<!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>[182041] 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/182041">182041</a></dd>
<dt>Author</dt> <dd>timothy@apple.com</dd>
<dt>Date</dt> <dd>2015-03-26 16:37:55 -0700 (Thu, 26 Mar 2015)</dd>
</dl>
<h3>Log Message</h3>
<pre>Web Inspector: Convert sidebar classes to ES6
https://bugs.webkit.org/show_bug.cgi?id=143108
Reviewed by Joseph Pecoraro.
* UserInterface/Models/KeyboardShortcut.js:
(WebInspector.KeyboardShortcut._handleKeyDown): Continue if callback is null.
(WebInspector.KeyboardShortcut.prototype.set callback): Added.
* UserInterface/Views/ApplicationCacheDetailsSidebarPanel.js:
* UserInterface/Views/CSSStyleDetailsSidebarPanel.js:
* UserInterface/Views/DOMDetailsSidebarPanel.js:
* UserInterface/Views/DOMNodeDetailsSidebarPanel.js:
* UserInterface/Views/DebuggerSidebarPanel.js:
* UserInterface/Views/DetailsSidebarPanel.js:
* UserInterface/Views/LayerTreeDetailsSidebarPanel.js:
* UserInterface/Views/NavigationSidebarPanel.js:
* UserInterface/Views/ProbeDetailsSidebarPanel.js:
* UserInterface/Views/ResourceDetailsSidebarPanel.js:
* UserInterface/Views/ResourceSidebarPanel.js:
* UserInterface/Views/ScopeChainDetailsSidebarPanel.js:
* UserInterface/Views/Sidebar.js:
* UserInterface/Views/SidebarPanel.js:
* UserInterface/Views/TimelineSidebarPanel.js:
Converted to ES6 classes.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkSourceWebInspectorUIChangeLog">trunk/Source/WebInspectorUI/ChangeLog</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceModelsKeyboardShortcutjs">trunk/Source/WebInspectorUI/UserInterface/Models/KeyboardShortcut.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsApplicationCacheDetailsSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/ApplicationCacheDetailsSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsCSSStyleDetailsSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDOMDetailsSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/DOMDetailsSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDOMNodeDetailsSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/DOMNodeDetailsSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDebuggerSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDetailsSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsLayerTreeDetailsSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/LayerTreeDetailsSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsNavigationSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/NavigationSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsProbeDetailsSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/ProbeDetailsSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsResourceDetailsSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/ResourceDetailsSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsResourceSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/ResourceSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsScopeChainDetailsSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/ScopeChainDetailsSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsSidebarjs">trunk/Source/WebInspectorUI/UserInterface/Views/Sidebar.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/SidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsTimelineSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/TimelineSidebarPanel.js</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkSourceWebInspectorUIChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/ChangeLog (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/ChangeLog 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/ChangeLog 2015-03-26 23:37:55 UTC (rev 182041)
</span><span class="lines">@@ -1,5 +1,33 @@
</span><span class="cx"> 2015-03-26 Timothy Hatcher <timothy@apple.com>
</span><span class="cx">
</span><ins>+ Web Inspector: Convert sidebar classes to ES6
+ https://bugs.webkit.org/show_bug.cgi?id=143108
+
+ Reviewed by Joseph Pecoraro.
+
+ * UserInterface/Models/KeyboardShortcut.js:
+ (WebInspector.KeyboardShortcut._handleKeyDown): Continue if callback is null.
+ (WebInspector.KeyboardShortcut.prototype.set callback): Added.
+
+ * UserInterface/Views/ApplicationCacheDetailsSidebarPanel.js:
+ * UserInterface/Views/CSSStyleDetailsSidebarPanel.js:
+ * UserInterface/Views/DOMDetailsSidebarPanel.js:
+ * UserInterface/Views/DOMNodeDetailsSidebarPanel.js:
+ * UserInterface/Views/DebuggerSidebarPanel.js:
+ * UserInterface/Views/DetailsSidebarPanel.js:
+ * UserInterface/Views/LayerTreeDetailsSidebarPanel.js:
+ * UserInterface/Views/NavigationSidebarPanel.js:
+ * UserInterface/Views/ProbeDetailsSidebarPanel.js:
+ * UserInterface/Views/ResourceDetailsSidebarPanel.js:
+ * UserInterface/Views/ResourceSidebarPanel.js:
+ * UserInterface/Views/ScopeChainDetailsSidebarPanel.js:
+ * UserInterface/Views/Sidebar.js:
+ * UserInterface/Views/SidebarPanel.js:
+ * UserInterface/Views/TimelineSidebarPanel.js:
+ Converted to ES6 classes.
+
+2015-03-26 Timothy Hatcher <timothy@apple.com>
+
</ins><span class="cx"> Web Inspector: Convert some View classes to ES6 classes
</span><span class="cx"> https://bugs.webkit.org/show_bug.cgi?id=143107
</span><span class="cx">
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceModelsKeyboardShortcutjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Models/KeyboardShortcut.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Models/KeyboardShortcut.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/KeyboardShortcut.js 2015-03-26 23:37:55 UTC (rev 182041)
</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, 2015 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">@@ -78,6 +78,9 @@
</span><span class="cx"> if (!keyboardShortcut.matchesEvent(event))
</span><span class="cx"> continue;
</span><span class="cx">
</span><ins>+ if (!keyboardShortcut.callback)
+ continue;
+
</ins><span class="cx"> keyboardShortcut.callback(event, keyboardShortcut);
</span><span class="cx">
</span><span class="cx"> if (keyboardShortcut.implicitlyPreventsDefault)
</span><span class="lines">@@ -123,6 +126,13 @@
</span><span class="cx"> return this._callback;
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+ set callback(callback)
+ {
+ console.assert(!callback || typeof callback === "function");
+
+ this._callback = callback || null;
+ }
+
</ins><span class="cx"> get disabled()
</span><span class="cx"> {
</span><span class="cx"> return this._disabled;
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsApplicationCacheDetailsSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ApplicationCacheDetailsSidebarPanel.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ApplicationCacheDetailsSidebarPanel.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ApplicationCacheDetailsSidebarPanel.js 2015-03-26 23:37:55 UTC (rev 182041)
</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, 2015 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,54 +23,40 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ApplicationCacheDetailsSidebarPanel = function()
</del><ins>+WebInspector.ApplicationCacheDetailsSidebarPanel = class ApplicationCacheDetailsSidebarPanel extends WebInspector.DetailsSidebarPanel
</ins><span class="cx"> {
</span><del>- WebInspector.DetailsSidebarPanel.call(this, "application-cache-details", WebInspector.UIString("Storage"), WebInspector.UIString("Storage"), "Images/NavigationItemStorage.svg");
</del><ins>+ constructor()
+ {
+ super("application-cache-details", WebInspector.UIString("Storage"), WebInspector.UIString("Storage"), "Images/NavigationItemStorage.svg");
</ins><span class="cx">
</span><del>- this.element.classList.add(WebInspector.ApplicationCacheDetailsSidebarPanel.StyleClassName);
</del><ins>+ this.element.classList.add("application-cache");
</ins><span class="cx">
</span><del>- this._applicationCacheFrame = null;
</del><ins>+ this._applicationCacheFrame = null;
</ins><span class="cx">
</span><del>- this._locationManifestURLRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Manifest URL"));
- this._locationFrameURLRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Frame URL"));
</del><ins>+ this._locationManifestURLRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Manifest URL"));
+ this._locationFrameURLRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Frame URL"));
</ins><span class="cx">
</span><del>- this._locationGroup = new WebInspector.DetailsSectionGroup([this._locationManifestURLRow, this._locationFrameURLRow]);
</del><ins>+ this._locationGroup = new WebInspector.DetailsSectionGroup([this._locationManifestURLRow, this._locationFrameURLRow]);
</ins><span class="cx">
</span><del>- this._locationSection = new WebInspector.DetailsSection("application-cache-location", WebInspector.UIString("Location"), [this._locationGroup]);
</del><ins>+ this._locationSection = new WebInspector.DetailsSection("application-cache-location", WebInspector.UIString("Location"), [this._locationGroup]);
</ins><span class="cx">
</span><del>- this._onlineRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Online"));
- this._statusRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Status"));
</del><ins>+ this._onlineRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Online"));
+ this._statusRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Status"));
</ins><span class="cx">
</span><del>- this._statusGroup = new WebInspector.DetailsSectionGroup([this._onlineRow, this._statusRow]);
</del><ins>+ this._statusGroup = new WebInspector.DetailsSectionGroup([this._onlineRow, this._statusRow]);
</ins><span class="cx">
</span><del>- this._statusSection = new WebInspector.DetailsSection("application-cache-status", WebInspector.UIString("Status"), [this._statusGroup]);
</del><ins>+ this._statusSection = new WebInspector.DetailsSection("application-cache-status", WebInspector.UIString("Status"), [this._statusGroup]);
</ins><span class="cx">
</span><del>- this.contentElement.appendChild(this._locationSection.element);
- this.contentElement.appendChild(this._statusSection.element);
</del><ins>+ this.contentElement.appendChild(this._locationSection.element);
+ this.contentElement.appendChild(this._statusSection.element);
</ins><span class="cx">
</span><del>- WebInspector.applicationCacheManager.addEventListener(WebInspector.ApplicationCacheManager.Event.NetworkStateUpdated, this._networkStateUpdated, this);
- WebInspector.applicationCacheManager.addEventListener(WebInspector.ApplicationCacheManager.Event.FrameManifestStatusChanged, this._frameManifestStatusChanged, this);
-};
</del><ins>+ WebInspector.applicationCacheManager.addEventListener(WebInspector.ApplicationCacheManager.Event.NetworkStateUpdated, this._networkStateUpdated, this);
+ WebInspector.applicationCacheManager.addEventListener(WebInspector.ApplicationCacheManager.Event.FrameManifestStatusChanged, this._frameManifestStatusChanged, this);
+ }
</ins><span class="cx">
</span><del>-WebInspector.ApplicationCacheDetailsSidebarPanel.StyleClassName = "application-cache";
-
-// This needs to be kept in sync with ApplicationCacheManager.js.
-WebInspector.ApplicationCacheDetailsSidebarPanel.Status = {
- 0: "Uncached",
- 1: "Idle",
- 2: "Checking",
- 3: "Downloading",
- 4: "UpdateReady",
- 5: "Obsolete"
-};
-
-WebInspector.ApplicationCacheDetailsSidebarPanel.prototype = {
- constructor: WebInspector.ApplicationCacheDetailsSidebarPanel,
- __proto__: WebInspector.DetailsSidebarPanel.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><del>- inspect: function(objects)
</del><ins>+ inspect(objects)
</ins><span class="cx"> {
</span><span class="cx"> // Convert to a single item array if needed.
</span><span class="cx"> if (!(objects instanceof Array))
</span><span class="lines">@@ -89,12 +75,12 @@
</span><span class="cx"> this.applicationCacheFrame = applicationCacheFrameToInspect;
</span><span class="cx">
</span><span class="cx"> return !!this.applicationCacheFrame;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get applicationCacheFrame()
</span><span class="cx"> {
</span><span class="cx"> return this._applicationCacheFrame;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set applicationCacheFrame(applicationCacheFrame)
</span><span class="cx"> {
</span><span class="lines">@@ -104,9 +90,9 @@
</span><span class="cx"> this._applicationCacheFrame = applicationCacheFrame;
</span><span class="cx">
</span><span class="cx"> this.needsRefresh();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- refresh: function()
</del><ins>+ refresh()
</ins><span class="cx"> {
</span><span class="cx"> if (!this.applicationCacheFrame)
</span><span class="cx"> return;
</span><span class="lines">@@ -116,19 +102,19 @@
</span><span class="cx">
</span><span class="cx"> this._refreshOnlineRow();
</span><span class="cx"> this._refreshStatusRow();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _networkStateUpdated: function(event)
</del><ins>+ _networkStateUpdated(event)
</ins><span class="cx"> {
</span><span class="cx"> if (!this.applicationCacheFrame)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._refreshOnlineRow();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _frameManifestStatusChanged: function(event)
</del><ins>+ _frameManifestStatusChanged(event)
</ins><span class="cx"> {
</span><span class="cx"> if (!this.applicationCacheFrame)
</span><span class="cx"> return;
</span><span class="lines">@@ -138,15 +124,25 @@
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._refreshStatusRow();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshOnlineRow: function()
</del><ins>+ _refreshOnlineRow()
</ins><span class="cx"> {
</span><span class="cx"> this._onlineRow.value = WebInspector.applicationCacheManager.online ? WebInspector.UIString("Yes") : WebInspector.UIString("No");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshStatusRow: function()
</del><ins>+ _refreshStatusRow()
</ins><span class="cx"> {
</span><span class="cx"> this._statusRow.value = WebInspector.ApplicationCacheDetailsSidebarPanel.Status[this.applicationCacheFrame.status];
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+// This needs to be kept in sync with ApplicationCacheManager.js.
+WebInspector.ApplicationCacheDetailsSidebarPanel.Status = {
+ 0: "Uncached",
+ 1: "Idle",
+ 2: "Checking",
+ 3: "Downloading",
+ 4: "UpdateReady",
+ 5: "Obsolete"
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsCSSStyleDetailsSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.js 2015-03-26 23:37:55 UTC (rev 182041)
</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, 2015 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,83 +23,77 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.CSSStyleDetailsSidebarPanel = function()
</del><ins>+WebInspector.CSSStyleDetailsSidebarPanel = class CSSStyleDetailsSidebarPanel extends WebInspector.DOMDetailsSidebarPanel
</ins><span class="cx"> {
</span><del>- WebInspector.DOMDetailsSidebarPanel.call(this, "css-style", WebInspector.UIString("Styles"), WebInspector.UIString("Style"), "Images/NavigationItemBrushAndRuler.svg", "4");
</del><ins>+ constructor()
+ {
+ super("css-style", WebInspector.UIString("Styles"), WebInspector.UIString("Style"), "Images/NavigationItemBrushAndRuler.svg", "4");
</ins><span class="cx">
</span><del>- this._selectedPanel = null;
</del><ins>+ this._selectedPanel = null;
</ins><span class="cx">
</span><del>- this._navigationBar = new WebInspector.NavigationBar(null, null, "tablist");
- this._navigationBar.addEventListener(WebInspector.NavigationBar.Event.NavigationItemSelected, this._navigationItemSelected, this);
- this.element.insertBefore(this._navigationBar.element, this.contentElement);
</del><ins>+ this._navigationBar = new WebInspector.NavigationBar(null, null, "tablist");
+ this._navigationBar.addEventListener(WebInspector.NavigationBar.Event.NavigationItemSelected, this._navigationItemSelected, this);
+ this.element.insertBefore(this._navigationBar.element, this.contentElement);
</ins><span class="cx">
</span><del>- this._forcedPseudoClassCheckboxes = {};
</del><ins>+ this._forcedPseudoClassCheckboxes = {};
</ins><span class="cx">
</span><del>- if (WebInspector.cssStyleManager.canForcePseudoClasses()) {
- this._forcedPseudoClassContainer = document.createElement("div");
- this._forcedPseudoClassContainer.className = WebInspector.CSSStyleDetailsSidebarPanel.PseudoClassesElementStyleClassName;
</del><ins>+ if (WebInspector.cssStyleManager.canForcePseudoClasses()) {
+ this._forcedPseudoClassContainer = document.createElement("div");
+ this._forcedPseudoClassContainer.className = WebInspector.CSSStyleDetailsSidebarPanel.PseudoClassesElementStyleClassName;
</ins><span class="cx">
</span><del>- var groupElement = null;
</del><ins>+ var groupElement = null;
</ins><span class="cx">
</span><del>- WebInspector.CSSStyleManager.ForceablePseudoClasses.forEach(function(pseudoClass) {
- // We don't localize the label since it is a CSS pseudo-class from the CSS standard.
- var label = pseudoClass.capitalize();
</del><ins>+ WebInspector.CSSStyleManager.ForceablePseudoClasses.forEach(function(pseudoClass) {
+ // We don't localize the label since it is a CSS pseudo-class from the CSS standard.
+ var label = pseudoClass.capitalize();
</ins><span class="cx">
</span><del>- var labelElement = document.createElement("label");
</del><ins>+ var labelElement = document.createElement("label");
</ins><span class="cx">
</span><del>- var checkboxElement = document.createElement("input");
- checkboxElement.addEventListener("change", this._forcedPseudoClassCheckboxChanged.bind(this, pseudoClass));
- checkboxElement.type = "checkbox";
</del><ins>+ var checkboxElement = document.createElement("input");
+ checkboxElement.addEventListener("change", this._forcedPseudoClassCheckboxChanged.bind(this, pseudoClass));
+ checkboxElement.type = "checkbox";
</ins><span class="cx">
</span><del>- this._forcedPseudoClassCheckboxes[pseudoClass] = checkboxElement;
</del><ins>+ this._forcedPseudoClassCheckboxes[pseudoClass] = checkboxElement;
</ins><span class="cx">
</span><del>- labelElement.appendChild(checkboxElement);
- labelElement.appendChild(document.createTextNode(label));
</del><ins>+ labelElement.appendChild(checkboxElement);
+ labelElement.appendChild(document.createTextNode(label));
</ins><span class="cx">
</span><del>- if (!groupElement || groupElement.children.length === 2) {
- groupElement = document.createElement("div");
- groupElement.className = WebInspector.CSSStyleDetailsSidebarPanel.PseudoClassesGroupElementStyleClassName;
- this._forcedPseudoClassContainer.appendChild(groupElement);
- }
</del><ins>+ if (!groupElement || groupElement.children.length === 2) {
+ groupElement = document.createElement("div");
+ groupElement.className = WebInspector.CSSStyleDetailsSidebarPanel.PseudoClassesGroupElementStyleClassName;
+ this._forcedPseudoClassContainer.appendChild(groupElement);
+ }
</ins><span class="cx">
</span><del>- groupElement.appendChild(labelElement);
- }, this);
</del><ins>+ groupElement.appendChild(labelElement);
+ }, this);
</ins><span class="cx">
</span><del>- this.contentElement.appendChild(this._forcedPseudoClassContainer);
- }
</del><ins>+ this.contentElement.appendChild(this._forcedPseudoClassContainer);
+ }
</ins><span class="cx">
</span><del>- this._computedStyleDetailsPanel = new WebInspector.ComputedStyleDetailsPanel;
- this._rulesStyleDetailsPanel = new WebInspector.RulesStyleDetailsPanel;
- this._metricsStyleDetailsPanel = new WebInspector.MetricsStyleDetailsPanel;
</del><ins>+ this._computedStyleDetailsPanel = new WebInspector.ComputedStyleDetailsPanel;
+ this._rulesStyleDetailsPanel = new WebInspector.RulesStyleDetailsPanel;
+ this._metricsStyleDetailsPanel = new WebInspector.MetricsStyleDetailsPanel;
</ins><span class="cx">
</span><del>- this._panels = [this._computedStyleDetailsPanel, this._rulesStyleDetailsPanel, this._metricsStyleDetailsPanel];
</del><ins>+ this._panels = [this._computedStyleDetailsPanel, this._rulesStyleDetailsPanel, this._metricsStyleDetailsPanel];
</ins><span class="cx">
</span><del>- this._navigationBar.addNavigationItem(this._computedStyleDetailsPanel.navigationItem);
- this._navigationBar.addNavigationItem(this._rulesStyleDetailsPanel.navigationItem);
- this._navigationBar.addNavigationItem(this._metricsStyleDetailsPanel.navigationItem);
</del><ins>+ this._navigationBar.addNavigationItem(this._computedStyleDetailsPanel.navigationItem);
+ this._navigationBar.addNavigationItem(this._rulesStyleDetailsPanel.navigationItem);
+ this._navigationBar.addNavigationItem(this._metricsStyleDetailsPanel.navigationItem);
</ins><span class="cx">
</span><del>- this._lastSelectedSectionSetting = new WebInspector.Setting("last-selected-style-details-panel", this._rulesStyleDetailsPanel.navigationItem.identifier);
</del><ins>+ this._lastSelectedSectionSetting = new WebInspector.Setting("last-selected-style-details-panel", this._rulesStyleDetailsPanel.navigationItem.identifier);
</ins><span class="cx">
</span><del>- // This will cause the selected panel to be set in _navigationItemSelected.
- this._navigationBar.selectedNavigationItem = this._lastSelectedSectionSetting.value;
-};
</del><ins>+ // This will cause the selected panel to be set in _navigationItemSelected.
+ this._navigationBar.selectedNavigationItem = this._lastSelectedSectionSetting.value;
+ }
</ins><span class="cx">
</span><del>-WebInspector.CSSStyleDetailsSidebarPanel.PseudoClassesElementStyleClassName = "pseudo-classes";
-WebInspector.CSSStyleDetailsSidebarPanel.PseudoClassesGroupElementStyleClassName = "group";
-WebInspector.CSSStyleDetailsSidebarPanel.NoForcedPseudoClassesScrollOffset = 38; // Default height of the forced pseudo classes container. Updated in widthDidChange.
-
-WebInspector.CSSStyleDetailsSidebarPanel.prototype = {
- constructor: WebInspector.CSSStyleDetailsSidebarPanel,
- __proto__: WebInspector.DOMDetailsSidebarPanel.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><del>- supportsDOMNode: function(nodeToInspect)
</del><ins>+ supportsDOMNode(nodeToInspect)
</ins><span class="cx"> {
</span><span class="cx"> return nodeToInspect.nodeType() === Node.ELEMENT_NODE;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- refresh: function()
</del><ins>+ refresh()
</ins><span class="cx"> {
</span><span class="cx"> var domNode = this.domNode;
</span><span class="cx"> if (!domNode)
</span><span class="lines">@@ -113,9 +107,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> this._updatePseudoClassCheckboxes();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- visibilityDidChange: function()
</del><ins>+ visibilityDidChange()
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.SidebarPanel.prototype.visibilityDidChange.call(this);
</span><span class="cx">
</span><span class="lines">@@ -133,27 +127,27 @@
</span><span class="cx">
</span><span class="cx"> this._selectedPanel.shown();
</span><span class="cx"> this._selectedPanel.markAsNeedsRefresh(this.domNode);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- widthDidChange: function()
</del><ins>+ widthDidChange()
</ins><span class="cx"> {
</span><span class="cx"> this._updateNoForcedPseudoClassesScrollOffset();
</span><span class="cx">
</span><span class="cx"> if (this._selectedPanel)
</span><span class="cx"> this._selectedPanel.widthDidChange();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Protected
</span><span class="cx">
</span><del>- addEventListeners: function()
</del><ins>+ addEventListeners()
</ins><span class="cx"> {
</span><span class="cx"> this.domNode.addEventListener(WebInspector.DOMNode.Event.EnabledPseudoClassesChanged, this._updatePseudoClassCheckboxes, this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- removeEventListeners: function()
</del><ins>+ removeEventListeners()
</ins><span class="cx"> {
</span><span class="cx"> this.domNode.removeEventListener(null, null, this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><span class="lines">@@ -162,15 +156,15 @@
</span><span class="cx"> if (!WebInspector.cssStyleManager.canForcePseudoClasses())
</span><span class="cx"> return 0;
</span><span class="cx"> return this.domNode && this.domNode.enabledPseudoClasses.length ? 0 : WebInspector.CSSStyleDetailsSidebarPanel.NoForcedPseudoClassesScrollOffset;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateNoForcedPseudoClassesScrollOffset: function()
</del><ins>+ _updateNoForcedPseudoClassesScrollOffset()
</ins><span class="cx"> {
</span><span class="cx"> if (this._forcedPseudoClassContainer)
</span><span class="cx"> WebInspector.CSSStyleDetailsSidebarPanel.NoForcedPseudoClassesScrollOffset = this._forcedPseudoClassContainer.offsetHeight;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _navigationItemSelected: function(event)
</del><ins>+ _navigationItemSelected(event)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(event.target.selectedNavigationItem);
</span><span class="cx"> if (!event.target.selectedNavigationItem)
</span><span class="lines">@@ -208,17 +202,17 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> this._lastSelectedSectionSetting.value = selectedNavigationItem.identifier;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _forcedPseudoClassCheckboxChanged: function(pseudoClass, event)
</del><ins>+ _forcedPseudoClassCheckboxChanged(pseudoClass, event)
</ins><span class="cx"> {
</span><span class="cx"> if (!this.domNode)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this.domNode.setPseudoClassEnabled(pseudoClass, event.target.checked);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updatePseudoClassCheckboxes: function()
</del><ins>+ _updatePseudoClassCheckboxes()
</ins><span class="cx"> {
</span><span class="cx"> if (!this.domNode)
</span><span class="cx"> return;
</span><span class="lines">@@ -231,3 +225,7 @@
</span><span class="cx"> }
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.CSSStyleDetailsSidebarPanel.PseudoClassesElementStyleClassName = "pseudo-classes";
+WebInspector.CSSStyleDetailsSidebarPanel.PseudoClassesGroupElementStyleClassName = "group";
+WebInspector.CSSStyleDetailsSidebarPanel.NoForcedPseudoClassesScrollOffset = 38; // Default height of the forced pseudo classes container. Updated in widthDidChange.
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDOMDetailsSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMDetailsSidebarPanel.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMDetailsSidebarPanel.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMDetailsSidebarPanel.js 2015-03-26 23:37:55 UTC (rev 182041)
</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, 2015 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,22 +23,20 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.DOMDetailsSidebarPanel = function(identifier, displayName, singularDisplayName, image, keyboardShortcutKey, element)
</del><ins>+WebInspector.DOMDetailsSidebarPanel = class DOMDetailsSidebarPanel extends WebInspector.DetailsSidebarPanel
</ins><span class="cx"> {
</span><del>- WebInspector.DetailsSidebarPanel.call(this, identifier, displayName, singularDisplayName, image, keyboardShortcutKey, element);
</del><ins>+ constructor(identifier, displayName, singularDisplayName, image, keyboardShortcutKey, element)
+ {
+ super(identifier, displayName, singularDisplayName, image, keyboardShortcutKey, element);
</ins><span class="cx">
</span><del>- this.element.addEventListener("click", this._mouseWasClicked.bind(this), true);
</del><ins>+ this.element.addEventListener("click", this._mouseWasClicked.bind(this), true);
</ins><span class="cx">
</span><del>- this._domNode = null;
-};
</del><ins>+ this._domNode = null;
+ }
</ins><span class="cx">
</span><del>-WebInspector.DOMDetailsSidebarPanel.prototype = {
- constructor: WebInspector.DOMDetailsSidebarPanel,
- __proto__: WebInspector.DetailsSidebarPanel.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><del>- inspect: function(objects)
</del><ins>+ inspect(objects)
</ins><span class="cx"> {
</span><span class="cx"> // Convert to a single item array if needed.
</span><span class="cx"> if (!(objects instanceof Array))
</span><span class="lines">@@ -60,12 +58,12 @@
</span><span class="cx"> this.domNode = nodeToInspect;
</span><span class="cx">
</span><span class="cx"> return !!this._domNode;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get domNode()
</span><span class="cx"> {
</span><span class="cx"> return this._domNode;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set domNode(domNode)
</span><span class="cx"> {
</span><span class="lines">@@ -81,27 +79,27 @@
</span><span class="cx"> this.addEventListeners();
</span><span class="cx">
</span><span class="cx"> this.needsRefresh();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- supportsDOMNode: function(nodeToInspect)
</del><ins>+ supportsDOMNode(nodeToInspect)
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses.
</span><span class="cx"> return true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- addEventListeners: function()
</del><ins>+ addEventListeners()
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- removeEventListeners: function()
</del><ins>+ removeEventListeners()
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _mouseWasClicked: function(event)
</del><ins>+ _mouseWasClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this._domNode && this._domNode.ownerDocument) {
</span><span class="cx"> var mainResource = WebInspector.frameResourceManager.resourceForURL(this._domNode.ownerDocument.documentURL);
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDOMNodeDetailsSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMNodeDetailsSidebarPanel.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMNodeDetailsSidebarPanel.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMNodeDetailsSidebarPanel.js 2015-03-26 23:37:55 UTC (rev 182041)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013, 2014 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013-2015 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,83 +23,78 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.DOMNodeDetailsSidebarPanel = function()
</del><ins>+WebInspector.DOMNodeDetailsSidebarPanel = class DOMNodeDetailsSidebarPanel extends WebInspector.DOMDetailsSidebarPanel
</ins><span class="cx"> {
</span><del>- WebInspector.DOMDetailsSidebarPanel.call(this, "dom-node-details", WebInspector.UIString("Node"), WebInspector.UIString("Node"), "Images/NavigationItemAngleBrackets.svg", "2");
</del><ins>+ constructor()
+ {
+ super("dom-node-details", WebInspector.UIString("Node"), WebInspector.UIString("Node"), "Images/NavigationItemAngleBrackets.svg", "2");
</ins><span class="cx">
</span><del>- WebInspector.domTreeManager.addEventListener(WebInspector.DOMTreeManager.Event.AttributeModified, this._attributesChanged, this);
- WebInspector.domTreeManager.addEventListener(WebInspector.DOMTreeManager.Event.AttributeRemoved, this._attributesChanged, this);
- WebInspector.domTreeManager.addEventListener(WebInspector.DOMTreeManager.Event.CharacterDataModified, this._characterDataModified, this);
</del><ins>+ WebInspector.domTreeManager.addEventListener(WebInspector.DOMTreeManager.Event.AttributeModified, this._attributesChanged, this);
+ WebInspector.domTreeManager.addEventListener(WebInspector.DOMTreeManager.Event.AttributeRemoved, this._attributesChanged, this);
+ WebInspector.domTreeManager.addEventListener(WebInspector.DOMTreeManager.Event.CharacterDataModified, this._characterDataModified, this);
</ins><span class="cx">
</span><del>- this.element.classList.add(WebInspector.DOMNodeDetailsSidebarPanel.StyleClassName);
</del><ins>+ this.element.classList.add("dom-node");
</ins><span class="cx">
</span><del>- this._identityNodeTypeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Type"));
- this._identityNodeNameRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Name"));
- this._identityNodeValueRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Value"));
</del><ins>+ this._identityNodeTypeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Type"));
+ this._identityNodeNameRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Name"));
+ this._identityNodeValueRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Value"));
</ins><span class="cx">
</span><del>- var identityGroup = new WebInspector.DetailsSectionGroup([this._identityNodeTypeRow, this._identityNodeNameRow, this._identityNodeValueRow]);
- var identitySection = new WebInspector.DetailsSection("dom-node-identity", WebInspector.UIString("Identity"), [identityGroup]);
</del><ins>+ var identityGroup = new WebInspector.DetailsSectionGroup([this._identityNodeTypeRow, this._identityNodeNameRow, this._identityNodeValueRow]);
+ var identitySection = new WebInspector.DetailsSection("dom-node-identity", WebInspector.UIString("Identity"), [identityGroup]);
</ins><span class="cx">
</span><del>- this._attributesDataGridRow = new WebInspector.DetailsSectionDataGridRow(null, WebInspector.UIString("No Attributes"));
</del><ins>+ this._attributesDataGridRow = new WebInspector.DetailsSectionDataGridRow(null, WebInspector.UIString("No Attributes"));
</ins><span class="cx">
</span><del>- var attributesGroup = new WebInspector.DetailsSectionGroup([this._attributesDataGridRow]);
- var attributesSection = new WebInspector.DetailsSection("dom-node-attributes", WebInspector.UIString("Attributes"), [attributesGroup]);
</del><ins>+ var attributesGroup = new WebInspector.DetailsSectionGroup([this._attributesDataGridRow]);
+ var attributesSection = new WebInspector.DetailsSection("dom-node-attributes", WebInspector.UIString("Attributes"), [attributesGroup]);
</ins><span class="cx">
</span><del>- this._propertiesRow = new WebInspector.DetailsSectionRow;
</del><ins>+ this._propertiesRow = new WebInspector.DetailsSectionRow;
</ins><span class="cx">
</span><del>- var propertiesGroup = new WebInspector.DetailsSectionGroup([this._propertiesRow]);
- var propertiesSection = new WebInspector.DetailsSection("dom-node-properties", WebInspector.UIString("Properties"), [propertiesGroup]);
</del><ins>+ var propertiesGroup = new WebInspector.DetailsSectionGroup([this._propertiesRow]);
+ var propertiesSection = new WebInspector.DetailsSection("dom-node-properties", WebInspector.UIString("Properties"), [propertiesGroup]);
</ins><span class="cx">
</span><del>- this._eventListenersSectionGroup = new WebInspector.DetailsSectionGroup;
- var eventListenersSection = new WebInspector.DetailsSection("dom-node-event-listeners", WebInspector.UIString("Event Listeners"), [this._eventListenersSectionGroup]);
</del><ins>+ this._eventListenersSectionGroup = new WebInspector.DetailsSectionGroup;
+ var eventListenersSection = new WebInspector.DetailsSection("dom-node-event-listeners", WebInspector.UIString("Event Listeners"), [this._eventListenersSectionGroup]);
</ins><span class="cx">
</span><del>- this.contentElement.appendChild(identitySection.element);
- this.contentElement.appendChild(attributesSection.element);
- this.contentElement.appendChild(propertiesSection.element);
- this.contentElement.appendChild(eventListenersSection.element);
</del><ins>+ this.contentElement.appendChild(identitySection.element);
+ this.contentElement.appendChild(attributesSection.element);
+ this.contentElement.appendChild(propertiesSection.element);
+ this.contentElement.appendChild(eventListenersSection.element);
</ins><span class="cx">
</span><del>- if (this._accessibilitySupported()) {
- this._accessibilityEmptyRow = new WebInspector.DetailsSectionRow(WebInspector.UIString("No Accessibility Information"));
- this._accessibilityNodeActiveDescendantRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Shared Focus"));
- this._accessibilityNodeBusyRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Busy"));
- this._accessibilityNodeCheckedRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Checked"));
- this._accessibilityNodeChildrenRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Children"));
- this._accessibilityNodeControlsRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Controls"));
- this._accessibilityNodeDisabledRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Disabled"));
- this._accessibilityNodeExpandedRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Expanded"));
- this._accessibilityNodeFlowsRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Flows"));
- this._accessibilityNodeFocusedRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Focused"));
- this._accessibilityNodeIgnoredRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Ignored"));
- this._accessibilityNodeInvalidRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Invalid"));
- this._accessibilityNodeLiveRegionStatusRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Live"));
- this._accessibilityNodeMouseEventRow = new WebInspector.DetailsSectionSimpleRow("");
- this._accessibilityNodeLabelRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Label"));
- this._accessibilityNodeOwnsRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Owns"));
- this._accessibilityNodeParentRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Parent"));
- this._accessibilityNodePressedRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Pressed"));
- this._accessibilityNodeReadonlyRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Readonly"));
- this._accessibilityNodeRequiredRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Required"));
- this._accessibilityNodeRoleRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Role"));
- this._accessibilityNodeSelectedRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Selected"));
- this._accessibilityNodeSelectedChildrenRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Selected Items"));
-
- this._accessibilityGroup = new WebInspector.DetailsSectionGroup([this._accessibilityEmptyRow]);
- var accessibilitySection = new WebInspector.DetailsSection("dom-node-accessibility", WebInspector.UIString("Accessibility"), [this._accessibilityGroup]);
</del><ins>+ if (this._accessibilitySupported()) {
+ this._accessibilityEmptyRow = new WebInspector.DetailsSectionRow(WebInspector.UIString("No Accessibility Information"));
+ this._accessibilityNodeActiveDescendantRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Shared Focus"));
+ this._accessibilityNodeBusyRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Busy"));
+ this._accessibilityNodeCheckedRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Checked"));
+ this._accessibilityNodeChildrenRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Children"));
+ this._accessibilityNodeControlsRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Controls"));
+ this._accessibilityNodeDisabledRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Disabled"));
+ this._accessibilityNodeExpandedRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Expanded"));
+ this._accessibilityNodeFlowsRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Flows"));
+ this._accessibilityNodeFocusedRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Focused"));
+ this._accessibilityNodeIgnoredRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Ignored"));
+ this._accessibilityNodeInvalidRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Invalid"));
+ this._accessibilityNodeLiveRegionStatusRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Live"));
+ this._accessibilityNodeMouseEventRow = new WebInspector.DetailsSectionSimpleRow("");
+ this._accessibilityNodeLabelRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Label"));
+ this._accessibilityNodeOwnsRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Owns"));
+ this._accessibilityNodeParentRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Parent"));
+ this._accessibilityNodePressedRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Pressed"));
+ this._accessibilityNodeReadonlyRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Readonly"));
+ this._accessibilityNodeRequiredRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Required"));
+ this._accessibilityNodeRoleRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Role"));
+ this._accessibilityNodeSelectedRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Selected"));
+ this._accessibilityNodeSelectedChildrenRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Selected Items"));
</ins><span class="cx">
</span><del>- this.contentElement.appendChild(accessibilitySection.element);
- }
-};
</del><ins>+ this._accessibilityGroup = new WebInspector.DetailsSectionGroup([this._accessibilityEmptyRow]);
+ var accessibilitySection = new WebInspector.DetailsSection("dom-node-accessibility", WebInspector.UIString("Accessibility"), [this._accessibilityGroup]);
</ins><span class="cx">
</span><del>-WebInspector.DOMNodeDetailsSidebarPanel.StyleClassName = "dom-node";
-WebInspector.DOMNodeDetailsSidebarPanel.PropertiesObjectGroupName = "dom-node-details-sidebar-properties-object-group";
</del><ins>+ this.contentElement.appendChild(accessibilitySection.element);
+ }
+ }
</ins><span class="cx">
</span><del>-WebInspector.DOMNodeDetailsSidebarPanel.prototype = {
- constructor: WebInspector.DOMNodeDetailsSidebarPanel,
- __proto__: WebInspector.DOMDetailsSidebarPanel.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><del>- refresh: function()
</del><ins>+ refresh()
</ins><span class="cx"> {
</span><span class="cx"> var domNode = this.domNode;
</span><span class="cx"> if (!domNode)
</span><span class="lines">@@ -113,21 +108,21 @@
</span><span class="cx"> this._refreshProperties();
</span><span class="cx"> this._refreshEventListeners();
</span><span class="cx"> this._refreshAccessibility();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _accessibilitySupported: function()
</del><ins>+ _accessibilitySupported()
</ins><span class="cx"> {
</span><span class="cx"> return window.DOMAgent && DOMAgent.getAccessibilityPropertiesForNode;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshAttributes: function()
</del><ins>+ _refreshAttributes()
</ins><span class="cx"> {
</span><span class="cx"> this._attributesDataGridRow.dataGrid = this._createAttributesDataGrid();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshProperties: function()
</del><ins>+ _refreshProperties()
</ins><span class="cx"> {
</span><span class="cx"> var domNode = this.domNode;
</span><span class="cx"> if (!domNode)
</span><span class="lines">@@ -214,9 +209,9 @@
</span><span class="cx"> element.appendChild(detailsSection.element);
</span><span class="cx"> }
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshEventListeners: function()
</del><ins>+ _refreshEventListeners()
</ins><span class="cx"> {
</span><span class="cx"> var domNode = this.domNode;
</span><span class="cx"> if (!domNode)
</span><span class="lines">@@ -264,11 +259,18 @@
</span><span class="cx"> rows.push(eventListenerSections[eventListenerTypes[i]]);
</span><span class="cx"> this._eventListenersSectionGroup.rows = rows;
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshAccessibility: (function() {
</del><ins>+ _refreshAccessibility()
+ {
+ if (!this._accessibilitySupported())
+ return;
+
+ var domNode = this.domNode;
+ if (!domNode)
+ return;
+
</ins><span class="cx"> var properties = {};
</span><del>- var domNode;
</del><span class="cx">
</span><span class="cx"> function booleanValueToLocalizedStringIfTrue(property) {
</span><span class="cx"> if (properties[property])
</span><span class="lines">@@ -525,37 +527,25 @@
</span><span class="cx"> }
</span><span class="cx"> }
</span><span class="cx">
</span><del>- function refreshAX() {
- if (!this._accessibilitySupported())
- return;
</del><ins>+ domNode.accessibilityProperties(accessibilityPropertiesCallback.bind(this));
+ }
</ins><span class="cx">
</span><del>- // Make sure the domNode is available in the closure scope.
- domNode = this.domNode;
- if (!domNode)
- return;
-
- domNode.accessibilityProperties(accessibilityPropertiesCallback.bind(this));
- }
-
- return refreshAX;
- }()),
-
- _attributesChanged: function(event)
</del><ins>+ _attributesChanged(event)
</ins><span class="cx"> {
</span><span class="cx"> if (event.data.node !== this.domNode)
</span><span class="cx"> return;
</span><span class="cx"> this._refreshAttributes();
</span><span class="cx"> this._refreshAccessibility();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _characterDataModified: function(event)
</del><ins>+ _characterDataModified(event)
</ins><span class="cx"> {
</span><span class="cx"> if (event.data.node !== this.domNode)
</span><span class="cx"> return;
</span><span class="cx"> this._identityNodeValueRow.value = this.domNode.nodeValue();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _nodeTypeDisplayName: function()
</del><ins>+ _nodeTypeDisplayName()
</ins><span class="cx"> {
</span><span class="cx"> switch (this.domNode.nodeType()) {
</span><span class="cx"> case Node.ELEMENT_NODE:
</span><span class="lines">@@ -578,9 +568,9 @@
</span><span class="cx"> console.error("Unknown DOM node type: ", this.domNode.nodeType());
</span><span class="cx"> return this.domNode.nodeType();
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _createAttributesDataGrid: function()
</del><ins>+ _createAttributesDataGrid()
</ins><span class="cx"> {
</span><span class="cx"> var domNode = this.domNode;
</span><span class="cx"> if (!domNode || !domNode.hasAttributes())
</span><span class="lines">@@ -602,3 +592,5 @@
</span><span class="cx"> return dataGrid;
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.DOMNodeDetailsSidebarPanel.PropertiesObjectGroupName = "dom-node-details-sidebar-properties-object-group";
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDebuggerSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.js 2015-03-26 23:37:55 UTC (rev 182041)
</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, 2015 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,152 +23,141 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.DebuggerSidebarPanel = function()
</del><ins>+WebInspector.DebuggerSidebarPanel = class DebuggerSidebarPanel extends WebInspector.NavigationSidebarPanel
</ins><span class="cx"> {
</span><del>- WebInspector.NavigationSidebarPanel.call(this, "debugger", WebInspector.UIString("Debugger"), "Images/NavigationItemBug.svg", "3", true);
</del><ins>+ constructor()
+ {
+ super("debugger", WebInspector.UIString("Debugger"), "Images/NavigationItemBug.svg", "3", true);
</ins><span class="cx">
</span><del>- WebInspector.Frame.addEventListener(WebInspector.Frame.Event.MainResourceDidChange, this._mainResourceChanged, this);
- WebInspector.Frame.addEventListener(WebInspector.Frame.Event.ResourceWasAdded, this._resourceAdded, this);
</del><ins>+ WebInspector.Frame.addEventListener(WebInspector.Frame.Event.MainResourceDidChange, this._mainResourceChanged, this);
+ WebInspector.Frame.addEventListener(WebInspector.Frame.Event.ResourceWasAdded, this._resourceAdded, this);
</ins><span class="cx">
</span><del>- WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.BreakpointsEnabledDidChange, this._breakpointsEnabledDidChange, this);
- WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.CallFramesDidChange, this._debuggerCallFramesDidChange, this);
- WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.BreakpointAdded, this._breakpointAdded, this);
- WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.BreakpointRemoved, this._breakpointRemoved, this);
- WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.ScriptAdded, this._scriptAdded, this);
- WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.ScriptsCleared, this._scriptsCleared, this);
- WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.Paused, this._debuggerDidPause, this);
- WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.Resumed, this._debuggerDidResume, this);
- WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.ActiveCallFrameDidChange, this._debuggerActiveCallFrameDidChange, this);
</del><ins>+ WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.BreakpointsEnabledDidChange, this._breakpointsEnabledDidChange, this);
+ WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.CallFramesDidChange, this._debuggerCallFramesDidChange, this);
+ WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.BreakpointAdded, this._breakpointAdded, this);
+ WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.BreakpointRemoved, this._breakpointRemoved, this);
+ WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.ScriptAdded, this._scriptAdded, this);
+ WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.ScriptsCleared, this._scriptsCleared, this);
+ WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.Paused, this._debuggerDidPause, this);
+ WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.Resumed, this._debuggerDidResume, this);
+ WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.ActiveCallFrameDidChange, this._debuggerActiveCallFrameDidChange, this);
</ins><span class="cx">
</span><del>- this._toggleBreakpointsKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.CommandOrControl, "Y", this._breakpointsToggleButtonClicked.bind(this));
- this.pauseOrResumeKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.Control | WebInspector.KeyboardShortcut.Modifier.CommandOrControl, "Y", this._debuggerPauseResumeButtonClicked.bind(this));
- this._stepOverKeyboardShortcut = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.F6, this._debuggerStepOverButtonClicked.bind(this));
- this._stepIntoKeyboardShortcut = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.F7, this._debuggerStepIntoButtonClicked.bind(this));
- this._stepOutKeyboardShortcut = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.F8, this._debuggerStepOutButtonClicked.bind(this));
</del><ins>+ this._toggleBreakpointsKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.CommandOrControl, "Y", this._breakpointsToggleButtonClicked.bind(this));
+ this.pauseOrResumeKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.Control | WebInspector.KeyboardShortcut.Modifier.CommandOrControl, "Y", this._debuggerPauseResumeButtonClicked.bind(this));
+ this._stepOverKeyboardShortcut = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.F6, this._debuggerStepOverButtonClicked.bind(this));
+ this._stepIntoKeyboardShortcut = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.F7, this._debuggerStepIntoButtonClicked.bind(this));
+ this._stepOutKeyboardShortcut = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.F8, this._debuggerStepOutButtonClicked.bind(this));
</ins><span class="cx">
</span><del>- this.pauseOrResumeAlternateKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.CommandOrControl, WebInspector.KeyboardShortcut.Key.Backslash, this._debuggerPauseResumeButtonClicked.bind(this));
- this._stepOverAlternateKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.CommandOrControl, WebInspector.KeyboardShortcut.Key.SingleQuote, this._debuggerStepOverButtonClicked.bind(this));
- this._stepIntoAlternateKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.CommandOrControl, WebInspector.KeyboardShortcut.Key.Semicolon, this._debuggerStepIntoButtonClicked.bind(this));
- this._stepOutAlternateKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.Shift | WebInspector.KeyboardShortcut.Modifier.CommandOrControl, WebInspector.KeyboardShortcut.Key.Semicolon, this._debuggerStepOutButtonClicked.bind(this));
</del><ins>+ this.pauseOrResumeAlternateKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.CommandOrControl, WebInspector.KeyboardShortcut.Key.Backslash, this._debuggerPauseResumeButtonClicked.bind(this));
+ this._stepOverAlternateKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.CommandOrControl, WebInspector.KeyboardShortcut.Key.SingleQuote, this._debuggerStepOverButtonClicked.bind(this));
+ this._stepIntoAlternateKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.CommandOrControl, WebInspector.KeyboardShortcut.Key.Semicolon, this._debuggerStepIntoButtonClicked.bind(this));
+ this._stepOutAlternateKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.Shift | WebInspector.KeyboardShortcut.Modifier.CommandOrControl, WebInspector.KeyboardShortcut.Key.Semicolon, this._debuggerStepOutButtonClicked.bind(this));
</ins><span class="cx">
</span><del>- this._navigationBar = new WebInspector.NavigationBar;
- this.element.appendChild(this._navigationBar.element);
-
- var imageSize = WebInspector.Platform.isLegacyMacOS ? 16 : 15;
</del><ins>+ this._navigationBar = new WebInspector.NavigationBar;
+ this.element.appendChild(this._navigationBar.element);
</ins><span class="cx">
</span><del>- var breakpointsImage = {src: platformImagePath("Breakpoints.svg"), width: imageSize, height: imageSize};
- var pauseImage = {src: platformImagePath("Pause.svg"), width: imageSize, height: imageSize};
- var resumeImage = {src: platformImagePath("Resume.svg"), width: imageSize, height: imageSize};
- var stepOverImage = {src: platformImagePath("StepOver.svg"), width: imageSize, height: imageSize};
- var stepIntoImage = {src: platformImagePath("StepInto.svg"), width: imageSize, height: imageSize};
- var stepOutImage = {src: platformImagePath("StepOut.svg"), width: imageSize, height: imageSize};
</del><ins>+ var imageSize = WebInspector.Platform.isLegacyMacOS ? 16 : 15;
</ins><span class="cx">
</span><del>- var toolTip = WebInspector.UIString("Enable all breakpoints (%s)").format(this._toggleBreakpointsKeyboardShortcut.displayName);
- var altToolTip = WebInspector.UIString("Disable all breakpoints (%s)").format(this._toggleBreakpointsKeyboardShortcut.displayName);
</del><ins>+ var breakpointsImage = {src: platformImagePath("Breakpoints.svg"), width: imageSize, height: imageSize};
+ var pauseImage = {src: platformImagePath("Pause.svg"), width: imageSize, height: imageSize};
+ var resumeImage = {src: platformImagePath("Resume.svg"), width: imageSize, height: imageSize};
+ var stepOverImage = {src: platformImagePath("StepOver.svg"), width: imageSize, height: imageSize};
+ var stepIntoImage = {src: platformImagePath("StepInto.svg"), width: imageSize, height: imageSize};
+ var stepOutImage = {src: platformImagePath("StepOut.svg"), width: imageSize, height: imageSize};
</ins><span class="cx">
</span><del>- this._debuggerBreakpointsButtonItem = new WebInspector.ActivateButtonNavigationItem("debugger-breakpoints", toolTip, altToolTip, breakpointsImage.src, breakpointsImage.width, breakpointsImage.height);
- this._debuggerBreakpointsButtonItem.activated = WebInspector.debuggerManager.breakpointsEnabled;
- this._debuggerBreakpointsButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._breakpointsToggleButtonClicked, this);
- this._navigationBar.addNavigationItem(this._debuggerBreakpointsButtonItem);
</del><ins>+ var toolTip = WebInspector.UIString("Enable all breakpoints (%s)").format(this._toggleBreakpointsKeyboardShortcut.displayName);
+ var altToolTip = WebInspector.UIString("Disable all breakpoints (%s)").format(this._toggleBreakpointsKeyboardShortcut.displayName);
</ins><span class="cx">
</span><del>- toolTip = WebInspector.UIString("Pause script execution (%s or %s)").format(this.pauseOrResumeKeyboardShortcut.displayName, this.pauseOrResumeAlternateKeyboardShortcut.displayName);
- altToolTip = WebInspector.UIString("Continue script execution (%s or %s)").format(this.pauseOrResumeKeyboardShortcut.displayName, this.pauseOrResumeAlternateKeyboardShortcut.displayName);
</del><ins>+ this._debuggerBreakpointsButtonItem = new WebInspector.ActivateButtonNavigationItem("debugger-breakpoints", toolTip, altToolTip, breakpointsImage.src, breakpointsImage.width, breakpointsImage.height);
+ this._debuggerBreakpointsButtonItem.activated = WebInspector.debuggerManager.breakpointsEnabled;
+ this._debuggerBreakpointsButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._breakpointsToggleButtonClicked, this);
+ this._navigationBar.addNavigationItem(this._debuggerBreakpointsButtonItem);
</ins><span class="cx">
</span><del>- this._debuggerPauseResumeButtonItem = new WebInspector.ToggleButtonNavigationItem("debugger-pause-resume", toolTip, altToolTip, pauseImage.src, resumeImage.src, pauseImage.width, pauseImage.height);
- this._debuggerPauseResumeButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._debuggerPauseResumeButtonClicked, this);
- this._navigationBar.addNavigationItem(this._debuggerPauseResumeButtonItem);
</del><ins>+ toolTip = WebInspector.UIString("Pause script execution (%s or %s)").format(this.pauseOrResumeKeyboardShortcut.displayName, this.pauseOrResumeAlternateKeyboardShortcut.displayName);
+ altToolTip = WebInspector.UIString("Continue script execution (%s or %s)").format(this.pauseOrResumeKeyboardShortcut.displayName, this.pauseOrResumeAlternateKeyboardShortcut.displayName);
</ins><span class="cx">
</span><del>- this._debuggerStepOverButtonItem = new WebInspector.ButtonNavigationItem("debugger-step-over", WebInspector.UIString("Step over (%s or %s)").format(this._stepOverKeyboardShortcut.displayName, this._stepOverAlternateKeyboardShortcut.displayName), stepOverImage.src, stepOverImage.width, stepOverImage.height);
- this._debuggerStepOverButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._debuggerStepOverButtonClicked, this);
- this._debuggerStepOverButtonItem.enabled = false;
- this._navigationBar.addNavigationItem(this._debuggerStepOverButtonItem);
</del><ins>+ this._debuggerPauseResumeButtonItem = new WebInspector.ToggleButtonNavigationItem("debugger-pause-resume", toolTip, altToolTip, pauseImage.src, resumeImage.src, pauseImage.width, pauseImage.height);
+ this._debuggerPauseResumeButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._debuggerPauseResumeButtonClicked, this);
+ this._navigationBar.addNavigationItem(this._debuggerPauseResumeButtonItem);
</ins><span class="cx">
</span><del>- this._debuggerStepIntoButtonItem = new WebInspector.ButtonNavigationItem("debugger-step-into", WebInspector.UIString("Step into (%s or %s)").format(this._stepIntoKeyboardShortcut.displayName, this._stepIntoAlternateKeyboardShortcut.displayName), stepIntoImage.src, stepIntoImage.width, stepIntoImage.height);
- this._debuggerStepIntoButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._debuggerStepIntoButtonClicked, this);
- this._debuggerStepIntoButtonItem.enabled = false;
- this._navigationBar.addNavigationItem(this._debuggerStepIntoButtonItem);
</del><ins>+ this._debuggerStepOverButtonItem = new WebInspector.ButtonNavigationItem("debugger-step-over", WebInspector.UIString("Step over (%s or %s)").format(this._stepOverKeyboardShortcut.displayName, this._stepOverAlternateKeyboardShortcut.displayName), stepOverImage.src, stepOverImage.width, stepOverImage.height);
+ this._debuggerStepOverButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._debuggerStepOverButtonClicked, this);
+ this._debuggerStepOverButtonItem.enabled = false;
+ this._navigationBar.addNavigationItem(this._debuggerStepOverButtonItem);
</ins><span class="cx">
</span><del>- this._debuggerStepOutButtonItem = new WebInspector.ButtonNavigationItem("debugger-step-out", WebInspector.UIString("Step out (%s or %s)").format(this._stepOutKeyboardShortcut.displayName, this._stepOutAlternateKeyboardShortcut.displayName), stepOutImage.src, stepOutImage.width, stepOutImage.height);
- this._debuggerStepOutButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._debuggerStepOutButtonClicked, this);
- this._debuggerStepOutButtonItem.enabled = false;
- this._navigationBar.addNavigationItem(this._debuggerStepOutButtonItem);
</del><ins>+ this._debuggerStepIntoButtonItem = new WebInspector.ButtonNavigationItem("debugger-step-into", WebInspector.UIString("Step into (%s or %s)").format(this._stepIntoKeyboardShortcut.displayName, this._stepIntoAlternateKeyboardShortcut.displayName), stepIntoImage.src, stepIntoImage.width, stepIntoImage.height);
+ this._debuggerStepIntoButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._debuggerStepIntoButtonClicked, this);
+ this._debuggerStepIntoButtonItem.enabled = false;
+ this._navigationBar.addNavigationItem(this._debuggerStepIntoButtonItem);
</ins><span class="cx">
</span><del>- // Add this offset-sections class name so the sticky headers don't overlap the navigation bar.
- this.element.classList.add(WebInspector.DebuggerSidebarPanel.OffsetSectionsStyleClassName);
</del><ins>+ this._debuggerStepOutButtonItem = new WebInspector.ButtonNavigationItem("debugger-step-out", WebInspector.UIString("Step out (%s or %s)").format(this._stepOutKeyboardShortcut.displayName, this._stepOutAlternateKeyboardShortcut.displayName), stepOutImage.src, stepOutImage.width, stepOutImage.height);
+ this._debuggerStepOutButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._debuggerStepOutButtonClicked, this);
+ this._debuggerStepOutButtonItem.enabled = false;
+ this._navigationBar.addNavigationItem(this._debuggerStepOutButtonItem);
</ins><span class="cx">
</span><del>- this._globalBreakpointsFolderTreeElement = new WebInspector.FolderTreeElement(WebInspector.UIString("Global Breakpoints"), null, WebInspector.DebuggerSidebarPanel.GlobalIconStyleClassName);
- this._allExceptionsBreakpointTreeElement = new WebInspector.BreakpointTreeElement(WebInspector.debuggerManager.allExceptionsBreakpoint, WebInspector.DebuggerSidebarPanel.ExceptionIconStyleClassName, WebInspector.UIString("All Exceptions"));
- this._allUncaughtExceptionsBreakpointTreeElement = new WebInspector.BreakpointTreeElement(WebInspector.debuggerManager.allUncaughtExceptionsBreakpoint, WebInspector.DebuggerSidebarPanel.ExceptionIconStyleClassName, WebInspector.UIString("All Uncaught Exceptions"));
</del><ins>+ // Add this offset-sections class name so the sticky headers don't overlap the navigation bar.
+ this.element.classList.add(WebInspector.DebuggerSidebarPanel.OffsetSectionsStyleClassName);
</ins><span class="cx">
</span><del>- this.filterBar.placeholder = WebInspector.UIString("Filter Breakpoint List");
- var showResourcesWithBreakpointsOnlyFilterFunction = function(treeElement)
- {
- // Keep breakpoints and other elements that aren't resources.
- if (!treeElement instanceof WebInspector.ResourceTreeElement || treeElement instanceof WebInspector.BreakpointTreeElement)
- return true;
</del><ins>+ this._globalBreakpointsFolderTreeElement = new WebInspector.FolderTreeElement(WebInspector.UIString("Global Breakpoints"), null, WebInspector.DebuggerSidebarPanel.GlobalIconStyleClassName);
+ this._allExceptionsBreakpointTreeElement = new WebInspector.BreakpointTreeElement(WebInspector.debuggerManager.allExceptionsBreakpoint, WebInspector.DebuggerSidebarPanel.ExceptionIconStyleClassName, WebInspector.UIString("All Exceptions"));
+ this._allUncaughtExceptionsBreakpointTreeElement = new WebInspector.BreakpointTreeElement(WebInspector.debuggerManager.allUncaughtExceptionsBreakpoint, WebInspector.DebuggerSidebarPanel.ExceptionIconStyleClassName, WebInspector.UIString("All Uncaught Exceptions"));
</ins><span class="cx">
</span><del>- // Keep resources with breakpoints.
- if (treeElement.hasChildren) {
- for (var child of treeElement.children) {
- if (child instanceof WebInspector.BreakpointTreeElement)
- return true;
</del><ins>+ this.filterBar.placeholder = WebInspector.UIString("Filter Breakpoint List");
+ var showResourcesWithBreakpointsOnlyFilterFunction = function(treeElement)
+ {
+ // Keep breakpoints and other elements that aren't resources.
+ if (!treeElement instanceof WebInspector.ResourceTreeElement || treeElement instanceof WebInspector.BreakpointTreeElement)
+ return true;
+
+ // Keep resources with breakpoints.
+ if (treeElement.hasChildren) {
+ for (var child of treeElement.children) {
+ if (child instanceof WebInspector.BreakpointTreeElement)
+ return true;
+ }
</ins><span class="cx"> }
</span><del>- }
- return false;
- };
</del><ins>+ return false;
+ };
</ins><span class="cx">
</span><del>- this.filterBar.addFilterBarButton("debugger-show-resources-with-children-only", showResourcesWithBreakpointsOnlyFilterFunction, true, WebInspector.UIString("Show only resources with breakpoints."), WebInspector.UIString("Show resources with and without breakpoints."), platformImagePath("Breakpoints.svg"), 15, 15);
</del><ins>+ this.filterBar.addFilterBarButton("debugger-show-resources-with-children-only", showResourcesWithBreakpointsOnlyFilterFunction, true, WebInspector.UIString("Show only resources with breakpoints."), WebInspector.UIString("Show resources with and without breakpoints."), platformImagePath("Breakpoints.svg"), 15, 15);
</ins><span class="cx">
</span><del>- this._breakpointsContentTreeOutline = this.contentTreeOutline;
- this._breakpointsContentTreeOutline.onselect = this._treeElementSelected.bind(this);
- this._breakpointsContentTreeOutline.ondelete = this._breakpointTreeOutlineDeleteTreeElement.bind(this);
- this._breakpointsContentTreeOutline.oncontextmenu = this._breakpointTreeOutlineContextMenuTreeElement.bind(this);
</del><ins>+ this._breakpointsContentTreeOutline = this.contentTreeOutline;
+ this._breakpointsContentTreeOutline.onselect = this._treeElementSelected.bind(this);
+ this._breakpointsContentTreeOutline.ondelete = this._breakpointTreeOutlineDeleteTreeElement.bind(this);
+ this._breakpointsContentTreeOutline.oncontextmenu = this._breakpointTreeOutlineContextMenuTreeElement.bind(this);
</ins><span class="cx">
</span><del>- this._breakpointsContentTreeOutline.appendChild(this._globalBreakpointsFolderTreeElement);
- this._globalBreakpointsFolderTreeElement.appendChild(this._allExceptionsBreakpointTreeElement);
- this._globalBreakpointsFolderTreeElement.appendChild(this._allUncaughtExceptionsBreakpointTreeElement);
- this._globalBreakpointsFolderTreeElement.expand();
</del><ins>+ this._breakpointsContentTreeOutline.appendChild(this._globalBreakpointsFolderTreeElement);
+ this._globalBreakpointsFolderTreeElement.appendChild(this._allExceptionsBreakpointTreeElement);
+ this._globalBreakpointsFolderTreeElement.appendChild(this._allUncaughtExceptionsBreakpointTreeElement);
+ this._globalBreakpointsFolderTreeElement.expand();
</ins><span class="cx">
</span><del>- var breakpointsRow = new WebInspector.DetailsSectionRow;
- breakpointsRow.element.appendChild(this._breakpointsContentTreeOutline.element);
</del><ins>+ var breakpointsRow = new WebInspector.DetailsSectionRow;
+ breakpointsRow.element.appendChild(this._breakpointsContentTreeOutline.element);
</ins><span class="cx">
</span><del>- var breakpointsGroup = new WebInspector.DetailsSectionGroup([breakpointsRow]);
- var breakpointsSection = new WebInspector.DetailsSection("scripts", WebInspector.UIString("Scripts"), [breakpointsGroup]);
- this.contentElement.appendChild(breakpointsSection.element);
</del><ins>+ var breakpointsGroup = new WebInspector.DetailsSectionGroup([breakpointsRow]);
+ var breakpointsSection = new WebInspector.DetailsSection("scripts", WebInspector.UIString("Scripts"), [breakpointsGroup]);
+ this.contentElement.appendChild(breakpointsSection.element);
</ins><span class="cx">
</span><del>- this._callStackContentTreeOutline = this.createContentTreeOutline(true);
- this._callStackContentTreeOutline.onselect = this._treeElementSelected.bind(this);
</del><ins>+ this._callStackContentTreeOutline = this.createContentTreeOutline(true);
+ this._callStackContentTreeOutline.onselect = this._treeElementSelected.bind(this);
</ins><span class="cx">
</span><del>- this._callStackRow = new WebInspector.DetailsSectionRow(WebInspector.UIString("No Call Frames"));
- this._callStackRow.showEmptyMessage();
</del><ins>+ this._callStackRow = new WebInspector.DetailsSectionRow(WebInspector.UIString("No Call Frames"));
+ this._callStackRow.showEmptyMessage();
</ins><span class="cx">
</span><del>- var callStackGroup = new WebInspector.DetailsSectionGroup([this._callStackRow]);
- this._callStackSection = new WebInspector.DetailsSection("call-stack", WebInspector.UIString("Call Stack"), [callStackGroup]);
</del><ins>+ var callStackGroup = new WebInspector.DetailsSectionGroup([this._callStackRow]);
+ this._callStackSection = new WebInspector.DetailsSection("call-stack", WebInspector.UIString("Call Stack"), [callStackGroup]);
</ins><span class="cx">
</span><del>- this._pauseReasonTreeOutline = null;
</del><ins>+ this._pauseReasonTreeOutline = null;
</ins><span class="cx">
</span><del>- this._pauseReasonLinkContainerElement = document.createElement("span");
- this._pauseReasonTextRow = new WebInspector.DetailsSectionTextRow;
- this._pauseReasonGroup = new WebInspector.DetailsSectionGroup([this._pauseReasonTextRow]);
- this._pauseReasonSection = new WebInspector.DetailsSection("paused-reason", null, [this._pauseReasonGroup], this._pauseReasonLinkContainerElement);
- this._pauseReasonSection.title = WebInspector.UIString("Pause Reason");
</del><ins>+ this._pauseReasonLinkContainerElement = document.createElement("span");
+ this._pauseReasonTextRow = new WebInspector.DetailsSectionTextRow;
+ this._pauseReasonGroup = new WebInspector.DetailsSectionGroup([this._pauseReasonTextRow]);
+ this._pauseReasonSection = new WebInspector.DetailsSection("paused-reason", null, [this._pauseReasonGroup], this._pauseReasonLinkContainerElement);
+ this._pauseReasonSection.title = WebInspector.UIString("Pause Reason");
</ins><span class="cx">
</span><del>- WebInspector.Breakpoint.addEventListener(WebInspector.Breakpoint.Event.DisplayLocationDidChange, this._breakpointDisplayLocationDidChange, this);
-};
</del><ins>+ WebInspector.Breakpoint.addEventListener(WebInspector.Breakpoint.Event.DisplayLocationDidChange, this._breakpointDisplayLocationDidChange, this);
+ }
</ins><span class="cx">
</span><del>-WebInspector.DebuggerSidebarPanel.OffsetSectionsStyleClassName = "offset-sections";
-WebInspector.DebuggerSidebarPanel.DebuggerPausedStyleClassName = "paused";
-WebInspector.DebuggerSidebarPanel.ExceptionIconStyleClassName = "breakpoint-exception-icon";
-WebInspector.DebuggerSidebarPanel.PausedBreakpointIconStyleClassName = "breakpoint-paused-icon";
-WebInspector.DebuggerSidebarPanel.GlobalIconStyleClassName = "global-breakpoints-icon";
-
-WebInspector.DebuggerSidebarPanel.SelectedAllExceptionsCookieKey = "debugger-sidebar-panel-all-exceptions-breakpoint";
-WebInspector.DebuggerSidebarPanel.SelectedAllUncaughtExceptionsCookieKey = "debugger-sidebar-panel-all-uncaught-exceptions-breakpoint";
-
-WebInspector.DebuggerSidebarPanel.prototype = {
- constructor: WebInspector.DebuggerSidebarPanel,
- __proto__: WebInspector.NavigationSidebarPanel.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get hasSelectedElement()
</span><span class="lines">@@ -176,25 +165,25 @@
</span><span class="cx"> return !!this._breakpointsContentTreeOutline.selectedTreeElement
</span><span class="cx"> || !!this._callStackContentTreeOutline.selectedTreeElement
</span><span class="cx"> || (this._pauseReasonTreeOutline && !!this._pauseReasonTreeOutline.selectedTreeElement);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showDefaultContentView: function()
</del><ins>+ showDefaultContentView()
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.resourceSidebarPanel.showDefaultContentView();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- treeElementForRepresentedObject: function(representedObject)
</del><ins>+ treeElementForRepresentedObject(representedObject)
</ins><span class="cx"> {
</span><span class="cx"> // The main resource is used as the representedObject instead of Frame in our tree.
</span><span class="cx"> if (representedObject instanceof WebInspector.Frame)
</span><span class="cx"> representedObject = representedObject.mainResource;
</span><span class="cx">
</span><span class="cx"> return this.contentTreeOutline.getCachedTreeElement(representedObject);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Protected
</span><span class="cx">
</span><del>- saveStateToCookie: function(cookie)
</del><ins>+ saveStateToCookie(cookie)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(cookie);
</span><span class="cx">
</span><span class="lines">@@ -210,10 +199,10 @@
</span><span class="cx"> if (representedObject === WebInspector.debuggerManager.allUncaughtExceptionsBreakpoint)
</span><span class="cx"> cookie[WebInspector.DebuggerSidebarPanel.SelectedAllUncaughtExceptionsCookieKey] = true;
</span><span class="cx">
</span><del>- WebInspector.NavigationSidebarPanel.prototype.saveStateToCookie.call(this, cookie);
- },
</del><ins>+ super.saveStateToCookie(cookie);
+ }
</ins><span class="cx">
</span><del>- restoreStateFromCookie: function(cookie, relaxedMatchDelay)
</del><ins>+ restoreStateFromCookie(cookie, relaxedMatchDelay)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(cookie);
</span><span class="cx">
</span><span class="lines">@@ -223,12 +212,12 @@
</span><span class="cx"> else if (cookie[WebInspector.DebuggerSidebarPanel.SelectedAllUncaughtExceptionsCookieKey])
</span><span class="cx"> this._allUncaughtExceptionsBreakpointTreeElement.revealAndSelect();
</span><span class="cx"> else
</span><del>- WebInspector.NavigationSidebarPanel.prototype.restoreStateFromCookie.call(this, cookie, relaxedMatchDelay);
- },
</del><ins>+ super.restoreStateFromCookie(cookie, relaxedMatchDelay);
+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _debuggerPauseResumeButtonClicked: function(event)
</del><ins>+ _debuggerPauseResumeButtonClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> if (WebInspector.debuggerManager.paused)
</span><span class="cx"> WebInspector.debuggerManager.resume();
</span><span class="lines">@@ -236,24 +225,24 @@
</span><span class="cx"> this._debuggerPauseResumeButtonItem.enabled = false;
</span><span class="cx"> WebInspector.debuggerManager.pause();
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _debuggerStepOverButtonClicked: function(event)
</del><ins>+ _debuggerStepOverButtonClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.debuggerManager.stepOver();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _debuggerStepIntoButtonClicked: function(event)
</del><ins>+ _debuggerStepIntoButtonClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.debuggerManager.stepInto();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _debuggerStepOutButtonClicked: function(event)
</del><ins>+ _debuggerStepOutButtonClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.debuggerManager.stepOut();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _debuggerDidPause: function(event)
</del><ins>+ _debuggerDidPause(event)
</ins><span class="cx"> {
</span><span class="cx"> this.contentElement.insertBefore(this._callStackSection.element, this.contentElement.firstChild);
</span><span class="cx"> if (this._updatePauseReason())
</span><span class="lines">@@ -265,9 +254,9 @@
</span><span class="cx"> this._debuggerStepIntoButtonItem.enabled = true;
</span><span class="cx">
</span><span class="cx"> this.element.classList.add(WebInspector.DebuggerSidebarPanel.DebuggerPausedStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _debuggerDidResume: function(event)
</del><ins>+ _debuggerDidResume(event)
</ins><span class="cx"> {
</span><span class="cx"> this._callStackSection.element.remove();
</span><span class="cx"> this._pauseReasonSection.element.remove();
</span><span class="lines">@@ -279,19 +268,19 @@
</span><span class="cx"> this._debuggerStepOutButtonItem.enabled = false;
</span><span class="cx">
</span><span class="cx"> this.element.classList.remove(WebInspector.DebuggerSidebarPanel.DebuggerPausedStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _breakpointsEnabledDidChange: function(event)
</del><ins>+ _breakpointsEnabledDidChange(event)
</ins><span class="cx"> {
</span><span class="cx"> this._debuggerBreakpointsButtonItem.activated = WebInspector.debuggerManager.breakpointsEnabled;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _breakpointsToggleButtonClicked: function(event)
</del><ins>+ _breakpointsToggleButtonClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.debuggerManager.breakpointsEnabled = !this._debuggerBreakpointsButtonItem.activated;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _addBreakpoint: function(breakpoint)
</del><ins>+ _addBreakpoint(breakpoint)
</ins><span class="cx"> {
</span><span class="cx"> var sourceCode = breakpoint.sourceCodeLocation.displaySourceCode;
</span><span class="cx"> if (!sourceCode)
</span><span class="lines">@@ -311,16 +300,16 @@
</span><span class="cx"> if (parentTreeElement.children.length === 1)
</span><span class="cx"> parentTreeElement.expand();
</span><span class="cx"> return breakpointTreeElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _addBreakpointsForSourceCode: function(sourceCode)
</del><ins>+ _addBreakpointsForSourceCode(sourceCode)
</ins><span class="cx"> {
</span><span class="cx"> var breakpoints = WebInspector.debuggerManager.breakpointsForSourceCode(sourceCode);
</span><span class="cx"> for (var i = 0; i < breakpoints.length; ++i)
</span><span class="cx"> this._addBreakpoint(breakpoints[i], sourceCode);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _addTreeElementForSourceCodeToContentTreeOutline: function(sourceCode)
</del><ins>+ _addTreeElementForSourceCodeToContentTreeOutline(sourceCode)
</ins><span class="cx"> {
</span><span class="cx"> var treeElement = this._breakpointsContentTreeOutline.getCachedTreeElement(sourceCode);
</span><span class="cx"> if (!treeElement) {
</span><span class="lines">@@ -340,9 +329,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> return treeElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _resourceAdded: function(event)
</del><ins>+ _resourceAdded(event)
</ins><span class="cx"> {
</span><span class="cx"> var resource = event.data.resource;
</span><span class="cx">
</span><span class="lines">@@ -351,16 +340,16 @@
</span><span class="cx">
</span><span class="cx"> this._addTreeElementForSourceCodeToContentTreeOutline(resource);
</span><span class="cx"> this._addBreakpointsForSourceCode(resource);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _mainResourceChanged: function(event)
</del><ins>+ _mainResourceChanged(event)
</ins><span class="cx"> {
</span><span class="cx"> var resource = event.target.mainResource;
</span><span class="cx"> this._addTreeElementForSourceCodeToContentTreeOutline(resource);
</span><span class="cx"> this._addBreakpointsForSourceCode(resource);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _scriptAdded: function(event)
</del><ins>+ _scriptAdded(event)
</ins><span class="cx"> {
</span><span class="cx"> var script = event.data.script;
</span><span class="cx">
</span><span class="lines">@@ -380,9 +369,9 @@
</span><span class="cx">
</span><span class="cx"> this._addTreeElementForSourceCodeToContentTreeOutline(script);
</span><span class="cx"> this._addBreakpointsForSourceCode(script);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _scriptsCleared: function(event)
</del><ins>+ _scriptsCleared(event)
</ins><span class="cx"> {
</span><span class="cx"> for (var i = this._breakpointsContentTreeOutline.children.length - 1; i >= 0; --i) {
</span><span class="cx"> var treeElement = this._breakpointsContentTreeOutline.children[i];
</span><span class="lines">@@ -391,15 +380,15 @@
</span><span class="cx">
</span><span class="cx"> this._breakpointsContentTreeOutline.removeChildAtIndex(i, true, true);
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _breakpointAdded: function(event)
</del><ins>+ _breakpointAdded(event)
</ins><span class="cx"> {
</span><span class="cx"> var breakpoint = event.data.breakpoint;
</span><span class="cx"> this._addBreakpoint(breakpoint);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _breakpointRemoved: function(event)
</del><ins>+ _breakpointRemoved(event)
</ins><span class="cx"> {
</span><span class="cx"> var breakpoint = event.data.breakpoint;
</span><span class="cx">
</span><span class="lines">@@ -415,9 +404,9 @@
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._removeBreakpointTreeElement(breakpointTreeElement);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _breakpointDisplayLocationDidChange: function(event)
</del><ins>+ _breakpointDisplayLocationDidChange(event)
</ins><span class="cx"> {
</span><span class="cx"> var breakpoint = event.target;
</span><span class="cx"> if (event.data.oldDisplaySourceCode === breakpoint.displaySourceCode)
</span><span class="lines">@@ -437,17 +426,17 @@
</span><span class="cx">
</span><span class="cx"> if (newBreakpointTreeElement && wasSelected)
</span><span class="cx"> newBreakpointTreeElement.revealAndSelect(true, false, true, true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _removeBreakpointTreeElement: function(breakpointTreeElement)
</del><ins>+ _removeBreakpointTreeElement(breakpointTreeElement)
</ins><span class="cx"> {
</span><span class="cx"> var parentTreeElement = breakpointTreeElement.parent;
</span><span class="cx"> parentTreeElement.removeChild(breakpointTreeElement);
</span><span class="cx">
</span><span class="cx"> console.assert(parentTreeElement.parent === this._breakpointsContentTreeOutline);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _debuggerCallFramesDidChange: function()
</del><ins>+ _debuggerCallFramesDidChange()
</ins><span class="cx"> {
</span><span class="cx"> this._callStackContentTreeOutline.removeChildren();
</span><span class="cx">
</span><span class="lines">@@ -472,9 +461,9 @@
</span><span class="cx">
</span><span class="cx"> if (treeElementToSelect)
</span><span class="cx"> treeElementToSelect.select(true, true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _debuggerActiveCallFrameDidChange: function()
</del><ins>+ _debuggerActiveCallFrameDidChange()
</ins><span class="cx"> {
</span><span class="cx"> var callFrames = WebInspector.debuggerManager.callFrames;
</span><span class="cx"> if (!callFrames)
</span><span class="lines">@@ -485,9 +474,9 @@
</span><span class="cx"> // since there might be call frames in the backend that were removed when processing the call
</span><span class="cx"> // frame payload.
</span><span class="cx"> this._debuggerStepOutButtonItem.enabled = indexOfActiveCallFrame < callFrames.length - 1;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _breakpointsBeneathTreeElement: function(treeElement)
</del><ins>+ _breakpointsBeneathTreeElement(treeElement)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(treeElement instanceof WebInspector.ResourceTreeElement || treeElement instanceof WebInspector.ScriptTreeElement);
</span><span class="cx"> if (!(treeElement instanceof WebInspector.ResourceTreeElement) && !(treeElement instanceof WebInspector.ScriptTreeElement))
</span><span class="lines">@@ -504,24 +493,24 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> return breakpoints;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _removeAllBreakpoints: function(breakpoints)
</del><ins>+ _removeAllBreakpoints(breakpoints)
</ins><span class="cx"> {
</span><span class="cx"> for (var i = 0; i < breakpoints.length; ++i) {
</span><span class="cx"> var breakpoint = breakpoints[i];
</span><span class="cx"> if (WebInspector.debuggerManager.isBreakpointRemovable(breakpoint))
</span><span class="cx"> WebInspector.debuggerManager.removeBreakpoint(breakpoint);
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _toggleAllBreakpoints: function(breakpoints, disabled)
</del><ins>+ _toggleAllBreakpoints(breakpoints, disabled)
</ins><span class="cx"> {
</span><span class="cx"> for (var i = 0; i < breakpoints.length; ++i)
</span><span class="cx"> breakpoints[i].disabled = disabled;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _breakpointTreeOutlineDeleteTreeElement: function(treeElement)
</del><ins>+ _breakpointTreeOutlineDeleteTreeElement(treeElement)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(treeElement.selected);
</span><span class="cx"> console.assert(treeElement instanceof WebInspector.ResourceTreeElement || treeElement instanceof WebInspector.ScriptTreeElement);
</span><span class="lines">@@ -538,9 +527,9 @@
</span><span class="cx"> nextSibling.select(true, true);
</span><span class="cx">
</span><span class="cx"> return true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _breakpointTreeOutlineContextMenuTreeElement: function(event, treeElement)
</del><ins>+ _breakpointTreeOutlineContextMenuTreeElement(event, treeElement)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(treeElement instanceof WebInspector.ResourceTreeElement || treeElement instanceof WebInspector.ScriptTreeElement || treeElement.constructor === WebInspector.FolderTreeElement);
</span><span class="cx"> if (!(treeElement instanceof WebInspector.ResourceTreeElement) && !(treeElement instanceof WebInspector.ScriptTreeElement))
</span><span class="lines">@@ -572,9 +561,9 @@
</span><span class="cx"> contextMenu.appendItem(WebInspector.UIString("Enable Breakpoints"), toggleAllResourceBreakpoints.bind(this));
</span><span class="cx"> contextMenu.appendItem(WebInspector.UIString("Delete Breakpoints"), removeAllResourceBreakpoints.bind(this));
</span><span class="cx"> contextMenu.show();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _treeElementSelected: function(treeElement, selectedByUser)
</del><ins>+ _treeElementSelected(treeElement, selectedByUser)
</ins><span class="cx"> {
</span><span class="cx"> function deselectCallStackContentTreeElements()
</span><span class="cx"> {
</span><span class="lines">@@ -643,9 +632,9 @@
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> WebInspector.resourceSidebarPanel.showSourceCodeLocation(breakpoint.sourceCodeLocation);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _compareTopLevelTreeElements: function(a, b)
</del><ins>+ _compareTopLevelTreeElements(a, b)
</ins><span class="cx"> {
</span><span class="cx"> if (a === this._globalBreakpointsFolderTreeElement)
</span><span class="cx"> return -1;
</span><span class="lines">@@ -653,9 +642,9 @@
</span><span class="cx"> return 1;
</span><span class="cx">
</span><span class="cx"> return a.mainTitle.localeCompare(b.mainTitle);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _compareBreakpointTreeElements: function(a, b)
</del><ins>+ _compareBreakpointTreeElements(a, b)
</ins><span class="cx"> {
</span><span class="cx"> var aLocation = a.breakpoint.sourceCodeLocation;
</span><span class="cx"> var bLocation = b.breakpoint.sourceCodeLocation;
</span><span class="lines">@@ -665,17 +654,17 @@
</span><span class="cx"> return comparisonResult;
</span><span class="cx">
</span><span class="cx"> return aLocation.displayColumnNumber - bLocation.displayColumnNumber;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updatePauseReason: function()
</del><ins>+ _updatePauseReason()
</ins><span class="cx"> {
</span><span class="cx"> this._pauseReasonTreeOutline = null;
</span><span class="cx">
</span><span class="cx"> this._updatePauseReasonGotoArrow();
</span><span class="cx"> return this._updatePauseReasonSection();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updatePauseReasonSection: function()
</del><ins>+ _updatePauseReasonSection()
</ins><span class="cx"> {
</span><span class="cx"> var pauseData = WebInspector.debuggerManager.pauseData;
</span><span class="cx">
</span><span class="lines">@@ -746,9 +735,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> return false;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updatePauseReasonGotoArrow: function()
</del><ins>+ _updatePauseReasonGotoArrow()
</ins><span class="cx"> {
</span><span class="cx"> this._pauseReasonLinkContainerElement.removeChildren();
</span><span class="cx">
</span><span class="lines">@@ -764,3 +753,12 @@
</span><span class="cx"> this._pauseReasonLinkContainerElement.appendChild(linkElement);
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.DebuggerSidebarPanel.OffsetSectionsStyleClassName = "offset-sections";
+WebInspector.DebuggerSidebarPanel.DebuggerPausedStyleClassName = "paused";
+WebInspector.DebuggerSidebarPanel.ExceptionIconStyleClassName = "breakpoint-exception-icon";
+WebInspector.DebuggerSidebarPanel.PausedBreakpointIconStyleClassName = "breakpoint-paused-icon";
+WebInspector.DebuggerSidebarPanel.GlobalIconStyleClassName = "global-breakpoints-icon";
+
+WebInspector.DebuggerSidebarPanel.SelectedAllExceptionsCookieKey = "debugger-sidebar-panel-all-exceptions-breakpoint";
+WebInspector.DebuggerSidebarPanel.SelectedAllUncaughtExceptionsCookieKey = "debugger-sidebar-panel-all-uncaught-exceptions-breakpoint";
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDetailsSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSidebarPanel.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSidebarPanel.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSidebarPanel.js 2015-03-26 23:37:55 UTC (rev 182041)
</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, 2015 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,47 +23,48 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.DetailsSidebarPanel = function(identifier, displayName, singularDisplayName, image, keyboardShortcutKey, element)
</del><ins>+WebInspector.DetailsSidebarPanel = class DetailsSidebarPanel extends WebInspector.SidebarPanel
</ins><span class="cx"> {
</span><del>- if (keyboardShortcutKey)
- this._keyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.Control | WebInspector.KeyboardShortcut.Modifier.Shift, keyboardShortcutKey, this.toggle.bind(this));
</del><ins>+ constructor(identifier, displayName, singularDisplayName, image, keyboardShortcutKey, element)
+ {
+ var keyboardShortcut = null;
+ if (keyboardShortcutKey)
+ keyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.Control | WebInspector.KeyboardShortcut.Modifier.Shift, keyboardShortcutKey);
</ins><span class="cx">
</span><del>- if (this._keyboardShortcut) {
- var showToolTip = WebInspector.UIString("Show the %s details sidebar (%s)").format(singularDisplayName, this._keyboardShortcut.displayName);
- var hideToolTip = WebInspector.UIString("Hide the %s details sidebar (%s)").format(singularDisplayName, this._keyboardShortcut.displayName);
- } else {
- var showToolTip = WebInspector.UIString("Show the %s details sidebar").format(singularDisplayName);
- var hideToolTip = WebInspector.UIString("Hide the %s details sidebar").format(singularDisplayName);
- }
</del><ins>+ if (keyboardShortcut) {
+ var showToolTip = WebInspector.UIString("Show the %s details sidebar (%s)").format(singularDisplayName, keyboardShortcut.displayName);
+ var hideToolTip = WebInspector.UIString("Hide the %s details sidebar (%s)").format(singularDisplayName, keyboardShortcut.displayName);
+ } else {
+ var showToolTip = WebInspector.UIString("Show the %s details sidebar").format(singularDisplayName);
+ var hideToolTip = WebInspector.UIString("Hide the %s details sidebar").format(singularDisplayName);
+ }
</ins><span class="cx">
</span><del>- WebInspector.SidebarPanel.call(this, identifier, displayName, showToolTip, hideToolTip, image, element);
</del><ins>+ super(identifier, displayName, showToolTip, hideToolTip, image, element);
</ins><span class="cx">
</span><del>- this.element.classList.add(WebInspector.DetailsSidebarPanel.StyleClassName);
-};
</del><ins>+ this._keyboardShortcut = keyboardShortcut;
+ if (this._keyboardShortcut)
+ this._keyboardShortcut.callback = this.toggle.bind(this);
</ins><span class="cx">
</span><del>-WebInspector.DetailsSidebarPanel.StyleClassName = "details";
</del><ins>+ this.element.classList.add("details");
+ }
</ins><span class="cx">
</span><del>-WebInspector.DetailsSidebarPanel.prototype = {
- constructor: WebInspector.DetailsSidebarPanel,
- __proto__: WebInspector.SidebarPanel.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><del>- inspect: function(objects)
</del><ins>+ inspect(objects)
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses.
</span><span class="cx"> return false;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- shown: function()
</del><ins>+ shown()
</ins><span class="cx"> {
</span><span class="cx"> if (this._needsRefresh) {
</span><span class="cx"> delete this._needsRefresh;
</span><span class="cx"> this.refresh();
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- needsRefresh: function()
</del><ins>+ needsRefresh()
</ins><span class="cx"> {
</span><span class="cx"> if (!this.selected) {
</span><span class="cx"> this._needsRefresh = true;
</span><span class="lines">@@ -71,9 +72,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> this.refresh();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- refresh: function()
</del><ins>+ refresh()
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses.
</span><span class="cx"> }
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsLayerTreeDetailsSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/LayerTreeDetailsSidebarPanel.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/LayerTreeDetailsSidebarPanel.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/LayerTreeDetailsSidebarPanel.js 2015-03-26 23:37:55 UTC (rev 182041)
</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, 2015 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,32 +23,28 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.LayerTreeDetailsSidebarPanel = function()
</del><ins>+WebInspector.LayerTreeDetailsSidebarPanel = class LayerTreeDetailsSidebarPanel extends WebInspector.DOMDetailsSidebarPanel
</ins><span class="cx"> {
</span><del>- WebInspector.DOMDetailsSidebarPanel.call(this, "layer-tree", WebInspector.UIString("Layers"), WebInspector.UIString("Layer"), "Images/NavigationItemLayers.svg", "3");
</del><ins>+ constructor()
+ {
+ super("layer-tree", WebInspector.UIString("Layers"), WebInspector.UIString("Layer"), "Images/NavigationItemLayers.svg", "3");
</ins><span class="cx">
</span><del>- this._dataGridNodesByLayerId = {};
</del><ins>+ this._dataGridNodesByLayerId = {};
</ins><span class="cx">
</span><del>- this.element.classList.add(WebInspector.LayerTreeDetailsSidebarPanel.StyleClassName);
</del><ins>+ this.element.classList.add("layer-tree");
</ins><span class="cx">
</span><del>- WebInspector.showShadowDOMSetting.addEventListener(WebInspector.Setting.Event.Changed, this._showShadowDOMSettingChanged, this);
</del><ins>+ WebInspector.showShadowDOMSetting.addEventListener(WebInspector.Setting.Event.Changed, this._showShadowDOMSettingChanged, this);
</ins><span class="cx">
</span><del>- window.addEventListener("resize", this._windowResized.bind(this));
</del><ins>+ window.addEventListener("resize", this._windowResized.bind(this));
</ins><span class="cx">
</span><del>- this._buildLayerInfoSection();
- this._buildDataGridSection();
- this._buildBottomBar();
-};
</del><ins>+ this._buildLayerInfoSection();
+ this._buildDataGridSection();
+ this._buildBottomBar();
+ }
</ins><span class="cx">
</span><del>-WebInspector.LayerTreeDetailsSidebarPanel.StyleClassName = "layer-tree";
-
-WebInspector.LayerTreeDetailsSidebarPanel.prototype = {
- constructor: WebInspector.LayerTreeDetailsSidebarPanel,
- __proto__: WebInspector.DOMDetailsSidebarPanel.prototype,
-
</del><span class="cx"> // DetailsSidebarPanel Overrides.
</span><span class="cx">
</span><del>- shown: function()
</del><ins>+ shown()
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.layerTreeManager.addEventListener(WebInspector.LayerTreeManager.Event.LayerTreeDidChange, this._layerTreeDidChange, this);
</span><span class="cx">
</span><span class="lines">@@ -57,16 +53,16 @@
</span><span class="cx"> this.needsRefresh();
</span><span class="cx">
</span><span class="cx"> WebInspector.DOMDetailsSidebarPanel.prototype.shown.call(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- hidden: function()
</del><ins>+ hidden()
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.layerTreeManager.removeEventListener(WebInspector.LayerTreeManager.Event.LayerTreeDidChange, this._layerTreeDidChange, this);
</span><span class="cx">
</span><span class="cx"> WebInspector.DOMDetailsSidebarPanel.prototype.hidden.call(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- refresh: function()
</del><ins>+ refresh()
</ins><span class="cx"> {
</span><span class="cx"> if (!this.domNode)
</span><span class="cx"> return;
</span><span class="lines">@@ -75,35 +71,35 @@
</span><span class="cx"> this._unfilteredChildLayers = childLayers;
</span><span class="cx"> this._updateDisplayWithLayers(layerForNode, childLayers);
</span><span class="cx"> }.bind(this));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // DOMDetailsSidebarPanel Overrides
</span><span class="cx">
</span><del>- supportsDOMNode: function(nodeToInspect)
</del><ins>+ supportsDOMNode(nodeToInspect)
</ins><span class="cx"> {
</span><span class="cx"> return WebInspector.layerTreeManager.supported && nodeToInspect.nodeType() === Node.ELEMENT_NODE;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _layerTreeDidChange: function(event)
</del><ins>+ _layerTreeDidChange(event)
</ins><span class="cx"> {
</span><span class="cx"> this.needsRefresh();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _showShadowDOMSettingChanged: function(event)
</del><ins>+ _showShadowDOMSettingChanged(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this.selected)
</span><span class="cx"> this._updateDisplayWithLayers(this._layerForNode, this._unfilteredChildLayers);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _windowResized: function(event)
</del><ins>+ _windowResized(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this._popover && this._popover.visible)
</span><span class="cx"> this._updatePopoverForSelectedNode();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _buildLayerInfoSection: function()
</del><ins>+ _buildLayerInfoSection()
</ins><span class="cx"> {
</span><span class="cx"> var rows = this._layerInfoRows = {};
</span><span class="cx"> var rowsArray = [];
</span><span class="lines">@@ -122,9 +118,9 @@
</span><span class="cx"> this._layerInfoSection = new WebInspector.DetailsSection("layer-info", WebInspector.UIString("Layer Info"), [this._noLayerInformationGroup]);
</span><span class="cx">
</span><span class="cx"> this.contentElement.appendChild(this._layerInfoSection.element);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _buildDataGridSection: function()
</del><ins>+ _buildDataGridSection()
</ins><span class="cx"> {
</span><span class="cx"> var columns = {name: {}, paintCount: {}, memory: {}};
</span><span class="cx">
</span><span class="lines">@@ -160,9 +156,9 @@
</span><span class="cx">
</span><span class="cx"> var element = this.contentElement.appendChild(section.element);
</span><span class="cx"> element.classList.add(section.identifier);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _buildBottomBar: function()
</del><ins>+ _buildBottomBar()
</ins><span class="cx"> {
</span><span class="cx"> var bottomBar = this.element.appendChild(document.createElement("div"));
</span><span class="cx"> bottomBar.className = "bottom-bar";
</span><span class="lines">@@ -172,9 +168,9 @@
</span><span class="cx">
</span><span class="cx"> this._layersMemoryLabel = bottomBar.appendChild(document.createElement("div"));
</span><span class="cx"> this._layersMemoryLabel.className = "layers-memory-label";
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _sortDataGrid: function()
</del><ins>+ _sortDataGrid()
</ins><span class="cx"> {
</span><span class="cx"> var sortColumnIdentifier = this._dataGrid.sortColumnIdentifier;
</span><span class="cx">
</span><span class="lines">@@ -187,9 +183,9 @@
</span><span class="cx">
</span><span class="cx"> this._dataGrid.sortNodes(comparator);
</span><span class="cx"> this._updatePopoverForSelectedNode();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _selectedDataGridNodeChanged: function()
</del><ins>+ _selectedDataGridNodeChanged()
</ins><span class="cx"> {
</span><span class="cx"> if (this._dataGrid.selectedNode) {
</span><span class="cx"> this._highlightSelectedNode();
</span><span class="lines">@@ -198,27 +194,27 @@
</span><span class="cx"> WebInspector.domTreeManager.hideDOMNodeHighlight();
</span><span class="cx"> this._hidePopover();
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _dataGridGainedFocus: function(event)
</del><ins>+ _dataGridGainedFocus(event)
</ins><span class="cx"> {
</span><span class="cx"> this._highlightSelectedNode();
</span><span class="cx"> this._showPopoverForSelectedNode();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _dataGridLostFocus: function(event)
</del><ins>+ _dataGridLostFocus(event)
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.domTreeManager.hideDOMNodeHighlight();
</span><span class="cx"> this._hidePopover();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _dataGridWasClicked: function(event)
</del><ins>+ _dataGridWasClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this._dataGrid.selectedNode && event.target.parentNode.classList.contains("filler"))
</span><span class="cx"> this._dataGrid.selectedNode.deselect();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _highlightSelectedNode: function()
</del><ins>+ _highlightSelectedNode()
</ins><span class="cx"> {
</span><span class="cx"> var dataGridNode = this._dataGrid.selectedNode;
</span><span class="cx"> if (!dataGridNode)
</span><span class="lines">@@ -229,9 +225,9 @@
</span><span class="cx"> WebInspector.domTreeManager.highlightRect(layer.bounds, true);
</span><span class="cx"> else
</span><span class="cx"> WebInspector.domTreeManager.highlightDOMNode(layer.nodeId);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateDisplayWithLayers: function(layerForNode, childLayers)
</del><ins>+ _updateDisplayWithLayers(layerForNode, childLayers)
</ins><span class="cx"> {
</span><span class="cx"> if (!WebInspector.showShadowDOMSetting.value) {
</span><span class="cx"> childLayers = childLayers.filter(function(layer) {
</span><span class="lines">@@ -245,11 +241,11 @@
</span><span class="cx">
</span><span class="cx"> this._layerForNode = layerForNode;
</span><span class="cx"> this._childLayers = childLayers;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateLayerInfoSection: function(layer)
</del><ins>+ _updateLayerInfoSection(layer)
</ins><span class="cx"> {
</span><del>- const emDash = "\u2014";
</del><ins>+ var emDash = "\u2014";
</ins><span class="cx">
</span><span class="cx"> this._layerInfoSection.groups = layer ? [this._layerInfoGroup] : [this._noLayerInformationGroup];
</span><span class="cx">
</span><span class="lines">@@ -260,9 +256,9 @@
</span><span class="cx"> this._layerInfoRows["Width"].value = layer.compositedBounds.width + "px";
</span><span class="cx"> this._layerInfoRows["Height"].value = layer.compositedBounds.height + "px";
</span><span class="cx"> this._layerInfoRows["Paints"].value = layer.paintCount + "";
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateDataGrid: function(layerForNode, childLayers)
</del><ins>+ _updateDataGrid(layerForNode, childLayers)
</ins><span class="cx"> {
</span><span class="cx"> var dataGrid = this._dataGrid;
</span><span class="cx">
</span><span class="lines">@@ -291,18 +287,18 @@
</span><span class="cx"> this._sortDataGrid();
</span><span class="cx">
</span><span class="cx"> this._childLayersRow.dataGrid = !isEmptyObject(childLayers) ? this._dataGrid : null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _dataGridNodeForLayer: function(layer)
</del><ins>+ _dataGridNodeForLayer(layer)
</ins><span class="cx"> {
</span><span class="cx"> var node = new WebInspector.LayerTreeDataGridNode(layer);
</span><span class="cx">
</span><span class="cx"> this._dataGridNodesByLayerId[layer.layerId] = node;
</span><span class="cx">
</span><span class="cx"> return node;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateMetrics: function(layerForNode, childLayers)
</del><ins>+ _updateMetrics(layerForNode, childLayers)
</ins><span class="cx"> {
</span><span class="cx"> var layerCount = 0;
</span><span class="cx"> var totalMemory = 0;
</span><span class="lines">@@ -319,9 +315,9 @@
</span><span class="cx">
</span><span class="cx"> this._layersCountLabel.textContent = WebInspector.UIString("Layer Count: %d").format(layerCount);
</span><span class="cx"> this._layersMemoryLabel.textContent = WebInspector.UIString("Memory: %s").format(Number.bytesToString(totalMemory));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _showPopoverForSelectedNode: function()
</del><ins>+ _showPopoverForSelectedNode()
</ins><span class="cx"> {
</span><span class="cx"> var dataGridNode = this._dataGrid.selectedNode;
</span><span class="cx"> if (!dataGridNode)
</span><span class="lines">@@ -331,9 +327,9 @@
</span><span class="cx"> if (dataGridNode === this._dataGrid.selectedNode)
</span><span class="cx"> this._updatePopoverForSelectedNode(content);
</span><span class="cx"> }.bind(this));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updatePopoverForSelectedNode: function(content)
</del><ins>+ _updatePopoverForSelectedNode(content)
</ins><span class="cx"> {
</span><span class="cx"> var dataGridNode = this._dataGrid.selectedNode;
</span><span class="cx"> if (!dataGridNode)
</span><span class="lines">@@ -349,15 +345,15 @@
</span><span class="cx"> popover.content = content;
</span><span class="cx">
</span><span class="cx"> popover.present(targetFrame.pad(2), [WebInspector.RectEdge.MIN_X]);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _hidePopover: function()
</del><ins>+ _hidePopover()
</ins><span class="cx"> {
</span><span class="cx"> if (this._popover)
</span><span class="cx"> this._popover.dismiss();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _contentForPopover: function(layer, callback)
</del><ins>+ _contentForPopover(layer, callback)
</ins><span class="cx"> {
</span><span class="cx"> var content = document.createElement("div");
</span><span class="cx"> content.className = "layer-tree-popover";
</span><span class="lines">@@ -378,9 +374,9 @@
</span><span class="cx"> }.bind(this));
</span><span class="cx">
</span><span class="cx"> return content;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _populateListOfCompositingReasons: function(list, compositingReasons)
</del><ins>+ _populateListOfCompositingReasons(list, compositingReasons)
</ins><span class="cx"> {
</span><span class="cx"> function addReason(reason)
</span><span class="cx"> {
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsNavigationSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NavigationSidebarPanel.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/NavigationSidebarPanel.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NavigationSidebarPanel.js 2015-03-26 23:37:55 UTC (rev 182041)
</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, 2015 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,99 +23,88 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.NavigationSidebarPanel = function(identifier, displayName, image, keyboardShortcutKey, autoPruneOldTopLevelResourceTreeElements, autoHideToolbarItemWhenEmpty, wantsTopOverflowShadow, element, role, label)
</del><ins>+WebInspector.NavigationSidebarPanel = class NavigationSidebarPanel extends WebInspector.SidebarPanel
</ins><span class="cx"> {
</span><del>- if (keyboardShortcutKey)
- this._keyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.Control, keyboardShortcutKey, this.toggle.bind(this));
</del><ins>+ constructor(identifier, displayName, image, keyboardShortcutKey, autoPruneOldTopLevelResourceTreeElements, autoHideToolbarItemWhenEmpty, wantsTopOverflowShadow, element, role, label)
+ {
+ var keyboardShortcut = null;
+ if (keyboardShortcutKey)
+ keyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.Control, keyboardShortcutKey);
</ins><span class="cx">
</span><del>- if (this._keyboardShortcut) {
- var showToolTip = WebInspector.UIString("Show the %s navigation sidebar (%s)").format(displayName, this._keyboardShortcut.displayName);
- var hideToolTip = WebInspector.UIString("Hide the %s navigation sidebar (%s)").format(displayName, this._keyboardShortcut.displayName);
- } else {
- var showToolTip = WebInspector.UIString("Show the %s navigation sidebar").format(displayName);
- var hideToolTip = WebInspector.UIString("Hide the %s navigation sidebar").format(displayName);
- }
</del><ins>+ if (keyboardShortcut) {
+ var showToolTip = WebInspector.UIString("Show the %s navigation sidebar (%s)").format(displayName, keyboardShortcut.displayName);
+ var hideToolTip = WebInspector.UIString("Hide the %s navigation sidebar (%s)").format(displayName, keyboardShortcut.displayName);
+ } else {
+ var showToolTip = WebInspector.UIString("Show the %s navigation sidebar").format(displayName);
+ var hideToolTip = WebInspector.UIString("Hide the %s navigation sidebar").format(displayName);
+ }
</ins><span class="cx">
</span><del>- WebInspector.SidebarPanel.call(this, identifier, displayName, showToolTip, hideToolTip, image, element, role, label || displayName);
</del><ins>+ super(identifier, displayName, showToolTip, hideToolTip, image, element, role, label || displayName);
</ins><span class="cx">
</span><del>- this.element.classList.add(WebInspector.NavigationSidebarPanel.StyleClassName);
</del><ins>+ this.element.classList.add("navigation");
</ins><span class="cx">
</span><del>- this._autoHideToolbarItemWhenEmpty = autoHideToolbarItemWhenEmpty || false;
</del><ins>+ this._keyboardShortcut = keyboardShortcut;
+ this._keyboardShortcut.callback = this.toggle.bind(this);
</ins><span class="cx">
</span><del>- if (autoHideToolbarItemWhenEmpty)
- this.toolbarItem.hidden = true;
</del><ins>+ this._autoHideToolbarItemWhenEmpty = autoHideToolbarItemWhenEmpty || false;
</ins><span class="cx">
</span><del>- this._visibleContentTreeOutlines = new Set;
</del><ins>+ if (autoHideToolbarItemWhenEmpty)
+ this.toolbarItem.hidden = true;
</ins><span class="cx">
</span><del>- this.contentElement.addEventListener("scroll", this._updateContentOverflowShadowVisibility.bind(this));
</del><ins>+ this._visibleContentTreeOutlines = new Set;
</ins><span class="cx">
</span><del>- this._contentTreeOutline = this.createContentTreeOutline(true);
</del><ins>+ this.contentElement.addEventListener("scroll", this._updateContentOverflowShadowVisibility.bind(this));
</ins><span class="cx">
</span><del>- this._filterBar = new WebInspector.FilterBar();
- this._filterBar.addEventListener(WebInspector.FilterBar.Event.FilterDidChange, this._filterDidChange, this);
- this.element.appendChild(this._filterBar.element);
</del><ins>+ this._contentTreeOutline = this.createContentTreeOutline(true);
</ins><span class="cx">
</span><del>- this._bottomOverflowShadowElement = document.createElement("div");
- this._bottomOverflowShadowElement.className = WebInspector.NavigationSidebarPanel.OverflowShadowElementStyleClassName;
- this.element.appendChild(this._bottomOverflowShadowElement);
</del><ins>+ this._filterBar = new WebInspector.FilterBar();
+ this._filterBar.addEventListener(WebInspector.FilterBar.Event.FilterDidChange, this._filterDidChange, this);
+ this.element.appendChild(this._filterBar.element);
</ins><span class="cx">
</span><del>- if (wantsTopOverflowShadow) {
- this._topOverflowShadowElement = document.createElement("div");
- this._topOverflowShadowElement.classList.add(WebInspector.NavigationSidebarPanel.OverflowShadowElementStyleClassName);
- this._topOverflowShadowElement.classList.add(WebInspector.NavigationSidebarPanel.TopOverflowShadowElementStyleClassName);
- this.element.appendChild(this._topOverflowShadowElement);
- }
</del><ins>+ this._bottomOverflowShadowElement = document.createElement("div");
+ this._bottomOverflowShadowElement.className = WebInspector.NavigationSidebarPanel.OverflowShadowElementStyleClassName;
+ this.element.appendChild(this._bottomOverflowShadowElement);
</ins><span class="cx">
</span><del>- window.addEventListener("resize", this._updateContentOverflowShadowVisibility.bind(this));
</del><ins>+ if (wantsTopOverflowShadow) {
+ this._topOverflowShadowElement = document.createElement("div");
+ this._topOverflowShadowElement.classList.add(WebInspector.NavigationSidebarPanel.OverflowShadowElementStyleClassName);
+ this._topOverflowShadowElement.classList.add(WebInspector.NavigationSidebarPanel.TopOverflowShadowElementStyleClassName);
+ this.element.appendChild(this._topOverflowShadowElement);
+ }
</ins><span class="cx">
</span><del>- this._filtersSetting = new WebInspector.Setting(identifier + "-navigation-sidebar-filters", {});
- this._filterBar.filters = this._filtersSetting.value;
</del><ins>+ window.addEventListener("resize", this._updateContentOverflowShadowVisibility.bind(this));
</ins><span class="cx">
</span><del>- this._emptyContentPlaceholderElement = document.createElement("div");
- this._emptyContentPlaceholderElement.className = WebInspector.NavigationSidebarPanel.EmptyContentPlaceholderElementStyleClassName;
</del><ins>+ this._filtersSetting = new WebInspector.Setting(identifier + "-navigation-sidebar-filters", {});
+ this._filterBar.filters = this._filtersSetting.value;
</ins><span class="cx">
</span><del>- this._emptyContentPlaceholderMessageElement = document.createElement("div");
- this._emptyContentPlaceholderMessageElement.className = WebInspector.NavigationSidebarPanel.EmptyContentPlaceholderMessageElementStyleClassName;
- this._emptyContentPlaceholderElement.appendChild(this._emptyContentPlaceholderMessageElement);
</del><ins>+ this._emptyContentPlaceholderElement = document.createElement("div");
+ this._emptyContentPlaceholderElement.className = WebInspector.NavigationSidebarPanel.EmptyContentPlaceholderElementStyleClassName;
</ins><span class="cx">
</span><del>- this._generateStyleRulesIfNeeded();
- this._generateDisclosureTrianglesIfNeeded();
</del><ins>+ this._emptyContentPlaceholderMessageElement = document.createElement("div");
+ this._emptyContentPlaceholderMessageElement.className = WebInspector.NavigationSidebarPanel.EmptyContentPlaceholderMessageElementStyleClassName;
+ this._emptyContentPlaceholderElement.appendChild(this._emptyContentPlaceholderMessageElement);
</ins><span class="cx">
</span><del>- if (autoPruneOldTopLevelResourceTreeElements) {
- WebInspector.Frame.addEventListener(WebInspector.Frame.Event.MainResourceDidChange, this._checkForOldResources, this);
- WebInspector.Frame.addEventListener(WebInspector.Frame.Event.ChildFrameWasRemoved, this._checkForOldResources, this);
- WebInspector.Frame.addEventListener(WebInspector.Frame.Event.ResourceWasRemoved, this._checkForOldResources, this);
</del><ins>+ this._generateStyleRulesIfNeeded();
+ this._generateDisclosureTrianglesIfNeeded();
+
+ if (autoPruneOldTopLevelResourceTreeElements) {
+ WebInspector.Frame.addEventListener(WebInspector.Frame.Event.MainResourceDidChange, this._checkForOldResources, this);
+ WebInspector.Frame.addEventListener(WebInspector.Frame.Event.ChildFrameWasRemoved, this._checkForOldResources, this);
+ WebInspector.Frame.addEventListener(WebInspector.Frame.Event.ResourceWasRemoved, this._checkForOldResources, this);
+ }
</ins><span class="cx"> }
</span><del>-};
</del><span class="cx">
</span><del>-WebInspector.NavigationSidebarPanel.StyleClassName = "navigation";
-WebInspector.NavigationSidebarPanel.OverflowShadowElementStyleClassName = "overflow-shadow";
-WebInspector.NavigationSidebarPanel.TopOverflowShadowElementStyleClassName = "top";
-WebInspector.NavigationSidebarPanel.ContentTreeOutlineElementHiddenStyleClassName = "hidden";
-WebInspector.NavigationSidebarPanel.ContentTreeOutlineElementStyleClassName = "navigation-sidebar-panel-content-tree-outline";
-WebInspector.NavigationSidebarPanel.HideDisclosureButtonsStyleClassName = "hide-disclosure-buttons";
-WebInspector.NavigationSidebarPanel.EmptyContentPlaceholderElementStyleClassName = "empty-content-placeholder";
-WebInspector.NavigationSidebarPanel.EmptyContentPlaceholderMessageElementStyleClassName = "message";
-WebInspector.NavigationSidebarPanel.DisclosureTriangleOpenCanvasIdentifier = "navigation-sidebar-panel-disclosure-triangle-open";
-WebInspector.NavigationSidebarPanel.DisclosureTriangleClosedCanvasIdentifier = "navigation-sidebar-panel-disclosure-triangle-closed";
-WebInspector.NavigationSidebarPanel.DisclosureTriangleNormalCanvasIdentifierSuffix = "-normal";
-WebInspector.NavigationSidebarPanel.DisclosureTriangleSelectedCanvasIdentifierSuffix = "-selected";
-
-WebInspector.NavigationSidebarPanel.prototype = {
- constructor: WebInspector.NavigationSidebarPanel,
- __proto__: WebInspector.SidebarPanel.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get contentTreeOutlineElement()
</span><span class="cx"> {
</span><span class="cx"> return this._contentTreeOutline.element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get contentTreeOutline()
</span><span class="cx"> {
</span><span class="cx"> return this._contentTreeOutline;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set contentTreeOutline(newTreeOutline)
</span><span class="cx"> {
</span><span class="lines">@@ -133,34 +122,34 @@
</span><span class="cx"> this._visibleContentTreeOutlines.add(newTreeOutline);
</span><span class="cx">
</span><span class="cx"> this._updateFilter();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get contentTreeOutlineToAutoPrune()
</span><span class="cx"> {
</span><span class="cx"> return this._contentTreeOutline;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get visibleContentTreeOutlines()
</span><span class="cx"> {
</span><span class="cx"> return this._visibleContentTreeOutlines;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get hasSelectedElement()
</span><span class="cx"> {
</span><span class="cx"> return !!this._contentTreeOutline.selectedTreeElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get filterBar()
</span><span class="cx"> {
</span><span class="cx"> return this._filterBar;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get restoringState()
</span><span class="cx"> {
</span><span class="cx"> return this._restoringState;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- createContentTreeOutline: function(dontHideByDefault, suppressFiltering)
</del><ins>+ createContentTreeOutline(dontHideByDefault, suppressFiltering)
</ins><span class="cx"> {
</span><span class="cx"> var contentTreeOutlineElement = document.createElement("ol");
</span><span class="cx"> contentTreeOutlineElement.className = WebInspector.NavigationSidebarPanel.ContentTreeOutlineElementStyleClassName;
</span><span class="lines">@@ -182,27 +171,27 @@
</span><span class="cx"> this._visibleContentTreeOutlines.add(contentTreeOutline);
</span><span class="cx">
</span><span class="cx"> return contentTreeOutline;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- treeElementForRepresentedObject: function(representedObject)
</del><ins>+ treeElementForRepresentedObject(representedObject)
</ins><span class="cx"> {
</span><span class="cx"> return this._contentTreeOutline.getCachedTreeElement(representedObject);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showDefaultContentView: function()
</del><ins>+ showDefaultContentView()
</ins><span class="cx"> {
</span><span class="cx"> // Implemneted by subclasses if needed to show a content view when no existing tree element is selected.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showContentViewForCurrentSelection: function()
</del><ins>+ showContentViewForCurrentSelection()
</ins><span class="cx"> {
</span><span class="cx"> // Reselect the selected tree element to cause the content view to be shown as well. <rdar://problem/10854727>
</span><span class="cx"> var selectedTreeElement = this._contentTreeOutline.selectedTreeElement;
</span><span class="cx"> if (selectedTreeElement)
</span><span class="cx"> selectedTreeElement.select();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- saveStateToCookie: function(cookie)
</del><ins>+ saveStateToCookie(cookie)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(cookie);
</span><span class="cx">
</span><span class="lines">@@ -226,10 +215,10 @@
</span><span class="cx"> representedObject.saveIdentityToCookie(cookie);
</span><span class="cx"> else
</span><span class="cx"> console.error("Error: TreeElement.representedObject is missing a saveIdentityToCookie implementation. TreeElement.constructor: ", selectedTreeElement.constructor);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // This can be supplemented by subclasses that admit a simpler strategy for static tree elements.
</span><del>- restoreStateFromCookie: function(cookie, relaxedMatchDelay)
</del><ins>+ restoreStateFromCookie(cookie, relaxedMatchDelay)
</ins><span class="cx"> {
</span><span class="cx"> this._pendingViewStateCookie = cookie;
</span><span class="cx"> this._restoringState = true;
</span><span class="lines">@@ -253,9 +242,9 @@
</span><span class="cx"> // If the specific tree element wasn't found, we may need to wait for the resources
</span><span class="cx"> // to be registered. We try one last time (match type only) after an arbitrary amount of timeout.
</span><span class="cx"> this._finalAttemptToRestoreViewStateTimeout = setTimeout(finalAttemptToRestoreViewStateFromCookie.bind(this), relaxedMatchDelay);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showEmptyContentPlaceholder: function(message, hideToolbarItem)
</del><ins>+ showEmptyContentPlaceholder(message, hideToolbarItem)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(message);
</span><span class="cx">
</span><span class="lines">@@ -268,9 +257,9 @@
</span><span class="cx"> this._hideToolbarItemWhenEmpty = hideToolbarItem || false;
</span><span class="cx"> this._updateToolbarItemVisibility();
</span><span class="cx"> this._updateContentOverflowShadowVisibility();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- hideEmptyContentPlaceholder: function()
</del><ins>+ hideEmptyContentPlaceholder()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._emptyContentPlaceholderElement.parentNode)
</span><span class="cx"> return;
</span><span class="lines">@@ -280,9 +269,9 @@
</span><span class="cx"> this._hideToolbarItemWhenEmpty = false;
</span><span class="cx"> this._updateToolbarItemVisibility();
</span><span class="cx"> this._updateContentOverflowShadowVisibility();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- updateEmptyContentPlaceholder: function(message)
</del><ins>+ updateEmptyContentPlaceholder(message)
</ins><span class="cx"> {
</span><span class="cx"> this._updateToolbarItemVisibility();
</span><span class="cx">
</span><span class="lines">@@ -293,35 +282,35 @@
</span><span class="cx"> // There are tree elements, and not all of them are hidden by the filter.
</span><span class="cx"> this.hideEmptyContentPlaceholder();
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- updateFilter: function()
</del><ins>+ updateFilter()
</ins><span class="cx"> {
</span><span class="cx"> this._updateFilter();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- hasCustomFilters: function()
</del><ins>+ hasCustomFilters()
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses if needed.
</span><span class="cx"> return false;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- matchTreeElementAgainstCustomFilters: function(treeElement)
</del><ins>+ matchTreeElementAgainstCustomFilters(treeElement)
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses if needed.
</span><span class="cx"> return true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- matchTreeElementAgainstFilterFunctions: function(treeElement)
</del><ins>+ matchTreeElementAgainstFilterFunctions(treeElement)
</ins><span class="cx"> {
</span><span class="cx"> for (var filterFunction of this._filterFunctions) {
</span><span class="cx"> if (filterFunction(treeElement))
</span><span class="cx"> return true;
</span><span class="cx"> }
</span><span class="cx"> return false;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- applyFiltersToTreeElement: function(treeElement)
</del><ins>+ applyFiltersToTreeElement(treeElement)
</ins><span class="cx"> {
</span><span class="cx"> if (!this._filterBar.hasActiveFilters() && !this.hasCustomFilters()) {
</span><span class="cx"> // No filters, so make everything visible.
</span><span class="lines">@@ -399,9 +388,9 @@
</span><span class="cx">
</span><span class="cx"> // Make this element invisible since it does not match.
</span><span class="cx"> treeElement.hidden = true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- show: function()
</del><ins>+ show()
</ins><span class="cx"> {
</span><span class="cx"> if (!this.parentSidebar)
</span><span class="cx"> return;
</span><span class="lines">@@ -409,9 +398,9 @@
</span><span class="cx"> WebInspector.SidebarPanel.prototype.show.call(this);
</span><span class="cx">
</span><span class="cx"> this.contentTreeOutlineElement.focus();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- shown: function()
</del><ins>+ shown()
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.SidebarPanel.prototype.shown.call(this);
</span><span class="cx">
</span><span class="lines">@@ -420,26 +409,26 @@
</span><span class="cx"> // Force the navigation item to be visible. This makes sure it is
</span><span class="cx"> // always visible when the panel is shown.
</span><span class="cx"> this.toolbarItem.hidden = false;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- hidden: function()
</del><ins>+ hidden()
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.SidebarPanel.prototype.hidden.call(this);
</span><span class="cx">
</span><span class="cx"> this._updateToolbarItemVisibility();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _updateContentOverflowShadowVisibilitySoon: function()
</del><ins>+ _updateContentOverflowShadowVisibilitySoon()
</ins><span class="cx"> {
</span><span class="cx"> if (this._updateContentOverflowShadowVisibilityIdentifier)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._updateContentOverflowShadowVisibilityIdentifier = setTimeout(this._updateContentOverflowShadowVisibility.bind(this), 0);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateContentOverflowShadowVisibility: function()
</del><ins>+ _updateContentOverflowShadowVisibility()
</ins><span class="cx"> {
</span><span class="cx"> delete this._updateContentOverflowShadowVisibilityIdentifier;
</span><span class="cx">
</span><span class="lines">@@ -454,9 +443,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> if (WebInspector.Platform.isLegacyMacOS)
</span><del>- const edgeThreshold = 10;
</del><ins>+ var edgeThreshold = 10;
</ins><span class="cx"> else
</span><del>- const edgeThreshold = 1;
</del><ins>+ var edgeThreshold = 1;
</ins><span class="cx">
</span><span class="cx"> var scrollTop = this.contentElement.scrollTop;
</span><span class="cx">
</span><span class="lines">@@ -466,16 +455,16 @@
</span><span class="cx"> if (this._topOverflowShadowElement)
</span><span class="cx"> this._topOverflowShadowElement.style.opacity = (topCoverage / edgeThreshold).toFixed(1);
</span><span class="cx"> this._bottomOverflowShadowElement.style.opacity = (1 - (bottomCoverage / edgeThreshold)).toFixed(1);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateToolbarItemVisibility: function()
</del><ins>+ _updateToolbarItemVisibility()
</ins><span class="cx"> {
</span><span class="cx"> // Hide the navigation item if requested or auto-hiding and we are not visible and we are empty.
</span><span class="cx"> var shouldHide = ((this._hideToolbarItemWhenEmpty || this._autoHideToolbarItemWhenEmpty) && !this.selected && !this._contentTreeOutline.children.length);
</span><span class="cx"> this.toolbarItem.hidden = shouldHide;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _checkForEmptyFilterResults: function()
</del><ins>+ _checkForEmptyFilterResults()
</ins><span class="cx"> {
</span><span class="cx"> // No tree elements, so don't touch the empty content placeholder.
</span><span class="cx"> if (!this._contentTreeOutline.children.length)
</span><span class="lines">@@ -497,14 +486,14 @@
</span><span class="cx"> // All top level tree elements are hidden, so filtering hid everything. Show a message.
</span><span class="cx"> this.showEmptyContentPlaceholder(WebInspector.UIString("No Filter Results"));
</span><span class="cx"> this._emptyFilterResults = true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _filterDidChange: function()
</del><ins>+ _filterDidChange()
</ins><span class="cx"> {
</span><span class="cx"> this._updateFilter();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateFilter: function()
</del><ins>+ _updateFilter()
</ins><span class="cx"> {
</span><span class="cx"> var selectedTreeElement = this._contentTreeOutline.selectedTreeElement;
</span><span class="cx"> var selectionWasHidden = selectedTreeElement && selectedTreeElement.hidden;
</span><span class="lines">@@ -534,9 +523,9 @@
</span><span class="cx"> if (currentContentView instanceof WebInspector.TimelineRecordingContentView && typeof currentContentView.currentTimelineView.filterUpdated === "function")
</span><span class="cx"> currentContentView.currentTimelineView.filterUpdated();
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _treeElementAddedOrChanged: function(treeElement)
</del><ins>+ _treeElementAddedOrChanged(treeElement)
</ins><span class="cx"> {
</span><span class="cx"> // Don't populate if we don't have any active filters.
</span><span class="cx"> // We only need to populate when a filter needs to reveal.
</span><span class="lines">@@ -554,23 +543,23 @@
</span><span class="cx">
</span><span class="cx"> if (this.selected)
</span><span class="cx"> this._checkElementsForPendingViewStateCookie(treeElement);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _treeElementExpandedOrCollapsed: function(treeElement)
</del><ins>+ _treeElementExpandedOrCollapsed(treeElement)
</ins><span class="cx"> {
</span><span class="cx"> this._updateContentOverflowShadowVisibility();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _generateStyleRulesIfNeeded: function()
</del><ins>+ _generateStyleRulesIfNeeded()
</ins><span class="cx"> {
</span><span class="cx"> if (WebInspector.NavigationSidebarPanel._styleElement)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> WebInspector.NavigationSidebarPanel._styleElement = document.createElement("style");
</span><span class="cx">
</span><del>- const maximumSidebarTreeDepth = 32;
- const baseLeftPadding = 5; // Matches the padding in NavigationSidebarPanel.css for the item class. Keep in sync.
- const depthPadding = 10;
</del><ins>+ var maximumSidebarTreeDepth = 32;
+ var baseLeftPadding = 5; // Matches the padding in NavigationSidebarPanel.css for the item class. Keep in sync.
+ var depthPadding = 10;
</ins><span class="cx">
</span><span class="cx"> var styleText = "";
</span><span class="cx"> var childrenSubstring = "";
</span><span class="lines">@@ -584,9 +573,9 @@
</span><span class="cx"> WebInspector.NavigationSidebarPanel._styleElement.textContent = styleText;
</span><span class="cx">
</span><span class="cx"> document.head.appendChild(WebInspector.NavigationSidebarPanel._styleElement);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _generateDisclosureTrianglesIfNeeded: function()
</del><ins>+ _generateDisclosureTrianglesIfNeeded()
</ins><span class="cx"> {
</span><span class="cx"> if (WebInspector.NavigationSidebarPanel._generatedDisclosureTriangles)
</span><span class="cx"> return;
</span><span class="lines">@@ -625,9 +614,9 @@
</span><span class="cx">
</span><span class="cx"> generateColoredImagesForCSS("Images/DisclosureTriangleSmallOpen.svg", specifications, 13, 13, WebInspector.NavigationSidebarPanel.DisclosureTriangleOpenCanvasIdentifier);
</span><span class="cx"> generateColoredImagesForCSS("Images/DisclosureTriangleSmallClosed.svg", specifications, 13, 13, WebInspector.NavigationSidebarPanel.DisclosureTriangleClosedCanvasIdentifier);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _checkForOldResources: function(event)
</del><ins>+ _checkForOldResources(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this._checkForOldResourcesTimeoutIdentifier)
</span><span class="cx"> return;
</span><span class="lines">@@ -657,17 +646,17 @@
</span><span class="cx">
</span><span class="cx"> // Check on a delay to coalesce multiple calls to _checkForOldResources.
</span><span class="cx"> this._checkForOldResourcesTimeoutIdentifier = setTimeout(delayedWork.bind(this), 0);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _isTreeElementWithoutRepresentedObject: function(treeElement)
</del><ins>+ _isTreeElementWithoutRepresentedObject(treeElement)
</ins><span class="cx"> {
</span><span class="cx"> return treeElement instanceof WebInspector.FolderTreeElement
</span><span class="cx"> || treeElement instanceof WebInspector.DatabaseHostTreeElement
</span><span class="cx"> || typeof treeElement.representedObject === "string"
</span><span class="cx"> || treeElement.representedObject instanceof String;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _checkOutlinesForPendingViewStateCookie: function(matchTypeOnly)
</del><ins>+ _checkOutlinesForPendingViewStateCookie(matchTypeOnly)
</ins><span class="cx"> {
</span><span class="cx"> if (!this._pendingViewStateCookie)
</span><span class="cx"> return;
</span><span class="lines">@@ -682,9 +671,9 @@
</span><span class="cx"> });
</span><span class="cx">
</span><span class="cx"> return this._checkElementsForPendingViewStateCookie(visibleTreeElements, matchTypeOnly);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _checkElementsForPendingViewStateCookie: function(treeElements, matchTypeOnly)
</del><ins>+ _checkElementsForPendingViewStateCookie(treeElements, matchTypeOnly)
</ins><span class="cx"> {
</span><span class="cx"> if (!this._pendingViewStateCookie)
</span><span class="cx"> return;
</span><span class="lines">@@ -746,3 +735,15 @@
</span><span class="cx"> }
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.NavigationSidebarPanel.OverflowShadowElementStyleClassName = "overflow-shadow";
+WebInspector.NavigationSidebarPanel.TopOverflowShadowElementStyleClassName = "top";
+WebInspector.NavigationSidebarPanel.ContentTreeOutlineElementHiddenStyleClassName = "hidden";
+WebInspector.NavigationSidebarPanel.ContentTreeOutlineElementStyleClassName = "navigation-sidebar-panel-content-tree-outline";
+WebInspector.NavigationSidebarPanel.HideDisclosureButtonsStyleClassName = "hide-disclosure-buttons";
+WebInspector.NavigationSidebarPanel.EmptyContentPlaceholderElementStyleClassName = "empty-content-placeholder";
+WebInspector.NavigationSidebarPanel.EmptyContentPlaceholderMessageElementStyleClassName = "message";
+WebInspector.NavigationSidebarPanel.DisclosureTriangleOpenCanvasIdentifier = "navigation-sidebar-panel-disclosure-triangle-open";
+WebInspector.NavigationSidebarPanel.DisclosureTriangleClosedCanvasIdentifier = "navigation-sidebar-panel-disclosure-triangle-closed";
+WebInspector.NavigationSidebarPanel.DisclosureTriangleNormalCanvasIdentifierSuffix = "-normal";
+WebInspector.NavigationSidebarPanel.DisclosureTriangleSelectedCanvasIdentifierSuffix = "-selected";
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsProbeDetailsSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ProbeDetailsSidebarPanel.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ProbeDetailsSidebarPanel.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ProbeDetailsSidebarPanel.js 2015-03-26 23:37:55 UTC (rev 182041)
</span><span class="lines">@@ -1,6 +1,6 @@
</span><span class="cx"> /*
</span><ins>+ * Copyright (C) 2014-2015 Apple Inc. All rights reserved.
</ins><span class="cx"> * Copyright (C) 2013 University of Washington. All rights reserved.
</span><del>- * Copyright (C) 2014 Apple Inc. All rights reserved.
</del><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">@@ -24,33 +24,29 @@
</span><span class="cx"> * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ProbeDetailsSidebarPanel = function()
</del><ins>+WebInspector.ProbeDetailsSidebarPanel = class ProbeDetailsSidebarPanel extends WebInspector.DetailsSidebarPanel
</ins><span class="cx"> {
</span><del>- WebInspector.DetailsSidebarPanel.call(this, "probe", WebInspector.UIString("Probes"), WebInspector.UIString("Probes"), "Images/NavigationItemProbes.svg", "6");
</del><ins>+ constructor()
+ {
+ super("probe", WebInspector.UIString("Probes"), WebInspector.UIString("Probes"), "Images/NavigationItemProbes.svg", "6");
</ins><span class="cx">
</span><del>- WebInspector.probeManager.addEventListener(WebInspector.ProbeManager.Event.ProbeSetAdded, this._probeSetAdded, this);
- WebInspector.probeManager.addEventListener(WebInspector.ProbeManager.Event.ProbeSetRemoved, this._probeSetRemoved, this);
</del><ins>+ WebInspector.probeManager.addEventListener(WebInspector.ProbeManager.Event.ProbeSetAdded, this._probeSetAdded, this);
+ WebInspector.probeManager.addEventListener(WebInspector.ProbeManager.Event.ProbeSetRemoved, this._probeSetRemoved, this);
</ins><span class="cx">
</span><del>- this._probeSetSections = new Map;
- this._inspectedProbeSets = [];
</del><ins>+ this._probeSetSections = new Map;
+ this._inspectedProbeSets = [];
</ins><span class="cx">
</span><del>- // Initialize sidebar sections for probe sets that already exist.
- for (var probeSet of WebInspector.probeManager.probeSets)
- this._probeSetAdded(probeSet);
-};
</del><ins>+ // Initialize sidebar sections for probe sets that already exist.
+ for (var probeSet of WebInspector.probeManager.probeSets)
+ this._probeSetAdded(probeSet);
+ }
</ins><span class="cx">
</span><del>-WebInspector.ProbeDetailsSidebarPanel.OffsetSectionsStyleClassName = "offset-sections";
-
-WebInspector.ProbeDetailsSidebarPanel.prototype = {
- constructor: WebInspector.ProbeDetailsSidebarPanel,
- __proto__: WebInspector.DetailsSidebarPanel.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get inspectedProbeSets()
</span><span class="cx"> {
</span><span class="cx"> return this._inspectedProbeSets.slice();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set inspectedProbeSets(newProbeSets)
</span><span class="cx"> {
</span><span class="lines">@@ -65,9 +61,9 @@
</span><span class="cx"> var shownSection = this._probeSetSections.get(probeSet);
</span><span class="cx"> this.contentElement.appendChild(shownSection.element);
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- inspect: function(objects)
</del><ins>+ inspect(objects)
</ins><span class="cx"> {
</span><span class="cx"> if (!(objects instanceof Array))
</span><span class="cx"> objects = [objects];
</span><span class="lines">@@ -93,11 +89,11 @@
</span><span class="cx"> this.inspectedProbeSets = inspectedProbeSets;
</span><span class="cx">
</span><span class="cx"> return !!this._inspectedProbeSets.length;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _probeSetAdded: function(probeSetOrEvent)
</del><ins>+ _probeSetAdded(probeSetOrEvent)
</ins><span class="cx"> {
</span><span class="cx"> var probeSet;
</span><span class="cx"> if (probeSetOrEvent instanceof WebInspector.ProbeSet)
</span><span class="lines">@@ -108,10 +104,10 @@
</span><span class="cx">
</span><span class="cx"> var newSection = new WebInspector.ProbeSetDetailsSection(probeSet);
</span><span class="cx"> this._probeSetSections.set(probeSet, newSection);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx">
</span><del>- _probeSetRemoved: function(event)
</del><ins>+ _probeSetRemoved(event)
</ins><span class="cx"> {
</span><span class="cx"> var probeSet = event.data.probeSet;
</span><span class="cx"> console.assert(this._probeSetSections.has(probeSet), "Removed probe group ", probeSet, " doesn't have a sidebar.");
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsResourceDetailsSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ResourceDetailsSidebarPanel.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ResourceDetailsSidebarPanel.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ResourceDetailsSidebarPanel.js 2015-03-26 23:37:55 UTC (rev 182041)
</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, 2015 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,99 +23,95 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ResourceDetailsSidebarPanel = function()
</del><ins>+WebInspector.ResourceDetailsSidebarPanel = class ResourceDetailsSidebarPanel extends WebInspector.DetailsSidebarPanel
</ins><span class="cx"> {
</span><del>- WebInspector.DetailsSidebarPanel.call(this, "resource-details", WebInspector.UIString("Resource"), WebInspector.UIString("Resource"), "Images/NavigationItemFile.svg", "1");
</del><ins>+ constructor()
+ {
+ super("resource-details", WebInspector.UIString("Resource"), WebInspector.UIString("Resource"), "Images/NavigationItemFile.svg", "1");
</ins><span class="cx">
</span><del>- this.element.classList.add(WebInspector.ResourceDetailsSidebarPanel.StyleClassName);
</del><ins>+ this.element.classList.add("resource");
</ins><span class="cx">
</span><del>- this._resource = null;
</del><ins>+ this._resource = null;
</ins><span class="cx">
</span><del>- this._typeMIMETypeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("MIME Type"));
- this._typeResourceTypeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Resource Type"));
</del><ins>+ this._typeMIMETypeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("MIME Type"));
+ this._typeResourceTypeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Resource Type"));
</ins><span class="cx">
</span><del>- this._typeSection = new WebInspector.DetailsSection("resource-type", WebInspector.UIString("Type"));
- this._typeSection.groups = [new WebInspector.DetailsSectionGroup([this._typeMIMETypeRow, this._typeResourceTypeRow])];
</del><ins>+ this._typeSection = new WebInspector.DetailsSection("resource-type", WebInspector.UIString("Type"));
+ this._typeSection.groups = [new WebInspector.DetailsSectionGroup([this._typeMIMETypeRow, this._typeResourceTypeRow])];
</ins><span class="cx">
</span><del>- this._locationFullURLRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Full URL"));
- this._locationSchemeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Scheme"));
- this._locationHostRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Host"));
- this._locationPortRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Port"));
- this._locationPathRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Path"));
- this._locationQueryStringRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Query String"));
- this._locationFragmentRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Fragment"));
- this._locationFilenameRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Filename"));
- this._initiatorRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Initiator"));
</del><ins>+ this._locationFullURLRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Full URL"));
+ this._locationSchemeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Scheme"));
+ this._locationHostRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Host"));
+ this._locationPortRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Port"));
+ this._locationPathRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Path"));
+ this._locationQueryStringRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Query String"));
+ this._locationFragmentRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Fragment"));
+ this._locationFilenameRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Filename"));
+ this._initiatorRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Initiator"));
</ins><span class="cx">
</span><del>- var firstGroup = [this._locationFullURLRow];
- var secondGroup = [this._locationSchemeRow, this._locationHostRow, this._locationPortRow, this._locationPathRow,
- this._locationQueryStringRow, this._locationFragmentRow, this._locationFilenameRow];
- var thirdGroup = [this._initiatorRow];
</del><ins>+ var firstGroup = [this._locationFullURLRow];
+ var secondGroup = [this._locationSchemeRow, this._locationHostRow, this._locationPortRow, this._locationPathRow,
+ this._locationQueryStringRow, this._locationFragmentRow, this._locationFilenameRow];
+ var thirdGroup = [this._initiatorRow];
</ins><span class="cx">
</span><del>- this._fullURLGroup = new WebInspector.DetailsSectionGroup(firstGroup);
- this._locationURLComponentsGroup = new WebInspector.DetailsSectionGroup(secondGroup);
- this._initiatorGroup = new WebInspector.DetailsSectionGroup(thirdGroup);
</del><ins>+ this._fullURLGroup = new WebInspector.DetailsSectionGroup(firstGroup);
+ this._locationURLComponentsGroup = new WebInspector.DetailsSectionGroup(secondGroup);
+ this._initiatorGroup = new WebInspector.DetailsSectionGroup(thirdGroup);
</ins><span class="cx">
</span><del>- this._locationSection = new WebInspector.DetailsSection("resource-location", WebInspector.UIString("Location"), [this._fullURLGroup, this._locationURLComponentsGroup, this._initiatorGroup]);
</del><ins>+ this._locationSection = new WebInspector.DetailsSection("resource-location", WebInspector.UIString("Location"), [this._fullURLGroup, this._locationURLComponentsGroup, this._initiatorGroup]);
</ins><span class="cx">
</span><del>- this._queryParametersRow = new WebInspector.DetailsSectionDataGridRow(null, WebInspector.UIString("No Query Parameters"));
- this._queryParametersSection = new WebInspector.DetailsSection("resource-query-parameters", WebInspector.UIString("Query Parameters"));
- this._queryParametersSection.groups = [new WebInspector.DetailsSectionGroup([this._queryParametersRow])];
</del><ins>+ this._queryParametersRow = new WebInspector.DetailsSectionDataGridRow(null, WebInspector.UIString("No Query Parameters"));
+ this._queryParametersSection = new WebInspector.DetailsSection("resource-query-parameters", WebInspector.UIString("Query Parameters"));
+ this._queryParametersSection.groups = [new WebInspector.DetailsSectionGroup([this._queryParametersRow])];
</ins><span class="cx">
</span><del>- this._requestDataSection = new WebInspector.DetailsSection("resource-request-data", WebInspector.UIString("Request Data"));
</del><ins>+ this._requestDataSection = new WebInspector.DetailsSection("resource-request-data", WebInspector.UIString("Request Data"));
</ins><span class="cx">
</span><del>- this._requestMethodRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Method"));
- this._cachedRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Cached"));
</del><ins>+ this._requestMethodRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Method"));
+ this._cachedRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Cached"));
</ins><span class="cx">
</span><del>- this._statusTextRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Status"));
- this._statusCodeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Code"));
</del><ins>+ this._statusTextRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Status"));
+ this._statusCodeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Code"));
</ins><span class="cx">
</span><del>- this._encodedSizeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Encoded"));
- this._decodedSizeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Decoded"));
- this._transferSizeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Transfered"));
</del><ins>+ this._encodedSizeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Encoded"));
+ this._decodedSizeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Decoded"));
+ this._transferSizeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Transfered"));
</ins><span class="cx">
</span><del>- this._compressedRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Compressed"));
- this._compressionRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Compression"));
</del><ins>+ this._compressedRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Compressed"));
+ this._compressionRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Compression"));
</ins><span class="cx">
</span><del>- var requestGroup = new WebInspector.DetailsSectionGroup([this._requestMethodRow, this._cachedRow]);
- var statusGroup = new WebInspector.DetailsSectionGroup([this._statusTextRow, this._statusCodeRow]);
- var sizeGroup = new WebInspector.DetailsSectionGroup([this._encodedSizeRow, this._decodedSizeRow, this._transferSizeRow]);
- var compressionGroup = new WebInspector.DetailsSectionGroup([this._compressedRow, this._compressionRow]);
</del><ins>+ var requestGroup = new WebInspector.DetailsSectionGroup([this._requestMethodRow, this._cachedRow]);
+ var statusGroup = new WebInspector.DetailsSectionGroup([this._statusTextRow, this._statusCodeRow]);
+ var sizeGroup = new WebInspector.DetailsSectionGroup([this._encodedSizeRow, this._decodedSizeRow, this._transferSizeRow]);
+ var compressionGroup = new WebInspector.DetailsSectionGroup([this._compressedRow, this._compressionRow]);
</ins><span class="cx">
</span><del>- this._requestAndResponseSection = new WebInspector.DetailsSection("resource-request-response", WebInspector.UIString("Request & Response"), [requestGroup, statusGroup, sizeGroup, compressionGroup]);
</del><ins>+ this._requestAndResponseSection = new WebInspector.DetailsSection("resource-request-response", WebInspector.UIString("Request & Response"), [requestGroup, statusGroup, sizeGroup, compressionGroup]);
</ins><span class="cx">
</span><del>- this._requestHeadersRow = new WebInspector.DetailsSectionDataGridRow(null, WebInspector.UIString("No Request Headers"));
- this._requestHeadersSection = new WebInspector.DetailsSection("resource-request-headers", WebInspector.UIString("Request Headers"));
- this._requestHeadersSection.groups = [new WebInspector.DetailsSectionGroup([this._requestHeadersRow])];
</del><ins>+ this._requestHeadersRow = new WebInspector.DetailsSectionDataGridRow(null, WebInspector.UIString("No Request Headers"));
+ this._requestHeadersSection = new WebInspector.DetailsSection("resource-request-headers", WebInspector.UIString("Request Headers"));
+ this._requestHeadersSection.groups = [new WebInspector.DetailsSectionGroup([this._requestHeadersRow])];
</ins><span class="cx">
</span><del>- this._responseHeadersRow = new WebInspector.DetailsSectionDataGridRow(null, WebInspector.UIString("No Response Headers"));
- this._responseHeadersSection = new WebInspector.DetailsSection("resource-response-headers", WebInspector.UIString("Response Headers"));
- this._responseHeadersSection.groups = [new WebInspector.DetailsSectionGroup([this._responseHeadersRow])];
</del><ins>+ this._responseHeadersRow = new WebInspector.DetailsSectionDataGridRow(null, WebInspector.UIString("No Response Headers"));
+ this._responseHeadersSection = new WebInspector.DetailsSection("resource-response-headers", WebInspector.UIString("Response Headers"));
+ this._responseHeadersSection.groups = [new WebInspector.DetailsSectionGroup([this._responseHeadersRow])];
</ins><span class="cx">
</span><del>- // Rows for the "Image Size" section.
- this._imageWidthRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Width"));
- this._imageHeightRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Height"));
</del><ins>+ // Rows for the "Image Size" section.
+ this._imageWidthRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Width"));
+ this._imageHeightRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Height"));
</ins><span class="cx">
</span><del>- // "Image Size" section where we display intrinsic metrics for image resources.
- this._imageSizeSection = new WebInspector.DetailsSection("resource-type", WebInspector.UIString("Image Size"));
- this._imageSizeSection.groups = [new WebInspector.DetailsSectionGroup([this._imageWidthRow, this._imageHeightRow])];
</del><ins>+ // "Image Size" section where we display intrinsic metrics for image resources.
+ this._imageSizeSection = new WebInspector.DetailsSection("resource-type", WebInspector.UIString("Image Size"));
+ this._imageSizeSection.groups = [new WebInspector.DetailsSectionGroup([this._imageWidthRow, this._imageHeightRow])];
</ins><span class="cx">
</span><del>- this.contentElement.appendChild(this._typeSection.element);
- this.contentElement.appendChild(this._locationSection.element);
- this.contentElement.appendChild(this._requestAndResponseSection.element);
- this.contentElement.appendChild(this._requestHeadersSection.element);
- this.contentElement.appendChild(this._responseHeadersSection.element);
-};
</del><ins>+ this.contentElement.appendChild(this._typeSection.element);
+ this.contentElement.appendChild(this._locationSection.element);
+ this.contentElement.appendChild(this._requestAndResponseSection.element);
+ this.contentElement.appendChild(this._requestHeadersSection.element);
+ this.contentElement.appendChild(this._responseHeadersSection.element);
+ }
</ins><span class="cx">
</span><del>-WebInspector.ResourceDetailsSidebarPanel.StyleClassName = "resource";
-
-WebInspector.ResourceDetailsSidebarPanel.prototype = {
- constructor: WebInspector.ResourceDetailsSidebarPanel,
- __proto__: WebInspector.DetailsSidebarPanel.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><del>- inspect: function(objects)
</del><ins>+ inspect(objects)
</ins><span class="cx"> {
</span><span class="cx"> // Convert to a single item array if needed.
</span><span class="cx"> if (!(objects instanceof Array))
</span><span class="lines">@@ -139,12 +135,12 @@
</span><span class="cx"> this.resource = resourceToInspect;
</span><span class="cx">
</span><span class="cx"> return !!this._resource;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get resource()
</span><span class="cx"> {
</span><span class="cx"> return this._resource;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set resource(resource)
</span><span class="cx"> {
</span><span class="lines">@@ -176,9 +172,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> this.needsRefresh();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- refresh: function()
</del><ins>+ refresh()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._resource)
</span><span class="cx"> return;
</span><span class="lines">@@ -192,11 +188,11 @@
</span><span class="cx"> this._refreshRequestHeaders();
</span><span class="cx"> this._refreshImageSizeSection();
</span><span class="cx"> this._refreshRequestDataSection();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _refreshURL: function()
</del><ins>+ _refreshURL()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._resource)
</span><span class="cx"> return;
</span><span class="lines">@@ -238,25 +234,25 @@
</span><span class="cx"> if (queryParametersSectionElement.parentNode)
</span><span class="cx"> queryParametersSectionElement.parentNode.removeChild(queryParametersSectionElement);
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshResourceType: function()
</del><ins>+ _refreshResourceType()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._resource)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._typeResourceTypeRow.value = WebInspector.Resource.displayNameForType(this._resource.type);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshMIMEType: function()
</del><ins>+ _refreshMIMEType()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._resource)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._typeMIMETypeRow.value = this._resource.mimeType;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshRequestAndResponse: function()
</del><ins>+ _refreshRequestAndResponse()
</ins><span class="cx"> {
</span><span class="cx"> var resource = this._resource;
</span><span class="cx"> if (!resource)
</span><span class="lines">@@ -264,7 +260,7 @@
</span><span class="cx">
</span><span class="cx"> // If we don't have a value, we set an em-dash to keep the row from hiding.
</span><span class="cx"> // This keeps the UI from shifting around as data comes in.
</span><del>- const emDash = "\u2014";
</del><ins>+ var emDash = "\u2014";
</ins><span class="cx">
</span><span class="cx"> this._requestMethodRow.value = resource.requestMethod || emDash;
</span><span class="cx">
</span><span class="lines">@@ -275,23 +271,23 @@
</span><span class="cx">
</span><span class="cx"> this._refreshResponseHeaders();
</span><span class="cx"> this._refreshCompressed();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _valueForSize: function(size)
</del><ins>+ _valueForSize(size)
</ins><span class="cx"> {
</span><span class="cx"> // If we don't have a value, we set an em-dash to keep the row from hiding.
</span><span class="cx"> // This keeps the UI from shifting around as data comes in.
</span><del>- const emDash = "\u2014";
</del><ins>+ var emDash = "\u2014";
</ins><span class="cx"> return size > 0 ? Number.bytesToString(size) : emDash;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshCompressed: function()
</del><ins>+ _refreshCompressed()
</ins><span class="cx"> {
</span><span class="cx"> this._compressedRow.value = this._resource.compressed ? WebInspector.UIString("Yes") : WebInspector.UIString("No");
</span><span class="cx"> this._compressionRow.value = this._resource.compressed ? WebInspector.UIString("%.2f\u00d7").format(this._resource.size / this._resource.encodedSize) : null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshDecodedSize: function()
</del><ins>+ _refreshDecodedSize()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._resource)
</span><span class="cx"> return;
</span><span class="lines">@@ -300,9 +296,9 @@
</span><span class="cx"> this._decodedSizeRow.value = this._valueForSize(this._resource.size);
</span><span class="cx">
</span><span class="cx"> this._refreshCompressed();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshTransferSize: function()
</del><ins>+ _refreshTransferSize()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._resource)
</span><span class="cx"> return;
</span><span class="lines">@@ -311,25 +307,25 @@
</span><span class="cx"> this._transferSizeRow.value = this._valueForSize(this._resource.transferSize);
</span><span class="cx">
</span><span class="cx"> this._refreshCompressed();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshRequestHeaders: function()
</del><ins>+ _refreshRequestHeaders()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._resource)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._requestHeadersRow.dataGrid = this._createNameValueDataGrid(this._resource.requestHeaders);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshResponseHeaders: function()
</del><ins>+ _refreshResponseHeaders()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._resource)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._responseHeadersRow.dataGrid = this._createNameValueDataGrid(this._resource.responseHeaders);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _createNameValueDataGrid: function(data)
</del><ins>+ _createNameValueDataGrid(data)
</ins><span class="cx"> {
</span><span class="cx"> if (!data || data instanceof Array ? !data.length : isEmptyObject(data))
</span><span class="cx"> return null;
</span><span class="lines">@@ -345,7 +341,6 @@
</span><span class="cx"> console.assert(!nodeValue.value || typeof nodeValue.value === "string");
</span><span class="cx">
</span><span class="cx"> var node = new WebInspector.DataGridNode({name: nodeValue.name, value: nodeValue.value || ""}, false);
</span><del>- node.selectable = true;
</del><span class="cx"> dataGrid.appendChild(node);
</span><span class="cx"> }
</span><span class="cx">
</span><span class="lines">@@ -374,9 +369,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> return dataGrid;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshImageSizeSection: function()
</del><ins>+ _refreshImageSizeSection()
</ins><span class="cx"> {
</span><span class="cx"> var resource = this._resource;
</span><span class="cx">
</span><span class="lines">@@ -399,14 +394,14 @@
</span><span class="cx"> this._imageWidthRow.value = WebInspector.UIString("%fpx").format(size.width);
</span><span class="cx"> this._imageHeightRow.value = WebInspector.UIString("%fpx").format(size.height);
</span><span class="cx"> }.bind(this));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _goToRequestDataClicked: function()
</del><ins>+ _goToRequestDataClicked()
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.resourceSidebarPanel.showResourceRequest(this._resource);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _refreshRequestDataSection: function()
</del><ins>+ _refreshRequestDataSection()
</ins><span class="cx"> {
</span><span class="cx"> var resource = this._resource;
</span><span class="cx">
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsResourceSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ResourceSidebarPanel.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ResourceSidebarPanel.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ResourceSidebarPanel.js 2015-03-26 23:37:55 UTC (rev 182041)
</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, 2015 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,86 +23,86 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ResourceSidebarPanel = function() {
- WebInspector.NavigationSidebarPanel.call(this, "resource", WebInspector.UIString("Resources"), "Images/NavigationItemStorage.svg", "1", true, false, true);
</del><ins>+WebInspector.ResourceSidebarPanel = class ResourceSidebarPanel extends WebInspector.NavigationSidebarPanel
+{
+ constructor()
+ {
+ super("resource", WebInspector.UIString("Resources"), "Images/NavigationItemStorage.svg", "1", true, false, true);
</ins><span class="cx">
</span><del>- var searchElement = document.createElement("div");
- searchElement.classList.add("search-bar");
- this.element.appendChild(searchElement);
</del><ins>+ var searchElement = document.createElement("div");
+ searchElement.classList.add("search-bar");
+ this.element.appendChild(searchElement);
</ins><span class="cx">
</span><del>- this._inputElement = document.createElement("input");
- this._inputElement.type = "search";
- this._inputElement.spellcheck = false;
- this._inputElement.addEventListener("search", this._searchFieldChanged.bind(this));
- this._inputElement.addEventListener("input", this._searchFieldInput.bind(this));
- this._inputElement.setAttribute("results", 5);
- this._inputElement.setAttribute("autosave", "inspector-search");
- this._inputElement.setAttribute("placeholder", WebInspector.UIString("Search Resource Content"));
- searchElement.appendChild(this._inputElement);
</del><ins>+ this._inputElement = document.createElement("input");
+ this._inputElement.type = "search";
+ this._inputElement.spellcheck = false;
+ this._inputElement.addEventListener("search", this._searchFieldChanged.bind(this));
+ this._inputElement.addEventListener("input", this._searchFieldInput.bind(this));
+ this._inputElement.setAttribute("results", 5);
+ this._inputElement.setAttribute("autosave", "inspector-search");
+ this._inputElement.setAttribute("placeholder", WebInspector.UIString("Search Resource Content"));
+ searchElement.appendChild(this._inputElement);
</ins><span class="cx">
</span><del>- this.filterBar.placeholder = WebInspector.UIString("Filter Resource List");
</del><ins>+ this.filterBar.placeholder = WebInspector.UIString("Filter Resource List");
</ins><span class="cx">
</span><del>- this._waitingForInitialMainFrame = true;
- this._lastSearchedPageSetting = new WebInspector.Setting("last-searched-page", null);
</del><ins>+ this._waitingForInitialMainFrame = true;
+ this._lastSearchedPageSetting = new WebInspector.Setting("last-searched-page", null);
</ins><span class="cx">
</span><del>- this._searchQuerySetting = new WebInspector.Setting("search-sidebar-query", "");
- this._inputElement.value = this._searchQuerySetting.value;
</del><ins>+ this._searchQuerySetting = new WebInspector.Setting("search-sidebar-query", "");
+ this._inputElement.value = this._searchQuerySetting.value;
</ins><span class="cx">
</span><del>- this._searchKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.CommandOrControl | WebInspector.KeyboardShortcut.Modifier.Shift, "F", this._focusSearchField.bind(this));
</del><ins>+ this._searchKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.CommandOrControl | WebInspector.KeyboardShortcut.Modifier.Shift, "F", this._focusSearchField.bind(this));
</ins><span class="cx">
</span><del>- this._localStorageRootTreeElement = null;
- this._sessionStorageRootTreeElement = null;
</del><ins>+ this._localStorageRootTreeElement = null;
+ this._sessionStorageRootTreeElement = null;
</ins><span class="cx">
</span><del>- this._databaseRootTreeElement = null;
- this._databaseHostTreeElementMap = {};
</del><ins>+ this._databaseRootTreeElement = null;
+ this._databaseHostTreeElementMap = {};
</ins><span class="cx">
</span><del>- this._indexedDatabaseRootTreeElement = null;
- this._indexedDatabaseHostTreeElementMap = {};
</del><ins>+ this._indexedDatabaseRootTreeElement = null;
+ this._indexedDatabaseHostTreeElementMap = {};
</ins><span class="cx">
</span><del>- this._cookieStorageRootTreeElement = null;
</del><ins>+ this._cookieStorageRootTreeElement = null;
</ins><span class="cx">
</span><del>- this._applicationCacheRootTreeElement = null;
- this._applicationCacheURLTreeElementMap = {};
</del><ins>+ this._applicationCacheRootTreeElement = null;
+ this._applicationCacheURLTreeElementMap = {};
</ins><span class="cx">
</span><del>- WebInspector.storageManager.addEventListener(WebInspector.StorageManager.Event.CookieStorageObjectWasAdded, this._cookieStorageObjectWasAdded, this);
- WebInspector.storageManager.addEventListener(WebInspector.StorageManager.Event.DOMStorageObjectWasAdded, this._domStorageObjectWasAdded, this);
- WebInspector.storageManager.addEventListener(WebInspector.StorageManager.Event.DOMStorageObjectWasInspected, this._domStorageObjectWasInspected, this);
- WebInspector.storageManager.addEventListener(WebInspector.StorageManager.Event.DatabaseWasAdded, this._databaseWasAdded, this);
- WebInspector.storageManager.addEventListener(WebInspector.StorageManager.Event.DatabaseWasInspected, this._databaseWasInspected, this);
- WebInspector.storageManager.addEventListener(WebInspector.StorageManager.Event.IndexedDatabaseWasAdded, this._indexedDatabaseWasAdded, this);
- WebInspector.storageManager.addEventListener(WebInspector.StorageManager.Event.Cleared, this._storageCleared, this);
</del><ins>+ WebInspector.storageManager.addEventListener(WebInspector.StorageManager.Event.CookieStorageObjectWasAdded, this._cookieStorageObjectWasAdded, this);
+ WebInspector.storageManager.addEventListener(WebInspector.StorageManager.Event.DOMStorageObjectWasAdded, this._domStorageObjectWasAdded, this);
+ WebInspector.storageManager.addEventListener(WebInspector.StorageManager.Event.DOMStorageObjectWasInspected, this._domStorageObjectWasInspected, this);
+ WebInspector.storageManager.addEventListener(WebInspector.StorageManager.Event.DatabaseWasAdded, this._databaseWasAdded, this);
+ WebInspector.storageManager.addEventListener(WebInspector.StorageManager.Event.DatabaseWasInspected, this._databaseWasInspected, this);
+ WebInspector.storageManager.addEventListener(WebInspector.StorageManager.Event.IndexedDatabaseWasAdded, this._indexedDatabaseWasAdded, this);
+ WebInspector.storageManager.addEventListener(WebInspector.StorageManager.Event.Cleared, this._storageCleared, this);
</ins><span class="cx">
</span><del>- WebInspector.applicationCacheManager.addEventListener(WebInspector.ApplicationCacheManager.Event.FrameManifestAdded, this._frameManifestAdded, this);
- WebInspector.applicationCacheManager.addEventListener(WebInspector.ApplicationCacheManager.Event.FrameManifestRemoved, this._frameManifestRemoved, this);
</del><ins>+ WebInspector.applicationCacheManager.addEventListener(WebInspector.ApplicationCacheManager.Event.FrameManifestAdded, this._frameManifestAdded, this);
+ WebInspector.applicationCacheManager.addEventListener(WebInspector.ApplicationCacheManager.Event.FrameManifestRemoved, this._frameManifestRemoved, this);
</ins><span class="cx">
</span><del>- WebInspector.frameResourceManager.addEventListener(WebInspector.FrameResourceManager.Event.MainFrameDidChange, this._mainFrameDidChange, this);
- WebInspector.frameResourceManager.addEventListener(WebInspector.FrameResourceManager.Event.FrameWasAdded, this._frameWasAdded, this);
</del><ins>+ WebInspector.frameResourceManager.addEventListener(WebInspector.FrameResourceManager.Event.MainFrameDidChange, this._mainFrameDidChange, this);
+ WebInspector.frameResourceManager.addEventListener(WebInspector.FrameResourceManager.Event.FrameWasAdded, this._frameWasAdded, this);
</ins><span class="cx">
</span><del>- WebInspector.domTreeManager.addEventListener(WebInspector.DOMTreeManager.Event.DOMNodeWasInspected, this._domNodeWasInspected, this);
</del><ins>+ WebInspector.domTreeManager.addEventListener(WebInspector.DOMTreeManager.Event.DOMNodeWasInspected, this._domNodeWasInspected, this);
</ins><span class="cx">
</span><del>- WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.ScriptAdded, this._scriptWasAdded, this);
- WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.ScriptsCleared, this._scriptsCleared, this);
</del><ins>+ WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.ScriptAdded, this._scriptWasAdded, this);
+ WebInspector.debuggerManager.addEventListener(WebInspector.DebuggerManager.Event.ScriptsCleared, this._scriptsCleared, this);
</ins><span class="cx">
</span><del>- WebInspector.notifications.addEventListener(WebInspector.Notification.ExtraDomainsActivated, this._extraDomainsActivated, this);
</del><ins>+ WebInspector.notifications.addEventListener(WebInspector.Notification.ExtraDomainsActivated, this._extraDomainsActivated, this);
</ins><span class="cx">
</span><del>- this._resourcesContentTreeOutline = this.contentTreeOutline;
- this._searchContentTreeOutline = this.createContentTreeOutline();
</del><ins>+ this._resourcesContentTreeOutline = this.contentTreeOutline;
+ this._searchContentTreeOutline = this.createContentTreeOutline();
</ins><span class="cx">
</span><del>- this._resourcesContentTreeOutline.onselect = this._treeElementSelected.bind(this);
- this._searchContentTreeOutline.onselect = this._treeElementSelected.bind(this);
</del><ins>+ this._resourcesContentTreeOutline.onselect = this._treeElementSelected.bind(this);
+ this._searchContentTreeOutline.onselect = this._treeElementSelected.bind(this);
</ins><span class="cx">
</span><del>- this._resourcesContentTreeOutline.includeSourceMapResourceChildren = true;
</del><ins>+ this._resourcesContentTreeOutline.includeSourceMapResourceChildren = true;
</ins><span class="cx">
</span><del>- if (WebInspector.debuggableType === WebInspector.DebuggableType.JavaScript)
- this._resourcesContentTreeOutline.element.classList.add(WebInspector.NavigationSidebarPanel.HideDisclosureButtonsStyleClassName);
-};
</del><ins>+ if (WebInspector.debuggableType === WebInspector.DebuggableType.JavaScript)
+ this._resourcesContentTreeOutline.element.classList.add(WebInspector.NavigationSidebarPanel.HideDisclosureButtonsStyleClassName);
+ }
</ins><span class="cx">
</span><del>-WebInspector.ResourceSidebarPanel.prototype = {
- constructor: WebInspector.ResourceSidebarPanel,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><del>- showDefaultContentView: function()
</del><ins>+ showDefaultContentView()
</ins><span class="cx"> {
</span><span class="cx"> if (WebInspector.frameResourceManager.mainFrame) {
</span><span class="cx"> this.showMainFrame();
</span><span class="lines">@@ -112,41 +112,41 @@
</span><span class="cx"> var firstTreeElement = this._resourcesContentTreeOutline.children[0];
</span><span class="cx"> if (firstTreeElement)
</span><span class="cx"> firstTreeElement.revealAndSelect();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get contentTreeOutlineToAutoPrune()
</span><span class="cx"> {
</span><span class="cx"> return this._searchContentTreeOutline;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showMainFrame: function(nodeToSelect, preventFocusChange)
</del><ins>+ showMainFrame(nodeToSelect, preventFocusChange)
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.contentBrowser.showContentViewForRepresentedObject(WebInspector.frameResourceManager.mainFrame);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showMainFrameDOMTree: function(nodeToSelect, preventFocusChange)
</del><ins>+ showMainFrameDOMTree(nodeToSelect, preventFocusChange)
</ins><span class="cx"> {
</span><span class="cx"> var contentView = WebInspector.contentBrowser.contentViewForRepresentedObject(WebInspector.frameResourceManager.mainFrame);
</span><span class="cx"> contentView.showDOMTree(nodeToSelect, preventFocusChange);
</span><span class="cx"> WebInspector.contentBrowser.showContentView(contentView);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showMainFrameSourceCode: function()
</del><ins>+ showMainFrameSourceCode()
</ins><span class="cx"> {
</span><span class="cx"> var contentView = WebInspector.contentBrowser.contentViewForRepresentedObject(WebInspector.frameResourceManager.mainFrame);
</span><span class="cx"> contentView.showSourceCode();
</span><span class="cx"> WebInspector.contentBrowser.showContentView(contentView);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showContentFlowDOMTree: function(contentFlow, nodeToSelect, preventFocusChange)
</del><ins>+ showContentFlowDOMTree(contentFlow, nodeToSelect, preventFocusChange)
</ins><span class="cx"> {
</span><span class="cx"> var contentView = WebInspector.contentBrowser.contentViewForRepresentedObject(contentFlow);
</span><span class="cx"> if (nodeToSelect)
</span><span class="cx"> contentView.selectAndRevealDOMNode(nodeToSelect, preventFocusChange);
</span><span class="cx"> WebInspector.contentBrowser.showContentView(contentView);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showSourceCodeForFrame: function(frameIdentifier, revealAndSelectTreeElement)
</del><ins>+ showSourceCodeForFrame(frameIdentifier, revealAndSelectTreeElement)
</ins><span class="cx"> {
</span><span class="cx"> delete this._frameIdentifierToShowSourceCodeWhenAvailable;
</span><span class="cx">
</span><span class="lines">@@ -168,9 +168,9 @@
</span><span class="cx">
</span><span class="cx"> if (revealAndSelectTreeElement)
</span><span class="cx"> this.treeElementForRepresentedObject(frame).revealAndSelect(true, true, true, true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showSourceCode: function(sourceCode, positionToReveal, textRangeToSelect, forceUnformatted)
</del><ins>+ showSourceCode(sourceCode, positionToReveal, textRangeToSelect, forceUnformatted)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(!positionToReveal || positionToReveal instanceof WebInspector.SourceCodePosition, positionToReveal);
</span><span class="cx"> var representedObject = sourceCode;
</span><span class="lines">@@ -186,41 +186,41 @@
</span><span class="cx">
</span><span class="cx"> var cookie = positionToReveal ? {lineNumber: positionToReveal.lineNumber, columnNumber: positionToReveal.columnNumber} : {};
</span><span class="cx"> WebInspector.contentBrowser.showContentViewForRepresentedObject(representedObject, cookie);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showSourceCodeLocation: function(sourceCodeLocation)
</del><ins>+ showSourceCodeLocation(sourceCodeLocation)
</ins><span class="cx"> {
</span><span class="cx"> this.showSourceCode(sourceCodeLocation.displaySourceCode, sourceCodeLocation.displayPosition());
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showOriginalUnformattedSourceCodeLocation: function(sourceCodeLocation)
</del><ins>+ showOriginalUnformattedSourceCodeLocation(sourceCodeLocation)
</ins><span class="cx"> {
</span><span class="cx"> this.showSourceCode(sourceCodeLocation.sourceCode, sourceCodeLocation.position(), undefined, true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showOriginalOrFormattedSourceCodeLocation: function(sourceCodeLocation)
</del><ins>+ showOriginalOrFormattedSourceCodeLocation(sourceCodeLocation)
</ins><span class="cx"> {
</span><span class="cx"> this.showSourceCode(sourceCodeLocation.sourceCode, sourceCodeLocation.formattedPosition());
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showSourceCodeTextRange: function(sourceCodeTextRange)
</del><ins>+ showSourceCodeTextRange(sourceCodeTextRange)
</ins><span class="cx"> {
</span><span class="cx"> var textRangeToSelect = sourceCodeTextRange.displayTextRange;
</span><span class="cx"> this.showSourceCode(sourceCodeTextRange.displaySourceCode, textRangeToSelect.startPosition(), textRangeToSelect);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showOriginalOrFormattedSourceCodeTextRange: function(sourceCodeTextRange)
</del><ins>+ showOriginalOrFormattedSourceCodeTextRange(sourceCodeTextRange)
</ins><span class="cx"> {
</span><span class="cx"> var textRangeToSelect = sourceCodeTextRange.formattedTextRange;
</span><span class="cx"> this.showSourceCode(sourceCodeTextRange.sourceCode, textRangeToSelect.startPosition(), textRangeToSelect);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showResource: function(resource)
</del><ins>+ showResource(resource)
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.contentBrowser.showContentViewForRepresentedObject(resource.isMainResource() ? resource.parentFrame : resource);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showResourceRequest: function(resource)
</del><ins>+ showResourceRequest(resource)
</ins><span class="cx"> {
</span><span class="cx"> var contentView = WebInspector.contentBrowser.contentViewForRepresentedObject(resource.isMainResource() ? resource.parentFrame : resource);
</span><span class="cx">
</span><span class="lines">@@ -236,9 +236,9 @@
</span><span class="cx"> resourceContentView.showRequest();
</span><span class="cx">
</span><span class="cx"> WebInspector.contentBrowser.showContentView(contentView);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- treeElementForRepresentedObject: function(representedObject)
</del><ins>+ treeElementForRepresentedObject(representedObject)
</ins><span class="cx"> {
</span><span class="cx"> // A custom implementation is needed for this since the frames are populated lazily.
</span><span class="cx">
</span><span class="lines">@@ -305,9 +305,9 @@
</span><span class="cx"> this._anonymousScriptsFolderTreeElement.appendChild(scriptTreeElement);
</span><span class="cx">
</span><span class="cx"> return scriptTreeElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- performSearch: function(searchTerm)
</del><ins>+ performSearch(searchTerm)
</ins><span class="cx"> {
</span><span class="cx"> // Before performing a new search, clear the old search.
</span><span class="cx"> this._searchContentTreeOutline.removeChildren();
</span><span class="lines">@@ -515,35 +515,35 @@
</span><span class="cx"> // <https://webkit.org/b/131252> Web Inspector: JSContext inspection Resource search does not work
</span><span class="cx"> if (!window.DOMAgent && !window.PageAgent)
</span><span class="cx"> updateEmptyContentPlaceholderSoon.call(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _showResourcesContentTreeOutline: function()
</del><ins>+ _showResourcesContentTreeOutline()
</ins><span class="cx"> {
</span><span class="cx"> this.filterBar.placeholder = WebInspector.UIString("Filter Resource List");
</span><span class="cx"> this.contentTreeOutline = this._resourcesContentTreeOutline;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _showSearchContentTreeOutline: function()
</del><ins>+ _showSearchContentTreeOutline()
</ins><span class="cx"> {
</span><span class="cx"> this.filterBar.placeholder = WebInspector.UIString("Filter Search Results");
</span><span class="cx"> this.contentTreeOutline = this._searchContentTreeOutline;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _searchFieldChanged: function(event)
</del><ins>+ _searchFieldChanged(event)
</ins><span class="cx"> {
</span><span class="cx"> this.performSearch(event.target.value);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _searchFieldInput: function(event)
</del><ins>+ _searchFieldInput(event)
</ins><span class="cx"> {
</span><span class="cx"> // If the search field is cleared, immediately clear the search results tree outline.
</span><span class="cx"> if (!event.target.value.length && this.contentTreeOutline === this._searchContentTreeOutline)
</span><span class="cx"> this.performSearch("");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _searchTreeElementForResource: function(resource)
</del><ins>+ _searchTreeElementForResource(resource)
</ins><span class="cx"> {
</span><span class="cx"> var resourceTreeElement = this._searchContentTreeOutline.getCachedTreeElement(resource);
</span><span class="cx"> if (!resourceTreeElement) {
</span><span class="lines">@@ -555,9 +555,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> return resourceTreeElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _searchTreeElementForScript: function(script)
</del><ins>+ _searchTreeElementForScript(script)
</ins><span class="cx"> {
</span><span class="cx"> var scriptTreeElement = this._searchContentTreeOutline.getCachedTreeElement(script);
</span><span class="cx"> if (!scriptTreeElement) {
</span><span class="lines">@@ -569,16 +569,16 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> return scriptTreeElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _focusSearchField: function(keyboardShortcut, event)
</del><ins>+ _focusSearchField(keyboardShortcut, event)
</ins><span class="cx"> {
</span><span class="cx"> this.show();
</span><span class="cx">
</span><span class="cx"> this._inputElement.select();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _mainFrameDidChange: function(event)
</del><ins>+ _mainFrameDidChange(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this._mainFrameTreeElement) {
</span><span class="cx"> this._mainFrameTreeElement.frame.removeEventListener(WebInspector.Frame.Event.MainResourceDidChange, this._mainFrameMainResourceDidChange, this);
</span><span class="lines">@@ -616,9 +616,9 @@
</span><span class="cx">
</span><span class="cx"> // Search for whatever is in the input field. This was populated with the last used search term.
</span><span class="cx"> this.performSearch(this._inputElement.value);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _mainFrameMainResourceDidChange: function(event)
</del><ins>+ _mainFrameMainResourceDidChange(event)
</ins><span class="cx"> {
</span><span class="cx"> var wasShowingResourceSidebar = this.selected;
</span><span class="cx"> var currentContentView = WebInspector.contentBrowser.currentContentView;
</span><span class="lines">@@ -655,9 +655,9 @@
</span><span class="cx"> // Delay this work because other listeners of this event might not have fired yet. So selecting the main frame
</span><span class="cx"> // before those listeners do their work might cause the content of the old page to show instead of the new page.
</span><span class="cx"> setTimeout(delayedWork.bind(this), 0);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _frameWasAdded: function(event)
</del><ins>+ _frameWasAdded(event)
</ins><span class="cx"> {
</span><span class="cx"> if (!this._frameIdentifierToShowSourceCodeWhenAvailable)
</span><span class="cx"> return;
</span><span class="lines">@@ -667,9 +667,9 @@
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this.showSourceCodeForFrame(frame.id, true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _scriptWasAdded: function(event)
</del><ins>+ _scriptWasAdded(event)
</ins><span class="cx"> {
</span><span class="cx"> var script = event.data.script;
</span><span class="cx">
</span><span class="lines">@@ -715,9 +715,9 @@
</span><span class="cx">
</span><span class="cx"> parentFolderTreeElement.appendChild(scriptTreeElement);
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _scriptsCleared: function(event)
</del><ins>+ _scriptsCleared(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this._extensionScriptsFolderTreeElement) {
</span><span class="cx"> if (this._extensionScriptsFolderTreeElement.parent)
</span><span class="lines">@@ -736,9 +736,9 @@
</span><span class="cx"> this._anonymousScriptsFolderTreeElement.parent.removeChild(this._anonymousScriptsFolderTreeElement);
</span><span class="cx"> this._anonymousScriptsFolderTreeElement = null;
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _scriptsToSearch: function(event)
</del><ins>+ _scriptsToSearch(event)
</ins><span class="cx"> {
</span><span class="cx"> var nonResourceScripts = [];
</span><span class="cx">
</span><span class="lines">@@ -763,9 +763,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> return nonResourceScripts;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _treeElementSelected: function(treeElement, selectedByUser)
</del><ins>+ _treeElementSelected(treeElement, selectedByUser)
</ins><span class="cx"> {
</span><span class="cx"> if (treeElement instanceof WebInspector.FolderTreeElement || treeElement instanceof WebInspector.DatabaseHostTreeElement ||
</span><span class="cx"> treeElement instanceof WebInspector.IndexedDatabaseHostTreeElement || treeElement instanceof WebInspector.IndexedDatabaseTreeElement)
</span><span class="lines">@@ -788,14 +788,14 @@
</span><span class="cx"> this.showMainFrameDOMTree(treeElement.representedObject.domNode, true);
</span><span class="cx"> else if (treeElement.representedObject instanceof WebInspector.SourceCodeSearchMatchObject)
</span><span class="cx"> this.showOriginalOrFormattedSourceCodeTextRange(treeElement.representedObject.sourceCodeTextRange);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _domNodeWasInspected: function(event)
</del><ins>+ _domNodeWasInspected(event)
</ins><span class="cx"> {
</span><span class="cx"> this.showMainFrameDOMTree(event.data.node);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _domStorageObjectWasAdded: function(event)
</del><ins>+ _domStorageObjectWasAdded(event)
</ins><span class="cx"> {
</span><span class="cx"> var domStorage = event.data.domStorage;
</span><span class="cx"> var storageElement = new WebInspector.DOMStorageTreeElement(domStorage);
</span><span class="lines">@@ -804,16 +804,16 @@
</span><span class="cx"> this._localStorageRootTreeElement = this._addStorageChild(storageElement, this._localStorageRootTreeElement, WebInspector.UIString("Local Storage"));
</span><span class="cx"> else
</span><span class="cx"> this._sessionStorageRootTreeElement = this._addStorageChild(storageElement, this._sessionStorageRootTreeElement, WebInspector.UIString("Session Storage"));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _domStorageObjectWasInspected: function(event)
</del><ins>+ _domStorageObjectWasInspected(event)
</ins><span class="cx"> {
</span><span class="cx"> var domStorage = event.data.domStorage;
</span><span class="cx"> var treeElement = this.treeElementForRepresentedObject(domStorage);
</span><span class="cx"> treeElement.revealAndSelect(true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _databaseWasAdded: function(event)
</del><ins>+ _databaseWasAdded(event)
</ins><span class="cx"> {
</span><span class="cx"> var database = event.data.database;
</span><span class="cx">
</span><span class="lines">@@ -826,16 +826,16 @@
</span><span class="cx">
</span><span class="cx"> var databaseElement = new WebInspector.DatabaseTreeElement(database);
</span><span class="cx"> this._databaseHostTreeElementMap[database.host].appendChild(databaseElement);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _databaseWasInspected: function(event)
</del><ins>+ _databaseWasInspected(event)
</ins><span class="cx"> {
</span><span class="cx"> var database = event.data.database;
</span><span class="cx"> var treeElement = this.treeElementForRepresentedObject(database);
</span><span class="cx"> treeElement.revealAndSelect(true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _indexedDatabaseWasAdded: function(event)
</del><ins>+ _indexedDatabaseWasAdded(event)
</ins><span class="cx"> {
</span><span class="cx"> var indexedDatabase = event.data.indexedDatabase;
</span><span class="cx">
</span><span class="lines">@@ -848,17 +848,17 @@
</span><span class="cx">
</span><span class="cx"> var indexedDatabaseElement = new WebInspector.IndexedDatabaseTreeElement(indexedDatabase);
</span><span class="cx"> this._indexedDatabaseHostTreeElementMap[indexedDatabase.host].appendChild(indexedDatabaseElement);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _cookieStorageObjectWasAdded: function(event)
</del><ins>+ _cookieStorageObjectWasAdded(event)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(event.data.cookieStorage instanceof WebInspector.CookieStorageObject);
</span><span class="cx">
</span><span class="cx"> var cookieElement = new WebInspector.CookieStorageTreeElement(event.data.cookieStorage);
</span><span class="cx"> this._cookieStorageRootTreeElement = this._addStorageChild(cookieElement, this._cookieStorageRootTreeElement, WebInspector.UIString("Cookies"));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _frameManifestAdded: function(event)
</del><ins>+ _frameManifestAdded(event)
</ins><span class="cx"> {
</span><span class="cx"> var frameManifest = event.data.frameManifest;
</span><span class="cx"> console.assert(frameManifest instanceof WebInspector.ApplicationCacheFrame);
</span><span class="lines">@@ -872,14 +872,14 @@
</span><span class="cx">
</span><span class="cx"> var frameCacheElement = new WebInspector.ApplicationCacheFrameTreeElement(frameManifest);
</span><span class="cx"> this._applicationCacheURLTreeElementMap[manifestURL].appendChild(frameCacheElement);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _frameManifestRemoved: function(event)
</del><ins>+ _frameManifestRemoved(event)
</ins><span class="cx"> {
</span><span class="cx"> // FIXME: Implement this.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _compareTreeElements: function(a, b)
</del><ins>+ _compareTreeElements(a, b)
</ins><span class="cx"> {
</span><span class="cx"> // Always sort the main frame element first.
</span><span class="cx"> if (a instanceof WebInspector.FrameTreeElement)
</span><span class="lines">@@ -891,9 +891,9 @@
</span><span class="cx"> console.assert(b.mainTitle);
</span><span class="cx">
</span><span class="cx"> return (a.mainTitle || "").localeCompare(b.mainTitle || "");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _addStorageChild: function(childElement, parentElement, folderName)
</del><ins>+ _addStorageChild(childElement, parentElement, folderName)
</ins><span class="cx"> {
</span><span class="cx"> if (!parentElement) {
</span><span class="cx"> childElement.flattened = true;
</span><span class="lines">@@ -923,9 +923,9 @@
</span><span class="cx"> parentElement.insertChild(childElement, insertionIndexForObjectInListSortedByFunction(childElement, parentElement.children, this._compareTreeElements));
</span><span class="cx">
</span><span class="cx"> return parentElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _storageCleared: function(event)
</del><ins>+ _storageCleared(event)
</ins><span class="cx"> {
</span><span class="cx"> // Close all DOM and cookie storage content views since the main frame has navigated and all storages are cleared.
</span><span class="cx"> WebInspector.contentBrowser.contentViewContainer.closeAllContentViewsOfPrototype(WebInspector.CookieStorageContentView);
</span><span class="lines">@@ -961,13 +961,11 @@
</span><span class="cx"> this._cookieStorageRootTreeElement = null;
</span><span class="cx"> this._applicationCacheRootTreeElement = null;
</span><span class="cx"> this._applicationCacheURLTreeElementMap = {};
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _extraDomainsActivated: function()
</del><ins>+ _extraDomainsActivated()
</ins><span class="cx"> {
</span><span class="cx"> if (WebInspector.debuggableType === WebInspector.DebuggableType.JavaScript)
</span><span class="cx"> this._resourcesContentTreeOutline.element.classList.remove(WebInspector.NavigationSidebarPanel.HideDisclosureButtonsStyleClassName);
</span><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.ResourceSidebarPanel.prototype.__proto__ = WebInspector.NavigationSidebarPanel.prototype;
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsScopeChainDetailsSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ScopeChainDetailsSidebarPanel.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ScopeChainDetailsSidebarPanel.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ScopeChainDetailsSidebarPanel.js 2015-03-26 23:37:55 UTC (rev 182041)
</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, 2015 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,22 +23,18 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ScopeChainDetailsSidebarPanel = function()
</del><ins>+WebInspector.ScopeChainDetailsSidebarPanel = class ScopeChainDetailsSidebarPanel extends WebInspector.DetailsSidebarPanel
</ins><span class="cx"> {
</span><del>- WebInspector.DetailsSidebarPanel.call(this, "scope-chain", WebInspector.UIString("Scope Chain"), WebInspector.UIString("Scope Chain"), "Images/NavigationItemVariable.svg", "5");
</del><ins>+ constructor()
+ {
+ super("scope-chain", WebInspector.UIString("Scope Chain"), WebInspector.UIString("Scope Chain"), "Images/NavigationItemVariable.svg", "5");
</ins><span class="cx">
</span><del>- this._callFrame = null;
</del><ins>+ this._callFrame = null;
</ins><span class="cx">
</span><del>- // Update on console prompt eval as objects in the scope chain may have changed.
- WebInspector.runtimeManager.addEventListener(WebInspector.RuntimeManager.Event.DidEvaluate, this.needsRefresh, this);
-};
</del><ins>+ // Update on console prompt eval as objects in the scope chain may have changed.
+ WebInspector.runtimeManager.addEventListener(WebInspector.RuntimeManager.Event.DidEvaluate, this.needsRefresh, this);
+ }
</ins><span class="cx">
</span><del>-WebInspector.ScopeChainDetailsSidebarPanel.autoExpandProperties = new Set;
-
-WebInspector.ScopeChainDetailsSidebarPanel.prototype = {
- constructor: WebInspector.ScopeChainDetailsSidebarPanel,
- __proto__: WebInspector.DetailsSidebarPanel.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> inspect(objects)
</span><span class="lines">@@ -60,12 +56,12 @@
</span><span class="cx"> this.callFrame = callFrameToInspect;
</span><span class="cx">
</span><span class="cx"> return !!this.callFrame;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get callFrame()
</span><span class="cx"> {
</span><span class="cx"> return this._callFrame;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set callFrame(callFrame)
</span><span class="cx"> {
</span><span class="lines">@@ -75,7 +71,7 @@
</span><span class="cx"> this._callFrame = callFrame;
</span><span class="cx">
</span><span class="cx"> this.needsRefresh();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> refresh()
</span><span class="cx"> {
</span><span class="lines">@@ -181,13 +177,13 @@
</span><span class="cx"> // We need a timeout in place in case there are long running, pending backend dispatches. This can happen
</span><span class="cx"> // if the debugger is paused in code that was executed from the console. The console will be waiting for
</span><span class="cx"> // the result of the execution and without a timeout we would never update the scope variables.
</span><del>- var delay = WebInspector.ScopeChainDetailsSidebarPanel.autoExpandProperties.size === 0 ? 50 : 250;
</del><ins>+ var delay = WebInspector.ScopeChainDetailsSidebarPanel._autoExpandProperties.size === 0 ? 50 : 250;
</ins><span class="cx"> var timeout = setTimeout(delayedWork.bind(this), delay);
</span><span class="cx">
</span><span class="cx"> // Since ObjectTreeView populates asynchronously, we want to wait to replace the existing content
</span><span class="cx"> // until after all the pending asynchronous requests are completed. This prevents severe flashing while stepping.
</span><span class="cx"> InspectorBackend.runAfterPendingDispatches(delayedWork.bind(this));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> _propertyPathIdentifierForTreeElement(identifier, objectPropertyTreeElement)
</span><span class="cx"> {
</span><span class="lines">@@ -199,7 +195,7 @@
</span><span class="cx"> return null;
</span><span class="cx">
</span><span class="cx"> return identifier + "-" + propertyPath.fullPath;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> _objectTreeAddHandler(identifier, treeElement)
</span><span class="cx"> {
</span><span class="lines">@@ -207,9 +203,9 @@
</span><span class="cx"> if (!propertyPathIdentifier)
</span><span class="cx"> return;
</span><span class="cx">
</span><del>- if (WebInspector.ScopeChainDetailsSidebarPanel.autoExpandProperties.has(propertyPathIdentifier))
</del><ins>+ if (WebInspector.ScopeChainDetailsSidebarPanel._autoExpandProperties.has(propertyPathIdentifier))
</ins><span class="cx"> treeElement.expand();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> _objectTreeExpandHandler(identifier, treeElement)
</span><span class="cx"> {
</span><span class="lines">@@ -217,8 +213,8 @@
</span><span class="cx"> if (!propertyPathIdentifier)
</span><span class="cx"> return;
</span><span class="cx">
</span><del>- WebInspector.ScopeChainDetailsSidebarPanel.autoExpandProperties.add(propertyPathIdentifier);
- },
</del><ins>+ WebInspector.ScopeChainDetailsSidebarPanel._autoExpandProperties.add(propertyPathIdentifier);
+ }
</ins><span class="cx">
</span><span class="cx"> _objectTreeCollapseHandler(identifier, treeElement)
</span><span class="cx"> {
</span><span class="lines">@@ -226,6 +222,8 @@
</span><span class="cx"> if (!propertyPathIdentifier)
</span><span class="cx"> return;
</span><span class="cx">
</span><del>- WebInspector.ScopeChainDetailsSidebarPanel.autoExpandProperties.delete(propertyPathIdentifier);
</del><ins>+ WebInspector.ScopeChainDetailsSidebarPanel._autoExpandProperties.delete(propertyPathIdentifier);
</ins><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.ScopeChainDetailsSidebarPanel._autoExpandProperties = new Set;
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsSidebarjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Sidebar.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/Sidebar.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Sidebar.js 2015-03-26 23:37:55 UTC (rev 182041)
</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, 2015 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,56 +23,38 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.Sidebar = function(element, side, sidebarPanels, role, label) {
- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+WebInspector.Sidebar = class Sidebar extends WebInspector.Object
+{
+ constructor(element, side, sidebarPanels, role, label)
+ {
+ super();
</ins><span class="cx">
</span><del>- console.assert(!side || side === WebInspector.Sidebar.Sides.Left || side === WebInspector.Sidebar.Sides.Right);
- this._side = side || WebInspector.Sidebar.Sides.Left;
</del><ins>+ console.assert(!side || side === WebInspector.Sidebar.Sides.Left || side === WebInspector.Sidebar.Sides.Right);
+ this._side = side || WebInspector.Sidebar.Sides.Left;
</ins><span class="cx">
</span><del>- this._element = element || document.createElement("div");
- this._element.classList.add(WebInspector.Sidebar.StyleClassName);
- this._element.classList.add(WebInspector.Sidebar.CollapsedStyleClassName);
- this._element.classList.add(this._side);
</del><ins>+ this._element = element || document.createElement("div");
+ this._element.classList.add("sidebar");
+ this._element.classList.add(WebInspector.Sidebar.CollapsedStyleClassName);
+ this._element.classList.add(this._side);
</ins><span class="cx">
</span><del>- this._element.setAttribute("role", role || "group");
- if (label)
- this._element.setAttribute("aria-label", label);
</del><ins>+ this._element.setAttribute("role", role || "group");
+ if (label)
+ this._element.setAttribute("aria-label", label);
</ins><span class="cx">
</span><del>- this._resizer = new WebInspector.Resizer(WebInspector.Resizer.RuleOrientation.Vertical, this);
- this._element.insertBefore(this._resizer.element, this._element.firstChild);
</del><ins>+ this._resizer = new WebInspector.Resizer(WebInspector.Resizer.RuleOrientation.Vertical, this);
+ this._element.insertBefore(this._resizer.element, this._element.firstChild);
</ins><span class="cx">
</span><del>- this._sidebarPanels = [];
</del><ins>+ this._sidebarPanels = [];
</ins><span class="cx">
</span><del>- if (sidebarPanels) {
- for (var i = 0; i < sidebarPanels.length; ++i)
- this.addSidebarPanel(sidebarPanels[i]);
</del><ins>+ if (sidebarPanels) {
+ for (var i = 0; i < sidebarPanels.length; ++i)
+ this.addSidebarPanel(sidebarPanels[i]);
+ }
</ins><span class="cx"> }
</span><del>-};
</del><span class="cx">
</span><del>-// FIXME: Move to a WebInspector.Object subclass and we can remove this.
-WebInspector.Object.deprecatedAddConstructorFunctions(WebInspector.Sidebar);
-
-WebInspector.Sidebar.StyleClassName = "sidebar";
-WebInspector.Sidebar.CollapsedStyleClassName = "collapsed";
-WebInspector.Sidebar.AbsoluteMinimumWidth = 200;
-
-WebInspector.Sidebar.Sides = {};
-WebInspector.Sidebar.Sides.Right = "right";
-WebInspector.Sidebar.Sides.Left = "left";
-
-WebInspector.Sidebar.Event = {
- SidebarPanelSelected: "sidebar-sidebar-panel-selected",
- CollapsedStateDidChange: "sidebar-sidebar-collapsed-state-did-change",
- WidthDidChange: "sidebar-width-did-change",
-};
-
-WebInspector.Sidebar.prototype = {
- constructor: WebInspector.Sidebar,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><del>- addSidebarPanel: function(sidebarPanel)
</del><ins>+ addSidebarPanel(sidebarPanel)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(sidebarPanel instanceof WebInspector.SidebarPanel);
</span><span class="cx"> if (!(sidebarPanel instanceof WebInspector.SidebarPanel))
</span><span class="lines">@@ -90,9 +72,9 @@
</span><span class="cx"> sidebarPanel.added();
</span><span class="cx">
</span><span class="cx"> return sidebarPanel;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- removeSidebarPanel: function(sidebarPanelOrIdentifierOrIndex, index)
</del><ins>+ removeSidebarPanel(sidebarPanelOrIdentifierOrIndex, index)
</ins><span class="cx"> {
</span><span class="cx"> var sidebarPanel = this.findSidebarPanel(sidebarPanelOrIdentifierOrIndex);
</span><span class="cx"> if (!sidebarPanel)
</span><span class="lines">@@ -113,12 +95,12 @@
</span><span class="cx"> sidebarPanel.removed();
</span><span class="cx">
</span><span class="cx"> return sidebarPanel;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get selectedSidebarPanel()
</span><span class="cx"> {
</span><span class="cx"> return this._selectedSidebarPanel || null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set selectedSidebarPanel(sidebarPanelOrIdentifierOrIndex)
</span><span class="cx"> {
</span><span class="lines">@@ -149,24 +131,24 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.Sidebar.Event.SidebarPanelSelected);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get minimumWidth()
</span><span class="cx"> {
</span><span class="cx"> return WebInspector.Sidebar.AbsoluteMinimumWidth;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get maximumWidth()
</span><span class="cx"> {
</span><span class="cx"> // FIXME: This is kind of arbitrary and ideally would be a more complex calculation based on the
</span><span class="cx"> // available space for the sibling elements.
</span><span class="cx"> return Math.round(window.innerWidth / 3);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get width()
</span><span class="cx"> {
</span><span class="cx"> return this._element.offsetWidth;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set width(newWidth)
</span><span class="cx"> {
</span><span class="lines">@@ -181,12 +163,12 @@
</span><span class="cx"> this._selectedSidebarPanel.widthDidChange();
</span><span class="cx">
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.Sidebar.Event.WidthDidChange);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get collapsed()
</span><span class="cx"> {
</span><span class="cx"> return this._element.classList.contains(WebInspector.Sidebar.CollapsedStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set collapsed(flag)
</span><span class="cx"> {
</span><span class="lines">@@ -211,24 +193,24 @@
</span><span class="cx">
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.Sidebar.Event.CollapsedStateDidChange);
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.Sidebar.Event.WidthDidChange);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get sidebarPanels()
</span><span class="cx"> {
</span><span class="cx"> return this._sidebarPanels;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get side()
</span><span class="cx"> {
</span><span class="cx"> return this._side;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- findSidebarPanel: function(sidebarPanelOrIdentifierOrIndex)
</del><ins>+ findSidebarPanel(sidebarPanelOrIdentifierOrIndex)
</ins><span class="cx"> {
</span><span class="cx"> var sidebarPanel = null;
</span><span class="cx">
</span><span class="lines">@@ -247,16 +229,16 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> return sidebarPanel;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Protected
</span><span class="cx">
</span><del>- resizerDragStarted: function(resizer)
</del><ins>+ resizerDragStarted(resizer)
</ins><span class="cx"> {
</span><span class="cx"> this._widthBeforeResize = this.width;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- resizerDragging: function(resizer, positionDelta)
</del><ins>+ resizerDragging(resizer, positionDelta)
</ins><span class="cx"> {
</span><span class="cx"> if (this._side === WebInspector.Sidebar.Sides.Left)
</span><span class="cx"> positionDelta *= -1;
</span><span class="lines">@@ -264,19 +246,31 @@
</span><span class="cx"> var newWidth = positionDelta + this._widthBeforeResize;
</span><span class="cx"> this.width = newWidth;
</span><span class="cx"> this.collapsed = (newWidth < (this.minimumWidth / 2));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- resizerDragEnded: function(resizer)
</del><ins>+ resizerDragEnded(resizer)
</ins><span class="cx"> {
</span><span class="cx"> delete this._widthBeforeResize;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _navigationItemSelected: function(event)
</del><ins>+ _navigationItemSelected(event)
</ins><span class="cx"> {
</span><span class="cx"> this.selectedSidebarPanel = event.target.selectedNavigationItem ? event.target.selectedNavigationItem.identifier : null;
</span><span class="cx"> }
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.Sidebar.prototype.__proto__ = WebInspector.Object.prototype;
</del><ins>+WebInspector.Sidebar.CollapsedStyleClassName = "collapsed";
+WebInspector.Sidebar.AbsoluteMinimumWidth = 200;
+
+WebInspector.Sidebar.Sides = {
+ Right: "right",
+ Left: "left"
+};
+
+WebInspector.Sidebar.Event = {
+ SidebarPanelSelected: "sidebar-panel-selected",
+ CollapsedStateDidChange: "sidebar-collapsed-state-did-change",
+ WidthDidChange: "sidebar-width-did-change",
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SidebarPanel.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/SidebarPanel.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SidebarPanel.js 2015-03-26 23:37:55 UTC (rev 182041)
</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, 2015 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,68 +23,61 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.SidebarPanel = function(identifier, displayName, showToolTip, hideToolTip, image, element, role, label)
</del><ins>+WebInspector.SidebarPanel = class SidebarPanel extends WebInspector.Object
</ins><span class="cx"> {
</span><del>- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+ constructor(identifier, displayName, showToolTip, hideToolTip, image, element, role, label)
+ {
+ super();
</ins><span class="cx">
</span><del>- this._identifier = identifier;
</del><ins>+ this._identifier = identifier;
</ins><span class="cx">
</span><del>- this._toolbarItem = new WebInspector.ActivateButtonToolbarItem(identifier, showToolTip, hideToolTip, displayName, image, null, "tab");
- this._toolbarItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this.toggle, this);
- this._toolbarItem.enabled = false;
</del><ins>+ this._toolbarItem = new WebInspector.ActivateButtonToolbarItem(identifier, showToolTip, hideToolTip, displayName, image, null, "tab");
+ this._toolbarItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this.toggle, this);
+ this._toolbarItem.enabled = false;
</ins><span class="cx">
</span><del>- this._element = element || document.createElement("div");
- this._element.classList.add(WebInspector.SidebarPanel.StyleClassName);
- this._element.classList.add(identifier);
</del><ins>+ this._element = element || document.createElement("div");
+ this._element.classList.add("panel");
+ this._element.classList.add(identifier);
</ins><span class="cx">
</span><del>- this._element.setAttribute("role", role || "group");
- this._element.setAttribute("aria-label", label || displayName);
</del><ins>+ this._element.setAttribute("role", role || "group");
+ this._element.setAttribute("aria-label", label || displayName);
</ins><span class="cx">
</span><del>- this._contentElement = document.createElement("div");
- this._contentElement.className = WebInspector.SidebarPanel.ContentElementStyleClassName;
- this._element.appendChild(this._contentElement);
-};
</del><ins>+ this._contentElement = document.createElement("div");
+ this._contentElement.className = "content";
+ this._element.appendChild(this._contentElement);
+ }
</ins><span class="cx">
</span><del>-WebInspector.SidebarPanel.StyleClassName = "panel";
-WebInspector.SidebarPanel.SelectedStyleClassName = "selected";
-WebInspector.SidebarPanel.ContentElementStyleClassName = "content";
-
-WebInspector.SidebarPanel.prototype = {
- constructor: WebInspector.SidebarPanel,
- __proto__: WebInspector.Object.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get identifier()
</span><span class="cx"> {
</span><span class="cx"> return this._identifier;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get toolbarItem()
</span><span class="cx"> {
</span><span class="cx"> return this._toolbarItem;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get contentElement()
</span><span class="cx"> {
</span><span class="cx"> return this._contentElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get visible()
</span><span class="cx"> {
</span><span class="cx"> return this.selected && this._parentSidebar && !this._parentSidebar.collapsed;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get selected()
</span><span class="cx"> {
</span><span class="cx"> return this._element.classList.contains(WebInspector.SidebarPanel.SelectedStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set selected(flag)
</span><span class="cx"> {
</span><span class="lines">@@ -92,75 +85,77 @@
</span><span class="cx"> this._element.classList.add(WebInspector.SidebarPanel.SelectedStyleClassName);
</span><span class="cx"> else
</span><span class="cx"> this._element.classList.remove(WebInspector.SidebarPanel.SelectedStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get parentSidebar()
</span><span class="cx"> {
</span><span class="cx"> return this._parentSidebar;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- show: function()
</del><ins>+ show()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._parentSidebar)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._parentSidebar.collapsed = false;
</span><span class="cx"> this._parentSidebar.selectedSidebarPanel = this;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- hide: function()
</del><ins>+ hide()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._parentSidebar)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._parentSidebar.collapsed = true;
</span><span class="cx"> this._parentSidebar.selectedSidebarPanel = null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- toggle: function()
</del><ins>+ toggle()
</ins><span class="cx"> {
</span><span class="cx"> if (this.visible)
</span><span class="cx"> this.hide();
</span><span class="cx"> else
</span><span class="cx"> this.show();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- added: function()
</del><ins>+ added()
</ins><span class="cx"> {
</span><span class="cx"> console.assert(this._parentSidebar);
</span><span class="cx"> this._toolbarItem.enabled = true;
</span><span class="cx"> this._toolbarItem.activated = this.visible;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- removed: function()
</del><ins>+ removed()
</ins><span class="cx"> {
</span><span class="cx"> console.assert(!this._parentSidebar);
</span><span class="cx"> this._toolbarItem.enabled = false;
</span><span class="cx"> this._toolbarItem.activated = false;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- willRemove: function()
</del><ins>+ willRemove()
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- shown: function()
</del><ins>+ shown()
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- hidden: function()
</del><ins>+ hidden()
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- widthDidChange: function()
</del><ins>+ widthDidChange()
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- visibilityDidChange: function()
</del><ins>+ visibilityDidChange()
</ins><span class="cx"> {
</span><span class="cx"> this._toolbarItem.activated = this.visible;
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.SidebarPanel.SelectedStyleClassName = "selected";
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsTimelineSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineSidebarPanel.js (182040 => 182041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineSidebarPanel.js 2015-03-26 23:37:45 UTC (rev 182040)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineSidebarPanel.js 2015-03-26 23:37:55 UTC (rev 182041)
</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, 2015 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,155 +23,130 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.TimelineSidebarPanel = function()
</del><ins>+WebInspector.TimelineSidebarPanel = class TimelineSidebarPanel extends WebInspector.NavigationSidebarPanel
</ins><span class="cx"> {
</span><del>- WebInspector.NavigationSidebarPanel.call(this, "timeline", WebInspector.UIString("Timelines"), "Images/NavigationItemStopwatch.svg", "2");
</del><ins>+ constructor()
+ {
+ super("timeline", WebInspector.UIString("Timelines"), "Images/NavigationItemStopwatch.svg", "2");
</ins><span class="cx">
</span><del>- this._timelineEventsTitleBarElement = document.createElement("div");
- this._timelineEventsTitleBarElement.classList.add(WebInspector.TimelineSidebarPanel.TitleBarStyleClass);
- this._timelineEventsTitleBarElement.classList.add(WebInspector.TimelineSidebarPanel.TimelineEventsTitleBarStyleClass);
- this.element.insertBefore(this._timelineEventsTitleBarElement, this.element.firstChild);
</del><ins>+ this._timelineEventsTitleBarElement = document.createElement("div");
+ this._timelineEventsTitleBarElement.classList.add(WebInspector.TimelineSidebarPanel.TitleBarStyleClass);
+ this._timelineEventsTitleBarElement.classList.add(WebInspector.TimelineSidebarPanel.TimelineEventsTitleBarStyleClass);
+ this.element.insertBefore(this._timelineEventsTitleBarElement, this.element.firstChild);
</ins><span class="cx">
</span><del>- this.contentTreeOutlineLabel = "";
</del><ins>+ this.contentTreeOutlineLabel = "";
</ins><span class="cx">
</span><del>- this._timelinesContentContainerElement = document.createElement("div");
- this._timelinesContentContainerElement.classList.add(WebInspector.TimelineSidebarPanel.TimelinesContentContainerStyleClass);
- this.element.insertBefore(this._timelinesContentContainerElement, this.element.firstChild);
</del><ins>+ this._timelinesContentContainerElement = document.createElement("div");
+ this._timelinesContentContainerElement.classList.add(WebInspector.TimelineSidebarPanel.TimelinesContentContainerStyleClass);
+ this.element.insertBefore(this._timelinesContentContainerElement, this.element.firstChild);
</ins><span class="cx">
</span><del>- this._displayedRecording = null;
- this._displayedContentView = null;
</del><ins>+ this._displayedRecording = null;
+ this._displayedContentView = null;
</ins><span class="cx">
</span><del>- // Maintain an invisible tree outline containing tree elements for all recordings.
- // The visible recording's tree element is selected when the content view changes.
- this._recordingTreeElementMap = new Map;
- this._recordingsTreeOutline = this.createContentTreeOutline(true, true);
- this._recordingsTreeOutline.element.classList.add(WebInspector.NavigationSidebarPanel.HideDisclosureButtonsStyleClassName);
- this._recordingsTreeOutline.element.classList.add(WebInspector.NavigationSidebarPanel.ContentTreeOutlineElementHiddenStyleClassName);
- this._recordingsTreeOutline.onselect = this._recordingsTreeElementSelected.bind(this);
- this._timelinesContentContainerElement.appendChild(this._recordingsTreeOutline.element);
</del><ins>+ // Maintain an invisible tree outline containing tree elements for all recordings.
+ // The visible recording's tree element is selected when the content view changes.
+ this._recordingTreeElementMap = new Map;
+ this._recordingsTreeOutline = this.createContentTreeOutline(true, true);
+ this._recordingsTreeOutline.element.classList.add(WebInspector.NavigationSidebarPanel.HideDisclosureButtonsStyleClassName);
+ this._recordingsTreeOutline.element.classList.add(WebInspector.NavigationSidebarPanel.ContentTreeOutlineElementHiddenStyleClassName);
+ this._recordingsTreeOutline.onselect = this._recordingsTreeElementSelected.bind(this);
+ this._timelinesContentContainerElement.appendChild(this._recordingsTreeOutline.element);
</ins><span class="cx">
</span><del>- // Maintain a tree outline with tree elements for each timeline of the selected recording.
- this._timelinesTreeOutline = this.createContentTreeOutline(true, true);
- this._timelinesTreeOutline.element.classList.add(WebInspector.NavigationSidebarPanel.HideDisclosureButtonsStyleClassName);
- this._timelinesTreeOutline.onselect = this._timelinesTreeElementSelected.bind(this);
- this._timelinesContentContainerElement.appendChild(this._timelinesTreeOutline.element);
</del><ins>+ // Maintain a tree outline with tree elements for each timeline of the selected recording.
+ this._timelinesTreeOutline = this.createContentTreeOutline(true, true);
+ this._timelinesTreeOutline.element.classList.add(WebInspector.NavigationSidebarPanel.HideDisclosureButtonsStyleClassName);
+ this._timelinesTreeOutline.onselect = this._timelinesTreeElementSelected.bind(this);
+ this._timelinesContentContainerElement.appendChild(this._timelinesTreeOutline.element);
</ins><span class="cx">
</span><del>- this._timelineTreeElementMap = new Map;
</del><ins>+ this._timelineTreeElementMap = new Map;
</ins><span class="cx">
</span><del>- var timelinesTitleBarElement = document.createElement("div");
- timelinesTitleBarElement.textContent = WebInspector.UIString("Timelines");
- timelinesTitleBarElement.classList.add(WebInspector.TimelineSidebarPanel.TitleBarStyleClass);
- timelinesTitleBarElement.classList.add(WebInspector.TimelineSidebarPanel.TimelinesTitleBarStyleClass);
- this.element.insertBefore(timelinesTitleBarElement, this.element.firstChild);
</del><ins>+ var timelinesTitleBarElement = document.createElement("div");
+ timelinesTitleBarElement.textContent = WebInspector.UIString("Timelines");
+ timelinesTitleBarElement.classList.add(WebInspector.TimelineSidebarPanel.TitleBarStyleClass);
+ timelinesTitleBarElement.classList.add(WebInspector.TimelineSidebarPanel.TimelinesTitleBarStyleClass);
+ this.element.insertBefore(timelinesTitleBarElement, this.element.firstChild);
</ins><span class="cx">
</span><del>- var statusBarElement = this._statusBarElement = document.createElement("div");
- statusBarElement.classList.add(WebInspector.TimelineSidebarPanel.StatusBarStyleClass);
- this.element.insertBefore(statusBarElement, this.element.firstChild);
</del><ins>+ var statusBarElement = this._statusBarElement = document.createElement("div");
+ statusBarElement.classList.add(WebInspector.TimelineSidebarPanel.StatusBarStyleClass);
+ this.element.insertBefore(statusBarElement, this.element.firstChild);
</ins><span class="cx">
</span><del>- this._recordGlyphElement = document.createElement("div");
- this._recordGlyphElement.className = WebInspector.TimelineSidebarPanel.RecordGlyphStyleClass;
- this._recordGlyphElement.addEventListener("mouseover", this._recordGlyphMousedOver.bind(this));
- this._recordGlyphElement.addEventListener("mouseout", this._recordGlyphMousedOut.bind(this));
- this._recordGlyphElement.addEventListener("click", this._recordGlyphClicked.bind(this));
- statusBarElement.appendChild(this._recordGlyphElement);
</del><ins>+ this._recordGlyphElement = document.createElement("div");
+ this._recordGlyphElement.className = WebInspector.TimelineSidebarPanel.RecordGlyphStyleClass;
+ this._recordGlyphElement.addEventListener("mouseover", this._recordGlyphMousedOver.bind(this));
+ this._recordGlyphElement.addEventListener("mouseout", this._recordGlyphMousedOut.bind(this));
+ this._recordGlyphElement.addEventListener("click", this._recordGlyphClicked.bind(this));
+ statusBarElement.appendChild(this._recordGlyphElement);
</ins><span class="cx">
</span><del>- this._recordStatusElement = document.createElement("div");
- this._recordStatusElement.className = WebInspector.TimelineSidebarPanel.RecordStatusStyleClass;
- statusBarElement.appendChild(this._recordStatusElement);
</del><ins>+ this._recordStatusElement = document.createElement("div");
+ this._recordStatusElement.className = WebInspector.TimelineSidebarPanel.RecordStatusStyleClass;
+ statusBarElement.appendChild(this._recordStatusElement);
</ins><span class="cx">
</span><del>- WebInspector.showReplayInterfaceSetting.addEventListener(WebInspector.Setting.Event.Changed, this._updateReplayInterfaceVisibility, this);
</del><ins>+ WebInspector.showReplayInterfaceSetting.addEventListener(WebInspector.Setting.Event.Changed, this._updateReplayInterfaceVisibility, this);
</ins><span class="cx">
</span><del>- // We always create a navigation bar; its visibility is controlled by WebInspector.showReplayInterfaceSetting.
- this._navigationBar = new WebInspector.NavigationBar;
- this.element.appendChild(this._navigationBar.element);
</del><ins>+ // We always create a navigation bar; its visibility is controlled by WebInspector.showReplayInterfaceSetting.
+ this._navigationBar = new WebInspector.NavigationBar;
+ this.element.appendChild(this._navigationBar.element);
</ins><span class="cx">
</span><del>- var toolTip = WebInspector.UIString("Begin Capturing");
- var altToolTip = WebInspector.UIString("End Capturing");
- this._replayCaptureButtonItem = new WebInspector.ActivateButtonNavigationItem("replay-capture", toolTip, altToolTip, "Images/Circle.svg", 16, 16);
- this._replayCaptureButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._replayCaptureButtonClicked, this);
- this._replayCaptureButtonItem.enabled = true;
- this._navigationBar.addNavigationItem(this._replayCaptureButtonItem);
</del><ins>+ var toolTip = WebInspector.UIString("Begin Capturing");
+ var altToolTip = WebInspector.UIString("End Capturing");
+ this._replayCaptureButtonItem = new WebInspector.ActivateButtonNavigationItem("replay-capture", toolTip, altToolTip, "Images/Circle.svg", 16, 16);
+ this._replayCaptureButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._replayCaptureButtonClicked, this);
+ this._replayCaptureButtonItem.enabled = true;
+ this._navigationBar.addNavigationItem(this._replayCaptureButtonItem);
</ins><span class="cx">
</span><del>- var pauseImage, resumeImage;
- if (WebInspector.Platform.isLegacyMacOS) {
- pauseImage = {src: "Images/Legacy/Pause.svg", width: 16, height: 16};
- resumeImage = {src: "Images/Legacy/Resume.svg", width: 16, height: 16};
- } else {
- pauseImage = {src: "Images/Pause.svg", width: 15, height: 15};
- resumeImage = {src: "Images/Resume.svg", width: 15, height: 15};
- }
</del><ins>+ var pauseImage, resumeImage;
+ if (WebInspector.Platform.isLegacyMacOS) {
+ pauseImage = {src: "Images/Legacy/Pause.svg", width: 16, height: 16};
+ resumeImage = {src: "Images/Legacy/Resume.svg", width: 16, height: 16};
+ } else {
+ pauseImage = {src: "Images/Pause.svg", width: 15, height: 15};
+ resumeImage = {src: "Images/Resume.svg", width: 15, height: 15};
+ }
</ins><span class="cx">
</span><del>- toolTip = WebInspector.UIString("Start Playback");
- altToolTip = WebInspector.UIString("Pause Playback");
- this._replayPauseResumeButtonItem = new WebInspector.ToggleButtonNavigationItem("replay-pause-resume", toolTip, altToolTip, resumeImage.src, pauseImage.src, pauseImage.width, pauseImage.height, true);
- this._replayPauseResumeButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._replayPauseResumeButtonClicked, this);
- this._replayPauseResumeButtonItem.enabled = false;
- this._navigationBar.addNavigationItem(this._replayPauseResumeButtonItem);
</del><ins>+ toolTip = WebInspector.UIString("Start Playback");
+ altToolTip = WebInspector.UIString("Pause Playback");
+ this._replayPauseResumeButtonItem = new WebInspector.ToggleButtonNavigationItem("replay-pause-resume", toolTip, altToolTip, resumeImage.src, pauseImage.src, pauseImage.width, pauseImage.height, true);
+ this._replayPauseResumeButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._replayPauseResumeButtonClicked, this);
+ this._replayPauseResumeButtonItem.enabled = false;
+ this._navigationBar.addNavigationItem(this._replayPauseResumeButtonItem);
</ins><span class="cx">
</span><del>- WebInspector.replayManager.addEventListener(WebInspector.ReplayManager.Event.CaptureStarted, this._captureStarted, this);
- WebInspector.replayManager.addEventListener(WebInspector.ReplayManager.Event.CaptureStopped, this._captureStopped, this);
</del><ins>+ WebInspector.replayManager.addEventListener(WebInspector.ReplayManager.Event.CaptureStarted, this._captureStarted, this);
+ WebInspector.replayManager.addEventListener(WebInspector.ReplayManager.Event.CaptureStopped, this._captureStopped, this);
</ins><span class="cx">
</span><del>- this._statusBarElement.oncontextmenu = this._contextMenuNavigationBarOrStatusBar.bind(this);
- this._navigationBar.element.oncontextmenu = this._contextMenuNavigationBarOrStatusBar.bind(this);
- this._updateReplayInterfaceVisibility();
</del><ins>+ this._statusBarElement.oncontextmenu = this._contextMenuNavigationBarOrStatusBar.bind(this);
+ this._navigationBar.element.oncontextmenu = this._contextMenuNavigationBarOrStatusBar.bind(this);
+ this._updateReplayInterfaceVisibility();
</ins><span class="cx">
</span><del>- WebInspector.timelineManager.addEventListener(WebInspector.TimelineManager.Event.RecordingCreated, this._recordingCreated, this);
- WebInspector.timelineManager.addEventListener(WebInspector.TimelineManager.Event.RecordingLoaded, this._recordingLoaded, this);
</del><ins>+ WebInspector.timelineManager.addEventListener(WebInspector.TimelineManager.Event.RecordingCreated, this._recordingCreated, this);
+ WebInspector.timelineManager.addEventListener(WebInspector.TimelineManager.Event.RecordingLoaded, this._recordingLoaded, this);
</ins><span class="cx">
</span><del>- WebInspector.contentBrowser.addEventListener(WebInspector.ContentBrowser.Event.CurrentContentViewDidChange, this._contentBrowserCurrentContentViewDidChange, this);
- WebInspector.timelineManager.addEventListener(WebInspector.TimelineManager.Event.CapturingStarted, this._capturingStarted, this);
- WebInspector.timelineManager.addEventListener(WebInspector.TimelineManager.Event.CapturingStopped, this._capturingStopped, this);
-};
</del><ins>+ WebInspector.contentBrowser.addEventListener(WebInspector.ContentBrowser.Event.CurrentContentViewDidChange, this._contentBrowserCurrentContentViewDidChange, this);
+ WebInspector.timelineManager.addEventListener(WebInspector.TimelineManager.Event.CapturingStarted, this._capturingStarted, this);
+ WebInspector.timelineManager.addEventListener(WebInspector.TimelineManager.Event.CapturingStopped, this._capturingStopped, this);
+ }
</ins><span class="cx">
</span><del>-WebInspector.TimelineSidebarPanel.HiddenStyleClassName = "hidden";
-WebInspector.TimelineSidebarPanel.StatusBarStyleClass = "status-bar";
-WebInspector.TimelineSidebarPanel.RecordGlyphStyleClass = "record-glyph";
-WebInspector.TimelineSidebarPanel.RecordGlyphRecordingStyleClass = "recording";
-WebInspector.TimelineSidebarPanel.RecordGlyphRecordingForcedStyleClass = "forced";
-WebInspector.TimelineSidebarPanel.RecordStatusStyleClass = "record-status";
-WebInspector.TimelineSidebarPanel.TitleBarStyleClass = "title-bar";
-WebInspector.TimelineSidebarPanel.TimelinesTitleBarStyleClass = "timelines";
-WebInspector.TimelineSidebarPanel.TimelineEventsTitleBarStyleClass = "timeline-events";
-WebInspector.TimelineSidebarPanel.TimelinesContentContainerStyleClass = "timelines-content";
-WebInspector.TimelineSidebarPanel.CloseButtonStyleClass = "close-button";
-WebInspector.TimelineSidebarPanel.LargeIconStyleClass = "large";
-WebInspector.TimelineSidebarPanel.StopwatchIconStyleClass = "stopwatch-icon";
-WebInspector.TimelineSidebarPanel.NetworkIconStyleClass = "network-icon";
-WebInspector.TimelineSidebarPanel.ColorsIconStyleClass = "colors-icon";
-WebInspector.TimelineSidebarPanel.ScriptIconStyleClass = "script-icon";
-WebInspector.TimelineSidebarPanel.RunLoopIconStyleClass = "runloop-icon";
-WebInspector.TimelineSidebarPanel.TimelineRecordingContentViewShowingStyleClass = "timeline-recording-content-view-showing";
-
-WebInspector.TimelineSidebarPanel.ShowingTimelineRecordingContentViewCookieKey = "timeline-sidebar-panel-showing-timeline-recording-content-view";
-WebInspector.TimelineSidebarPanel.SelectedTimelineViewIdentifierCookieKey = "timeline-sidebar-panel-selected-timeline-view-identifier";
-WebInspector.TimelineSidebarPanel.OverviewTimelineIdentifierCookieValue = "overview";
-
-WebInspector.TimelineSidebarPanel.prototype = {
- constructor: WebInspector.TimelineSidebarPanel,
- __proto__: WebInspector.NavigationSidebarPanel.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><del>- shown: function()
</del><ins>+ shown()
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.NavigationSidebarPanel.prototype.shown.call(this);
</span><span class="cx">
</span><span class="cx"> if (this._displayedContentView)
</span><span class="cx"> WebInspector.contentBrowser.showContentView(this._displayedContentView);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showDefaultContentView: function()
</del><ins>+ showDefaultContentView()
</ins><span class="cx"> {
</span><span class="cx"> if (this._displayedContentView)
</span><span class="cx"> this.showTimelineOverview();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get hasSelectedElement()
</span><span class="cx"> {
</span><span class="cx"> return !!this._contentTreeOutline.selectedTreeElement || !!this._recordingsTreeOutline.selectedTreeElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- treeElementForRepresentedObject: function(representedObject)
</del><ins>+ treeElementForRepresentedObject(representedObject)
</ins><span class="cx"> {
</span><span class="cx"> if (representedObject instanceof WebInspector.TimelineRecording)
</span><span class="cx"> return this._recordingTreeElementMap.get(representedObject);
</span><span class="lines">@@ -240,12 +215,12 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> return null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get contentTreeOutlineLabel()
</span><span class="cx"> {
</span><span class="cx"> return this._timelineEventsTitleBarElement.textContent;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set contentTreeOutlineLabel(label)
</span><span class="cx"> {
</span><span class="lines">@@ -253,56 +228,56 @@
</span><span class="cx">
</span><span class="cx"> this._timelineEventsTitleBarElement.textContent = label;
</span><span class="cx"> this.filterBar.placeholder = WebInspector.UIString("Filter %s").format(label);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showTimelineOverview: function()
</del><ins>+ showTimelineOverview()
</ins><span class="cx"> {
</span><span class="cx"> if (this._timelinesTreeOutline.selectedTreeElement)
</span><span class="cx"> this._timelinesTreeOutline.selectedTreeElement.deselect();
</span><span class="cx">
</span><span class="cx"> this._displayedContentView.showOverviewTimelineView();
</span><span class="cx"> WebInspector.contentBrowser.showContentView(this._displayedContentView);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showTimelineViewForTimeline: function(timeline)
</del><ins>+ showTimelineViewForTimeline(timeline)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(timeline instanceof WebInspector.Timeline, timeline);
</span><span class="cx"> console.assert(this._timelineTreeElementMap.has(timeline), "Cannot show timeline because it does not belong to the shown recording.", timeline);
</span><span class="cx">
</span><span class="cx"> // Defer showing the relevant timeline to the onselect handler of the timelines tree element.
</span><del>- const wasSelectedByUser = true;
- const shouldSuppressOnSelect = false;
</del><ins>+ var wasSelectedByUser = true;
+ var shouldSuppressOnSelect = false;
</ins><span class="cx"> this._timelineTreeElementMap.get(timeline).select(true, wasSelectedByUser, shouldSuppressOnSelect, true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Protected
</span><span class="cx">
</span><del>- updateFilter: function()
</del><ins>+ updateFilter()
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.NavigationSidebarPanel.prototype.updateFilter.call(this);
</span><span class="cx">
</span><span class="cx"> this._displayedContentView.filterDidChange();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- hasCustomFilters: function()
</del><ins>+ hasCustomFilters()
</ins><span class="cx"> {
</span><span class="cx"> return true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- matchTreeElementAgainstCustomFilters: function(treeElement)
</del><ins>+ matchTreeElementAgainstCustomFilters(treeElement)
</ins><span class="cx"> {
</span><span class="cx"> if (!this._displayedContentView)
</span><span class="cx"> return true;
</span><span class="cx">
</span><span class="cx"> return this._displayedContentView.matchTreeElementAgainstCustomFilters(treeElement);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- canShowDifferentContentView: function()
</del><ins>+ canShowDifferentContentView()
</ins><span class="cx"> {
</span><span class="cx"> return !this.restoringState || !this._restoredShowingTimelineRecordingContentView;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- saveStateToCookie: function(cookie)
</del><ins>+ saveStateToCookie(cookie)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(cookie);
</span><span class="cx">
</span><span class="lines">@@ -314,10 +289,10 @@
</span><span class="cx"> else
</span><span class="cx"> cookie[WebInspector.TimelineSidebarPanel.SelectedTimelineViewIdentifierCookieKey] = WebInspector.TimelineSidebarPanel.OverviewTimelineIdentifierCookieValue;
</span><span class="cx">
</span><del>- WebInspector.NavigationSidebarPanel.prototype.saveStateToCookie.call(this, cookie);
- },
</del><ins>+ super.saveStateToCookie(cookie);
+ }
</ins><span class="cx">
</span><del>- restoreStateFromCookie: function(cookie, relaxedMatchDelay)
</del><ins>+ restoreStateFromCookie(cookie, relaxedMatchDelay)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(cookie);
</span><span class="cx">
</span><span class="lines">@@ -340,11 +315,11 @@
</span><span class="cx">
</span><span class="cx"> // Don't call NavigationSidebarPanel.restoreStateFromCookie, because it tries to match based
</span><span class="cx"> // on type only as a last resort. This would cause the first recording to be reselected on reload.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _recordingsTreeElementSelected: function(treeElement, selectedByUser)
</del><ins>+ _recordingsTreeElementSelected(treeElement, selectedByUser)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(treeElement.representedObject instanceof WebInspector.TimelineRecording);
</span><span class="cx"> console.assert(!selectedByUser, "Recording tree elements should be hidden and only programmatically selectable.");
</span><span class="lines">@@ -354,16 +329,16 @@
</span><span class="cx"> // Deselect or re-select the timeline tree element for the timeline view being displayed.
</span><span class="cx"> var currentTimelineView = this._displayedContentView.currentTimelineView;
</span><span class="cx"> if (currentTimelineView && currentTimelineView.representedObject instanceof WebInspector.Timeline) {
</span><del>- const wasSelectedByUser = false; // This is a simulated selection.
- const shouldSuppressOnSelect = false;
</del><ins>+ var wasSelectedByUser = false; // This is a simulated selection.
+ var shouldSuppressOnSelect = false;
</ins><span class="cx"> this._timelineTreeElementMap.get(currentTimelineView.representedObject).select(true, wasSelectedByUser, shouldSuppressOnSelect, true);
</span><span class="cx"> } else if (this._timelinesTreeOutline.selectedTreeElement)
</span><span class="cx"> this._timelinesTreeOutline.selectedTreeElement.deselect();
</span><span class="cx">
</span><span class="cx"> this.updateFilter();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _timelinesTreeElementSelected: function(treeElement, selectedByUser)
</del><ins>+ _timelinesTreeElementSelected(treeElement, selectedByUser)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(this._timelineTreeElementMap.get(treeElement.representedObject) === treeElement, treeElement);
</span><span class="cx">
</span><span class="lines">@@ -379,27 +354,27 @@
</span><span class="cx">
</span><span class="cx"> this._displayedContentView.showTimelineViewForTimeline(timeline);
</span><span class="cx"> WebInspector.contentBrowser.showContentView(this._displayedContentView);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _contentBrowserCurrentContentViewDidChange: function(event)
</del><ins>+ _contentBrowserCurrentContentViewDidChange(event)
</ins><span class="cx"> {
</span><span class="cx"> var didShowTimelineRecordingContentView = WebInspector.contentBrowser.currentContentView instanceof WebInspector.TimelineRecordingContentView;
</span><span class="cx"> this.element.classList.toggle(WebInspector.TimelineSidebarPanel.TimelineRecordingContentViewShowingStyleClass, didShowTimelineRecordingContentView);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _capturingStarted: function(event)
</del><ins>+ _capturingStarted(event)
</ins><span class="cx"> {
</span><span class="cx"> this._recordStatusElement.textContent = WebInspector.UIString("Recording");
</span><span class="cx"> this._recordGlyphElement.classList.add(WebInspector.TimelineSidebarPanel.RecordGlyphRecordingStyleClass);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _capturingStopped: function(event)
</del><ins>+ _capturingStopped(event)
</ins><span class="cx"> {
</span><span class="cx"> this._recordStatusElement.textContent = "";
</span><span class="cx"> this._recordGlyphElement.classList.remove(WebInspector.TimelineSidebarPanel.RecordGlyphRecordingStyleClass);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _recordingCreated: function(event)
</del><ins>+ _recordingCreated(event)
</ins><span class="cx"> {
</span><span class="cx"> var recording = event.data.recording;
</span><span class="cx"> console.assert(recording instanceof WebInspector.TimelineRecording, recording);
</span><span class="lines">@@ -409,9 +384,9 @@
</span><span class="cx"> this._recordingsTreeOutline.appendChild(recordingTreeElement);
</span><span class="cx">
</span><span class="cx"> this._recordingCountChanged();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _recordingCountChanged: function()
</del><ins>+ _recordingCountChanged()
</ins><span class="cx"> {
</span><span class="cx"> var previousTreeElement = null;
</span><span class="cx"> for (var treeElement of this._recordingTreeElementMap.values()) {
</span><span class="lines">@@ -422,9 +397,9 @@
</span><span class="cx">
</span><span class="cx"> previousTreeElement = treeElement;
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _recordingSelected: function(recording)
</del><ins>+ _recordingSelected(recording)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(recording instanceof WebInspector.TimelineRecording, recording);
</span><span class="cx">
</span><span class="lines">@@ -448,14 +423,14 @@
</span><span class="cx"> this._displayedContentView = WebInspector.contentBrowser.contentViewForRepresentedObject(this._displayedRecording);
</span><span class="cx"> if (this.selected)
</span><span class="cx"> WebInspector.contentBrowser.showContentView(this._displayedContentView);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _recordingLoaded: function(event)
</del><ins>+ _recordingLoaded(event)
</ins><span class="cx"> {
</span><span class="cx"> this._recordingSelected(WebInspector.timelineManager.activeRecording);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _timelineAdded: function(timelineOrEvent)
</del><ins>+ _timelineAdded(timelineOrEvent)
</ins><span class="cx"> {
</span><span class="cx"> var timeline = timelineOrEvent;
</span><span class="cx"> if (!(timeline instanceof WebInspector.Timeline))
</span><span class="lines">@@ -465,7 +440,7 @@
</span><span class="cx"> console.assert(!this._timelineTreeElementMap.has(timeline), timeline);
</span><span class="cx">
</span><span class="cx"> var timelineTreeElement = new WebInspector.GeneralTreeElement([timeline.iconClassName, WebInspector.TimelineSidebarPanel.LargeIconStyleClass], timeline.displayName, null, timeline);
</span><del>- const tooltip = WebInspector.UIString("Close %s timeline view").format(timeline.displayName);
</del><ins>+ var tooltip = WebInspector.UIString("Close %s timeline view").format(timeline.displayName);
</ins><span class="cx"> wrappedSVGDocument(platformImagePath("CloseLarge.svg"), WebInspector.TimelineSidebarPanel.CloseButtonStyleClass, tooltip, function(element) {
</span><span class="cx"> var button = new WebInspector.TreeElementStatusButton(element);
</span><span class="cx"> button.addEventListener(WebInspector.TreeElementStatusButton.Event.Clicked, this.showTimelineOverview, this);
</span><span class="lines">@@ -475,24 +450,24 @@
</span><span class="cx"> this._timelineTreeElementMap.set(timeline, timelineTreeElement);
</span><span class="cx">
</span><span class="cx"> this._timelineCountChanged();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _timelineRemoved: function(event)
</del><ins>+ _timelineRemoved(event)
</ins><span class="cx"> {
</span><span class="cx"> var timeline = event.data.timeline;
</span><span class="cx"> console.assert(timeline instanceof WebInspector.Timeline, timeline);
</span><span class="cx"> console.assert(this._timelineTreeElementMap.has(timeline), timeline);
</span><span class="cx">
</span><span class="cx"> var timelineTreeElement = this._timelineTreeElementMap.take(timeline);
</span><del>- const shouldSuppressOnDeselect = false;
- const shouldSuppressSelectSibling = true;
</del><ins>+ var shouldSuppressOnDeselect = false;
+ var shouldSuppressSelectSibling = true;
</ins><span class="cx"> this._timelinesTreeOutline.removeChild(timelineTreeElement, shouldSuppressOnDeselect, shouldSuppressSelectSibling);
</span><span class="cx"> this._timelineTreeElementMap.delete(timeline);
</span><span class="cx">
</span><span class="cx"> this._timelineCountChanged();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _timelineCountChanged: function()
</del><ins>+ _timelineCountChanged()
</ins><span class="cx"> {
</span><span class="cx"> var previousTreeElement = null;
</span><span class="cx"> for (var treeElement of this._timelineTreeElementMap.values()) {
</span><span class="lines">@@ -504,16 +479,16 @@
</span><span class="cx"> previousTreeElement = treeElement;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- const timelineHeight = 36;
- const eventTitleBarOffset = 51;
- const contentElementOffset = 74;
</del><ins>+ var timelineHeight = 36;
+ var eventTitleBarOffset = 51;
+ var contentElementOffset = 74;
</ins><span class="cx"> var timelineCount = this._displayedRecording.timelines.size;
</span><span class="cx"> this._timelinesContentContainerElement.style.height = (timelineHeight * timelineCount) + "px";
</span><span class="cx"> this._timelineEventsTitleBarElement.style.top = (timelineHeight * timelineCount + eventTitleBarOffset) + "px";
</span><span class="cx"> this.contentElement.style.top = (timelineHeight * timelineCount + contentElementOffset) + "px";
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _recordGlyphMousedOver: function(event)
</del><ins>+ _recordGlyphMousedOver(event)
</ins><span class="cx"> {
</span><span class="cx"> this._recordGlyphElement.classList.remove(WebInspector.TimelineSidebarPanel.RecordGlyphRecordingForcedStyleClass);
</span><span class="cx">
</span><span class="lines">@@ -521,9 +496,9 @@
</span><span class="cx"> this._recordStatusElement.textContent = WebInspector.UIString("Stop Recording");
</span><span class="cx"> else
</span><span class="cx"> this._recordStatusElement.textContent = WebInspector.UIString("Start Recording");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _recordGlyphMousedOut: function(event)
</del><ins>+ _recordGlyphMousedOut(event)
</ins><span class="cx"> {
</span><span class="cx"> this._recordGlyphElement.classList.remove(WebInspector.TimelineSidebarPanel.RecordGlyphRecordingForcedStyleClass);
</span><span class="cx">
</span><span class="lines">@@ -531,9 +506,9 @@
</span><span class="cx"> this._recordStatusElement.textContent = WebInspector.UIString("Recording");
</span><span class="cx"> else
</span><span class="cx"> this._recordStatusElement.textContent = "";
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _recordGlyphClicked: function(event)
</del><ins>+ _recordGlyphClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> // Add forced class to prevent the glyph from showing a confusing status after click.
</span><span class="cx"> this._recordGlyphElement.classList.add(WebInspector.TimelineSidebarPanel.RecordGlyphRecordingForcedStyleClass);
</span><span class="lines">@@ -547,19 +522,19 @@
</span><span class="cx"> // Show the timeline to which events will be appended.
</span><span class="cx"> this._recordingLoaded();
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // These methods are only used when ReplayAgent is available.
</span><span class="cx">
</span><del>- _updateReplayInterfaceVisibility: function()
</del><ins>+ _updateReplayInterfaceVisibility()
</ins><span class="cx"> {
</span><span class="cx"> var shouldShowReplayInterface = window.ReplayAgent && WebInspector.showReplayInterfaceSetting.value;
</span><span class="cx">
</span><span class="cx"> this._statusBarElement.classList.toggle(WebInspector.TimelineSidebarPanel.HiddenStyleClassName, shouldShowReplayInterface);
</span><span class="cx"> this._navigationBar.element.classList.toggle(WebInspector.TimelineSidebarPanel.HiddenStyleClassName, !shouldShowReplayInterface);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _contextMenuNavigationBarOrStatusBar: function()
</del><ins>+ _contextMenuNavigationBarOrStatusBar()
</ins><span class="cx"> {
</span><span class="cx"> if (!window.ReplayAgent)
</span><span class="cx"> return;
</span><span class="lines">@@ -574,9 +549,9 @@
</span><span class="cx"> else
</span><span class="cx"> contextMenu.appendItem(WebInspector.UIString("Show Replay Controls"), toggleReplayInterface);
</span><span class="cx"> contextMenu.show();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _replayCaptureButtonClicked: function()
</del><ins>+ _replayCaptureButtonClicked()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._replayCaptureButtonItem.activated) {
</span><span class="cx"> WebInspector.replayManager.startCapturing();
</span><span class="lines">@@ -591,34 +566,57 @@
</span><span class="cx">
</span><span class="cx"> this._replayCaptureButtonItem.enabled = false;
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _replayPauseResumeButtonClicked: function()
</del><ins>+ _replayPauseResumeButtonClicked()
</ins><span class="cx"> {
</span><span class="cx"> if (this._replayPauseResumeButtonItem.toggled)
</span><span class="cx"> WebInspector.replayManager.pausePlayback();
</span><span class="cx"> else
</span><span class="cx"> WebInspector.replayManager.replayToCompletion();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _captureStarted: function()
</del><ins>+ _captureStarted()
</ins><span class="cx"> {
</span><span class="cx"> this._replayCaptureButtonItem.enabled = true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _captureStopped: function()
</del><ins>+ _captureStopped()
</ins><span class="cx"> {
</span><span class="cx"> this._replayCaptureButtonItem.activated = false;
</span><span class="cx"> this._replayPauseResumeButtonItem.enabled = true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _playbackStarted: function()
</del><ins>+ _playbackStarted()
</ins><span class="cx"> {
</span><span class="cx"> this._replayPauseResumeButtonItem.toggled = true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _playbackPaused: function()
</del><ins>+ _playbackPaused()
</ins><span class="cx"> {
</span><span class="cx"> this._replayPauseResumeButtonItem.toggled = false;
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.TimelineSidebarPanel.HiddenStyleClassName = "hidden";
+WebInspector.TimelineSidebarPanel.StatusBarStyleClass = "status-bar";
+WebInspector.TimelineSidebarPanel.RecordGlyphStyleClass = "record-glyph";
+WebInspector.TimelineSidebarPanel.RecordGlyphRecordingStyleClass = "recording";
+WebInspector.TimelineSidebarPanel.RecordGlyphRecordingForcedStyleClass = "forced";
+WebInspector.TimelineSidebarPanel.RecordStatusStyleClass = "record-status";
+WebInspector.TimelineSidebarPanel.TitleBarStyleClass = "title-bar";
+WebInspector.TimelineSidebarPanel.TimelinesTitleBarStyleClass = "timelines";
+WebInspector.TimelineSidebarPanel.TimelineEventsTitleBarStyleClass = "timeline-events";
+WebInspector.TimelineSidebarPanel.TimelinesContentContainerStyleClass = "timelines-content";
+WebInspector.TimelineSidebarPanel.CloseButtonStyleClass = "close-button";
+WebInspector.TimelineSidebarPanel.LargeIconStyleClass = "large";
+WebInspector.TimelineSidebarPanel.StopwatchIconStyleClass = "stopwatch-icon";
+WebInspector.TimelineSidebarPanel.NetworkIconStyleClass = "network-icon";
+WebInspector.TimelineSidebarPanel.ColorsIconStyleClass = "colors-icon";
+WebInspector.TimelineSidebarPanel.ScriptIconStyleClass = "script-icon";
+WebInspector.TimelineSidebarPanel.RunLoopIconStyleClass = "runloop-icon";
+WebInspector.TimelineSidebarPanel.TimelineRecordingContentViewShowingStyleClass = "timeline-recording-content-view-showing";
+
+WebInspector.TimelineSidebarPanel.ShowingTimelineRecordingContentViewCookieKey = "timeline-sidebar-panel-showing-timeline-recording-content-view";
+WebInspector.TimelineSidebarPanel.SelectedTimelineViewIdentifierCookieKey = "timeline-sidebar-panel-selected-timeline-view-identifier";
+WebInspector.TimelineSidebarPanel.OverviewTimelineIdentifierCookieValue = "overview";
</ins></span></pre>
</div>
</div>
</body>
</html>