mockup/master: Enable drag and drop inside of the theme editor file tree.

Repository: mockup
Branch: refs/heads/master
Date: 2017-06-24T18:15:24-05:00
Author: Oshane Bailey (b4oshany) <[email protected]>
Commit: https://github.com/plone/mockup/commit/6ffa6a706e0210b542636fadd85b00fa77dd48c4

Enable drag and drop inside of the theme editor file tree.

Files changed:
M CHANGES.rst
M bower.json
M mockup/patterns/filemanager/pattern.js

diff --git a/CHANGES.rst b/CHANGES.rst
index 49c5c7fd..55d21dea 100644
--- a/CHANGES.rst
+++ b/CHANGES.rst
@@ -15,17 +15,14 @@ New features:
  - Added Bootstrap Dropdown menu to the UI views.
  - Added Anchor (a) tag to the UI views.
  - Make thumb scale in folder contents listing adjustable/supressable.
-   Replace meaningless paper clip icon (fontello) with mime type icons from mimetype registry.
- - Search for files and opening the file upon click
- - Search for text within files and opening the file upon click
- - Added Bootstrap Dropdown menu to the UI views
- - Added Anchor (a) tag to the UI views
-
+ - Replace meaningless paper clip icon (fontello) with mime type icons from mimetype registry.
+ - Enable Drag and Drop inside of the theme editor file tree.
+ - Upgrade JQTree to 1.4.1
  - Search for files and opening the file upon click.
  - Search for text within files and opening the file upon click.
  - Added Bootstrap Dropdown menu to the UI views.
  - Added Anchor (a) tag to the UI views.
- 
+
  - make thumb size in folder contents listing adjustable/supressable
    replace meaningless paper clip icon (fontello) with mime type icons
    from mimetype registry
diff --git a/bower.json b/bower.json
index 7603daf8..55232710 100644
--- a/bower.json
+++ b/bower.json
@@ -9,7 +9,7 @@
     "console-polyfill": "0.2.2",
     "dropzone": "4.3.0",
     "es5-shim": "4.5.9",
-    "jqtree": "1.3.3",
+    "jqtree": "1.4.1",
     "jquery": "1.11.3",
     "jquery-form": "3.51",
     "jquery.cookie": "1.4.1",
diff --git a/mockup/patterns/filemanager/pattern.js b/mockup/patterns/filemanager/pattern.js
index 916780f3..d711e972 100644
--- a/mockup/patterns/filemanager/pattern.js
+++ b/mockup/patterns/filemanager/pattern.js
@@ -95,13 +95,13 @@ define([
 
       self.options.treeConfig = $.extend(true, {}, self.treeConfig, {
         dataUrl: self.options.actionUrl + '?action=dataTree',
+        dragAndDrop: true,
         onCreateLi: function(node, li) {
           var imageTypes = ['png', 'jpg', 'jpeg', 'gif', 'ico'];
           var themeTypes = ['css', 'html', 'htm', 'txt', 'xml', 'js', 'cfg', 'less'];
-
           $('span', li).addClass('glyphicon');
           if (node.folder) {
-            $('span', li).addClass('glyphicon-folder-close');
+            $('span', li).addClass('glyphicon-folder-close').addClass("droptarget");
           } else if ($.inArray(node.fileType, imageTypes) >= 0) {
             $('span', li).addClass('glyphicon-picture');
           } else if ($.inArray(node.fileType, themeTypes) >= 0) {
@@ -339,6 +339,23 @@ define([
         }
       });
 
+      self.$tree.bind('tree.move', function(event) {
+        self.doAction('move', {
+          data: {
+            source: event.move_info.moved_node.path,
+            destination: event.move_info.target_node.path
+          },
+          dataType: 'json',
+          success: function(data) {
+            console.log(data);
+            var jdata = JSON.parse(data);
+            if(jdata.error != ''){
+              alert(jdata.error);
+            }
+          }
+        });
+      });
+
       self.$tree.bind('tree.open', function(e) {
         var element = $(e.node.element).find(':first').find('.glyphicon');
         $(element).addClass('glyphicon-folder-open');



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