<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[165382] trunk/Source/WebInspectorUI</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/165382">165382</a></dd>
<dt>Author</dt> <dd>bburg@apple.com</dd>
<dt>Date</dt> <dd>2014-03-10 11:07:29 -0700 (Mon, 10 Mar 2014)</dd>
</dl>
<h3>Log Message</h3>
<pre>Web Inspector: convert the dashboard toolbar item to support multiple dashboards
https://bugs.webkit.org/show_bug.cgi?id=129898
Reviewed by Timothy Hatcher.
We want to ability to swap in and out different dashboard contents depending on
circumstances such as debugger activity and page loading. This patch converts the
existing hard-coded dashboard implementation to follow the container-based approach
used by WebInspector.ContentViewContainer.
As part of the refactoring, we introduce dashboard model objects to store persistent
dashboard data. Some CSS has also been split between the container and specific dashboard.
* UserInterface/Controllers/DashboardManager.js:
(WebInspector.DashboardManager):
(WebInspector.DashboardManager.prototype.get toolbarItem):
* UserInterface/Main.html:
* UserInterface/Models/DefaultDashboard.js: Copied from Source/WebInspectorUI/UserInterface/Controllers/DashboardManager.js.
(WebInspector.DefaultDashboard):
(WebInspector.DefaultDashboard.prototype.get resourcesCount):
(WebInspector.DefaultDashboard.prototype.set resourcesCount):
(WebInspector.DefaultDashboard.prototype.get resourcesSize):
(WebInspector.DefaultDashboard.prototype.set resourcesSize):
(WebInspector.DefaultDashboard.prototype.get time):
(WebInspector.DefaultDashboard.prototype.set time):
(WebInspector.DefaultDashboard.prototype.get logs):
(WebInspector.DefaultDashboard.prototype.set logs):
(WebInspector.DefaultDashboard.prototype.get errors):
(WebInspector.DefaultDashboard.prototype.set errors):
(WebInspector.DefaultDashboard.prototype.get issues):
(WebInspector.DefaultDashboard.prototype.set issues):
(WebInspector.DefaultDashboard.prototype._dataDidChange):
(WebInspector.DefaultDashboard.prototype._mainResourceDidChange):
(WebInspector.DefaultDashboard.prototype._recordingStopped):
(WebInspector.DefaultDashboard.prototype._resourceWasAdded):
(WebInspector.DefaultDashboard.prototype._frameWasAdded):
(WebInspector.DefaultDashboard.prototype._resourceSizeDidChange):
(WebInspector.DefaultDashboard.prototype._startUpdatingTime):
(WebInspector.DefaultDashboard.prototype._stopUpdatingTime):
(WebInspector.DefaultDashboard.prototype._updateTime):
(WebInspector.DefaultDashboard.prototype._consoleMessageAdded):
(WebInspector.DefaultDashboard.prototype._consoleMessageWasRepeated):
(WebInspector.DefaultDashboard.prototype._incrementConsoleMessageType):
(WebInspector.DefaultDashboard.prototype._consoleWasCleared):
* UserInterface/Views/DashboardContainerView.css: Added.
(.toolbar .dashboard-container):
(body.window-inactive .toolbar .dashboard-container):
(body.javascript .toolbar .dashboard-container):
(.toolbar.normal-size.icon-and-label-vertical .dashboard-container):
(.toolbar.small-size.icon-and-label-horizontal .dashboard-container):
(.toolbar.normal-size.icon-and-label-horizontal .dashboard-container):
(.toolbar .dashboard-container):
(.toolbar .dashboard):
(.toolbar .dashboard.visible):
(.toolbar .dashboard.slide-out-up):
(.toolbar .dashboard.slide-out-down):
(.toolbar .dashboard.slide-in-up):
(.toolbar .dashboard.slide-in-down):
(@-webkit-keyframes slide-top-edge):
(to):
(@-webkit-keyframes slide-bottom-edge):
* UserInterface/Views/DashboardContainerView.js: Added.
(WebInspector.DashboardContainerView):
(WebInspector.DashboardContainerView.prototype.get toolbarItem):
(WebInspector.DashboardContainerView.prototype.get currentDashboardView):
(WebInspector.DashboardContainerView.prototype.showDashboardViewForRepresentedObject):
(WebInspector.DashboardContainerView.prototype._dashboardViewForRepresentedObject):
(WebInspector.DashboardContainerView.prototype._showDashboardView):
* UserInterface/Views/DashboardView.css: Removed.
* UserInterface/Views/DashboardView.js:
(WebInspector.DashboardView):
(WebInspector.DashboardView.prototype.get element):
(WebInspector.DashboardView.prototype.get parentContainer):
(WebInspector.DashboardView.prototype.get representedObject):
(WebInspector.DashboardView.prototype.shown):
(WebInspector.DashboardView.prototype.hidden):
* UserInterface/Views/DefaultDashboardView.css: Added.
(body.web .toolbar.collapsed .dashboard.default > .logs):
(body.javascript .toolbar .dashboard.default > .resourcesCount):
(.toolbar .dashboard.default):
(.toolbar .dashboard.default > .item):
(.toolbar .dashboard.default > .resourcesSize):
(.toolbar .dashboard.default > .item.enabled:hover):
(.toolbar .dashboard.default > .item.enabled:active):
(.toolbar .dashboard.default > .item > *):
(.toolbar .dashboard.default > .item > img):
(.toolbar .dashboard.default > .item.enabled > img):
(.toolbar .dashboard.default > .item.enabled:hover > img):
(.toolbar .dashboard.default > .item > div):
(.toolbar .dashboard.default > .item.enabled > div):
(.toolbar .dashboard.default > .item.enabled:hover > div):
(.toolbar .dashboard.default > .resourcesCount > img):
(.toolbar .dashboard.default > .time > img):
(.toolbar .dashboard.default > .logs > img):
(.toolbar .dashboard.default > .resourcesSize > img):
(.toolbar .dashboard.default > .errors > img):
(.toolbar .dashboard.default > .errors.enabled > img):
(.toolbar .dashboard.default > .errors.enabled:hover > img):
(.toolbar .dashboard.default > .errors.enabled > div):
(.toolbar .dashboard.default > .errors.enabled:hover > div):
(.toolbar .dashboard.default > .issues > img):
(.toolbar .dashboard.default > .issues.enabled > img):
(.toolbar .dashboard.default > .issues.enabled:hover > img):
(.toolbar .dashboard.default > .issues.enabled > div):
(.toolbar .dashboard.default > .issues.enabled:hover > div):
(.toolbar .dashboard.default > .item.pulsing):
(@-webkit-keyframes console-item-pulse):
(.toolbar.small-size.icon-and-label-horizontal .dashboard.default > .item):
(.toolbar.normal-size.icon-and-label-horizontal .dashboard.default > .item):
* UserInterface/Views/DefaultDashboardView.js: Copied from Source/WebInspectorUI/UserInterface/Views/DashboardView.js.
(WebInspector.DefaultDashboardView):
(WebInspector.DefaultDashboardView.prototype._updateDisplay):
(WebInspector.DefaultDashboardView.prototype._formatPossibleLargeNumber):
(WebInspector.DefaultDashboardView.prototype._appendElementForNamedItem.):
(WebInspector.DefaultDashboardView.prototype._appendElementForNamedItem.set item):
(WebInspector.DefaultDashboardView.prototype._appendElementForNamedItem):
(WebInspector.DefaultDashboardView.prototype._itemWasClicked):
(WebInspector.DefaultDashboardView.prototype._resourcesWasClicked):
(WebInspector.DefaultDashboardView.prototype._networkItemWasClicked):
(WebInspector.DefaultDashboardView.prototype._consoleItemWasClicked):
(WebInspector.DefaultDashboardView.prototype.animationEnded):
(WebInspector.DefaultDashboardView.prototype._setConsoleItemValue):
(WebInspector.DefaultDashboardView.prototype._setItemEnabled):</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkSourceWebInspectorUIChangeLog">trunk/Source/WebInspectorUI/ChangeLog</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceBaseMainjs">trunk/Source/WebInspectorUI/UserInterface/Base/Main.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceControllersDashboardManagerjs">trunk/Source/WebInspectorUI/UserInterface/Controllers/DashboardManager.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceMainhtml">trunk/Source/WebInspectorUI/UserInterface/Main.html</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDashboardViewjs">trunk/Source/WebInspectorUI/UserInterface/Views/DashboardView.js</a></li>
</ul>
<h3>Added Paths</h3>
<ul>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceModelsDefaultDashboardjs">trunk/Source/WebInspectorUI/UserInterface/Models/DefaultDashboard.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDashboardContainerViewcss">trunk/Source/WebInspectorUI/UserInterface/Views/DashboardContainerView.css</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDashboardContainerViewjs">trunk/Source/WebInspectorUI/UserInterface/Views/DashboardContainerView.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDefaultDashboardViewcss">trunk/Source/WebInspectorUI/UserInterface/Views/DefaultDashboardView.css</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDefaultDashboardViewjs">trunk/Source/WebInspectorUI/UserInterface/Views/DefaultDashboardView.js</a></li>
</ul>
<h3>Removed Paths</h3>
<ul>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDashboardViewcss">trunk/Source/WebInspectorUI/UserInterface/Views/DashboardView.css</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkSourceWebInspectorUIChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/ChangeLog (165381 => 165382)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/ChangeLog 2014-03-10 17:49:38 UTC (rev 165381)
+++ trunk/Source/WebInspectorUI/ChangeLog 2014-03-10 18:07:29 UTC (rev 165382)
</span><span class="lines">@@ -1,3 +1,129 @@
</span><ins>+2014-03-10 Brian Burg <bburg@apple.com>
+
+ Web Inspector: convert the dashboard toolbar item to support multiple dashboards
+ https://bugs.webkit.org/show_bug.cgi?id=129898
+
+ Reviewed by Timothy Hatcher.
+
+ We want to ability to swap in and out different dashboard contents depending on
+ circumstances such as debugger activity and page loading. This patch converts the
+ existing hard-coded dashboard implementation to follow the container-based approach
+ used by WebInspector.ContentViewContainer.
+
+ As part of the refactoring, we introduce dashboard model objects to store persistent
+ dashboard data. Some CSS has also been split between the container and specific dashboard.
+
+ * UserInterface/Controllers/DashboardManager.js:
+ (WebInspector.DashboardManager):
+ (WebInspector.DashboardManager.prototype.get toolbarItem):
+ * UserInterface/Main.html:
+ * UserInterface/Models/DefaultDashboard.js: Copied from Source/WebInspectorUI/UserInterface/Controllers/DashboardManager.js.
+ (WebInspector.DefaultDashboard):
+ (WebInspector.DefaultDashboard.prototype.get resourcesCount):
+ (WebInspector.DefaultDashboard.prototype.set resourcesCount):
+ (WebInspector.DefaultDashboard.prototype.get resourcesSize):
+ (WebInspector.DefaultDashboard.prototype.set resourcesSize):
+ (WebInspector.DefaultDashboard.prototype.get time):
+ (WebInspector.DefaultDashboard.prototype.set time):
+ (WebInspector.DefaultDashboard.prototype.get logs):
+ (WebInspector.DefaultDashboard.prototype.set logs):
+ (WebInspector.DefaultDashboard.prototype.get errors):
+ (WebInspector.DefaultDashboard.prototype.set errors):
+ (WebInspector.DefaultDashboard.prototype.get issues):
+ (WebInspector.DefaultDashboard.prototype.set issues):
+ (WebInspector.DefaultDashboard.prototype._dataDidChange):
+ (WebInspector.DefaultDashboard.prototype._mainResourceDidChange):
+ (WebInspector.DefaultDashboard.prototype._recordingStopped):
+ (WebInspector.DefaultDashboard.prototype._resourceWasAdded):
+ (WebInspector.DefaultDashboard.prototype._frameWasAdded):
+ (WebInspector.DefaultDashboard.prototype._resourceSizeDidChange):
+ (WebInspector.DefaultDashboard.prototype._startUpdatingTime):
+ (WebInspector.DefaultDashboard.prototype._stopUpdatingTime):
+ (WebInspector.DefaultDashboard.prototype._updateTime):
+ (WebInspector.DefaultDashboard.prototype._consoleMessageAdded):
+ (WebInspector.DefaultDashboard.prototype._consoleMessageWasRepeated):
+ (WebInspector.DefaultDashboard.prototype._incrementConsoleMessageType):
+ (WebInspector.DefaultDashboard.prototype._consoleWasCleared):
+ * UserInterface/Views/DashboardContainerView.css: Added.
+ (.toolbar .dashboard-container):
+ (body.window-inactive .toolbar .dashboard-container):
+ (body.javascript .toolbar .dashboard-container):
+ (.toolbar.normal-size.icon-and-label-vertical .dashboard-container):
+ (.toolbar.small-size.icon-and-label-horizontal .dashboard-container):
+ (.toolbar.normal-size.icon-and-label-horizontal .dashboard-container):
+ (.toolbar .dashboard-container):
+ (.toolbar .dashboard):
+ (.toolbar .dashboard.visible):
+ (.toolbar .dashboard.slide-out-up):
+ (.toolbar .dashboard.slide-out-down):
+ (.toolbar .dashboard.slide-in-up):
+ (.toolbar .dashboard.slide-in-down):
+ (@-webkit-keyframes slide-top-edge):
+ (to):
+ (@-webkit-keyframes slide-bottom-edge):
+ * UserInterface/Views/DashboardContainerView.js: Added.
+ (WebInspector.DashboardContainerView):
+ (WebInspector.DashboardContainerView.prototype.get toolbarItem):
+ (WebInspector.DashboardContainerView.prototype.get currentDashboardView):
+ (WebInspector.DashboardContainerView.prototype.showDashboardViewForRepresentedObject):
+ (WebInspector.DashboardContainerView.prototype._dashboardViewForRepresentedObject):
+ (WebInspector.DashboardContainerView.prototype._showDashboardView):
+ * UserInterface/Views/DashboardView.css: Removed.
+ * UserInterface/Views/DashboardView.js:
+ (WebInspector.DashboardView):
+ (WebInspector.DashboardView.prototype.get element):
+ (WebInspector.DashboardView.prototype.get parentContainer):
+ (WebInspector.DashboardView.prototype.get representedObject):
+ (WebInspector.DashboardView.prototype.shown):
+ (WebInspector.DashboardView.prototype.hidden):
+ * UserInterface/Views/DefaultDashboardView.css: Added.
+ (body.web .toolbar.collapsed .dashboard.default > .logs):
+ (body.javascript .toolbar .dashboard.default > .resourcesCount):
+ (.toolbar .dashboard.default):
+ (.toolbar .dashboard.default > .item):
+ (.toolbar .dashboard.default > .resourcesSize):
+ (.toolbar .dashboard.default > .item.enabled:hover):
+ (.toolbar .dashboard.default > .item.enabled:active):
+ (.toolbar .dashboard.default > .item > *):
+ (.toolbar .dashboard.default > .item > img):
+ (.toolbar .dashboard.default > .item.enabled > img):
+ (.toolbar .dashboard.default > .item.enabled:hover > img):
+ (.toolbar .dashboard.default > .item > div):
+ (.toolbar .dashboard.default > .item.enabled > div):
+ (.toolbar .dashboard.default > .item.enabled:hover > div):
+ (.toolbar .dashboard.default > .resourcesCount > img):
+ (.toolbar .dashboard.default > .time > img):
+ (.toolbar .dashboard.default > .logs > img):
+ (.toolbar .dashboard.default > .resourcesSize > img):
+ (.toolbar .dashboard.default > .errors > img):
+ (.toolbar .dashboard.default > .errors.enabled > img):
+ (.toolbar .dashboard.default > .errors.enabled:hover > img):
+ (.toolbar .dashboard.default > .errors.enabled > div):
+ (.toolbar .dashboard.default > .errors.enabled:hover > div):
+ (.toolbar .dashboard.default > .issues > img):
+ (.toolbar .dashboard.default > .issues.enabled > img):
+ (.toolbar .dashboard.default > .issues.enabled:hover > img):
+ (.toolbar .dashboard.default > .issues.enabled > div):
+ (.toolbar .dashboard.default > .issues.enabled:hover > div):
+ (.toolbar .dashboard.default > .item.pulsing):
+ (@-webkit-keyframes console-item-pulse):
+ (.toolbar.small-size.icon-and-label-horizontal .dashboard.default > .item):
+ (.toolbar.normal-size.icon-and-label-horizontal .dashboard.default > .item):
+ * UserInterface/Views/DefaultDashboardView.js: Copied from Source/WebInspectorUI/UserInterface/Views/DashboardView.js.
+ (WebInspector.DefaultDashboardView):
+ (WebInspector.DefaultDashboardView.prototype._updateDisplay):
+ (WebInspector.DefaultDashboardView.prototype._formatPossibleLargeNumber):
+ (WebInspector.DefaultDashboardView.prototype._appendElementForNamedItem.):
+ (WebInspector.DefaultDashboardView.prototype._appendElementForNamedItem.set item):
+ (WebInspector.DefaultDashboardView.prototype._appendElementForNamedItem):
+ (WebInspector.DefaultDashboardView.prototype._itemWasClicked):
+ (WebInspector.DefaultDashboardView.prototype._resourcesWasClicked):
+ (WebInspector.DefaultDashboardView.prototype._networkItemWasClicked):
+ (WebInspector.DefaultDashboardView.prototype._consoleItemWasClicked):
+ (WebInspector.DefaultDashboardView.prototype.animationEnded):
+ (WebInspector.DefaultDashboardView.prototype._setConsoleItemValue):
+ (WebInspector.DefaultDashboardView.prototype._setItemEnabled):
+
</ins><span class="cx"> 2014-03-08 Joseph Pecoraro <pecoraro@apple.com>
</span><span class="cx">
</span><span class="cx"> Web Inspector: update-InspectorBackendCommands.rb is putting legacy protocol files in the wrong place
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceBaseMainjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Main.js (165381 => 165382)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Base/Main.js 2014-03-10 17:49:38 UTC (rev 165381)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Main.js 2014-03-10 18:07:29 UTC (rev 165382)
</span><span class="lines">@@ -280,8 +280,11 @@
</span><span class="cx"> this._consoleToolbarButton.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this.toggleConsoleView, this);
</span><span class="cx"> this.toolbar.addToolbarItem(this._consoleToolbarButton, WebInspector.Toolbar.Section.Center);
</span><span class="cx">
</span><del>- this.toolbar.addToolbarItem(this.dashboardManager.toolbarItem, WebInspector.Toolbar.Section.Center);
</del><ins>+ this._dashboardContainerView = new WebInspector.DashboardContainerView;
+ this._dashboardContainerView.showDashboardViewForRepresentedObject(this.dashboardManager.dashboards.default);
</ins><span class="cx">
</span><ins>+ this.toolbar.addToolbarItem(this._dashboardContainerView.toolbarItem, WebInspector.Toolbar.Section.Center);
+
</ins><span class="cx"> // The toolbar button for node inspection.
</span><span class="cx"> if (this.debuggableType === WebInspector.DebuggableType.Web) {
</span><span class="cx"> var toolTip = WebInspector.UIString("Enable point to inspect mode (%s)").format(WebInspector._inspectModeKeyboardShortcut.displayName);
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceControllersDashboardManagerjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Controllers/DashboardManager.js (165381 => 165382)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Controllers/DashboardManager.js 2014-03-10 17:49:38 UTC (rev 165381)
+++ trunk/Source/WebInspectorUI/UserInterface/Controllers/DashboardManager.js 2014-03-10 18:07:29 UTC (rev 165382)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2014 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -26,162 +26,16 @@
</span><span class="cx"> WebInspector.DashboardManager = function() {
</span><span class="cx"> WebInspector.Object.call(this);
</span><span class="cx">
</span><del>- this.toolbarItem = new WebInspector.NavigationItem("dashboard", "group", WebInspector.UIString("Activity Viewer"));
- this._view = new WebInspector.DashboardView(this.toolbarItem.element);
-
- this._waitingForFirstMainResourceToStartTrackingSize = true;
-
- // Necessary event required to track page load time and resource sizes.
- WebInspector.Frame.addEventListener(WebInspector.Frame.Event.MainResourceDidChange, this._mainResourceDidChange, this);
- WebInspector.timelineManager.addEventListener(WebInspector.TimelineManager.Event.RecordingStopped, this._recordingStopped, this);
-
- // Necessary events required to track load of resources.
- WebInspector.Frame.addEventListener(WebInspector.Frame.Event.ResourceWasAdded, this._resourceWasAdded, this);
- WebInspector.frameResourceManager.addEventListener(WebInspector.FrameResourceManager.Event.FrameWasAdded, this._frameWasAdded, this);
-
- // Necessary events required to track console messages.
- var logManager = WebInspector.logManager;
- logManager.addEventListener(WebInspector.LogManager.Event.Cleared, this._consoleWasCleared, this);
- logManager.addEventListener(WebInspector.LogManager.Event.ActiveLogCleared, this._consoleWasCleared, this);
- logManager.addEventListener(WebInspector.LogManager.Event.MessageAdded, this._consoleMessageAdded, this);
- logManager.addEventListener(WebInspector.LogManager.Event.PreviousMessageRepeatCountUpdated, this._consoleMessageWasRepeated, this);
</del><ins>+ this._dashboards = {};
+ this._dashboards.default = new WebInspector.DefaultDashboard;
</ins><span class="cx"> };
</span><span class="cx">
</span><span class="cx"> WebInspector.DashboardManager.prototype = {
</span><span class="cx"> constructor: WebInspector.DashboardManager,
</span><ins>+ __proto__: WebInspector.Object.prototype,
</ins><span class="cx">
</span><del>- _mainResourceDidChange: function(event)
</del><ins>+ get dashboards()
</ins><span class="cx"> {
</span><del>- console.assert(event.target instanceof WebInspector.Frame);
-
- if (!event.target.isMainFrame())
- return;
-
- this._view.resourcesCount = 1;
- this._view.resourcesSize = WebInspector.frameResourceManager.mainFrame.mainResource.size || 0;
-
- // Only update the time if we are recording the timeline.
- if (!WebInspector.timelineManager.recordingEnabled) {
- this._view.time = 0;
- return;
- }
-
- // We should only track resource sizes on fresh loads.
- if (this._waitingForFirstMainResourceToStartTrackingSize) {
- delete this._waitingForFirstMainResourceToStartTrackingSize;
- WebInspector.Resource.addEventListener(WebInspector.Resource.Event.SizeDidChange, this._resourceSizeDidChange, this);
- }
-
- this._startUpdatingTime();
- },
-
- _recordingStopped: function(event)
- {
- // If recording stops, we should stop the timer if it hasn't stopped already.
- this._stopUpdatingTime();
- },
-
- _resourceWasAdded: function(event)
- {
- ++this._view.resourcesCount;
- },
-
- _frameWasAdded: function(event)
- {
- ++this._view.resourcesCount;
- },
-
- _resourceSizeDidChange: function(event)
- {
- this._view.resourcesSize += event.target.size - event.data.previousSize;
- },
-
- _startUpdatingTime: function()
- {
- this._stopUpdatingTime();
-
- this._view.time = 0;
-
- this._timelineBaseTime = Date.now();
- this._timeIntervalDelay = 50;
- this._timeIntervalIdentifier = setInterval(this._updateTime.bind(this), this._timeIntervalDelay);
- },
-
- _stopUpdatingTime: function()
- {
- if (!this._timeIntervalIdentifier)
- return;
-
- clearInterval(this._timeIntervalIdentifier);
- delete this._timeIntervalIdentifier;
- },
-
- _updateTime: function()
- {
- var duration = Date.now() - this._timelineBaseTime;
-
- var timeIntervalDelay = this._timeIntervalDelay;
- if (duration >= 1000) // 1 second
- timeIntervalDelay = 100;
- else if (duration >= 60000) // 60 seconds
- timeIntervalDelay = 1000;
- else if (duration >= 3600000) // 1 minute
- timeIntervalDelay = 10000;
-
- if (timeIntervalDelay !== this._timeIntervalDelay) {
- this._timeIntervalDelay = timeIntervalDelay;
-
- clearInterval(this._timeIntervalIdentifier);
- this._timeIntervalIdentifier = setInterval(this._updateTime.bind(this), this._timeIntervalDelay);
- }
-
- var mainFrame = WebInspector.frameResourceManager.mainFrame;
- var mainFrameStartTime = mainFrame.mainResource.firstTimestamp;
- var mainFrameLoadEventTime = mainFrame.loadEventTimestamp;
-
- if (isNaN(mainFrameStartTime) || isNaN(mainFrameLoadEventTime)) {
- this._view.time = duration / 1000;
- return;
- }
-
- this._view.time = mainFrameLoadEventTime - mainFrameStartTime;
-
- this._stopUpdatingTime();
- },
-
- _consoleMessageAdded: function(event)
- {
- var message = event.data.message;
- this._lastConsoleMessageType = message.level;
- this._incrementConsoleMessageType(message.level, message.totalRepeatCount);
- },
-
- _consoleMessageWasRepeated: function(event)
- {
- this._incrementConsoleMessageType(this._lastConsoleMessageType, 1);
- },
-
- _incrementConsoleMessageType: function(type, increment)
- {
- switch (type) {
- case "log":
- this._view.logs += increment;
- break;
- case "warning":
- this._view.issues += increment;
- break;
- case "error":
- this._view.errors += increment;
- break;
- }
- },
-
- _consoleWasCleared: function(event)
- {
- this._view.logs = 0;
- this._view.issues = 0;
- this._view.errors = 0;
</del><ins>+ return this._dashboards;
</ins><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.DashboardManager.prototype.__proto__ = WebInspector.Object.prototype;
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceMainhtml"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Main.html (165381 => 165382)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Main.html 2014-03-10 17:49:38 UTC (rev 165381)
+++ trunk/Source/WebInspectorUI/UserInterface/Main.html 2014-03-10 18:07:29 UTC (rev 165382)
</span><span class="lines">@@ -61,7 +61,8 @@
</span><span class="cx"> <link rel="stylesheet" href="Views/DOMTreeContentView.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/DOMTreeDataGrid.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/DOMTreeOutline.css">
</span><del>- <link rel="stylesheet" href="Views/DashboardView.css">
</del><ins>+ <link rel="stylesheet" href="Views/DashboardContainerView.css">
+ <link rel="stylesheet" href="Views/DefaultDashboardView.css">
</ins><span class="cx"> <link rel="stylesheet" href="Views/DataGrid.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/DatabaseContentView.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/DatabaseIcon.css">
</span><span class="lines">@@ -217,6 +218,7 @@
</span><span class="cx"> <script src="Models/DOMSearchMatchObject.js"></script>
</span><span class="cx"> <script src="Models/DOMStorageObject.js"></script>
</span><span class="cx"> <script src="Models/DOMTree.js"></script>
</span><ins>+ <script src="Models/DefaultDashboard.js"></script>
</ins><span class="cx"> <script src="Models/DatabaseObject.js"></script>
</span><span class="cx"> <script src="Models/DatabaseTableObject.js"></script>
</span><span class="cx"> <script src="Models/ExecutionContext.js"></script>
</span><span class="lines">@@ -339,7 +341,7 @@
</span><span class="cx"> <script src="Views/DOMTreeElementPathComponent.js"></script>
</span><span class="cx"> <script src="Views/DOMTreeOutline.js"></script>
</span><span class="cx"> <script src="Views/DOMTreeUpdater.js"></script>
</span><del>- <script src="Views/DashboardView.js"></script>
</del><ins>+ <script src="Views/DashboardContainerView.js"></script>
</ins><span class="cx"> <script src="Views/DatabaseContentView.js"></script>
</span><span class="cx"> <script src="Views/DatabaseHostTreeElement.js"></script>
</span><span class="cx"> <script src="Views/DatabaseTableContentView.js"></script>
</span><span class="lines">@@ -347,6 +349,8 @@
</span><span class="cx"> <script src="Views/DatabaseTreeElement.js"></script>
</span><span class="cx"> <script src="Views/DebuggerSidebarPanel.js"></script>
</span><span class="cx"> <script src="Views/DetailsSection.js"></script>
</span><ins>+ <script src="Views/DashboardView.js"></script>
+ <script src="Views/DefaultDashboardView.js"></script>
</ins><span class="cx"> <script src="Views/DetailsSectionDataGridRow.js"></script>
</span><span class="cx"> <script src="Views/DetailsSectionGroup.js"></script>
</span><span class="cx"> <script src="Views/DetailsSectionPropertiesRow.js"></script>
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceModelsDefaultDashboardjsfromrev165380trunkSourceWebInspectorUIUserInterfaceControllersDashboardManagerjs"></a>
<div class="copfile"><h4>Copied: trunk/Source/WebInspectorUI/UserInterface/Models/DefaultDashboard.js (from rev 165380, trunk/Source/WebInspectorUI/UserInterface/Controllers/DashboardManager.js) (0 => 165382)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Models/DefaultDashboard.js (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/DefaultDashboard.js 2014-03-10 18:07:29 UTC (rev 165382)
</span><span class="lines">@@ -0,0 +1,270 @@
</span><ins>+/*
+ * Copyright (C) 2013, 2014 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+ * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+ * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+ * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+ * OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+ * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+ * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+ * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+ * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+ * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WebInspector.DefaultDashboard = function() {
+ WebInspector.Object.call(this);
+
+ this._waitingForFirstMainResourceToStartTrackingSize = true;
+
+ // Necessary event required to track page load time and resource sizes.
+ WebInspector.Frame.addEventListener(WebInspector.Frame.Event.MainResourceDidChange, this._mainResourceDidChange, this);
+ WebInspector.timelineManager.addEventListener(WebInspector.TimelineManager.Event.RecordingStopped, this._recordingStopped, this);
+
+ // Necessary events required to track load of resources.
+ WebInspector.Frame.addEventListener(WebInspector.Frame.Event.ResourceWasAdded, this._resourceWasAdded, this);
+ WebInspector.frameResourceManager.addEventListener(WebInspector.FrameResourceManager.Event.FrameWasAdded, this._frameWasAdded, this);
+
+ // Necessary events required to track console messages.
+ var logManager = WebInspector.logManager;
+ logManager.addEventListener(WebInspector.LogManager.Event.Cleared, this._consoleWasCleared, this);
+ logManager.addEventListener(WebInspector.LogManager.Event.ActiveLogCleared, this._consoleWasCleared, this);
+ logManager.addEventListener(WebInspector.LogManager.Event.MessageAdded, this._consoleMessageAdded, this);
+ logManager.addEventListener(WebInspector.LogManager.Event.PreviousMessageRepeatCountUpdated, this._consoleMessageWasRepeated, this);
+
+ this._resourcesCount = 0;
+ this._resourcesSize = 0;
+ this._time = 0;
+ this._logs = 0;
+ this._errors = 0;
+ this._issues = 0;
+};
+
+WebInspector.DefaultDashboard.Event = {
+ DataDidChange: "default-dashboard-data-did-change"
+};
+
+WebInspector.DefaultDashboard.prototype = {
+ constructor: WebInspector.DefaultDashboard,
+ __proto__: WebInspector.Object.prototype,
+
+ // Public
+
+ get resourcesCount()
+ {
+ return this._resourcesCount;
+ },
+
+ set resourcesCount(value)
+ {
+ this._resourcesCount = value;
+ this._dataDidChange();
+ },
+
+ get resourcesSize()
+ {
+ return this._resourcesSize;
+ },
+
+ set resourcesSize(value)
+ {
+ this._resourcesSize = value;
+ this._dataDidChange();
+ },
+
+ get time()
+ {
+ return this._time;
+ },
+
+ set time(value)
+ {
+ this._time = value;
+ this._dataDidChange();
+ },
+
+ get logs()
+ {
+ return this._logs;
+ },
+
+ set logs(value)
+ {
+ this._logs = value;
+ this._dataDidChange();
+ },
+
+ get errors()
+ {
+ return this._errors;
+ },
+
+ set errors(value)
+ {
+ this._errors = value;
+ this._dataDidChange();
+ },
+
+ get issues()
+ {
+ return this._issues;
+ },
+
+ set issues(value)
+ {
+ this._issues = value;
+ this._dataDidChange();
+ },
+
+ // Private
+
+ _dataDidChange: function()
+ {
+ this.dispatchEventToListeners(WebInspector.DefaultDashboard.Event.DataDidChange);
+ },
+
+ _mainResourceDidChange: function(event)
+ {
+ console.assert(event.target instanceof WebInspector.Frame);
+
+ if (!event.target.isMainFrame())
+ return;
+
+ this._resourcesCount = 1;
+ this._resourcesSize = WebInspector.frameResourceManager.mainFrame.mainResource.size || 0;
+
+ // Only update the time if we are recording the timeline.
+ if (!WebInspector.timelineManager.recordingEnabled) {
+ this._time = 0;
+ return;
+ }
+
+ // We should only track resource sizes on fresh loads.
+ if (this._waitingForFirstMainResourceToStartTrackingSize) {
+ delete this._waitingForFirstMainResourceToStartTrackingSize;
+ WebInspector.Resource.addEventListener(WebInspector.Resource.Event.SizeDidChange, this._resourceSizeDidChange, this);
+ }
+
+ this._dataDidChange();
+ this._startUpdatingTime();
+ },
+
+ _recordingStopped: function(event)
+ {
+ // If recording stops, we should stop the timer if it hasn't stopped already.
+ this._stopUpdatingTime();
+ },
+
+ _resourceWasAdded: function(event)
+ {
+ ++this.resourcesCount;
+ },
+
+ _frameWasAdded: function(event)
+ {
+ ++this.resourcesCount;
+ },
+
+ _resourceSizeDidChange: function(event)
+ {
+ this.resourcesSize += event.target.size - event.data.previousSize;
+ },
+
+ _startUpdatingTime: function()
+ {
+ this._stopUpdatingTime();
+
+ this.time = 0;
+
+ this._timelineBaseTime = Date.now();
+ this._timeIntervalDelay = 50;
+ this._timeIntervalIdentifier = setInterval(this._updateTime.bind(this), this._timeIntervalDelay);
+ },
+
+ _stopUpdatingTime: function()
+ {
+ if (!this._timeIntervalIdentifier)
+ return;
+
+ clearInterval(this._timeIntervalIdentifier);
+ delete this._timeIntervalIdentifier;
+ },
+
+ _updateTime: function()
+ {
+ var duration = Date.now() - this._timelineBaseTime;
+
+ var timeIntervalDelay = this._timeIntervalDelay;
+ if (duration >= 1000) // 1 second
+ timeIntervalDelay = 100;
+ else if (duration >= 60000) // 60 seconds
+ timeIntervalDelay = 1000;
+ else if (duration >= 3600000) // 1 minute
+ timeIntervalDelay = 10000;
+
+ if (timeIntervalDelay !== this._timeIntervalDelay) {
+ this._timeIntervalDelay = timeIntervalDelay;
+
+ clearInterval(this._timeIntervalIdentifier);
+ this._timeIntervalIdentifier = setInterval(this._updateTime.bind(this), this._timeIntervalDelay);
+ }
+
+ var mainFrame = WebInspector.frameResourceManager.mainFrame;
+ var mainFrameStartTime = mainFrame.mainResource.firstTimestamp;
+ var mainFrameLoadEventTime = mainFrame.loadEventTimestamp;
+
+ if (isNaN(mainFrameStartTime) || isNaN(mainFrameLoadEventTime)) {
+ this.time = duration / 1000;
+ return;
+ }
+
+ this.time = mainFrameLoadEventTime - mainFrameStartTime;
+
+ this._stopUpdatingTime();
+ },
+
+ _consoleMessageAdded: function(event)
+ {
+ var message = event.data.message;
+ this._lastConsoleMessageType = message.level;
+ this._incrementConsoleMessageType(message.level, message.totalRepeatCount);
+ },
+
+ _consoleMessageWasRepeated: function(event)
+ {
+ this._incrementConsoleMessageType(this._lastConsoleMessageType, 1);
+ },
+
+ _incrementConsoleMessageType: function(type, increment)
+ {
+ switch (type) {
+ case "log":
+ this.logs += increment;
+ break;
+ case "warning":
+ this.issues += increment;
+ break;
+ case "error":
+ this.errors += increment;
+ break;
+ }
+ },
+
+ _consoleWasCleared: function(event)
+ {
+ this._logs = 0;
+ this._issues = 0;
+ this._errors = 0;
+ }
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDashboardContainerViewcss"></a>
<div class="addfile"><h4>Added: trunk/Source/WebInspectorUI/UserInterface/Views/DashboardContainerView.css (0 => 165382)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DashboardContainerView.css (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DashboardContainerView.css 2014-03-10 18:07:29 UTC (rev 165382)
</span><span class="lines">@@ -0,0 +1,132 @@
</span><ins>+/*
+ * Copyright (C) 2013, 2014 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+.toolbar .dashboard-container {
+ position: relative;
+
+ width: 375px;
+
+ border: 1px solid rgb(163, 163, 163);
+ border-radius: 4px;
+
+ box-shadow: rgba(255, 255, 255, 0.45) 0 1px 0;
+
+ margin: 4px 10px;
+ overflow: hidden;
+}
+
+body.window-inactive .toolbar .dashboard-container {
+ border-color: rgb(196, 196, 196);
+ background-image: none;
+ background-color: rgb(239, 239, 239);
+}
+
+.toolbar.collapsed .dashboard-container,
+body.javascript .toolbar .dashboard-container {
+ width: 175px;
+}
+
+.toolbar.small-size.icon-and-label-vertical .dashboard-container,
+.toolbar.normal-size.icon-and-label-vertical .dashboard-container {
+ margin-top: 6px;
+}
+
+/* Styles for the extra short style, one row with quite a small y-margin */
+
+.toolbar.label-only .dashboard-container,
+.toolbar.small-size.icon-only .dashboard-container,
+.toolbar.small-size.icon-and-label-vertical .dashboard-container,
+.toolbar.small-size.icon-and-label-horizontal .dashboard-container {
+ height: 22px;
+}
+
+/* Styles for the fairly short style, one row with quite a bit of y-margin */
+
+.toolbar.normal-size.icon-only .dashboard-container,
+.toolbar.normal-size.icon-and-label-vertical .dashboard-container,
+.toolbar.normal-size.icon-and-label-horizontal .dashboard-container {
+ height: 30px;
+}
+
+/* Default styles for dashboards */
+
+.toolbar .dashboard {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+
+ background-image: linear-gradient(to bottom, rgba(0, 128, 255, 0), rgba(0, 128, 255, 0.075)),
+ linear-gradient(to right, rgba(0, 0, 0, 0.09), transparent, rgba(0, 0, 0, 0.09)),
+ linear-gradient(to bottom, rgb(240, 244, 251), rgb(250, 253, 255));
+ background-size: 100% 6px, auto, auto;
+ background-position: bottom, center, center;
+ background-repeat: no-repeat;
+
+ padding: 0 5px;
+
+ -webkit-animation-duration: 0.4s;
+}
+
+.toolbar .dashboard.visible {
+ z-index: 100;
+}
+
+.toolbar .dashboard.slide-out-up {
+ -webkit-animation-name: slide-top-edge;
+ -webkit-animation-direction: reverse;
+}
+
+.toolbar .dashboard.slide-out-down {
+ -webkit-animation-name: slide-bottom-edge;
+}
+
+.toolbar .dashboard.slide-in-up {
+ -webkit-animation-name: slide-bottom-edge;
+ -webkit-animation-direction: reverse;
+}
+
+.toolbar .dashboard.slide-in-down {
+ -webkit-animation-name: slide-top-edge;
+}
+
+@-webkit-keyframes slide-top-edge {
+ from {
+ -webkit-transform: translateY(-30px);
+ }
+ to {
+ -webkit-transform: translateY(0);
+ }
+}
+
+@-webkit-keyframes slide-bottom-edge {
+ from {
+ -webkit-transform: translateY(0);
+ }
+ to {
+ -webkit-transform: translateY(30px);
+ }
+}
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDashboardContainerViewjs"></a>
<div class="addfile"><h4>Added: trunk/Source/WebInspectorUI/UserInterface/Views/DashboardContainerView.js (0 => 165382)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DashboardContainerView.js (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DashboardContainerView.js 2014-03-10 18:07:29 UTC (rev 165382)
</span><span class="lines">@@ -0,0 +1,235 @@
</span><ins>+/*
+ * Copyright (C) 2013, 2014 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WebInspector.DashboardContainerView = function() {
+ WebInspector.Object.call(this);
+
+ this._toolbarItem = new WebInspector.NavigationItem("dashboard-container", "group", WebInspector.UIString("Activity Viewer"));
+
+ // Represents currently open dashboards, with the most recent entries appended to the end.
+ this._dashboardStack = [];
+ this._currentIndex = -1;
+};
+
+WebInspector.DashboardContainerView.VisibleDashboardStyleClassName = "visible";
+
+WebInspector.DashboardContainerView.AdvanceDirection = {
+ Forward: "dashboard-container-view-advance-direction-forward",
+ Backward: "dashboard-container-view-advance-direction-backward",
+ None: "dashboard-container-view-advance-direction-none"
+};
+
+WebInspector.DashboardContainerView.ForwardIncomingDashboardStyleClassName = "slide-in-down";
+WebInspector.DashboardContainerView.BackwardIncomingDashboardStyleClassName = "slide-in-up";
+WebInspector.DashboardContainerView.ForwardOutgoingDashboardStyleClassName = "slide-out-down";
+WebInspector.DashboardContainerView.BackwardOutgoingDashboardStyleClassName = "slide-out-up";
+
+WebInspector.DashboardContainerView.prototype = {
+ constructor: WebInspector.DashboardContainerView,
+ __proto__: WebInspector.Object.prototype,
+
+ // Public
+
+ get toolbarItem()
+ {
+ return this._toolbarItem;
+ },
+
+ get currentDashboardView()
+ {
+ if (this._currentIndex === -1)
+ return null;
+
+ return this._dashboardStack[this._currentIndex];
+ },
+
+ showDashboardViewForRepresentedObject: function(representedObject)
+ {
+ var dashboardView = this._dashboardViewForRepresentedObject(representedObject);
+ if (!dashboardView)
+ return null;
+
+ if (this.currentDashboardView === dashboardView)
+ return;
+
+ var index = this._dashboardStack.indexOf(dashboardView);
+ this._showDashboardAtIndex(index);
+ return dashboardView;
+ },
+
+ hideDashboardViewForRepresentedObject: function(representedObject)
+ {
+ var onlyReturnExistingViews = true;
+ var dashboardView = this._dashboardViewForRepresentedObject(representedObject, onlyReturnExistingViews);
+
+ if (this.currentDashboardView !== dashboardView)
+ return;
+
+ console.assert(this._currentIndex > 0);
+ this._showDashboardAtIndex(this._currentIndex - 1);
+ },
+
+ closeDashboardViewForRepresentedObject: function(representedObject)
+ {
+ var onlyReturnExistingViews = true;
+ var dashboardView = this._dashboardViewForRepresentedObject(representedObject, onlyReturnExistingViews);
+ if (!dashboardView)
+ return null;
+
+ this._closeDashboardView(dashboardView);
+ },
+
+ // Private
+
+ _dashboardViewForRepresentedObject: function(representedObject, onlyReturnExistingViews)
+ {
+ console.assert(representedObject);
+
+ // Iterate over all known dashboard views and see if any are for this object.
+ for (var dashboardView of this._dashboardStack) {
+ if (dashboardView.representedObject === representedObject)
+ return dashboardView;
+ }
+
+ if (onlyReturnExistingViews)
+ return null;
+
+ try {
+ // No existing content view found, make a new one.
+ dashboardView = new WebInspector.DashboardView(representedObject);
+ } catch (e) {
+ console.error(e);
+ return null;
+ }
+
+ this._dashboardStack.push(dashboardView);
+ this._toolbarItem.element.appendChild(dashboardView.element);
+
+ return dashboardView;
+ },
+
+ _showDashboardAtIndex: function(index)
+ {
+ console.assert(index >= 0 && index <= this._dashboardStack.length - 1);
+
+ if (this._currentIndex === index)
+ return;
+
+ var advanceDirection = WebInspector.DashboardContainerView.AdvanceDirection.Forward;
+ var initialDirection = WebInspector.DashboardContainerView.AdvanceDirection.None;
+ var isFirstDashboard = this._currentIndex === -1;
+ if (!isFirstDashboard)
+ this._hideDashboardView(this.currentDashboardView, advanceDirection);
+
+ this._currentIndex = index;
+ this._showDashboardView(this.currentDashboardView, isFirstDashboard ? initialDirection : advanceDirection);
+ },
+
+ _showDashboardView: function(dashboardView, advanceDirection)
+ {
+ console.assert(dashboardView instanceof WebInspector.DashboardView);
+
+ dashboardView.shown();
+
+ var animationClass = null;
+ if (advanceDirection === WebInspector.DashboardContainerView.AdvanceDirection.Forward)
+ animationClass = WebInspector.DashboardContainerView.ForwardIncomingDashboardStyleClassName;
+ if (advanceDirection === WebInspector.DashboardContainerView.AdvanceDirection.Backward)
+ animationClass = WebInspector.DashboardContainerView.BackwardIncomingDashboardStyleClassName;
+
+ if (animationClass) {
+ function animationEnded(event) {
+ if (event.target !== dashboardView.element)
+ return;
+
+ dashboardView.element.removeEventListener("webkitAnimationEnd", animationEnded);
+ dashboardView.element.classList.remove(animationClass);
+ dashboardView.element.classList.add(WebInspector.DashboardContainerView.VisibleDashboardStyleClassName);
+ }
+ dashboardView.element.classList.add(animationClass);
+ dashboardView.element.addEventListener("webkitAnimationEnd", animationEnded);
+ } else
+ dashboardView.element.classList.add(WebInspector.DashboardContainerView.VisibleDashboardStyleClassName);
+
+ return dashboardView;
+ },
+
+ _hideDashboardView: function(dashboardView, advanceDirection, callback)
+ {
+ console.assert(dashboardView instanceof WebInspector.DashboardView);
+ console.assert(this.currentDashboardView === dashboardView);
+
+ dashboardView.hidden();
+
+ var animationClass = null;
+ if (advanceDirection === WebInspector.DashboardContainerView.AdvanceDirection.Forward)
+ animationClass = WebInspector.DashboardContainerView.ForwardOutgoingDashboardStyleClassName;
+ if (advanceDirection === WebInspector.DashboardContainerView.AdvanceDirection.Backward)
+ animationClass = WebInspector.DashboardContainerView.BackwardOutgoingDashboardStyleClassName;
+
+ if (animationClass) {
+ function animationEnded(event) {
+ if (event.target !== dashboardView.element)
+ return;
+
+ dashboardView.element.removeEventListener("webkitAnimationEnd", animationEnded);
+ dashboardView.element.classList.remove(animationClass);
+ dashboardView.element.classList.remove(WebInspector.DashboardContainerView.VisibleDashboardStyleClassName);
+
+ if (typeof callback === "function")
+ callback();
+ }
+ dashboardView.element.classList.add(animationClass);
+ dashboardView.element.addEventListener("webkitAnimationEnd", animationEnded);
+ } else
+ dashboardView.element.classList.remove(WebInspector.DashboardContainerView.VisibleDashboardStyleClassName);
+ },
+
+ _closeDashboardView: function(dashboardView)
+ {
+ console.assert(dashboardView instanceof WebInspector.DashboardView);
+
+ function dissociateDashboardView() {
+ dashboardView.closed();
+ dashboardView.element.parentNode.removeChild(dashboardView.element);
+ }
+
+ var index = this._dashboardStack.indexOf(dashboardView);
+
+ if (this.currentDashboardView === dashboardView) {
+ var direction = WebInspector.DashboardContainerView.AdvanceDirection.Backward;
+ this._hideDashboardView(this.currentDashboardView, direction, dissociateDashboardView);
+ this._dashboardStack.splice(index, 1);
+ --this._currentIndex;
+ this._showDashboardView(this.currentDashboardView, direction);
+ return;
+ }
+
+ this._dashboardStack.splice(index, 1);
+ if (this._currentIndex > index)
+ --this._currentIndex;
+ dissociateDashboardView.call(this);
+ }
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDashboardViewcss"></a>
<div class="delfile"><h4>Deleted: trunk/Source/WebInspectorUI/UserInterface/Views/DashboardView.css (165381 => 165382)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DashboardView.css 2014-03-10 17:49:38 UTC (rev 165381)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DashboardView.css 2014-03-10 18:07:29 UTC (rev 165382)
</span><span class="lines">@@ -1,243 +0,0 @@
</span><del>-/*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
- *
- * Redistribution and use in source and binary forms, with or without
- * modification, are permitted provided that the following conditions
- * are met:
- * 1. Redistributions of source code must retain the above copyright
- * notice, this list of conditions and the following disclaimer.
- * 2. Redistributions in binary form must reproduce the above copyright
- * notice, this list of conditions and the following disclaimer in the
- * documentation and/or other materials provided with the distribution.
- *
- * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
- * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
- * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
- * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
- * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
- * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
- * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
- * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
- * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
- * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
- * THE POSSIBILITY OF SUCH DAMAGE.
- */
-
-.toolbar .dashboard {
- display: -webkit-flex;
- -webkit-flex-flow: row nowrap;
-
- -webkit-justify-content: space-between;
-
- margin: 4px 10px;
- padding: 0 5px;
-
- width: 375px;
-
- background-image: linear-gradient(to bottom, rgba(0, 128, 255, 0), rgba(0, 128, 255, 0.075)),
- linear-gradient(to right, rgba(0, 0, 0, 0.09), transparent, rgba(0, 0, 0, 0.09)),
- linear-gradient(to bottom, rgb(240, 244, 251), rgb(250, 253, 255));
- background-size: 100% 6px, auto, auto;
- background-position: bottom, center, center;
- background-repeat: no-repeat;
-
- border: 1px solid rgb(163, 163, 163);
- border-radius: 4px;
-
- box-shadow: rgba(255, 255, 255, 0.45) 0 1px 0;
-}
-
-body.window-inactive .toolbar .dashboard {
- border-color: rgb(196, 196, 196);
- background-image: none;
- background-color: rgb(239, 239, 239);
-}
-
-.toolbar.collapsed .dashboard,
-body.javascript .toolbar .dashboard {
- width: 175px;
-}
-
-body.web .toolbar.collapsed .dashboard > .time,
-body.web .toolbar.collapsed .dashboard > .resourcesSize,
-body.web .toolbar.collapsed .dashboard > .logs {
- display: none;
-}
-
-body.javascript .toolbar .dashboard > .time,
-body.javascript .toolbar .dashboard > .resourcesSize,
-body.javascript .toolbar .dashboard > .resourcesCount {
- display: none;
-}
-
-.toolbar .dashboard > .item {
- font-family: Helvetica, sans-serif;
- font-weight: bold;
- font-size: 11px;
- line-height: 12px;
-
- padding: 0 5px;
-
- display: -webkit-flex;
-
- min-width: 45px;
-
- -webkit-justify-content: center;
- -webkit-align-items: center;
-
- border-radius: 4px;
- border: 1px solid transparent;
-}
-
-.toolbar .dashboard > .time,
-.toolbar .dashboard > .resourcesSize {
- min-width: 70px;
-}
-
-.toolbar .dashboard > .item.enabled:hover {
- border: 1px solid rgba(0, 0, 0, 0.1);
-}
-
-.toolbar .dashboard > .item.enabled:active {
- border: 1px solid rgba(0, 0, 0, 0.2);
-}
-
-.toolbar .dashboard > .item > * {
- display: -webkit-flex;
- -webkit-align-items: center;
-}
-
-.toolbar .dashboard > .item > img {
- opacity: 0.2;
- width: 16px;
- height: 16px;
- pointer-events: none;
-}
-
-.toolbar .dashboard > .item.enabled > img {
- opacity: 0.5;
-}
-
-.toolbar .dashboard > .item.enabled:hover > img {
- opacity: 0.65;
-}
-
-.toolbar .dashboard > .item > div {
- display: -webkit-flex;
- -webkit-flex: 1;
-
- color: rgba(0, 0, 0, 0.2);
- padding-left: 2px;
-}
-
-.toolbar .dashboard > .item.enabled > div {
- color: rgba(0, 0, 0, 0.7);
-}
-
-.toolbar .dashboard > .item.enabled:hover > div {
- color: rgba(0, 0, 0, 0.85);
-}
-
-.toolbar .dashboard > .resourcesCount > img {
- content: url(../Images/Resources.svg);
-}
-
-.toolbar .dashboard > .time > img {
- content: url(../Images/Time.svg);
-}
-
-.toolbar .dashboard > .logs > img {
- content: url(../Images/Logs.svg);
-}
-
-.toolbar .dashboard > .resourcesSize > img {
- content: url(../Images/Weight.svg);
-}
-
-.toolbar .dashboard > .errors > img {
- content: url(../Images/Errors.svg);
-}
-
-.toolbar .dashboard > .errors.enabled > img {
- content: url(../Images/ErrorsEnabled.svg);
- opacity: 0.9;
-}
-
-.toolbar .dashboard > .errors.enabled:hover > img {
- opacity: 1;
-}
-
-.toolbar .dashboard > .errors.enabled > div {
- color: rgba(201, 55, 57, 0.9);
-}
-
-.toolbar .dashboard > .errors.enabled:hover > div {
- color: rgb(201, 55, 57);
-}
-
-.toolbar .dashboard > .issues > img {
- content: url(../Images/Issues.svg);
-}
-
-.toolbar .dashboard > .issues.enabled > img {
- content: url(../Images/IssuesEnabled.svg);
- opacity: 0.9;
-}
-
-.toolbar .dashboard > .issues.enabled:hover > img {
- opacity: 1;
-}
-
-.toolbar .dashboard > .issues.enabled > div {
- color: rgba(224, 164, 4, 0.9);
-}
-
-.toolbar .dashboard > .issues.enabled:hover > div {
- color: rgb(224, 164, 4);
-}
-
-.toolbar.small-size.icon-and-label-vertical .dashboard,
-.toolbar.normal-size.icon-and-label-vertical .dashboard {
- margin-top: 6px;
-}
-
-/* Styles for the extra short style, one row with quite a small y-margin */
-
-.toolbar.label-only .dashboard,
-.toolbar.small-size.icon-only .dashboard,
-.toolbar.small-size.icon-and-label-vertical .dashboard,
-.toolbar.small-size.icon-and-label-horizontal .dashboard {
- height: 22px;
-}
-
-.toolbar.label-only .dashboard > .item,
-.toolbar.small-size.icon-only .dashboard > .item,
-.toolbar.small-size.icon-and-label-vertical .dashboard > .item,
-.toolbar.small-size.icon-and-label-horizontal .dashboard > .item {
- margin: 1px 0;
-}
-
-/* Styles for the fairly short style, one row with quite a bit of y-margin */
-
-.toolbar.normal-size.icon-only .dashboard,
-.toolbar.normal-size.icon-and-label-vertical .dashboard,
-.toolbar.normal-size.icon-and-label-horizontal .dashboard {
- height: 30px;
-}
-
-.toolbar.normal-size.icon-only .dashboard > .item,
-.toolbar.normal-size.icon-and-label-vertical .dashboard > .item,
-.toolbar.normal-size.icon-and-label-horizontal .dashboard > .item {
- margin: 4px 0;
-}
-
-/* Styles for the pulsing animated state of console items */
-
-.toolbar .dashboard > .item.pulsing {
- -webkit-animation-name: console-item-pulse;
- -webkit-animation-duration: 0.75s;
-}
-
-@-webkit-keyframes console-item-pulse {
- 50% { opacity: 0.6; }
-}
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDashboardViewjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DashboardView.js (165381 => 165382)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DashboardView.js 2014-03-10 17:49:38 UTC (rev 165381)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DashboardView.js 2014-03-10 18:07:29 UTC (rev 165382)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2014 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,223 +23,61 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.DashboardView = function(element)
</del><ins>+WebInspector.DashboardView = function(representedObject, identifier)
</ins><span class="cx"> {
</span><del>- WebInspector.Object.call(this);
</del><ins>+ // Creating a new DashboardView directly returns an instance of the proper subclass.
+ if (this.constructor === WebInspector.DashboardView) {
+ console.assert(representedObject);
</ins><span class="cx">
</span><del>- this._element = element;
</del><ins>+ if (representedObject instanceof WebInspector.DefaultDashboard)
+ return new WebInspector.DefaultDashboardView(representedObject);
</ins><span class="cx">
</span><del>- this._items = {
- resourcesCount: {
- tooltip: WebInspector.UIString("Total number of resources, click to show the Resources navigation sidebar"),
- handler: this._resourcesWasClicked
- },
- resourcesSize: {
- tooltip: WebInspector.UIString("Total size of all resources, click to show the Network Requests timeline"),
- handler: this._networkItemWasClicked
- },
- time: {
- tooltip: WebInspector.UIString("Time until the load event fired, click to show the Network Requests timeline"),
- handler: this._networkItemWasClicked
- },
- logs: {
- tooltip: WebInspector.UIString("Console logs, click to show the Console"),
- handler: this._consoleItemWasClicked.bind(this, WebInspector.LogContentView.Scopes.Logs)
- },
- errors: {
- tooltip: WebInspector.UIString("Console errors, click to show the Console"),
- handler: this._consoleItemWasClicked.bind(this, WebInspector.LogContentView.Scopes.Errors)
- },
- issues: {
- tooltip: WebInspector.UIString("Console warnings, click to show the Console"),
- handler: this._consoleItemWasClicked.bind(this, WebInspector.LogContentView.Scopes.Warnings)
- }
- };
</del><ins>+ throw "Can't make a DashboardView for an unknown representedObject.";
+ }
</ins><span class="cx">
</span><del>- for (var name in this._items)
- this._appendElementForNamedItem(name);
</del><ins>+ // Otherwise, a subclass is calling the base constructor.
+ console.assert(this.constructor !== WebInspector.DashboardView && this instanceof WebInspector.DashboardView);
+ console.assert(identifier);
</ins><span class="cx">
</span><del>- this.resourcesCount = 0;
- this.resourcesSize = 0;
- this.time = 0;
- this.logs = 0;
- this.errors = 0;
- this.issues = 0;
</del><ins>+ WebInspector.Object.call(this);
+
+ this._representedObject = representedObject;
+
+ this._element = document.createElement("div");
+ this._element.classList.add(WebInspector.DashboardView.StyleClassName);
+ this._element.classList.add(identifier);
</ins><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.DashboardView.EnabledStyleClassName = "enabled";
</del><ins>+WebInspector.DashboardView.StyleClassName = "dashboard";
</ins><span class="cx">
</span><span class="cx"> WebInspector.DashboardView.prototype = {
</span><span class="cx"> constructor: WebInspector.DashboardView,
</span><ins>+ __proto__: WebInspector.Object.prototype,
</ins><span class="cx">
</span><span class="cx"> // Public
</span><span class="cx">
</span><del>- get logs()
</del><ins>+ get element()
</ins><span class="cx"> {
</span><del>- return this._logs;
</del><ins>+ return this._element;
</ins><span class="cx"> },
</span><span class="cx">
</span><del>- set logs(logs)
</del><ins>+ get representedObject()
</ins><span class="cx"> {
</span><del>- this._setConsoleItemValue("logs", logs);
</del><ins>+ return this._representedObject;
</ins><span class="cx"> },
</span><span class="cx">
</span><del>- get issues()
</del><ins>+ shown: function()
</ins><span class="cx"> {
</span><del>- return this._issues;
</del><ins>+ // Implemented by subclasses.
</ins><span class="cx"> },
</span><span class="cx">
</span><del>- set issues(issues)
</del><ins>+ hidden: function()
</ins><span class="cx"> {
</span><del>- this._setConsoleItemValue("issues", issues);
</del><ins>+ // Implemented by subclasses.
</ins><span class="cx"> },
</span><span class="cx">
</span><del>- get errors()
</del><ins>+ closed: function()
</ins><span class="cx"> {
</span><del>- return this._errors;
- },
-
- set errors(errors)
- {
- this._setConsoleItemValue("errors", errors);
- },
-
- set time(time)
- {
- var item = this._items.time;
- item.text = time ? Number.secondsToString(time) : "\u2014";
- this._setItemEnabled(item, time > 0);
- },
-
- get resourcesCount()
- {
- return this._resourcesCount;
- },
-
- set resourcesCount(resourcesCount)
- {
- this._resourcesCount = resourcesCount;
-
- var item = this._items.resourcesCount;
- item.text = this._formatPossibleLargeNumber(resourcesCount);
- this._setItemEnabled(item, resourcesCount > 0);
- },
-
- get resourcesSize()
- {
- return this._resourcesSize;
- },
-
- set resourcesSize(resourcesSize)
- {
- this._resourcesSize = resourcesSize;
-
- var item = this._items.resourcesSize;
- item.text = resourcesSize ? Number.bytesToString(resourcesSize, false) : "\u2014";
- this._setItemEnabled(item, resourcesSize > 0);
- },
-
- // Private
-
- _formatPossibleLargeNumber: function(number)
- {
- return number > 999 ? WebInspector.UIString("999+") : number;
- },
-
- _appendElementForNamedItem: function(name)
- {
- var item = this._items[name];
-
- item.container = this._element.appendChild(document.createElement("div"));
- item.container.className = "item " + name;
- item.container.title = item.tooltip;
-
- item.container.appendChild(document.createElement("img"));
-
- item.outlet = item.container.appendChild(document.createElement("div"));
-
- Object.defineProperty(item, "text",
- {
- set: function(newText)
- {
- if (newText === item.outlet.textContent)
- return;
- item.outlet.textContent = newText;
- }
- });
-
- item.container.addEventListener("click", function(event) {
- this._itemWasClicked(name);
- }.bind(this));
- },
-
- _itemWasClicked: function(name)
- {
- var item = this._items[name];
- if (!item.container.classList.contains(WebInspector.DashboardView.EnabledStyleClassName))
- return;
-
- if (item.handler)
- item.handler.call(this);
- },
-
- _resourcesWasClicked: function()
- {
- WebInspector.navigationSidebar.selectedSidebarPanel = WebInspector.resourceSidebarPanel;
- WebInspector.navigationSidebar.collapsed = false;
- },
-
- _networkItemWasClicked: function()
- {
- WebInspector.navigationSidebar.selectedSidebarPanel = WebInspector.timelineSidebarPanel;
- },
-
- _consoleItemWasClicked: function(scope)
- {
- WebInspector.showConsoleView(scope);
- },
-
- _setConsoleItemValue: function(itemName, newValue)
- {
- var iVarName = "_" + itemName;
- var previousValue = this[iVarName];
- this[iVarName] = newValue;
-
- var item = this._items[itemName];
- item.text = this._formatPossibleLargeNumber(newValue);
- this._setItemEnabled(item, newValue > 0);
-
- if (newValue <= previousValue)
- return;
-
- var container = item.container;
-
- function animationEnded(event)
- {
- if (event.target === container) {
- container.classList.remove("pulsing");
- container.removeEventListener("webkitAnimationEnd", animationEnded);
- }
- }
-
- // We need to force a style invalidation in the case where we already
- // were animating this item after we've removed the pulsing CSS class.
- if (container.classList.contains("pulsing")) {
- container.classList.remove("pulsing");
- container.recalculateStyles();
- } else
- container.addEventListener("webkitAnimationEnd", animationEnded);
-
- container.classList.add("pulsing");
- },
-
- _setItemEnabled: function(item, enabled)
- {
- if (enabled)
- item.container.classList.add(WebInspector.DashboardView.EnabledStyleClassName);
- else
- item.container.classList.remove(WebInspector.DashboardView.EnabledStyleClassName);
</del><ins>+ // Implemented by subclasses.
</ins><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.DashboardView.prototype.__proto__ = WebInspector.Object.prototype;
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDefaultDashboardViewcss"></a>
<div class="addfile"><h4>Added: trunk/Source/WebInspectorUI/UserInterface/Views/DefaultDashboardView.css (0 => 165382)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DefaultDashboardView.css (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DefaultDashboardView.css 2014-03-10 18:07:29 UTC (rev 165382)
</span><span class="lines">@@ -0,0 +1,197 @@
</span><ins>+/*
+ * Copyright (C) 2013, 2014 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+body.web .toolbar.collapsed .dashboard.default > .time,
+body.web .toolbar.collapsed .dashboard.default > .resourcesSize,
+body.web .toolbar.collapsed .dashboard.default > .logs {
+ display: none;
+}
+
+body.javascript .toolbar .dashboard.default > .time,
+body.javascript .toolbar .dashboard.default > .resourcesSize,
+body.javascript .toolbar .dashboard.default > .resourcesCount {
+ display: none;
+}
+
+.toolbar .dashboard.default {
+ display: -webkit-flex;
+ -webkit-flex-flow: row nowrap;
+ -webkit-justify-content: space-between;
+}
+
+.toolbar .dashboard.default > .item {
+ font-family: Helvetica, sans-serif;
+ font-weight: bold;
+ font-size: 11px;
+ line-height: 12px;
+
+ padding: 0 5px;
+
+ display: -webkit-flex;
+
+ min-width: 45px;
+
+ -webkit-justify-content: center;
+ -webkit-align-items: center;
+
+ border-radius: 4px;
+ border: 1px solid transparent;
+}
+
+.toolbar .dashboard.default > .time,
+.toolbar .dashboard.default > .resourcesSize {
+ min-width: 70px;
+}
+
+.toolbar .dashboard.default > .item.enabled:hover {
+ border: 1px solid rgba(0, 0, 0, 0.1);
+}
+
+.toolbar .dashboard.default > .item.enabled:active {
+ border: 1px solid rgba(0, 0, 0, 0.2);
+}
+
+.toolbar .dashboard.default > .item > * {
+ display: -webkit-flex;
+ -webkit-align-items: center;
+}
+
+.toolbar .dashboard.default > .item > img {
+ opacity: 0.2;
+ width: 16px;
+ height: 16px;
+ pointer-events: none;
+}
+
+.toolbar .dashboard.default > .item.enabled > img {
+ opacity: 0.5;
+}
+
+.toolbar .dashboard.default > .item.enabled:hover > img {
+ opacity: 0.65;
+}
+
+.toolbar .dashboard.default > .item > div {
+ display: -webkit-flex;
+ -webkit-flex: 1;
+
+ color: rgba(0, 0, 0, 0.2);
+ padding-left: 2px;
+}
+
+.toolbar .dashboard.default > .item.enabled > div {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.toolbar .dashboard.default > .item.enabled:hover > div {
+ color: rgba(0, 0, 0, 0.85);
+}
+
+.toolbar .dashboard.default > .resourcesCount > img {
+ content: url(../Images/Resources.svg);
+}
+
+.toolbar .dashboard.default > .time > img {
+ content: url(../Images/Time.svg);
+}
+
+.toolbar .dashboard.default > .logs > img {
+ content: url(../Images/Logs.svg);
+}
+
+.toolbar .dashboard.default > .resourcesSize > img {
+ content: url(../Images/Weight.svg);
+}
+
+.toolbar .dashboard.default > .errors > img {
+ content: url(../Images/Errors.svg);
+}
+
+.toolbar .dashboard.default > .errors.enabled > img {
+ content: url(../Images/ErrorsEnabled.svg);
+ opacity: 0.9;
+}
+
+.toolbar .dashboard.default > .errors.enabled:hover > img {
+ opacity: 1;
+}
+
+.toolbar .dashboard.default > .errors.enabled > div {
+ color: rgba(201, 55, 57, 0.9);
+}
+
+.toolbar .dashboard.default > .errors.enabled:hover > div {
+ color: rgb(201, 55, 57);
+}
+
+.toolbar .dashboard.default > .issues > img {
+ content: url(../Images/Issues.svg);
+}
+
+.toolbar .dashboard.default > .issues.enabled > img {
+ content: url(../Images/IssuesEnabled.svg);
+ opacity: 0.9;
+}
+
+.toolbar .dashboard.default > .issues.enabled:hover > img {
+ opacity: 1;
+}
+
+.toolbar .dashboard.default > .issues.enabled > div {
+ color: rgba(224, 164, 4, 0.9);
+}
+
+.toolbar .dashboard.default > .issues.enabled:hover > div {
+ color: rgb(224, 164, 4);
+}
+
+/* Styles for the pulsing animated state of console items */
+
+.toolbar .dashboard.default > .item.pulsing {
+ -webkit-animation-name: console-item-pulse;
+ -webkit-animation-duration: 0.75s;
+}
+
+@-webkit-keyframes console-item-pulse {
+ 50% { opacity: 0.6; }
+}
+
+
+/* Styles for the extra short style, one row with quite a small y-margin */
+
+.toolbar.label-only .dashboard.default > .item,
+.toolbar.small-size.icon-only .dashboard.default > .item,
+.toolbar.small-size.icon-and-label-vertical .dashboard.default > .item,
+.toolbar.small-size.icon-and-label-horizontal .dashboard.default > .item {
+ margin: 1px 0;
+}
+
+/* Styles for the fairly short style, one row with quite a bit of y-margin */
+
+.toolbar.normal-size.icon-only .dashboard.default > .item,
+.toolbar.normal-size.icon-and-label-vertical .dashboard.default > .item,
+.toolbar.normal-size.icon-and-label-horizontal .dashboard.default > .item {
+ margin: 4px 0;
+}
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDefaultDashboardViewjsfromrev165380trunkSourceWebInspectorUIUserInterfaceViewsDashboardViewjs"></a>
<div class="copfile"><h4>Copied: trunk/Source/WebInspectorUI/UserInterface/Views/DefaultDashboardView.js (from rev 165380, trunk/Source/WebInspectorUI/UserInterface/Views/DashboardView.js) (0 => 165382)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DefaultDashboardView.js (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DefaultDashboardView.js 2014-03-10 18:07:29 UTC (rev 165382)
</span><span class="lines">@@ -0,0 +1,190 @@
</span><ins>+/*
+ * Copyright (C) 2013, 2014 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+ * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+ * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+ * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+ * OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+ * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+ * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+ * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+ * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+ * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WebInspector.DefaultDashboardView = function(representedObject)
+{
+ WebInspector.DashboardView.call(this, representedObject, "default");
+
+ representedObject.addEventListener(WebInspector.DefaultDashboard.Event.DataDidChange, window.requestAnimationFrame.bind(null, this._updateDisplay.bind(this)));
+
+ this._items = {
+ resourcesCount: {
+ tooltip: WebInspector.UIString("Total number of resources, click to show the Resources navigation sidebar"),
+ handler: this._resourcesWasClicked
+ },
+ resourcesSize: {
+ tooltip: WebInspector.UIString("Total size of all resources, click to show the Network Requests timeline"),
+ handler: this._networkItemWasClicked
+ },
+ time: {
+ tooltip: WebInspector.UIString("Time until the load event fired, click to show the Network Requests timeline"),
+ handler: this._networkItemWasClicked
+ },
+ logs: {
+ tooltip: WebInspector.UIString("Console logs, click to show the Console"),
+ handler: this._consoleItemWasClicked.bind(this, WebInspector.LogContentView.Scopes.Logs)
+ },
+ errors: {
+ tooltip: WebInspector.UIString("Console errors, click to show the Console"),
+ handler: this._consoleItemWasClicked.bind(this, WebInspector.LogContentView.Scopes.Errors)
+ },
+ issues: {
+ tooltip: WebInspector.UIString("Console warnings, click to show the Console"),
+ handler: this._consoleItemWasClicked.bind(this, WebInspector.LogContentView.Scopes.Warnings)
+ }
+ };
+
+ for (var name in this._items)
+ this._appendElementForNamedItem(name);
+};
+
+WebInspector.DefaultDashboardView.EnabledItemStyleClassName = "enabled";
+
+WebInspector.DefaultDashboardView.prototype = {
+ constructor: WebInspector.DefaultDashboardView,
+ __proto__: WebInspector.DashboardView.prototype,
+
+ // Private
+
+ _updateDisplay: function()
+ {
+ var dashboard = this.representedObject;
+
+ for (var category of ["logs", "issues", "errors"])
+ this._setConsoleItemValue(category, dashboard[category]);
+
+ var timeItem = this._items.time;
+ timeItem.text = dashboard.time ? Number.secondsToString(dashboard.time) : "\u2014";
+ this._setItemEnabled(timeItem, dashboard.time > 0);
+
+ var countItem = this._items.resourcesCount;
+ countItem.text = this._formatPossibleLargeNumber(dashboard.resourcesCount);
+ this._setItemEnabled(countItem, dashboard.resourcesCount > 0);
+
+ var sizeItem = this._items.resourcesSize;
+ sizeItem.text = dashboard.resourcesSize ? Number.bytesToString(dashboard.resourcesSize, false) : "\u2014";
+ this._setItemEnabled(sizeItem, dashboard.resourcesSize > 0);
+ },
+
+ _formatPossibleLargeNumber: function(number)
+ {
+ return number > 999 ? WebInspector.UIString("999+") : number;
+ },
+
+ _appendElementForNamedItem: function(name)
+ {
+ var item = this._items[name];
+
+ item.container = this._element.appendChild(document.createElement("div"));
+ item.container.className = "item " + name;
+ item.container.title = item.tooltip;
+
+ item.container.appendChild(document.createElement("img"));
+
+ item.outlet = item.container.appendChild(document.createElement("div"));
+
+ Object.defineProperty(item, "text",
+ {
+ set: function(newText)
+ {
+ if (newText === item.outlet.textContent)
+ return;
+ item.outlet.textContent = newText;
+ }
+ });
+
+ item.container.addEventListener("click", function(event) {
+ this._itemWasClicked(name);
+ }.bind(this));
+ },
+
+ _itemWasClicked: function(name)
+ {
+ var item = this._items[name];
+ if (!item.container.classList.contains(WebInspector.DefaultDashboardView.EnabledItemStyleClassName))
+ return;
+
+ if (item.handler)
+ item.handler.call(this);
+ },
+
+ _resourcesWasClicked: function()
+ {
+ WebInspector.navigationSidebar.selectedSidebarPanel = WebInspector.resourceSidebarPanel;
+ WebInspector.navigationSidebar.collapsed = false;
+ },
+
+ _networkItemWasClicked: function()
+ {
+ WebInspector.navigationSidebar.selectedSidebarPanel = WebInspector.timelineSidebarPanel;
+ },
+
+ _consoleItemWasClicked: function(scope)
+ {
+ WebInspector.showConsoleView(scope);
+ },
+
+ _setConsoleItemValue: function(itemName, newValue)
+ {
+ var iVarName = "_" + itemName;
+ var previousValue = this[iVarName];
+ this[iVarName] = newValue;
+
+ var item = this._items[itemName];
+ item.text = this._formatPossibleLargeNumber(newValue);
+ this._setItemEnabled(item, newValue > 0);
+
+ if (newValue <= previousValue)
+ return;
+
+ var container = item.container;
+
+ function animationEnded(event)
+ {
+ if (event.target === container) {
+ container.classList.remove("pulsing");
+ container.removeEventListener("webkitAnimationEnd", animationEnded);
+ }
+ }
+
+ // We need to force a style invalidation in the case where we already
+ // were animating this item after we've removed the pulsing CSS class.
+ if (container.classList.contains("pulsing")) {
+ container.classList.remove("pulsing");
+ container.recalculateStyles();
+ } else
+ container.addEventListener("webkitAnimationEnd", animationEnded);
+
+ container.classList.add("pulsing");
+ },
+
+ _setItemEnabled: function(item, enabled)
+ {
+ if (enabled)
+ item.container.classList.add(WebInspector.DefaultDashboardView.EnabledItemStyleClassName);
+ else
+ item.container.classList.remove(WebInspector.DefaultDashboardView.EnabledItemStyleClassName);
+ }
+};
</ins></span></pre>
</div>
</div>
</body>
</html>