Changeset 90561 in webkit

Timestamp:

Jul 7, 2011 9:20:12 AM (13 years ago)

Author:

pfeldman@chromium.org

Message:

2011-07-07 Pavel Feldman <​pfeldman@chromium.org>

Web Inspector: prevent default action during drag'n'drop in the Elements panel.
​https://bugs.webkit.org/show_bug.cgi?id=64081

Reviewed by Yury Semikhatsky.

• inspector/front-end/ElementsTreeOutline.js: (WebInspector.ElementsTreeOutline): (WebInspector.ElementsTreeOutline.prototype._ondragstart): (WebInspector.ElementsTreeOutline.prototype._ondragover): (WebInspector.ElementsTreeOutline.prototype._ondragend):
• inspector/front-end/treeoutline.js: (TreeOutline.prototype.treeElementFromPoint):

Location:

trunk/Source/WebCore

Files:

• ChangeLog (modified) (1 diff)
• inspector/front-end/ElementsTreeOutline.js (modified) (7 diffs)
• inspector/front-end/treeoutline.js (modified) (1 diff)

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2011-07-07  Pavel Feldman  <pfeldman@chromium.org>
+
+        Web Inspector: prevent default action during drag'n'drop in the Elements panel.
+        https://bugs.webkit.org/show_bug.cgi?id=64081
+
+        Reviewed by Yury Semikhatsky.
+
+        * inspector/front-end/ElementsTreeOutline.js:
+        (WebInspector.ElementsTreeOutline):
+        (WebInspector.ElementsTreeOutline.prototype._ondragstart):
+        (WebInspector.ElementsTreeOutline.prototype._ondragover):
+        (WebInspector.ElementsTreeOutline.prototype._ondragend):
+        * inspector/front-end/treeoutline.js:
+        (TreeOutline.prototype.treeElementFromPoint):
+
 2011-07-07  Nikolas Zimmermann  <nzimmermann@rim.com>
 

trunk/Source/WebCore/inspector/front-end/ElementsTreeOutline.js

@@ -37 +37 @@
     this.element.addEventListener("dragover", this._ondragover.bind(this), false);
     this.element.addEventListener("dragleave", this._ondragleave.bind(this), false);
+    this.element.addEventListener("drop", this._ondrop.bind(this), false);
     this.element.addEventListener("dragend", this._ondragend.bind(this), false);
 
@@ -276 +277 @@
 
         event.dataTransfer.setData("text/plain", treeElement.listItemElement.textContent);
-        event.dataTransfer.effectAllowed = "copy";
+        event.dataTransfer.effectAllowed = "copyMove";
         this._nodeBeingDragged = treeElement.representedObject;
 
@@ -286 +287 @@
     _ondragover: function(event)
     {
-        this._clearDragOverTreeElementMarker();
-
         if (!this._nodeBeingDragged)
-            return;
-        
-        var treeElement = this._treeElementFromEvent(event);
-        if (!this._isValidDragSourceOrTarget(treeElement))
-            return;
-
-        var node = treeElement.representedObject;
-        while (node) {
-            if (node === this._nodeBeingDragged)
-                return;
-            node = node.parentNode;
-        }
-
-        treeElement.updateSelection();
-        treeElement.listItemElement.addStyleClass("elements-drag-over");
-        this._dragOverTreeElement = treeElement;
-    },
-
-    _ondragleave: function(event)
-    {
-        this._clearDragOverTreeElementMarker();
-
-        if (!this._nodeBeingDragged)
-            return;
+            return false;
         
         var treeElement = this._treeElementFromEvent(event);
@@ -321 +297 @@
         while (node) {
             if (node === this._nodeBeingDragged)
-                return;
+                return false;
             node = node.parentNode;
         }
@@ -328 +304 @@
         treeElement.listItemElement.addStyleClass("elements-drag-over");
         this._dragOverTreeElement = treeElement;
+        event.preventDefault();
+        event.dataTransfer.dropEffect = 'move';
+        return false;
+    },
+
+    _ondragleave: function(event)
+    {
+        this._clearDragOverTreeElementMarker();
+        event.preventDefault();
+        return false;
     },
 
@@ -348 +334 @@
     },
 
-    _ondragend: function(event)
-    {
-        if (this._nodeBeingDragged && this._dragOverTreeElement) {
+    _ondrop: function(event)
+    {
+        event.preventDefault();
+        var treeElement = this._treeElementFromEvent(event);
+        if (this._nodeBeingDragged && treeElement) {
             var parentNode;
             var anchorNode;
 
-            if (this._dragOverTreeElement._elementCloseTag) {
+            if (treeElement._elementCloseTag) {
                 // Drop onto closing tag -> insert as last child.
-                parentNode = this._dragOverTreeElement.representedObject;
+                parentNode = treeElement.representedObject;
             } else {
-                var dragTargetNode = this._dragOverTreeElement.representedObject;
+                var dragTargetNode = treeElement.representedObject;
                 parentNode = dragTargetNode.parentNode;
                 anchorNode = dragTargetNode;
@@ -375 +363 @@
             this._nodeBeingDragged.moveTo(parentNode, anchorNode, callback.bind(this));
         }
-        
+
+        delete this._nodeBeingDragged;
+    },
+
+    _ondragend: function(event)
+    {
+        event.preventDefault();
         this._clearDragOverTreeElementMarker();
         delete this._nodeBeingDragged;

trunk/Source/WebCore/inspector/front-end/treeoutline.js

@@ -333 +333 @@
 {
     var node = this._childrenListNode.ownerDocument.elementFromPoint(x, y);
+    if (!node)
+        return null;
+
     var listNode = node.enclosingNodeOrSelfWithNodeNameInArray(["ol", "li"]);
     if (listNode)