From 9e91e9e59d2107c23329cd122c20bfdeffd99890 Mon Sep 17 00:00:00 2001
From: Oleksii Kriuchykhin <okriuchykhin@biosistemika.com>
Date: Wed, 3 Apr 2019 16:31:56 +0200
Subject: [PATCH] Improve large image saving after editing [SCI-3289]

---
 .../javascripts/sitewide/file_preview.js      | 24 +++++++++++++++++--
 app/controllers/assets_controller.rb          |  8 +++----
 config/initializers/constants.rb              |  2 +-
 3 files changed, 27 insertions(+), 7 deletions(-)

diff --git a/app/assets/javascripts/sitewide/file_preview.js b/app/assets/javascripts/sitewide/file_preview.js
index 6ebc2b71f..cc92db301 100644
--- a/app/assets/javascripts/sitewide/file_preview.js
+++ b/app/assets/javascripts/sitewide/file_preview.js
@@ -1,6 +1,6 @@
 /* eslint no-underscore-dangle: ["error", { "allowAfterThis": true }]*/
 /* eslint no-use-before-define: ["error", { "functions": false }]*/
-/* global fabric tui animateSpinner setupAssetsLoading I18n*/
+/* global Uint8Array fabric tui animateSpinner setupAssetsLoading I18n*/
 //= require assets
 
 var FilePreviewModal = (function() {
@@ -282,10 +282,30 @@ var FilePreviewModal = (function() {
     $('.tui-image-editor-header').hide();
 
     $('.file-save-link').off().click(function(ev) {
+      var imageBlob;
+      var imageDataURL;
+      var imageFormat;
       var dataUpload = new FormData();
+      var blobArray;
+      var bytePosition;
+
       ev.preventDefault();
       ev.stopPropagation();
-      dataUpload.append('image', imageEditor.toDataURL());
+
+      imageFormat = (data['mime-type'] === 'image/png') ? 'png' : 'jpeg';
+
+      imageDataURL = imageEditor.toDataURL({ format: imageFormat });
+      imageDataURL = atob(imageDataURL.split(',')[1]);
+
+      blobArray = new Uint8Array(imageDataURL.length);
+
+      for (bytePosition = 0; bytePosition < imageDataURL.length; bytePosition += 1) {
+        blobArray[bytePosition] = imageDataURL.charCodeAt(bytePosition);
+      }
+
+      imageBlob = new Blob([blobArray]);
+
+      dataUpload.append('image', imageBlob);
       animateSpinner(null, true);
       $.ajax({
         type: 'POST',
diff --git a/app/controllers/assets_controller.rb b/app/controllers/assets_controller.rb
index a0bd0416e..dc1c9911e 100644
--- a/app/controllers/assets_controller.rb
+++ b/app/controllers/assets_controller.rb
@@ -63,6 +63,7 @@ class AssetsController < ApplicationController
     if @asset.is_image?
       response_json.merge!(
         'editable' =>  @asset.editable_image? && can_edit,
+        'mime-type' => @asset.file.content_type,
         'processing' => @asset.file.processing?,
         'large-preview-url' => @asset.url(:large),
         'processing-url' => image_tag('medium/processing.gif')
@@ -151,11 +152,10 @@ class AssetsController < ApplicationController
 
   def update_image
     @asset = Asset.find(params[:id])
+    orig_file_name = @asset.file_file_name
     return render_403 unless can_read_team?(@asset.team)
-    image_file = Paperclip.io_adapters.for(params[:image])
-    image_format = image_file.content_type.split('/')[1]
-    image_file.original_filename = @asset.file_file_name.ext(image_format)
-    @asset.file = image_file
+    @asset.file = params[:image]
+    @asset.file_file_name = orig_file_name
     @asset.save!
     # Post process file here
     @asset.post_process_file(@asset.team)
diff --git a/config/initializers/constants.rb b/config/initializers/constants.rb
index 553511198..32deee99d 100644
--- a/config/initializers/constants.rb
+++ b/config/initializers/constants.rb
@@ -220,7 +220,7 @@ class Constants
   ].freeze
 
   WHITELISTED_IMAGE_TYPES_EDITABLE = %w(
-    gif jpeg pjpeg png
+    jpeg pjpeg png
   ).freeze
 
   WHITELISTED_TAGS = %w(