Web Inspector: show a debugging-oriented dashboard when scripts pause
authorbburg@apple.com <bburg@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 10 Mar 2014 18:15:09 +0000 (18:15 +0000)
committerbburg@apple.com <bburg@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 10 Mar 2014 18:15:09 +0000 (18:15 +0000)
commit4f7aaa69376099c6426677b24ae187d826868615
tree36a20accfbbb946a64f8213c1f585a782ccdad17
parentca9393d52243a09d73efd6e12fe7eb170c0d2308
Web Inspector: show a debugging-oriented dashboard when scripts pause
https://bugs.webkit.org/show_bug.cgi?id=129913

Reviewed by Timothy Hatcher.

Using the dashboard swapping functionality just added, show a debugger dashboard
whenever the debugger pauses, and hide it when it resumes. The debugger manager
already coalesces pause/resume events across stepping commands.

The dashboard itself is straightforward, with the exception of how it uses the
navigation bar buttons. Since buttons from the same URL can't be reused if they
are bezeled, we don't bezel our button, and set the button image as the glyph mask
instead of the background image. This lets us easily animate the glyph shape.

We also have to more forcefully declare a bunch of icon rules that would otherwise
be messed up by the toolbar's icon rules (whereas we want to mostly emulate navigation
bar icon styles).

* Localizations/en.lproj/localizedStrings.js:
* UserInterface/Base/Main.js:
(WebInspector.loaded):
(WebInspector.contentLoaded):
(WebInspector._debuggerDidPause):
(WebInspector._debuggerDidResume):
* UserInterface/Controllers/DashboardManager.js:
(WebInspector.DashboardManager):
* UserInterface/Main.html:
* UserInterface/Models/DebuggerDashboard.js: Added.
(WebInspector.DebuggerDashboard):
* UserInterface/Views/ButtonNavigationItem.css:
(.navigation-bar .item.button.suppress-emboss > .glyph):
* UserInterface/Views/ButtonNavigationItem.js:
(WebInspector.ButtonNavigationItem.prototype._updateImage):
* UserInterface/Views/DashboardView.js:
(WebInspector.DashboardView):
* UserInterface/Views/DebuggerDashboardView.css: Added.
(.toolbar .dashboard.debugger):
(.dashboard.debugger > .message):
(.dashboard.debugger .navigation-bar):
(.toolbar:not(.small-size) .dashboard.debugger .navigation-bar):
(.dashboard.debugger .navigation-bar .item.button):
(.dashboard.debugger .navigation-bar .item.button > .glyph):
(@-webkit-keyframes pulse-pause-button):
(to):
(.dashboard.debugger > .divider):
(.dashboard.debugger > div):
(.dashboard.debugger > .location > :first-child):
(.toolbar:not(.small-size) .dashboard.debugger > .location :not(:first-child)):
(.dashboard.debugger > .location img.icon):
(.dashboard.debugger > .location .function-name):
(.dashboard.debugger > .location .function-name::after):
(.dashboard.debugger > .location .go-to-link):
(.toolbar.collapsed .dashboard.debugger > :not(.message):not(.navigation-bar )):
(.toolbar.small-size .dashboard.debugger > .message):
(.toolbar.small-size .dashboard.debugger > .location > :first-child):
* UserInterface/Views/DebuggerDashboardView.js: Added.
(WebInspector.DebuggerDashboardView):
(WebInspector.DebuggerDashboardView.prototype._rebuildLocation):
(WebInspector.DebuggerDashboardView.prototype._resumeButtonClicked):
* UserInterface/Views/DebuggerSidebarPanel.js:
(WebInspector.DebuggerSidebarPanel):

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@165383 268f45cc-cd09-0410-ab3c-d52691b4dbfc
12 files changed:
Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js
Source/WebInspectorUI/UserInterface/Base/Main.js
Source/WebInspectorUI/UserInterface/Controllers/DashboardManager.js
Source/WebInspectorUI/UserInterface/Main.html
Source/WebInspectorUI/UserInterface/Models/DebuggerDashboard.js [new file with mode: 0644]
Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.css
Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.js
Source/WebInspectorUI/UserInterface/Views/DashboardView.js
Source/WebInspectorUI/UserInterface/Views/DebuggerDashboardView.css [new file with mode: 0644]
Source/WebInspectorUI/UserInterface/Views/DebuggerDashboardView.js [new file with mode: 0644]
Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.js