Changeset 116852 in webkit

Timestamp:

May 12, 2012 5:52:42 AM (12 years ago)

Author:

pfeldman@chromium.org

Message:

Web Inspector: make call frame selector pane focusable, allow Up / Down to select current call frame.
​https://bugs.webkit.org/show_bug.cgi?id=86291

Reviewed by Yury Semikhatsky.

This change makes sidebar section focusable, introduces key listeners for Up and Down.

• inspector/front-end/CallStackSidebarPane.js:

(WebInspector.CallStackSidebarPane):
(WebInspector.CallStackSidebarPane.prototype.setStatus):
(WebInspector.CallStackSidebarPane.prototype._treeKeyDown):

• inspector/front-end/UISourceCode.js:
• inspector/front-end/scriptsPanel.css:

(#scripts-debug-toolbar img):

Location:

trunk/Source/WebCore

Files:

• ChangeLog (modified) (1 diff)
• inspector/front-end/CallStackSidebarPane.js (modified) (2 diffs)
• inspector/front-end/inspector.css (modified) (2 diffs)
• inspector/front-end/scriptsPanel.css (modified) (1 diff)

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2012-05-12  Pavel Feldman  <pfeldman@chromium.org>
+
+        Web Inspector: make call frame selector pane focusable, allow Up / Down to select current call frame.
+        https://bugs.webkit.org/show_bug.cgi?id=86291
+
+        Reviewed by Yury Semikhatsky.
+
+        This change makes sidebar section focusable, introduces key listeners for Up and Down.
+
+        * inspector/front-end/CallStackSidebarPane.js:
+        (WebInspector.CallStackSidebarPane):
+        (WebInspector.CallStackSidebarPane.prototype.setStatus):
+        (WebInspector.CallStackSidebarPane.prototype._treeKeyDown):
+        * inspector/front-end/UISourceCode.js:
+        * inspector/front-end/scriptsPanel.css:
+        (#scripts-debug-toolbar img):
+
 2012-05-12  Ilya Tikhonovsky  <loislo@chromium.org>
 

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

@@ -34 +34 @@
 
     this.bodyElement.addEventListener("contextmenu", this._contextMenu.bind(this), true);
+    this.bodyElement.addEventListener("keydown", this._keyDown.bind(this), true);
+    this.bodyElement.tabIndex = 0;
 }
 
@@ -151 +153 @@
             this._statusMessageElement.appendChild(status);
         }
+    },
+
+    _keyDown: function(event)
+    {
+        if (event.altKey || event.shiftKey || event.metaKey || event.ctrlKey)
+            return;
+
+        if (event.keyIdentifier === "Up") {
+            this._selectPreviousCallFrameOnStack();
+            event.consume();
+        } else if (event.keyIdentifier === "Down") {
+            this._selectNextCallFrameOnStack();
+            event.consume();
+        }
     }
 }

trunk/Source/WebCore/inspector/front-end/inspector.css

@@ -1178 +1178 @@
 
 .placard.selected {
-    border-top: 1px solid rgb(145, 160, 192);
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(162, 177, 207)), to(rgb(120, 138, 177)));
+    border-top: 1px solid rgb(172, 172, 172);
+    background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(182, 182, 182)), to(rgb(162, 162, 162)));
     -webkit-background-origin: padding;
     -webkit-background-clip: padding;
@@ -1185 +1185 @@
 
 :focus .placard.selected {
-    border-top: 1px solid rgb(68, 128, 200);
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(92, 147, 213)), to(rgb(21, 83, 170)));
-}
-
-body.inactive .placard.selected {
-    border-top: 1px solid rgb(151, 151, 151);
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(180, 180, 180)), to(rgb(138, 138, 138)));
+    border-top: 1px solid rgb(70, 103, 215);
+    background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(92, 147, 213)), to(rgb(56, 121, 217)));
 }
 

trunk/Source/WebCore/inspector/front-end/scriptsPanel.css

@@ -54 +54 @@
 }
 
+#scripts-debug-toolbar img {
+    padding-top: 2px;
+}
+
 #scripts-debug-sidebar-contents {
     position: absolute;