Browse Source

增加图片粘贴插件

xiatian 5 năm trước cách đây
mục cha
commit
7007ca2f56

+ 73 - 0
public/ckeditor/plugins/pastebase64/plugin.js

@@ -0,0 +1,73 @@
+(function() {
+  "use strict";
+
+  CKEDITOR.plugins.add("pastebase64", {
+    init: init
+  });
+
+  function init(editor) {
+    if (editor.addFeature) {
+      editor.addFeature({
+        allowedContent: "img[alt,id,!src]{width,height};"
+      });
+    }
+
+    editor.on("contentDom", function() {
+      var editableElement = editor.editable
+        ? editor.editable()
+        : editor.document;
+      editableElement.on("paste", onPaste, null, { editor: editor });
+    });
+  }
+
+  function onPaste(event) {
+    var editor = event.listenerData && event.listenerData.editor;
+    var $event = event.data.$;
+    var clipboardData = $event.clipboardData;
+    var found = false;
+    var imageType = /^image/;
+
+    if (!clipboardData) {
+      return;
+    }
+
+    return Array.prototype.forEach.call(clipboardData.types, function(type, i) {
+      if (found) {
+        return;
+      }
+
+      if (
+        type.match(imageType) ||
+        clipboardData.items[i].type.match(imageType)
+      ) {
+        readImageAsBase64(clipboardData.items[i], editor);
+        return (found = true);
+      }
+    });
+  }
+
+  function readImageAsBase64(item, editor) {
+    if (!item || typeof item.getAsFile !== "function") {
+      return;
+    }
+
+    var file = item.getAsFile();
+    var reader = new FileReader();
+
+    reader.onload = function(evt) {
+      var element = editor.document.createElement("img", {
+        attributes: {
+          src: evt.target.result
+        }
+      });
+
+      // We use a timeout callback to prevent a bug where insertElement inserts at first caret
+      // position
+      setTimeout(function() {
+        editor.insertElement(element);
+      }, 10);
+    };
+
+    reader.readAsDataURL(file);
+  }
+})();

+ 1 - 1
src/components/ckeditor.vue

@@ -72,7 +72,7 @@ export default {
       language: this.language,
       height: this.height,
       width: this.width,
-      extraPlugins: this.extraplugins + ",base64image",
+      extraPlugins: this.extraplugins + ",base64image,pastebase64",
       removeButtons: removeButtonStr,
       removePlugins: removePluginStr
     };

+ 1 - 1
src/modules/questions/component/ckeditor.vue

@@ -56,7 +56,7 @@ export default {
       language: this.language,
       height: this.height,
       width: this.width,
-      extraPlugins: this.extraplugins + ",base64image",
+      extraPlugins: this.extraplugins + ",base64image,pastebase64",
       toolbarGroups: [
         { name: "clipboard", groups: ["clipboard", "undo"] },
         {