From fa066968922fb4223c4592650ec3400fb2879104 Mon Sep 17 00:00:00 2001
From: mattwr18 <mattwr18@gmail.com>
Date: Wed, 2 Oct 2019 21:22:58 +0200
Subject: [PATCH] Convert canvas to blob to update file

- what was happening is that the file was being autocropped still and
sent to the backend with cropperjs autocrop... these changes update the
file's attributes so they can be saved properly
---
 webapp/components/TeaserImage/TeaserImage.vue | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/webapp/components/TeaserImage/TeaserImage.vue b/webapp/components/TeaserImage/TeaserImage.vue
index 1d922a073..e60a466e4 100644
--- a/webapp/components/TeaserImage/TeaserImage.vue
+++ b/webapp/components/TeaserImage/TeaserImage.vue
@@ -95,12 +95,19 @@ export default {
       confirm.addEventListener('click', () => {
         // Get the canvas with image data from Cropper.js
         let canvas = cropper.getCroppedCanvas()
-        image = new Image()
-        image.src = canvas.toDataURL()
-        image.classList.add('thumbnail-preview')
-        thumbnailElement.appendChild(image)
-        // Remove the editor from view
-        editor.parentNode.removeChild(editor)
+        canvas.toBlob(blob => {
+          this.$refs.el.manuallyAddFile(blob, canvas.toDataURL(), null, null, {
+            dontSubstractMaxFiles: false,
+            addToFiles: true,
+          })
+          image = new Image()
+          image.src = canvas.toDataURL()
+          image.classList.add('thumbnail-preview')
+          thumbnailElement.appendChild(image)
+          // Remove the editor from view
+          editor.parentNode.removeChild(editor)
+          this.addTeaserImage([blob])
+        })
       })
       editor.appendChild(confirm)