mockup/master: Fixes the autoscroll issue and dragging files to root folder

Repository: mockup
Branch: refs/heads/master
Date: 2017-07-10T21:09:18-05:00
Author: Oshane Bailey (b4oshany) <[email protected]>
Commit: https://github.com/plone/mockup/commit/99ab2740b4134a7d552fec594c82a8a3dbcc1a1f

Fixes the autoscroll issue and dragging files to root folders.

Files changed:
M CHANGES.rst
M mockup/patterns/filemanager/pattern.filemanager.less
M mockup/patterns/filemanager/pattern.js
M mockup/patterns/tree/pattern.js

diff --git a/CHANGES.rst b/CHANGES.rst
index 6ec527bf..2146bf88 100644
--- a/CHANGES.rst
+++ b/CHANGES.rst
@@ -14,6 +14,8 @@ New features:
   - Search for files and text within files and opening the file upon click.
   - Add Bootstrap Dropdown menu to the UI views.
   - Enable Drag and Drop inside of the theme editor file tree.
+  - Fixed the Drag and Drop files to root of the file tree.
+  - Fixed the autoscrolling issue when dragging a file in the file tree.
   - Add Anchor (a) tag to the UI views.
   - Upgrade JQTree to 1.4.1
   - Enable Drag and Drop inside of the theme editor file tree.
diff --git a/mockup/patterns/filemanager/pattern.filemanager.less b/mockup/patterns/filemanager/pattern.filemanager.less
index 85d01cdc..f2049f80 100644
--- a/mockup/patterns/filemanager/pattern.filemanager.less
+++ b/mockup/patterns/filemanager/pattern.filemanager.less
@@ -46,6 +46,7 @@
     .btn-group-dropdown:extend(.btn-group all){
         display: inline-block;
         margin: 0 !important;
+        vertical-align: initial !important;
     }
     .input-group:extend(.input-group all){}
     .input-group-addon:extend(.input-group-addon all){}
diff --git a/mockup/patterns/filemanager/pattern.js b/mockup/patterns/filemanager/pattern.js
index f12b7b7a..d6a37f3c 100644
--- a/mockup/patterns/filemanager/pattern.js
+++ b/mockup/patterns/filemanager/pattern.js
@@ -97,6 +97,13 @@ define([
         dataUrl: self.options.actionUrl + '?action=dataTree',
         dragAndDrop: true,
         useContextMenu: true,
+        onCanMoveTo: function(moved, target, position) {
+          /* if not using folder option, just allow, otherwise, only allow if folder */
+          if (position === "inside") {
+            return target.folder === undefined || target.folder === true;
+          }
+          return true;
+        },
         onCreateLi: function(node, li) {
           var imageTypes = ['png', 'jpg', 'jpeg', 'gif', 'ico'];
           var themeTypes = ['css', 'html', 'htm', 'txt', 'xml', 'js', 'cfg', 'less'];
@@ -349,10 +356,17 @@ define([
       });
 
       self.$tree.bind('tree.move', function(event) {
+        
+        var srcpath = event.move_info.moved_node.path;
+        var newpath = event.move_info.target_node.path;
+        if (event.move_info.position !== "inside" ){
+          newpath = newpath.substring(newpath.indexOf('/'), newpath.lastIndexOf('/'));
+        }
+        
         self.doAction('move', {
           data: {
-            source: event.move_info.moved_node.path,
-            destination: event.move_info.target_node.path
+            source: srcpath,
+            destination: newpath
           },
           dataType: 'json',
           success: function(data) {
diff --git a/mockup/patterns/tree/pattern.js b/mockup/patterns/tree/pattern.js
index 2be19804..3667140c 100644
--- a/mockup/patterns/tree/pattern.js
+++ b/mockup/patterns/tree/pattern.js
@@ -79,11 +79,14 @@ define([
         }
       }
 
-      if (self.options.dragAndDrop && self.options.onCanMoveTo === undefined) {
+      if (self.options.onCanMoveTo === undefined) {
         self.options.onCanMoveTo = function(moved, target, position) {
           /* if not using folder option, just allow, otherwise, only allow if folder */
-          return target.folder === undefined || target.folder === true;
-        };
+          if (position === "inside") {
+            return target.folder === undefined || target.folder === true;
+          }
+          return true;
+        }
       }
 
       if (self.options.data && typeof(self.options.data) === 'string') {



------------------------------------------------------------------------------
Check out the vibrant tech community on one of the world's most
engaging tech sites, Slashdot.org! http://sdm.link/slashdot