[Commits] r2168 - in core/trunk/geoext: lib/GeoExt/widgets resources/css

[commits at geoext.org]

Author: ahocevar
Date: 2010-05-10 19:29:35 +0200 (Mon, 10 May 2010)
New Revision: 2168

Added:
   core/trunk/geoext/resources/css/layerlegend.css
Modified:
   core/trunk/geoext/lib/GeoExt/widgets/VectorLegend.js
   core/trunk/geoext/resources/css/geoext-all-debug.css
Log:
Fixed the drag-drop issue reported in #270; made drag-drop look better (i.e. more like drag/drop in Ext.tree). r=tschaub (closes #271)


Modified: core/trunk/geoext/lib/GeoExt/widgets/VectorLegend.js
===================================================================
--- core/trunk/geoext/lib/GeoExt/widgets/VectorLegend.js	2010-05-10 14:29:03 UTC (rev 2167)
+++ core/trunk/geoext/lib/GeoExt/widgets/VectorLegend.js	2010-05-10 17:29:35 UTC (rev 2168)
@@ -499,31 +499,53 @@
      *  Adds drag & drop functionality to a rule entry.
      */
     addDD: function(component) {
-        var cursor = component.body.getStyle("cursor");
-        var dd = new Ext.Panel.DD(component);
-        // restore previous curser (if set). because Panel.DD always
-        // sets a move cursor
-        component.body.setStyle("cursor", cursor || "move");
+        var ct = component.ownerCt;
         var panel = this;
-        var dropZone = new Ext.dd.DropTarget(component.getEl(), {
-            notifyDrop: function(ddSource) {
-                var source = Ext.getCmp(ddSource.getEl().id);
-                var target = Ext.getCmp(this.getEl().id);
-                // sometimes, for whatever reason, Ext forgets who the source
-                // was, so we make sure that we have one before moving on
-                if (source && target && source != target) {
-                    var sourceCt = source.ownerCt;
-                    var targetCt = target.ownerCt;
-                    // only move rules around inside the same container
-                    if (sourceCt == targetCt) {
-                        panel.moveRule(
-                            sourceCt.items.indexOf(source),
-                            targetCt.items.indexOf(target)
-                        );
+        new Ext.dd.DragSource(component.getEl(), {
+            ddGroup: ct.id,
+            onDragOut: function(e, targetId) {
+                var target = Ext.getCmp(targetId);
+                target.removeClass("gx-ruledrag-insert-above");
+                target.removeClass("gx-ruledrag-insert-below");
+                return Ext.dd.DragZone.prototype.onDragOut.apply(this, arguments);
+            },
+            onDragEnter: function(e, targetId) {
+                var target = Ext.getCmp(targetId);
+                var cls;
+                var sourcePos = ct.items.indexOf(component);
+                var targetPos = ct.items.indexOf(target);
+                if (sourcePos > targetPos) {
+                    cls = "gx-ruledrag-insert-above";
+                } else if (sourcePos < targetPos) {
+                    cls = "gx-ruledrag-insert-below";
+                }                
+                cls && target.addClass(cls);
+                return Ext.dd.DragZone.prototype.onDragEnter.apply(this, arguments);
+            },
+            onDragDrop: function(e, targetId) {
+                panel.moveRule(ct.items.indexOf(component),
+                    ct.items.indexOf(Ext.getCmp(targetId)));
+                return Ext.dd.DragZone.prototype.onDragDrop.apply(this, arguments);
+            },
+            getDragData: function(e) {
+                var sourceEl = e.getTarget(".x-column-inner");
+                if(sourceEl) {
+                    var d = sourceEl.cloneNode(true);
+                    d.id = Ext.id();
+                    return {
+                        sourceEl: sourceEl,
+                        repairXY: Ext.fly(sourceEl).getXY(),
+                        ddel: d
                     }
                 }
             }
         });
+        new Ext.dd.DropTarget(component.getEl(), {
+            ddGroup: ct.id,
+            notifyDrop: function() {
+                return true;
+            }
+        });
     },
     
     /** api: method[update]

Modified: core/trunk/geoext/resources/css/geoext-all-debug.css
===================================================================
--- core/trunk/geoext/resources/css/geoext-all-debug.css	2010-05-10 14:29:03 UTC (rev 2167)
+++ core/trunk/geoext/resources/css/geoext-all-debug.css	2010-05-10 17:29:35 UTC (rev 2168)
@@ -4,3 +4,4 @@
  * overrides go into gxtheme-<theme>.css
  */
 @import "popup.css";
+ at import "layerlegend.css";

Added: core/trunk/geoext/resources/css/layerlegend.css
===================================================================
--- core/trunk/geoext/resources/css/layerlegend.css	                        (rev 0)
+++ core/trunk/geoext/resources/css/layerlegend.css	2010-05-10 17:29:35 UTC (rev 2168)
@@ -0,0 +1,6 @@
+.gx-ruledrag-insert-below {
+    border-bottom: 1px dotted;
+}
+.gx-ruledrag-insert-above {
+    border-top: 1px dotted;
+}