Generic wrapper for drag and drop support

See #2580

The implementation is basically a wrapper around the existing implementation, preserving near perfect compatibility for merges in older branches and full git history.

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/DragAndDrop.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/DragAndDrop.js
new file mode 100644 (file)
index 0000000..0c17c0c
--- /dev/null
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/DragAndDrop.js
@@ -0,0 +1,40 @@
+/**
+ * Generic interface for drag and Drop file uploads.
+ * 
+ * @author      Alexander Ebert
+ * @copyright   2001-2018 WoltLab GmbH
+ * @license     GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
+ * @module      WoltLabSuite/Core/Ui/DragAndDrop
+ */
+define(['Core', 'EventHandler', 'WoltLabSuite/Core/Ui/Redactor/DragAndDrop'], function (Core, EventHandler, UiRedactorDragAndDrop) {
+       /**
+        * @exports     WoltLabSuite/Core/Ui/DragAndDrop
+        */
+       return {
+               /**
+                * @param       {Object}        options
+                */
+               register: function (options) {
+                       var uuid = Core.getUuid();
+                       options = Core.extend({
+                               element: '',
+                               elementId: '',
+                               onDrop: function(data) {
+                                       /* data: { file: File } */
+                               },
+                               onGlobalDrop: function (data) {
+                                       /* data: { cancelDrop: boolean, event: DragEvent } */
+                               }
+                       });
+                       
+                       EventHandler.add('com.woltlab.wcf.redactor2', 'dragAndDrop_' + options.elementId, options.onDrop);
+                       EventHandler.add('com.woltlab.wcf.redactor2', 'dragAndDrop_globalDrop_' + options.elementId, options.onGlobalDrop);
+                       
+                       UiRedactorDragAndDrop.init({
+                               uuid: uuid,
+                               $editor: [options.element],
+                               $element: [{id: options.elementId}]
+                       });
+               }
+       };
+});

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/DragAndDrop.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/DragAndDrop.js
index b791e09c8565a7b68b134bc71a2d89bf96d43fc9..1b39a28b6571a4c188c0675e7cafadd0cc87f9a3 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/DragAndDrop.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/DragAndDrop.js
@@ -201,7 +201,15 @@ define(['Dictionary', 'EventHandler', 'Language'], function (Dictionary, EventHa
                 */
                _globalDrop: function (event) {
                        if (event.target.closest('.redactor-layer') === null) {
-                               event.preventDefault();
+                               var eventData = { cancelDrop: true, event: event };
+                               _dragArea.forEach(function(data) {
+                                       //noinspection JSUnresolvedVariable
+                                       EventHandler.fire('com.woltlab.wcf.redactor2', 'dragAndDrop_globalDrop_' + data.editor.$element[0].id, eventData);
+                               });
+                               
+                               if (eventData.cancelDrop) {
+                                       event.preventDefault();
+                               }
                        }
                        
                        this._dragLeave(event);