effective_bootstrap 0.7.2 → 0.7.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: aa24ecc96601ddcded2571c7dce3a569da0dce1193582982c878d40777ddf773
-  data.tar.gz: 943ca82b54895a6175ae41ee2692604bf4cbf20711f0798d5b4cce6781677afe
+  metadata.gz: edbd3d46e3b489964e42de81d6e1e80ee8cd069e3eb023691b3f4bd72c269232
+  data.tar.gz: 49aff1866905080fbd03ec98b882928d0082d9f03b63c453e35993d24687d493
 SHA512:
-  metadata.gz: b32cb5310a5b84f6d5877a72946c81e7a06ebe06ec3fb74f5cc3739b3d991f84709ff185ac82bd4e2f96cc96581be369aa0ac489b809f18d885b737fafde1bd4
-  data.tar.gz: 119c4873026a6e94c37726439bbe762ffe82d61b6efbcad4b7db010084fb2c8258f0aa66e1da425668b31806f2c5d0dbea6a8ca9124e035561ce5c50a7143b3f
+  metadata.gz: 8a2d898a6a45553bfac7ce5743aa0d0f98de8d0833e680f3665f845c30d8d2b452bd92351b3eab7ee534a0040a2ec291103a47253821f2a58bbbb4fa98a1dd4b
+  data.tar.gz: c0a16990a52e9b46f0b636765c13711b10b4c3ae14e9af4d28cd7869ee163887553969262b868a2d0a0e9621bc7a6dd509b060f55277b42bfc0544c7c6a8ce5d

data/app/assets/javascripts/effective_editor/image-drop-and-paste.js

@@ -0,0 +1,3 @@
+(function(){var exports={};
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});var _createClass=function(){function e(e,t){for(var a=0;a<t.length;a++){var r=t[a];r.enumerable=r.enumerable||false;r.configurable=true;if("value"in r)r.writable=true;Object.defineProperty(e,r.key,r)}}return function(t,a,r){if(a)e(t.prototype,a);if(r)e(t,r);return t}}();function _classCallCheck(e,t){if(!(e instanceof t)){throw new TypeError("Cannot call a class as a function")}}var ImageData=function(){function e(t,a){_classCallCheck(this,e);this.dataUrl=t;this.type=a}_createClass(e,[{key:"minify",value:function t(){var a=this;var r=arguments.length>0&&arguments[0]!==undefined?arguments[0]:{};return new Promise(function(t,n){var i=r.maxWidth||800;var l=r.maxHeight||800;var o=r.quality||.8;if(!a.dataUrl){return n({message:"[error] QuillImageDropAndPaste: Fail to minify the image, dataUrl should not be empty."})}var s=new Image;s.onload=function(){var r=s.width;var n=s.height;if(r>n){if(r>i){s.height=n*i/r;s.width=i}}else{if(n>l){s.width=r*l/n;s.height=l}}var u=document.createElement("canvas");u.width=s.width;u.height=s.height;var f=u.getContext("2d");f.drawImage(s,0,0,s.width,s.height);var d=a.type||"image/png";var h=u.toDataURL(d,o);t(new e(h,d))};s.src=a.dataUrl})}},{key:"toFile",value:function e(t){if(!window.File){console.error("[error] QuillImageDropAndPaste: Your browser didnot support File API.");return null}return new File([this.toBlob()],t,{type:this.type})}},{key:"toBlob",value:function e(){var t=this.dataUrl.replace(/^[^,]+,/,"");var a=this.binaryStringToArrayBuffer(atob(t));return this.createBlob([a],{type:this.type})}},{key:"binaryStringToArrayBuffer",value:function e(t){var a=t.length;var r=new ArrayBuffer(a);var n=new Uint8Array(r);var i=-1;while(++i<a){n[i]=t.charCodeAt(i)}return r}},{key:"createBlob",value:function e(){var t=arguments.length>0&&arguments[0]!==undefined?arguments[0]:[];var a=arguments.length>1&&arguments[1]!==undefined?arguments[1]:{};if(typeof a==="string")a={type:a};try{return new Blob(t,a)}catch(e){if(e.name!=="TypeError")throw e;var r=typeof BlobBuilder!=="undefined"?BlobBuilder:typeof MSBlobBuilder!=="undefined"?MSBlobBuilder:typeof MozBlobBuilder!=="undefined"?MozBlobBuilder:WebKitBlobBuilder;var n=new r;for(var i=0;i<t.length;i++){n.append(t[i])}return n.getBlob(a.type)}}}]);return e}();var ImageDropAndPaste=function(){function e(t){var a=arguments.length>1&&arguments[1]!==undefined?arguments[1]:{};_classCallCheck(this,e);this.quill=t;this.options=a;this.handleDrop=this.handleDrop.bind(this);this.handlePaste=this.handlePaste.bind(this);this.quill.root.addEventListener("drop",this.handleDrop,false);this.quill.root.addEventListener("paste",this.handlePaste,false)}_createClass(e,[{key:"handleDrop",value:function e(t){var a=this;t.preventDefault();if(t.dataTransfer&&t.dataTransfer.files&&t.dataTransfer.files.length){if(document.caretRangeFromPoint){var r=document.getSelection();var n=document.caretRangeFromPoint(t.clientX,t.clientY);if(r&&n){r.setBaseAndExtent(n.startContainer,n.startOffset,n.startContainer,n.startOffset)}}this.readFiles(t.dataTransfer.files,function(e,t){t=t||"image/png";if(typeof a.options.handler==="function"){a.options.handler.call(a,e,t,new ImageData(e,t))}else{a.insert.call(a,e,t)}},t)}}},{key:"handlePaste",value:function e(t){var a=this;if(t.clipboardData&&t.clipboardData.items&&t.clipboardData.items.length){this.readFiles(t.clipboardData.items,function(e,t){t=t||"image/png";if(typeof a.options.handler==="function"){a.options.handler.call(a,e,t,new ImageData(e,t))}else{a.insert(e,t)}},t)}}},{key:"readFiles",value:function e(t,a,r){[].forEach.call(t,function(e){var t=e.type;if(!t.match(/^image\/(gif|jpe?g|a?png|svg|webp|bmp)/i))return;r.preventDefault();var n=new FileReader;n.onload=function(e){a(e.target.result,t)};var i=e.getAsFile?e.getAsFile():e;if(i instanceof Blob)n.readAsDataURL(i)})}},{key:"insert",value:function e(t,a){var r=(this.quill.getSelection()||{}).index||this.quill.getLength();this.quill.insertEmbed(r,"image",t,"user")}}]);return e}();ImageDropAndPaste.ImageData=ImageData;exports.default=ImageDropAndPaste;
+window.QuillImageDropAndPaste = ImageDropAndPaste;window.Quill.register('modules/imageDropAndPaste',ImageDropAndPaste)})();

data/app/assets/javascripts/effective_editor/initialize.js.coffee

@@ -2,6 +2,7 @@
 # https://github.com/quilljs/quill
 
 Quill.register('modules/imageResize', window.ImageResize.default)
+Quill.register('modules/imageDrop', window.QuillImageDropAndPaste)
 
 (this.EffectiveBootstrap || {}).effective_editor = ($element, options) ->
   editor = '#' + $element.attr('id') + '_editor'
@@ -12,6 +13,15 @@ Quill.register('modules/imageResize', window.ImageResize.default)
   content_mode = options['content_mode']
   delete options['content_mode']
 
+  if options['modules']['imageDropAndPaste']
+    # Image Drop & Paste
+    # https://github.com/chenjuneking/quill-image-drop-and-paste
+    dropImage = (imageDataUrl, type, imageData) ->
+      file = imageData.toFile(type.replace('/', '.'))
+      uploadImage(quill, file)
+
+    options['modules']['imageDropAndPaste'] = { handler: dropImage }
+
   quill = new Quill($element.siblings(editor).get(0), options)
   content = $element.val() || ''
 

data/app/assets/javascripts/effective_editor/input.js

@@ -1,3 +1,4 @@
 //= require ./quill
+//= require ./image-drop-and-paste
 //= require ./image-resize
 //= require ./initialize

data/app/models/effective/form_inputs/editor.rb

@@ -15,7 +15,12 @@ module Effective
 
       def input_js_options
         {
-          modules: { toolbar: toolbar, imageResize: imageResize, syntax: (content_mode == :code) },
+          modules: { 
+            toolbar: toolbar, 
+            imageResize: imageResize, 
+            imageDropAndPaste: imageDropAndPaste,
+            syntax: (content_mode == :code) 
+          },
           theme: 'snow',
           placeholder: "Add #{name.to_s.pluralize}...",
           content_mode: content_mode,
@@ -36,6 +41,10 @@ module Effective
         ]
       end
 
+      def imageDropAndPaste
+        active_storage && !(content_mode == :code) 
+      end
+
       def imageResize
         {
           displaySize: true,

data/lib/effective_bootstrap/version.rb

@@ -1,3 +1,3 @@
 module EffectiveBootstrap
-  VERSION = '0.7.2'.freeze
+  VERSION = '0.7.3'.freeze
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: effective_bootstrap
 version: !ruby/object:Gem::Version
-  version: 0.7.2
+  version: 0.7.3
 platform: ruby
 authors:
 - Code and Effect
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2020-07-15 00:00:00.000000000 Z
+date: 2020-07-22 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -389,6 +389,7 @@ files:
 - app/assets/javascripts/effective_datetime/input.js
 - app/assets/javascripts/effective_datetime/overrides.js.coffee
 - app/assets/javascripts/effective_datetime/turbolinks.js.coffee
+- app/assets/javascripts/effective_editor/image-drop-and-paste.js
 - app/assets/javascripts/effective_editor/image-resize.js
 - app/assets/javascripts/effective_editor/initialize.js.coffee
 - app/assets/javascripts/effective_editor/input.js