From 4c86e08ed5056de31e51a5e2857c631003ac68c3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?DEZEIRAUD=20Ga=C3=ABtan?= <gaetan@dezeiraud.com>
Date: Fri, 2 Dec 2022 16:08:13 +0100
Subject: [PATCH] add drag&drop support

---
 src/index.js    | 51 +++++++++++++++++++++++++++++++++++++++++++++++++
 src/uploader.js | 42 ++++++++++++++++++++++++++++++++++++++++
 2 files changed, 93 insertions(+)

diff --git a/src/index.js b/src/index.js
index 72061aa..5cb045e 100644
--- a/src/index.js
+++ b/src/index.js
@@ -282,6 +282,57 @@ export default class AttachesTool {
     this.nodes.button.click();
   }
 
+  /**
+   * Specify paste substitutes
+   *
+   * @see {@link https://github.com/codex-team/editor.js/blob/master/docs/tools.md#paste-handling}
+   * @returns {{tags: string[], patterns: object<string, RegExp>, files: {extensions: string[], mimeTypes: string[]}}}
+   */
+  static get pasteConfig() {
+    return {
+      /**
+       * Paste HTML into Editor
+       */
+      tags: [],
+
+      /**
+       * Paste URL of file into the Editor
+       */
+      patterns: {},
+
+      /**
+       * Drag n drop file from into the Editor
+       */
+      files: {
+        mimeTypes: [ 'application/*' ],
+      },
+    };
+  }
+
+  /**
+   * Specify paste handlers
+   *
+   * @public
+   * @see {@link https://github.com/codex-team/editor.js/blob/master/docs/tools.md#paste-handling}
+   * @param {CustomEvent} event - editor.js custom paste event
+   *                              {@link https://github.com/codex-team/editor.js/blob/master/types/tools/paste-events.d.ts}
+   * @returns {void}
+   */
+  async onPaste(event) {
+    switch (event.type) {
+      case 'file': {
+        const file = event.detail.file;
+
+        this.uploader.uploadByFile(file, {
+          onPreview: () => {
+            this.nodes.wrapper.classList.add(this.CSS.wrapperLoading, this.CSS.loader);
+          },
+        });
+        break;
+      }
+    }
+  }
+
   /**
    * Checks if any of Tool's fields have data
    *
diff --git a/src/uploader.js b/src/uploader.js
index 037db25..6a32e0b 100644
--- a/src/uploader.js
+++ b/src/uploader.js
@@ -56,6 +56,48 @@ export default class Uploader {
       }).then((response) => response.body);
     }
 
+    upload.then((response) => {
+      this.onUpload(response);
+    }).catch((errorResponse) => {
+      const error = errorResponse.body;
+
+      const message = (error && error.message) ? error.message : this.config.errorMessage;
+
+      this.onError(message);
+    });
+  }
+  /**
+   * Handle clicks on the upload file button
+   * Fires ajax.post()
+   *
+   * @param {File} file - file pasted by drag-n-drop
+   * @param {Function} onPreview - file pasted by drag-n-drop
+   */
+  uploadByFile(file, { onPreview }) {
+    /**
+     * Custom uploading
+     * or default uploading
+     */
+    let upload;
+
+    // custom uploading
+    if (this.config.uploader && typeof this.config.uploader.uploadByFile === 'function') {
+      upload = this.config.uploader.uploadByFile(file);
+
+      if (!isPromise(upload)) {
+        console.warn('Custom uploader method uploadByFile should return a Promise');
+      }
+      // default uploading
+    } else {
+      upload = ajax.transport({
+        url: this.config.endpoint,
+        accept: this.config.types,
+        beforeSend: () => onPreview(),
+        fieldName: this.config.field,
+        headers: this.config.additionalRequestHeaders || {},
+      }).then((response) => response.body);
+    }
+
     upload.then((response) => {
       this.onUpload(response);
     }).catch((errorResponse) => {