Changeset 46520 in webkit

Timestamp:

Jul 28, 2009 9:54:07 PM (15 years ago)

Author:

timothy@apple.com

Message:

Allow tabbing through the Web Inspector DOM Storage grid cells when editing.

2009-07-28 Joseph Pecoraro <​joepeck02@gmail.com>

Inspector: Tab Through the DOM Storage DataGrid when Editing

​https://bugs.webkit.org/show_bug.cgi?id=27746

Reviewed by Timothy Hatcher.

• inspector/front-end/DOMStorageDataGrid.js: (WebInspector.DOMStorageDataGrid.prototype._startEditingColumnOfDataGridNode): refactored to directly edit and select a column (WebInspector.DOMStorageDataGrid.prototype._startEditing): (WebInspector.DOMStorageDataGrid.prototype._editingCommitted.moveToNextIfNeeded): handles moveDirection on a commit (WebInspector.DOMStorageDataGrid.prototype._editingCommitted): uses moveToNext to traverse appropriately

Location:

trunk/WebCore

Files:

• ChangeLog (modified) (1 diff)
• inspector/front-end/DOMStorageDataGrid.js (modified) (4 diffs)

trunk/WebCore/ChangeLog

@@ +1 @@
+2009-07-28  Joseph Pecoraro  <joepeck02@gmail.com>
+
+        Inspector: Tab Through the DOM Storage DataGrid when Editing
+
+        https://bugs.webkit.org/show_bug.cgi?id=27746
+
+        Reviewed by Timothy Hatcher.
+
+        * inspector/front-end/DOMStorageDataGrid.js:
+        (WebInspector.DOMStorageDataGrid.prototype._startEditingColumnOfDataGridNode): refactored to directly edit and select a column
+        (WebInspector.DOMStorageDataGrid.prototype._startEditing):
+        (WebInspector.DOMStorageDataGrid.prototype._editingCommitted.moveToNextIfNeeded): handles moveDirection on a commit
+        (WebInspector.DOMStorageDataGrid.prototype._editingCommitted): uses moveToNext to traverse appropriately
+
 2009-07-28  Joseph Pecoraro  <joepeck02@gmail.com>
 

trunk/WebCore/inspector/front-end/DOMStorageDataGrid.js

@@ -40 +40 @@
     },
 
+    _startEditingColumnOfDataGridNode: function(node, column)
+    {
+        this._editing = true;
+        this._editingNode = node;
+        this._editingNode.select();
+
+        var element = this._editingNode._element.children[column];
+        WebInspector.startEditing(element, this._editingCommitted.bind(this), this._editingCancelled.bind(this), element.textContent);
+        window.getSelection().setBaseAndExtent(element, 0, element, 1);
+    },
+
     _startEditing: function(event)
     {
@@ -52 +63 @@
             this._editingNode = this.creationNode;
         }
+
+        // Force editing the "Key" column when editing the creation node
+        if (this._editingNode.isCreationNode)
+            return this._startEditingColumnOfDataGridNode(this._editingNode, 0);
+
         this._editing = true;
-
-        if (this._editingNode.isCreationNode) {
-            this._editingNode.select();
-            element = this._editingNode._element.children[0]; // Create a new node by providing a Key First
-        }
-
         WebInspector.startEditing(element, this._editingCommitted.bind(this), this._editingCancelled.bind(this), element.textContent);
         window.getSelection().setBaseAndExtent(element, 0, element, 1);
     },
 
-    _editingCommitted: function(element, newText)
+    _editingCommitted: function(element, newText, oldText, context, moveDirection)
     {
         var columnIdentifier = (element.hasStyleClass("0-column") ? 0 : 1);
         var textBeforeEditing = this._editingNode.data[columnIdentifier];
+        var currentEditingNode = this._editingNode;
+
+        function moveToNextIfNeeded(wasChange) {
+            if (!moveDirection)
+                return;
+
+            if (moveDirection === "forward") {
+                if (currentEditingNode.isCreationNode && columnIdentifier === 0 && !wasChange)
+                    return;
+
+                if (columnIdentifier === 0)
+                    return this._startEditingColumnOfDataGridNode(currentEditingNode, 1);
+
+                var nextDataGridNode = currentEditingNode.traverseNextNode(true, null, true);
+                if (nextDataGridNode)
+                    return this._startEditingColumnOfDataGridNode(nextDataGridNode, 0);
+                if (currentEditingNode.isCreationNode && wasChange) {
+                    addCreationNode(false);
+                    return this._startEditingColumnOfDataGridNode(this.creationNode, 0);
+                }
+                return;
+            }
+
+            if (moveDirection === "backward") {
+                if (columnIdentifier === 1)
+                    return this._startEditingColumnOfDataGridNode(currentEditingNode, 0);
+                    var nextDataGridNode = currentEditingNode.traversePreviousNode(true, null, true);
+
+                if (nextDataGridNode)
+                    return this._startEditingColumnOfDataGridNode(nextDataGridNode, 1);
+                return;
+            }
+        }
+
         if (textBeforeEditing == newText) {
             this._editingCancelled(element);
+            moveToNextIfNeeded.call(this, false);
             return;
         }
@@ -78 +123 @@
                     element.textContent = this._editingNode.data[0];
                     this._editingCancelled(element);
+                    moveToNextIfNeeded.call(this, false);
                     return;
                 }
@@ -93 +139 @@
 
         this._editingCancelled(element);
+        moveToNextIfNeeded.call(this, true);
     },