<!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>[193053] branches/safari-601-branch/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/193053">193053</a></dd>
<dt>Author</dt> <dd>timothy@apple.com</dd>
<dt>Date</dt> <dd>2015-12-03 10:35:53 -0800 (Thu, 03 Dec 2015)</dd>
</dl>
<h3>Log Message</h3>
<pre>Merge <a href="http://trac.webkit.org/projects/webkit/changeset/187873">r187873</a>. rdar://problem/23221163</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#branchessafari601branchSourceWebInspectorUIChangeLog">branches/safari-601-branch/Source/WebInspectorUI/ChangeLog</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsDOMTreeDataGridjs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/DOMTreeDataGrid.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsDataGridjs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/DataGrid.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsDatabaseTableContentViewjs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/DatabaseTableContentView.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsIndexedDatabaseEntryDataGridNodejs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseEntryDataGridNode.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsLayerTreeDataGridNodejs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/LayerTreeDataGridNode.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsLayoutTimelineDataGridjs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGrid.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsLayoutTimelineDataGridNodejs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsProbeSetDataGridjs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ProbeSetDataGrid.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsProfileNodeDataGridNodejs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ProfileNodeDataGridNode.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsRenderingFrameTimelineDataGridNodejs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineDataGridNode.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsResourceTimelineDataGridNodejs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsScriptTimelineDataGridjs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ScriptTimelineDataGrid.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsScriptTimelineDataGridNodejs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ScriptTimelineDataGridNode.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsSourceCodeTimelineTimelineDataGridNodejs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/SourceCodeTimelineTimelineDataGridNode.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsTimelineDataGridjs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.js</a></li>
<li><a href="#branchessafari601branchSourceWebInspectorUIUserInterfaceViewsTimelineDataGridNodejs">branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/TimelineDataGridNode.js</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="branchessafari601branchSourceWebInspectorUIChangeLog"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/ChangeLog (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/ChangeLog 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/ChangeLog 2015-12-03 18:35:53 UTC (rev 193053)
</span><span class="lines">@@ -1,5 +1,38 @@
</span><span class="cx"> 2015-12-01 Timothy Hatcher <timothy@apple.com>
</span><span class="cx">
</span><ins>+ Merge r187873. rdar://problem/23221163
+
+ 2015-08-04 Brian J. Burg <bburg@apple.com>
+
+ Web Inspector: Convert DataGrid and DataGridNode classes to ES6 classes
+ https://bugs.webkit.org/show_bug.cgi?id=147439
+
+ Reviewed by Joseph Pecoraro.
+
+ Along the way, inline a few style class names.
+
+ Elided mechanical changes from the Changelog.
+
+ * UserInterface/Views/DOMTreeDataGrid.js:
+ * UserInterface/Views/DataGrid.js:
+ * UserInterface/Views/DatabaseTableContentView.js:
+ * UserInterface/Views/IndexedDatabaseEntryDataGridNode.js:
+ * UserInterface/Views/LayerTreeDataGridNode.js:
+ * UserInterface/Views/LayoutTimelineDataGrid.js:
+ * UserInterface/Views/LayoutTimelineDataGridNode.js:
+ * UserInterface/Views/ProbeSetDataGrid.js:
+ * UserInterface/Views/ProfileNodeDataGridNode.js:
+ * UserInterface/Views/RenderingFrameTimelineDataGridNode.js:
+ * UserInterface/Views/ResourceTimelineDataGridNode.js:
+ * UserInterface/Views/ScriptTimelineDataGrid.js:
+ * UserInterface/Views/ScriptTimelineDataGridNode.js:
+ * UserInterface/Views/SourceCodeTimelineTimelineDataGridNode.js:
+ * UserInterface/Views/TimelineDataGrid.js:
+ * UserInterface/Views/TimelineDataGridNode.js: Move a function definition out
+ of an else branch, since this is not allowed in ES6 strict mode.
+
+2015-12-01 Timothy Hatcher <timothy@apple.com>
+
</ins><span class="cx"> Merge r187872. rdar://problem/23221163
</span><span class="cx">
</span><span class="cx"> 2015-08-04 Brian J. Burg <burg@cs.washington.edu>
</span></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsDOMTreeDataGridjs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/DOMTreeDataGrid.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/DOMTreeDataGrid.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/DOMTreeDataGrid.js 2015-12-03 18:35:53 UTC (rev 193053)
</span><span class="lines">@@ -1,5 +1,6 @@
</span><span class="cx"> /*
</span><span class="cx"> * Copyright (C) 2013 Adobe Systems Inc. All rights reserved.
</span><ins>+ * Copyright (C) 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,33 +24,34 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.DOMTreeDataGrid = function() {
- WebInspector.DataGrid.call(this, {
- name: { title: WebInspector.UIString("Node"), sortable: false }
- });
</del><ins>+WebInspector.DOMTreeDataGrid = class DOMTreeDataGrid extends WebInspector.DataGrid
+{
+ constructor()
+ {
+ super({
+ name: {title: WebInspector.UIString("Node"), sortable: false}
+ });
</ins><span class="cx">
</span><del>- this._previousHoveredElement = null;
</del><ins>+ this._previousHoveredElement = null;
</ins><span class="cx">
</span><del>- this.element.classList.add("inline", "dom-tree-data-grid");
</del><ins>+ this.element.classList.add("inline", "dom-tree-data-grid");
</ins><span class="cx">
</span><del>- this.element.addEventListener("mousemove", this._onmousemove.bind(this), false);
- this.element.addEventListener("mouseout", this._onmouseout.bind(this), false);
-};
</del><ins>+ this.element.addEventListener("mousemove", this._onmousemove.bind(this), false);
+ this.element.addEventListener("mouseout", this._onmouseout.bind(this), false);
+ }
</ins><span class="cx">
</span><del>-WebInspector.DOMTreeDataGrid.prototype = {
- constructor: WebInspector.DOMTreeDataGrid,
- __proto__: WebInspector.DataGrid.prototype,
</del><ins>+ // Private
</ins><span class="cx">
</span><del>- _onmousemove: function(event)
</del><ins>+ _onmousemove(event)
</ins><span class="cx"> {
</span><span class="cx"> var gridNode = this.dataGridNodeFromNode(event.target);
</span><span class="cx"> if (!gridNode || this._previousHoveredElement === gridNode.domNode)
</span><span class="cx"> return;
</span><span class="cx"> this._previousHoveredElement = gridNode.domNode;
</span><span class="cx"> WebInspector.domTreeManager.highlightDOMNode(gridNode.domNode.id);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _onmouseout: function(event) {
</del><ins>+ _onmouseout(event) {
</ins><span class="cx"> if (!this._previousHoveredElement)
</span><span class="cx"> return;
</span><span class="cx"> WebInspector.domTreeManager.hideDOMNodeHighlight();
</span></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsDataGridjs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/DataGrid.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/DataGrid.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/DataGrid.js 2015-12-03 18:35:53 UTC (rev 193053)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2008, 2013, 2014 Apple Inc. All Rights Reserved.
</del><ins>+ * Copyright (C) 2008, 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,180 +23,162 @@
</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.DataGrid = function(columnsData, editCallback, deleteCallback, preferredColumnOrder)
</del><ins>+WebInspector.DataGrid = class DataGrid extends WebInspector.Object
</ins><span class="cx"> {
</span><del>- this.columns = new Map;
- this.orderedColumns = [];
</del><ins>+ constructor(columnsData, editCallback, deleteCallback, preferredColumnOrder)
+ {
+ super();
</ins><span class="cx">
</span><del>- this._sortColumnIdentifier = null;
- this._sortOrder = WebInspector.DataGrid.SortOrder.Indeterminate;
</del><ins>+ this.columns = new Map;
+ this.orderedColumns = [];
</ins><span class="cx">
</span><del>- this.children = [];
- this.selectedNode = null;
- this.expandNodesWhenArrowing = false;
- this.root = true;
- this.hasChildren = false;
- this.expanded = true;
- this.revealed = true;
- this.selected = false;
- this.dataGrid = this;
- this.indentWidth = 15;
- this.resizers = [];
- this._columnWidthsInitialized = false;
</del><ins>+ this._sortColumnIdentifier = null;
+ this._sortOrder = WebInspector.DataGrid.SortOrder.Indeterminate;
</ins><span class="cx">
</span><del>- this.element = document.createElement("div");
- this.element.className = "data-grid";
- this.element.tabIndex = 0;
- this.element.addEventListener("keydown", this._keyDown.bind(this), false);
- this.element.copyHandler = this;
</del><ins>+ this.children = [];
+ this.selectedNode = null;
+ this.expandNodesWhenArrowing = false;
+ this.root = true;
+ this.hasChildren = false;
+ this.expanded = true;
+ this.revealed = true;
+ this.selected = false;
+ this.dataGrid = this;
+ this.indentWidth = 15;
+ this.resizers = [];
+ this._columnWidthsInitialized = false;
</ins><span class="cx">
</span><del>- this._headerTableElement = document.createElement("table");
- this._headerTableElement.className = "header";
- this._headerTableColumnGroupElement = this._headerTableElement.createChild("colgroup");
- this._headerTableBodyElement = this._headerTableElement.createChild("tbody");
- this._headerTableRowElement = this._headerTableBodyElement.createChild("tr");
- this._headerTableCellElements = new Map;
</del><ins>+ this.element = document.createElement("div");
+ this.element.className = "data-grid";
+ this.element.tabIndex = 0;
+ this.element.addEventListener("keydown", this._keyDown.bind(this), false);
+ this.element.copyHandler = this;
</ins><span class="cx">
</span><del>- this._scrollContainerElement = document.createElement("div");
- this._scrollContainerElement.className = "data-container";
</del><ins>+ this._headerTableElement = document.createElement("table");
+ this._headerTableElement.className = "header";
+ this._headerTableColumnGroupElement = this._headerTableElement.createChild("colgroup");
+ this._headerTableBodyElement = this._headerTableElement.createChild("tbody");
+ this._headerTableRowElement = this._headerTableBodyElement.createChild("tr");
+ this._headerTableCellElements = new Map;
</ins><span class="cx">
</span><del>- this._dataTableElement = this._scrollContainerElement.createChild("table");
- this._dataTableElement.className = "data";
</del><ins>+ this._scrollContainerElement = document.createElement("div");
+ this._scrollContainerElement.className = "data-container";
</ins><span class="cx">
</span><del>- this._dataTableElement.addEventListener("mousedown", this._mouseDownInDataTable.bind(this));
- this._dataTableElement.addEventListener("click", this._clickInDataTable.bind(this));
- this._dataTableElement.addEventListener("contextmenu", this._contextMenuInDataTable.bind(this), true);
</del><ins>+ this._dataTableElement = this._scrollContainerElement.createChild("table");
+ this._dataTableElement.className = "data";
</ins><span class="cx">
</span><del>- // FIXME: Add a createCallback which is different from editCallback and has different
- // behavior when creating a new node.
- if (editCallback) {
- this._dataTableElement.addEventListener("dblclick", this._ondblclick.bind(this), false);
- this._editCallback = editCallback;
- }
- if (deleteCallback)
- this._deleteCallback = deleteCallback;
</del><ins>+ this._dataTableElement.addEventListener("mousedown", this._mouseDownInDataTable.bind(this));
+ this._dataTableElement.addEventListener("click", this._clickInDataTable.bind(this));
+ this._dataTableElement.addEventListener("contextmenu", this._contextMenuInDataTable.bind(this), true);
</ins><span class="cx">
</span><del>- this._dataTableColumnGroupElement = this._headerTableColumnGroupElement.cloneNode(true);
- this._dataTableElement.appendChild(this._dataTableColumnGroupElement);
</del><ins>+ // FIXME: Add a createCallback which is different from editCallback and has different
+ // behavior when creating a new node.
+ if (editCallback) {
+ this._dataTableElement.addEventListener("dblclick", this._ondblclick.bind(this), false);
+ this._editCallback = editCallback;
+ }
+ if (deleteCallback)
+ this._deleteCallback = deleteCallback;
</ins><span class="cx">
</span><del>- // This element is used by DataGridNodes to manipulate table rows and cells.
- this.dataTableBodyElement = this._dataTableElement.createChild("tbody");
- this._fillerRowElement = this.dataTableBodyElement.createChild("tr");
- this._fillerRowElement.className = "filler";
</del><ins>+ this._dataTableColumnGroupElement = this._headerTableColumnGroupElement.cloneNode(true);
+ this._dataTableElement.appendChild(this._dataTableColumnGroupElement);
</ins><span class="cx">
</span><del>- this.element.appendChild(this._headerTableElement);
- this.element.appendChild(this._scrollContainerElement);
</del><ins>+ // This element is used by DataGridNodes to manipulate table rows and cells.
+ this.dataTableBodyElement = this._dataTableElement.createChild("tbody");
+ this._fillerRowElement = this.dataTableBodyElement.createChild("tr");
+ this._fillerRowElement.className = "filler";
</ins><span class="cx">
</span><del>- if (preferredColumnOrder) {
- for (var columnIdentifier of preferredColumnOrder)
- this.insertColumn(columnIdentifier, columnsData[columnIdentifier]);
- } else {
- for (var columnIdentifier in columnsData)
- this.insertColumn(columnIdentifier, columnsData[columnIdentifier]);
- }
</del><ins>+ this.element.appendChild(this._headerTableElement);
+ this.element.appendChild(this._scrollContainerElement);
</ins><span class="cx">
</span><del>- this._generateSortIndicatorImagesIfNeeded();
-}
</del><ins>+ if (preferredColumnOrder) {
+ for (var columnIdentifier of preferredColumnOrder)
+ this.insertColumn(columnIdentifier, columnsData[columnIdentifier]);
+ } else {
+ for (var columnIdentifier in columnsData)
+ this.insertColumn(columnIdentifier, columnsData[columnIdentifier]);
+ }
</ins><span class="cx">
</span><del>-WebInspector.DataGrid.Event = {
- DidLayout: "datagrid-did-layout",
- SortChanged: "datagrid-sort-changed",
- SelectedNodeChanged: "datagrid-selected-node-changed",
- ExpandedNode: "datagrid-expanded-node",
- CollapsedNode: "datagrid-collapsed-node"
-};
-
-WebInspector.DataGrid.SortOrder = {
- Indeterminate: "data-grid-sort-order-indeterminate",
- Ascending: "data-grid-sort-order-ascending",
- Descending: "data-grid-sort-order-descending"
-};
-
-WebInspector.DataGrid.PreviousColumnOrdinalSymbol = Symbol("previous-column-ordinal");
-WebInspector.DataGrid.NextColumnOrdinalSymbol = Symbol("next-column-ordinal");
-
-WebInspector.DataGrid.SortColumnAscendingStyleClassName = "sort-ascending";
-WebInspector.DataGrid.SortColumnDescendingStyleClassName = "sort-descending";
-WebInspector.DataGrid.SortableColumnStyleClassName = "sortable";
-
-WebInspector.DataGrid.createSortableDataGrid = function(columnNames, values)
-{
- var numColumns = columnNames.length;
- if (!numColumns)
- return null;
-
- var columnsData = {};
- for (var columnName of columnNames) {
- columnsData[columnName] = {
- width: columnName.length,
- title: columnName,
- sortable: true,
- };
</del><ins>+ this._generateSortIndicatorImagesIfNeeded();
</ins><span class="cx"> }
</span><span class="cx">
</span><del>- var dataGrid = new WebInspector.DataGrid(columnsData, undefined, undefined, columnNames);
- for (var i = 0; i < values.length / numColumns; ++i) {
- var data = {};
- for (var j = 0; j < columnNames.length; ++j)
- data[columnNames[j]] = values[numColumns * i + j];
</del><ins>+ static createSortableDataGrid(columnNames, values)
+ {
+ var numColumns = columnNames.length;
+ if (!numColumns)
+ return null;
</ins><span class="cx">
</span><del>- var node = new WebInspector.DataGridNode(data, false);
- dataGrid.appendChild(node);
- }
</del><ins>+ var columnsData = {};
+ for (var columnName of columnNames) {
+ columnsData[columnName] = {
+ width: columnName.length,
+ title: columnName,
+ sortable: true,
+ };
+ }
</ins><span class="cx">
</span><del>- function sortDataGrid()
- {
- var sortColumnIdentifier = dataGrid.sortColumnIdentifier;
</del><ins>+ var dataGrid = new WebInspector.DataGrid(columnsData, undefined, undefined, columnNames);
+ for (var i = 0; i < values.length / numColumns; ++i) {
+ var data = {};
+ for (var j = 0; j < columnNames.length; ++j)
+ data[columnNames[j]] = values[numColumns * i + j];
</ins><span class="cx">
</span><del>- var columnIsNumeric = true;
- for (var node of dataGrid.children) {
- var value = dataGrid.textForDataGridNodeColumn(node, sortColumnIdentifier);
- if (isNaN(Number(value)))
- columnIsNumeric = false;
</del><ins>+ var node = new WebInspector.DataGridNode(data, false);
+ dataGrid.appendChild(node);
</ins><span class="cx"> }
</span><span class="cx">
</span><del>- function comparator(dataGridNode1, dataGridNode2)
</del><ins>+ function sortDataGrid()
</ins><span class="cx"> {
</span><del>- var item1 = dataGrid.textForDataGridNodeColumn(dataGridNode1, sortColumnIdentifier);
- var item2 = dataGrid.textForDataGridNodeColumn(dataGridNode2, sortColumnIdentifier);
</del><ins>+ var sortColumnIdentifier = dataGrid.sortColumnIdentifier;
</ins><span class="cx">
</span><del>- var comparison;
- if (columnIsNumeric) {
- var number1 = parseFloat(item1);
- var number2 = parseFloat(item2);
- comparison = number1 < number2 ? -1 : (number1 > number2 ? 1 : 0);
- } else
- comparison = item1 < item2 ? -1 : (item1 > item2 ? 1 : 0);
</del><ins>+ var columnIsNumeric = true;
+ for (var node of dataGrid.children) {
+ var value = dataGrid.textForDataGridNodeColumn(node, sortColumnIdentifier);
+ if (isNaN(Number(value)))
+ columnIsNumeric = false;
+ }
</ins><span class="cx">
</span><del>- return comparison;
- }
</del><ins>+ function comparator(dataGridNode1, dataGridNode2)
+ {
+ var item1 = dataGrid.textForDataGridNodeColumn(dataGridNode1, sortColumnIdentifier);
+ var item2 = dataGrid.textForDataGridNodeColumn(dataGridNode2, sortColumnIdentifier);
</ins><span class="cx">
</span><del>- dataGrid.sortNodes(comparator);
- }
</del><ins>+ var comparison;
+ if (columnIsNumeric) {
+ var number1 = parseFloat(item1);
+ var number2 = parseFloat(item2);
+ comparison = number1 < number2 ? -1 : (number1 > number2 ? 1 : 0);
+ } else
+ comparison = item1 < item2 ? -1 : (item1 > item2 ? 1 : 0);
</ins><span class="cx">
</span><del>- dataGrid.addEventListener(WebInspector.DataGrid.Event.SortChanged, sortDataGrid, this);
</del><ins>+ return comparison;
+ }
</ins><span class="cx">
</span><del>- dataGrid.sortOrder = WebInspector.DataGrid.SortOrder.Ascending;
- dataGrid.sortColumnIdentifier = columnNames[0];
</del><ins>+ dataGrid.sortNodes(comparator);
+ }
</ins><span class="cx">
</span><del>- return dataGrid;
-}
</del><ins>+ dataGrid.addEventListener(WebInspector.DataGrid.Event.SortChanged, sortDataGrid, this);
</ins><span class="cx">
</span><del>-WebInspector.DataGrid.prototype = {
</del><ins>+ dataGrid.sortOrder = WebInspector.DataGrid.SortOrder.Ascending;
+ dataGrid.sortColumnIdentifier = columnNames[0];
+
+ return dataGrid;
+ }
+
</ins><span class="cx"> get refreshCallback()
</span><span class="cx"> {
</span><span class="cx"> return this._refreshCallback;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set refreshCallback(refreshCallback)
</span><span class="cx"> {
</span><span class="cx"> this._refreshCallback = refreshCallback;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get sortOrder()
</span><span class="cx"> {
</span><span class="cx"> return this._sortOrder;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set sortOrder(order)
</span><span class="cx"> {
</span><span class="lines">@@ -214,12 +196,12 @@
</span><span class="cx"> sortHeaderCellElement.classList.toggle(WebInspector.DataGrid.SortColumnDescendingStyleClassName, this._sortOrder === WebInspector.DataGrid.SortOrder.Descending);
</span><span class="cx">
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.DataGrid.Event.SortChanged);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get sortColumnIdentifier()
</span><span class="cx"> {
</span><span class="cx"> return this._sortColumnIdentifier;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set sortColumnIdentifier(columnIdentifier)
</span><span class="cx"> {
</span><span class="lines">@@ -245,17 +227,17 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.DataGrid.Event.SortChanged);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _ondblclick: function(event)
</del><ins>+ _ondblclick(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this._editing || this._editingNode)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._startEditing(event.target);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _startEditingNodeAtColumnIndex: function(node, columnIndex)
</del><ins>+ _startEditingNodeAtColumnIndex(node, columnIndex)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(node, "Invalid argument: must provide DataGridNode to edit.");
</span><span class="cx">
</span><span class="lines">@@ -266,9 +248,9 @@
</span><span class="cx"> var element = this._editingNode._element.children[columnIndex];
</span><span class="cx"> WebInspector.startEditing(element, this._startEditingConfig(element));
</span><span class="cx"> window.getSelection().setBaseAndExtent(element, 0, element, 1);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _startEditing: function(target)
</del><ins>+ _startEditing(target)
</ins><span class="cx"> {
</span><span class="cx"> var element = target.enclosingNodeOrSelfWithNodeName("td");
</span><span class="cx"> if (!element)
</span><span class="lines">@@ -289,14 +271,14 @@
</span><span class="cx"> WebInspector.startEditing(element, this._startEditingConfig(element));
</span><span class="cx">
</span><span class="cx"> window.getSelection().setBaseAndExtent(element, 0, element, 1);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _startEditingConfig: function(element)
</del><ins>+ _startEditingConfig(element)
</ins><span class="cx"> {
</span><span class="cx"> return new WebInspector.EditingConfig(this._editingCommitted.bind(this), this._editingCancelled.bind(this), element.textContent);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _editingCommitted: function(element, newText, oldText, context, moveDirection)
</del><ins>+ _editingCommitted(element, newText, oldText, context, moveDirection)
</ins><span class="cx"> {
</span><span class="cx"> var columnIdentifier = element.__columnIdentifier;
</span><span class="cx"> var columnIndex = this.orderedColumns.indexOf(columnIdentifier);
</span><span class="lines">@@ -347,16 +329,16 @@
</span><span class="cx">
</span><span class="cx"> var textDidChange = textBeforeEditing.trim() !== newText.trim();
</span><span class="cx"> moveToNextCell.call(this, textDidChange);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _editingCancelled: function(element)
</del><ins>+ _editingCancelled(element)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(this._editingNode.element === element.enclosingNodeOrSelfWithNodeName("tr"));
</span><span class="cx"> delete this._editing;
</span><span class="cx"> this._editingNode = null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- autoSizeColumns: function(minPercent, maxPercent, maxDescentLevel)
</del><ins>+ autoSizeColumns(minPercent, maxPercent, maxDescentLevel)
</ins><span class="cx"> {
</span><span class="cx"> if (minPercent)
</span><span class="cx"> minPercent = Math.min(minPercent, Math.floor(100 / this.orderedColumns.length));
</span><span class="lines">@@ -421,9 +403,9 @@
</span><span class="cx"> column["element"].style.width = widths[identifier] + "%";
</span><span class="cx"> this._columnWidthsInitialized = false;
</span><span class="cx"> this.updateLayout();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- insertColumn: function(columnIdentifier, columnData, insertionIndex)
</del><ins>+ insertColumn(columnIdentifier, columnData, insertionIndex)
</ins><span class="cx"> {
</span><span class="cx"> if (insertionIndex === undefined)
</span><span class="cx"> insertionIndex = this.orderedColumns.length;
</span><span class="lines">@@ -515,9 +497,9 @@
</span><span class="cx">
</span><span class="cx"> if (column["hidden"])
</span><span class="cx"> this._hideColumn(columnIdentifier);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- removeColumn: function(columnIdentifier)
</del><ins>+ removeColumn(columnIdentifier)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(this.columns.has(columnIdentifier));
</span><span class="cx"> var removedColumn = this.columns.get(columnIdentifier);
</span><span class="lines">@@ -549,9 +531,9 @@
</span><span class="cx">
</span><span class="cx"> for (var child of this.children)
</span><span class="cx"> child.refresh();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _enumerateChildren: function(rootNode, result, maxLevel)
</del><ins>+ _enumerateChildren(rootNode, result, maxLevel)
</ins><span class="cx"> {
</span><span class="cx"> if (!rootNode.root)
</span><span class="cx"> result.push(rootNode);
</span><span class="lines">@@ -560,7 +542,7 @@
</span><span class="cx"> for (var i = 0; i < rootNode.children.length; ++i)
</span><span class="cx"> this._enumerateChildren(rootNode.children[i], result, maxLevel - 1);
</span><span class="cx"> return result;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Updates the widths of the table, including the positions of the column
</span><span class="cx"> // resizers.
</span><span class="lines">@@ -572,7 +554,7 @@
</span><span class="cx"> //
</span><span class="cx"> // If this function is not called after the DataGrid is attached to its
</span><span class="cx"> // parent element, then the DataGrid's columns will not be resizable.
</span><del>- updateLayout: function()
</del><ins>+ updateLayout()
</ins><span class="cx"> {
</span><span class="cx"> // Do not attempt to use offsetes if we're not attached to the document tree yet.
</span><span class="cx"> if (!this._columnWidthsInitialized && this.element.offsetWidth) {
</span><span class="lines">@@ -601,9 +583,9 @@
</span><span class="cx">
</span><span class="cx"> this._positionResizerElements();
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.DataGrid.Event.DidLayout);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- columnWidthsMap: function()
</del><ins>+ columnWidthsMap()
</ins><span class="cx"> {
</span><span class="cx"> var result = {};
</span><span class="cx"> for (var [identifier, column] of this.columns) {
</span><span class="lines">@@ -611,9 +593,9 @@
</span><span class="cx"> result[columnIdentifier] = parseFloat(width);
</span><span class="cx"> }
</span><span class="cx"> return result;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- applyColumnWidthsMap: function(columnWidthsMap)
</del><ins>+ applyColumnWidthsMap(columnWidthsMap)
</ins><span class="cx"> {
</span><span class="cx"> for (var [identifier, column] of this.columns) {
</span><span class="cx"> var width = (columnWidthsMap[identifier] || 0) + "%";
</span><span class="lines">@@ -623,19 +605,19 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> this.updateLayout();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _isColumnVisible: function(columnIdentifier)
</del><ins>+ _isColumnVisible(columnIdentifier)
</ins><span class="cx"> {
</span><span class="cx"> return !this.columns.get(columnIdentifier)["hidden"];
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _showColumn: function(columnIdentifier)
</del><ins>+ _showColumn(columnIdentifier)
</ins><span class="cx"> {
</span><span class="cx"> delete this.columns.get(columnIdentifier)["hidden"];
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _hideColumn: function(columnIdentifier)
</del><ins>+ _hideColumn(columnIdentifier)
</ins><span class="cx"> {
</span><span class="cx"> var column = this.columns.get(columnIdentifier);
</span><span class="cx"> column["hidden"] = true;
</span><span class="lines">@@ -644,24 +626,24 @@
</span><span class="cx"> columnElement.style.width = 0;
</span><span class="cx">
</span><span class="cx"> this._columnWidthsInitialized = false;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get scrollContainer()
</span><span class="cx"> {
</span><span class="cx"> return this._scrollContainerElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- isScrolledToLastRow: function()
</del><ins>+ isScrolledToLastRow()
</ins><span class="cx"> {
</span><span class="cx"> return this._scrollContainerElement.isScrolledToBottom();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- scrollToLastRow: function()
</del><ins>+ scrollToLastRow()
</ins><span class="cx"> {
</span><span class="cx"> this._scrollContainerElement.scrollTop = this._scrollContainerElement.scrollHeight - this._scrollContainerElement.offsetHeight;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _positionResizerElements: function()
</del><ins>+ _positionResizerElements()
</ins><span class="cx"> {
</span><span class="cx"> var left = 0;
</span><span class="cx"> var previousResizer = null;
</span><span class="lines">@@ -698,9 +680,9 @@
</span><span class="cx"> }
</span><span class="cx"> if (previousResizer)
</span><span class="cx"> previousResizer[WebInspector.DataGrid.NextColumnOrdinalSymbol] = this.orderedColumns.length - 1;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- addPlaceholderNode: function()
</del><ins>+ addPlaceholderNode()
</ins><span class="cx"> {
</span><span class="cx"> if (this.placeholderNode)
</span><span class="cx"> this.placeholderNode.makeNormal();
</span><span class="lines">@@ -710,14 +692,14 @@
</span><span class="cx"> emptyData[identifier] = "";
</span><span class="cx"> this.placeholderNode = new WebInspector.PlaceholderDataGridNode(emptyData);
</span><span class="cx"> this.appendChild(this.placeholderNode);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- appendChild: function(child)
</del><ins>+ appendChild(child)
</ins><span class="cx"> {
</span><span class="cx"> this.insertChild(child, this.children.length);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- insertChild: function(child, index)
</del><ins>+ insertChild(child, index)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(child);
</span><span class="cx"> if (!child)
</span><span class="lines">@@ -754,9 +736,9 @@
</span><span class="cx">
</span><span class="cx"> if (this.expanded)
</span><span class="cx"> child._attach();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- removeChild: function(child)
</del><ins>+ removeChild(child)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(child);
</span><span class="cx"> if (!child)
</span><span class="lines">@@ -785,9 +767,9 @@
</span><span class="cx"> this.hasChildren = false;
</span><span class="cx">
</span><span class="cx"> console.assert(!child.isPlaceholderNode, "Shouldn't delete the placeholder node.");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- removeChildren: function()
</del><ins>+ removeChildren()
</ins><span class="cx"> {
</span><span class="cx"> for (var i = 0; i < this.children.length; ++i) {
</span><span class="cx"> var child = this.children[i];
</span><span class="lines">@@ -802,9 +784,9 @@
</span><span class="cx">
</span><span class="cx"> this.children = [];
</span><span class="cx"> this.hasChildren = false;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- removeChildrenRecursive: function()
</del><ins>+ removeChildrenRecursive()
</ins><span class="cx"> {
</span><span class="cx"> var childrenToRemove = this.children;
</span><span class="cx">
</span><span class="lines">@@ -828,22 +810,22 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> this.children = [];
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- sortNodes: function(comparator)
</del><ins>+ sortNodes(comparator)
</ins><span class="cx"> {
</span><span class="cx"> if (this._sortNodesRequestId)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._sortNodesRequestId = window.requestAnimationFrame(this._sortNodesCallback.bind(this, comparator));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- sortNodesImmediately: function(comparator)
</del><ins>+ sortNodesImmediately(comparator)
</ins><span class="cx"> {
</span><span class="cx"> this._sortNodesCallback(comparator);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _sortNodesCallback: function(comparator)
</del><ins>+ _sortNodesCallback(comparator)
</ins><span class="cx"> {
</span><span class="cx"> function comparatorWrapper(aRow, bRow)
</span><span class="cx"> {
</span><span class="lines">@@ -889,9 +871,9 @@
</span><span class="cx"> previousSiblingNode.nextSibling = null;
</span><span class="cx">
</span><span class="cx"> tbody.appendChild(fillerRowElement); // We expect to find a filler row when attaching nodes.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _keyDown: function(event)
</del><ins>+ _keyDown(event)
</ins><span class="cx"> {
</span><span class="cx"> if (!this.selectedNode || event.shiftKey || event.metaKey || event.ctrlKey || this._editing)
</span><span class="cx"> return;
</span><span class="lines">@@ -960,42 +942,42 @@
</span><span class="cx"> event.preventDefault();
</span><span class="cx"> event.stopPropagation();
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- expand: function()
</del><ins>+ expand()
</ins><span class="cx"> {
</span><span class="cx"> // This is the root, do nothing.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- collapse: function()
</del><ins>+ collapse()
</ins><span class="cx"> {
</span><span class="cx"> // This is the root, do nothing.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- reveal: function()
</del><ins>+ reveal()
</ins><span class="cx"> {
</span><span class="cx"> // This is the root, do nothing.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- revealAndSelect: function()
</del><ins>+ revealAndSelect()
</ins><span class="cx"> {
</span><span class="cx"> // This is the root, do nothing.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- dataGridNodeFromNode: function(target)
</del><ins>+ dataGridNodeFromNode(target)
</ins><span class="cx"> {
</span><span class="cx"> var rowElement = target.enclosingNodeOrSelfWithNodeName("tr");
</span><span class="cx"> return rowElement && rowElement._dataGridNode;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- dataGridNodeFromPoint: function(x, y)
</del><ins>+ dataGridNodeFromPoint(x, y)
</ins><span class="cx"> {
</span><span class="cx"> var node = this._dataTableElement.ownerDocument.elementFromPoint(x, y);
</span><span class="cx"> var rowElement = node.enclosingNodeOrSelfWithNodeName("tr");
</span><span class="cx"> return rowElement && rowElement._dataGridNode;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _headerCellClicked: function(event)
</del><ins>+ _headerCellClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> var cell = event.target.enclosingNodeOrSelfWithNodeName("th");
</span><span class="cx"> if (!cell || !cell.columnIdentifier || !cell.classList.contains(WebInspector.DataGrid.SortableColumnStyleClassName))
</span><span class="lines">@@ -1009,27 +991,27 @@
</span><span class="cx"> this.sortOrder = WebInspector.DataGrid.SortOrder.Ascending;
</span><span class="cx"> } else
</span><span class="cx"> this.sortColumnIdentifier = clickedColumnIdentifier;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _mouseoverColumnCollapser: function(event)
</del><ins>+ _mouseoverColumnCollapser(event)
</ins><span class="cx"> {
</span><span class="cx"> var cell = event.target.enclosingNodeOrSelfWithNodeName("th");
</span><span class="cx"> if (!cell || !cell.collapsesGroup)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> cell.classList.add("mouse-over-collapser");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _mouseoutColumnCollapser: function(event)
</del><ins>+ _mouseoutColumnCollapser(event)
</ins><span class="cx"> {
</span><span class="cx"> var cell = event.target.enclosingNodeOrSelfWithNodeName("th");
</span><span class="cx"> if (!cell || !cell.collapsesGroup)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> cell.classList.remove("mouse-over-collapser");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _clickInColumnCollapser: function(event)
</del><ins>+ _clickInColumnCollapser(event)
</ins><span class="cx"> {
</span><span class="cx"> var cell = event.target.enclosingNodeOrSelfWithNodeName("th");
</span><span class="cx"> if (!cell || !cell.collapsesGroup)
</span><span class="lines">@@ -1039,9 +1021,9 @@
</span><span class="cx">
</span><span class="cx"> event.stopPropagation();
</span><span class="cx"> event.preventDefault();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- collapseColumnGroup: function(columnGroup)
</del><ins>+ collapseColumnGroup(columnGroup)
</ins><span class="cx"> {
</span><span class="cx"> var collapserColumnIdentifier = null;
</span><span class="cx"> for (var [identifier, column] of this.columns) {
</span><span class="lines">@@ -1057,9 +1039,9 @@
</span><span class="cx">
</span><span class="cx"> var cell = this._headerTableCellElements.get(collapserColumnIdentifier);
</span><span class="cx"> this._collapseColumnGroupWithCell(cell);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _collapseColumnGroupWithCell: function(cell)
</del><ins>+ _collapseColumnGroupWithCell(cell)
</ins><span class="cx"> {
</span><span class="cx"> var columnsWillCollapse = cell.classList.toggle("collapsed");
</span><span class="cx">
</span><span class="lines">@@ -1076,34 +1058,34 @@
</span><span class="cx"> collapserButton.title = columnsWillCollapse ? this._collapserButtonExpandColumnsToolTip() : this._collapserButtonCollapseColumnsToolTip();
</span><span class="cx">
</span><span class="cx"> this.didToggleColumnGroup(cell.collapsesGroup, columnsWillCollapse);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _collapserButtonCollapseColumnsToolTip: function()
</del><ins>+ _collapserButtonCollapseColumnsToolTip()
</ins><span class="cx"> {
</span><span class="cx"> return WebInspector.UIString("Collapse columns");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _collapserButtonExpandColumnsToolTip: function()
</del><ins>+ _collapserButtonExpandColumnsToolTip()
</ins><span class="cx"> {
</span><span class="cx"> return WebInspector.UIString("Expand columns");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- willToggleColumnGroup: function(columnGroup, willCollapse)
</del><ins>+ willToggleColumnGroup(columnGroup, willCollapse)
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses if needed.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- didToggleColumnGroup: function(columnGroup, didCollapse)
</del><ins>+ didToggleColumnGroup(columnGroup, didCollapse)
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses if needed.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- headerTableHeader: function(columnIdentifier)
</del><ins>+ headerTableHeader(columnIdentifier)
</ins><span class="cx"> {
</span><span class="cx"> return this._headerTableCellElements.get(columnIdentifier);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _generateSortIndicatorImagesIfNeeded: function()
</del><ins>+ _generateSortIndicatorImagesIfNeeded()
</ins><span class="cx"> {
</span><span class="cx"> if (WebInspector.DataGrid._generatedSortIndicatorImages)
</span><span class="cx"> return;
</span><span class="lines">@@ -1116,9 +1098,9 @@
</span><span class="cx">
</span><span class="cx"> generateColoredImagesForCSS("Images/SortIndicatorDownArrow.svg", specifications, 9, 8, "data-grid-sort-indicator-down-");
</span><span class="cx"> generateColoredImagesForCSS("Images/SortIndicatorUpArrow.svg", specifications, 9, 8, "data-grid-sort-indicator-up-");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _mouseDownInDataTable: function(event)
</del><ins>+ _mouseDownInDataTable(event)
</ins><span class="cx"> {
</span><span class="cx"> var gridNode = this.dataGridNodeFromNode(event.target);
</span><span class="cx"> if (!gridNode || !gridNode.selectable)
</span><span class="lines">@@ -1134,9 +1116,9 @@
</span><span class="cx"> gridNode.select();
</span><span class="cx"> } else
</span><span class="cx"> gridNode.select();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _contextMenuInDataTable: function(event)
</del><ins>+ _contextMenuInDataTable(event)
</ins><span class="cx"> {
</span><span class="cx"> var contextMenu = new WebInspector.ContextMenu(event);
</span><span class="cx">
</span><span class="lines">@@ -1162,9 +1144,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> contextMenu.show();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _clickInDataTable: function(event)
</del><ins>+ _clickInDataTable(event)
</ins><span class="cx"> {
</span><span class="cx"> var gridNode = this.dataGridNodeFromNode(event.target);
</span><span class="cx"> if (!gridNode || !gridNode.hasChildren)
</span><span class="lines">@@ -1184,15 +1166,15 @@
</span><span class="cx"> else
</span><span class="cx"> gridNode.expand();
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- textForDataGridNodeColumn: function(node, columnIdentifier)
</del><ins>+ textForDataGridNodeColumn(node, columnIdentifier)
</ins><span class="cx"> {
</span><span class="cx"> var data = node.data[columnIdentifier];
</span><span class="cx"> return (data instanceof Node ? data.textContent : data) || "";
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _copyTextForDataGridNode: function(node)
</del><ins>+ _copyTextForDataGridNode(node)
</ins><span class="cx"> {
</span><span class="cx"> var fields = [];
</span><span class="cx"> for (var identifier of node.dataGrid.orderedColumns)
</span><span class="lines">@@ -1200,15 +1182,15 @@
</span><span class="cx">
</span><span class="cx"> var tabSeparatedValues = fields.join("\t");
</span><span class="cx"> return tabSeparatedValues;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- handleBeforeCopyEvent: function(event)
</del><ins>+ handleBeforeCopyEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this.selectedNode && window.getSelection().isCollapsed)
</span><span class="cx"> event.preventDefault();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- handleCopyEvent: function(event)
</del><ins>+ handleCopyEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> if (!this.selectedNode || !window.getSelection().isCollapsed)
</span><span class="cx"> return;
</span><span class="lines">@@ -1217,9 +1199,9 @@
</span><span class="cx"> event.clipboardData.setData("text/plain", copyText);
</span><span class="cx"> event.stopPropagation();
</span><span class="cx"> event.preventDefault();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _copyRow: function(target)
</del><ins>+ _copyRow(target)
</ins><span class="cx"> {
</span><span class="cx"> var gridNode = this.dataGridNodeFromNode(target);
</span><span class="cx"> if (!gridNode)
</span><span class="lines">@@ -1227,29 +1209,29 @@
</span><span class="cx">
</span><span class="cx"> var copyText = this._copyTextForDataGridNode(gridNode);
</span><span class="cx"> InspectorFrontendHost.copyText(copyText);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get resizeMethod()
</span><span class="cx"> {
</span><span class="cx"> if (!this._resizeMethod)
</span><span class="cx"> return WebInspector.DataGrid.ResizeMethod.Nearest;
</span><span class="cx"> return this._resizeMethod;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set resizeMethod(method)
</span><span class="cx"> {
</span><span class="cx"> this._resizeMethod = method;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- resizerDragStarted: function(resizer)
</del><ins>+ resizerDragStarted(resizer)
</ins><span class="cx"> {
</span><span class="cx"> if (!resizer[WebInspector.DataGrid.NextColumnOrdinalSymbol])
</span><span class="cx"> return true; // Abort the drag;
</span><span class="cx">
</span><span class="cx"> this._currentResizer = resizer;
</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"> console.assert(resizer === this._currentResizer, resizer, this._currentResizer);
</span><span class="cx"> if (resizer != this._currentResizer)
</span><span class="lines">@@ -1296,9 +1278,9 @@
</span><span class="cx"> this._positionResizerElements();
</span><span class="cx"> event.preventDefault();
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.DataGrid.Event.DidLayout);
</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"> console.assert(resizer === this._currentResizer, resizer, this._currentResizer);
</span><span class="cx"> if (resizer != this._currentResizer)
</span><span class="lines">@@ -1306,52 +1288,73 @@
</span><span class="cx">
</span><span class="cx"> this._currentResizer = null;
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.DataGrid.Event.DidLayout);
</span><del>- },
</del><ins>+ }
+};
</ins><span class="cx">
</span><del>- ColumnResizePadding: 10,
</del><ins>+WebInspector.DataGrid.Event = {
+ DidLayout: "datagrid-did-layout",
+ SortChanged: "datagrid-sort-changed",
+ SelectedNodeChanged: "datagrid-selected-node-changed",
+ ExpandedNode: "datagrid-expanded-node",
+ CollapsedNode: "datagrid-collapsed-node"
+};
</ins><span class="cx">
</span><del>- CenterResizerOverBorderAdjustment: 3,
-}
-
</del><span class="cx"> WebInspector.DataGrid.ResizeMethod = {
</span><span class="cx"> Nearest: "nearest",
</span><span class="cx"> First: "first",
</span><span class="cx"> Last: "last"
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.DataGrid.prototype.__proto__ = WebInspector.Object.prototype;
</del><ins>+WebInspector.DataGrid.SortOrder = {
+ Indeterminate: "data-grid-sort-order-indeterminate",
+ Ascending: "data-grid-sort-order-ascending",
+ Descending: "data-grid-sort-order-descending"
+};
</ins><span class="cx">
</span><del>-WebInspector.DataGridNode = function(data, hasChildren)
</del><ins>+WebInspector.DataGrid.PreviousColumnOrdinalSymbol = Symbol("previous-column-ordinal");
+WebInspector.DataGrid.NextColumnOrdinalSymbol = Symbol("next-column-ordinal");
+
+WebInspector.DataGrid.ColumnResizePadding = 10;
+WebInspector.DataGrid.CenterResizerOverBorderAdjustment = 3;
+
+WebInspector.DataGrid.SortColumnAscendingStyleClassName = "sort-ascending";
+WebInspector.DataGrid.SortColumnDescendingStyleClassName = "sort-descending";
+WebInspector.DataGrid.SortableColumnStyleClassName = "sortable";
+
+WebInspector.DataGridNode = class DataGridNode extends WebInspector.Object
</ins><span class="cx"> {
</span><del>- this._expanded = false;
- this._selected = false;
- this._copyable = true;
- this._shouldRefreshChildren = true;
- this._data = data || {};
- this.hasChildren = hasChildren || false;
- this.children = [];
- this.dataGrid = null;
- this.parent = null;
- this.previousSibling = null;
- this.nextSibling = null;
- this.disclosureToggleWidth = 10;
-}
</del><ins>+ constructor(data, hasChildren)
+ {
+ super();
</ins><span class="cx">
</span><del>-WebInspector.DataGridNode.prototype = {
</del><ins>+ this._expanded = false;
+ this._selected = false;
+ this._copyable = true;
+ this._shouldRefreshChildren = true;
+ this._data = data || {};
+ this.hasChildren = hasChildren || false;
+ this.children = [];
+ this.dataGrid = null;
+ this.parent = null;
+ this.previousSibling = null;
+ this.nextSibling = null;
+ this.disclosureToggleWidth = 10;
+ }
+
</ins><span class="cx"> get selectable()
</span><span class="cx"> {
</span><span class="cx"> return !this._element || !this._element.classList.contains("hidden");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get copyable()
</span><span class="cx"> {
</span><span class="cx"> return this._copyable;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set copyable(x)
</span><span class="cx"> {
</span><span class="cx"> this._copyable = x;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="lines">@@ -1375,15 +1378,15 @@
</span><span class="cx">
</span><span class="cx"> this.createCells();
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- createCells: function()
</del><ins>+ createCells()
</ins><span class="cx"> {
</span><span class="cx"> for (var columnIdentifier of this.dataGrid.orderedColumns)
</span><span class="cx"> this._element.appendChild(this.createCell(columnIdentifier));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- refreshIfNeeded: function()
</del><ins>+ refreshIfNeeded()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._needsRefresh)
</span><span class="cx"> return;
</span><span class="lines">@@ -1391,9 +1394,9 @@
</span><span class="cx"> delete this._needsRefresh;
</span><span class="cx">
</span><span class="cx"> this.refresh();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- needsRefresh: function()
</del><ins>+ needsRefresh()
</ins><span class="cx"> {
</span><span class="cx"> this._needsRefresh = true;
</span><span class="cx">
</span><span class="lines">@@ -1404,18 +1407,18 @@
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._scheduledRefreshIdentifier = requestAnimationFrame(this.refresh.bind(this));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get data()
</span><span class="cx"> {
</span><span class="cx"> return this._data;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set data(x)
</span><span class="cx"> {
</span><span class="cx"> this._data = x || {};
</span><span class="cx"> this.needsRefresh();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get revealed()
</span><span class="cx"> {
</span><span class="lines">@@ -1434,7 +1437,7 @@
</span><span class="cx">
</span><span class="cx"> this._revealed = true;
</span><span class="cx"> return true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set hasChildren(x)
</span><span class="cx"> {
</span><span class="lines">@@ -1456,12 +1459,12 @@
</span><span class="cx"> {
</span><span class="cx"> this._element.classList.remove("parent", "expanded");
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get hasChildren()
</span><span class="cx"> {
</span><span class="cx"> return this._hasChildren;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set revealed(x)
</span><span class="cx"> {
</span><span class="lines">@@ -1481,7 +1484,7 @@
</span><span class="cx">
</span><span class="cx"> for (var i = 0; i < this.children.length; ++i)
</span><span class="cx"> this.children[i].revealed = x && this.expanded;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get depth()
</span><span class="cx"> {
</span><span class="lines">@@ -1492,7 +1495,7 @@
</span><span class="cx"> else
</span><span class="cx"> this._depth = 0;
</span><span class="cx"> return this._depth;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get leftPadding()
</span><span class="cx"> {
</span><span class="lines">@@ -1501,24 +1504,24 @@
</span><span class="cx">
</span><span class="cx"> this._leftPadding = this.depth * this.dataGrid.indentWidth;
</span><span class="cx"> return this._leftPadding;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get shouldRefreshChildren()
</span><span class="cx"> {
</span><span class="cx"> return this._shouldRefreshChildren;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set shouldRefreshChildren(x)
</span><span class="cx"> {
</span><span class="cx"> this._shouldRefreshChildren = x;
</span><span class="cx"> if (x && this.expanded)
</span><span class="cx"> this.expand();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get selected()
</span><span class="cx"> {
</span><span class="cx"> return this._selected;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set selected(x)
</span><span class="cx"> {
</span><span class="lines">@@ -1526,12 +1529,12 @@
</span><span class="cx"> this.select();
</span><span class="cx"> else
</span><span class="cx"> this.deselect();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get expanded()
</span><span class="cx"> {
</span><span class="cx"> return this._expanded;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set expanded(x)
</span><span class="cx"> {
</span><span class="lines">@@ -1539,9 +1542,9 @@
</span><span class="cx"> this.expand();
</span><span class="cx"> else
</span><span class="cx"> this.collapse();
</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._element || !this.dataGrid)
</span><span class="cx"> return;
</span><span class="lines">@@ -1555,14 +1558,14 @@
</span><span class="cx">
</span><span class="cx"> this._element.removeChildren();
</span><span class="cx"> this.createCells();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- updateLayout: function()
</del><ins>+ updateLayout()
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses if needed.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- createCell: function(columnIdentifier)
</del><ins>+ createCell(columnIdentifier)
</ins><span class="cx"> {
</span><span class="cx"> var cellElement = document.createElement("td");
</span><span class="cx"> cellElement.className = columnIdentifier + "-column";
</span><span class="lines">@@ -1587,30 +1590,30 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> return cellElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- createCellContent: function(columnIdentifier)
</del><ins>+ createCellContent(columnIdentifier)
</ins><span class="cx"> {
</span><span class="cx"> return this.data[columnIdentifier] || "\u200b"; // Zero width space to keep the cell from collapsing.
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- elementWithColumnIdentifier: function(columnIdentifier)
</del><ins>+ elementWithColumnIdentifier(columnIdentifier)
</ins><span class="cx"> {
</span><span class="cx"> var index = this.dataGrid.orderedColumns.indexOf(columnIdentifier);
</span><span class="cx"> if (index === -1)
</span><span class="cx"> return null;
</span><span class="cx">
</span><span class="cx"> return this._element.children[index];
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Share these functions with DataGrid. They are written to work with a DataGridNode this object.
</span><del>- appendChild: WebInspector.DataGrid.prototype.appendChild,
- insertChild: WebInspector.DataGrid.prototype.insertChild,
- removeChild: WebInspector.DataGrid.prototype.removeChild,
- removeChildren: WebInspector.DataGrid.prototype.removeChildren,
- removeChildrenRecursive: WebInspector.DataGrid.prototype.removeChildrenRecursive,
</del><ins>+ appendChild() { return WebInspector.DataGrid.prototype.appendChild.apply(this, arguments); }
+ insertChild() { return WebInspector.DataGrid.prototype.insertChild.apply(this, arguments); }
+ removeChild() { return WebInspector.DataGrid.prototype.removeChild.apply(this, arguments); }
+ removeChildren() { return WebInspector.DataGrid.prototype.removeChildren.apply(this, arguments); }
+ removeChildrenRecursive() { return WebInspector.DataGrid.prototype.removeChildrenRecursive.apply(this, arguments); }
</ins><span class="cx">
</span><del>- _recalculateSiblings: function(myIndex)
</del><ins>+ _recalculateSiblings(myIndex)
</ins><span class="cx"> {
</span><span class="cx"> if (!this.parent)
</span><span class="cx"> return;
</span><span class="lines">@@ -1630,9 +1633,9 @@
</span><span class="cx"> this.nextSibling = nextChild;
</span><span class="cx"> } else
</span><span class="cx"> this.nextSibling = null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- collapse: function()
</del><ins>+ collapse()
</ins><span class="cx"> {
</span><span class="cx"> if (this._element)
</span><span class="cx"> this._element.classList.remove("expanded");
</span><span class="lines">@@ -1646,9 +1649,9 @@
</span><span class="cx">
</span><span class="cx"> if (this.dataGrid)
</span><span class="cx"> this.dataGrid.dispatchEventToListeners(WebInspector.DataGrid.Event.CollapsedNode, {dataGridNode: this});
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- collapseRecursively: function()
</del><ins>+ collapseRecursively()
</ins><span class="cx"> {
</span><span class="cx"> var item = this;
</span><span class="cx"> while (item) {
</span><span class="lines">@@ -1656,9 +1659,9 @@
</span><span class="cx"> item.collapse();
</span><span class="cx"> item = item.traverseNextNode(false, this, true);
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- expand: function()
</del><ins>+ expand()
</ins><span class="cx"> {
</span><span class="cx"> if (!this.hasChildren || this.expanded)
</span><span class="cx"> return;
</span><span class="lines">@@ -1694,18 +1697,18 @@
</span><span class="cx">
</span><span class="cx"> if (this.dataGrid)
</span><span class="cx"> this.dataGrid.dispatchEventToListeners(WebInspector.DataGrid.Event.ExpandedNode, {dataGridNode: this});
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- expandRecursively: function()
</del><ins>+ expandRecursively()
</ins><span class="cx"> {
</span><span class="cx"> var item = this;
</span><span class="cx"> while (item) {
</span><span class="cx"> item.expand();
</span><span class="cx"> item = item.traverseNextNode(false, this);
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- reveal: function()
</del><ins>+ reveal()
</ins><span class="cx"> {
</span><span class="cx"> var currentAncestor = this.parent;
</span><span class="cx"> while (currentAncestor && !currentAncestor.root) {
</span><span class="lines">@@ -1717,9 +1720,9 @@
</span><span class="cx"> this.element.scrollIntoViewIfNeeded(false);
</span><span class="cx">
</span><span class="cx"> this.dispatchEventToListeners("revealed");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- select: function(supressSelectedEvent)
</del><ins>+ select(supressSelectedEvent)
</ins><span class="cx"> {
</span><span class="cx"> if (!this.dataGrid || !this.selectable || this.selected)
</span><span class="cx"> return;
</span><span class="lines">@@ -1735,15 +1738,15 @@
</span><span class="cx">
</span><span class="cx"> if (!supressSelectedEvent)
</span><span class="cx"> this.dataGrid.dispatchEventToListeners(WebInspector.DataGrid.Event.SelectedNodeChanged);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- revealAndSelect: function()
</del><ins>+ revealAndSelect()
</ins><span class="cx"> {
</span><span class="cx"> this.reveal();
</span><span class="cx"> this.select();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- deselect: function(supressDeselectedEvent)
</del><ins>+ deselect(supressDeselectedEvent)
</ins><span class="cx"> {
</span><span class="cx"> if (!this.dataGrid || this.dataGrid.selectedNode !== this || !this.selected)
</span><span class="cx"> return;
</span><span class="lines">@@ -1756,9 +1759,9 @@
</span><span class="cx">
</span><span class="cx"> if (!supressDeselectedEvent)
</span><span class="cx"> this.dataGrid.dispatchEventToListeners(WebInspector.DataGrid.Event.SelectedNodeChanged);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- traverseNextNode: function(skipHidden, stayWithin, dontPopulate, info)
</del><ins>+ traverseNextNode(skipHidden, stayWithin, dontPopulate, info)
</ins><span class="cx"> {
</span><span class="cx"> if (!dontPopulate && this.hasChildren)
</span><span class="cx"> this.dispatchEventToListeners("populate");
</span><span class="lines">@@ -1791,9 +1794,9 @@
</span><span class="cx"> return null;
</span><span class="cx">
</span><span class="cx"> return (!skipHidden || node.revealed) ? node.nextSibling : null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- traversePreviousNode: function(skipHidden, dontPopulate)
</del><ins>+ traversePreviousNode(skipHidden, dontPopulate)
</ins><span class="cx"> {
</span><span class="cx"> var node = (!skipHidden || this.revealed) ? this.previousSibling : null;
</span><span class="cx"> if (!dontPopulate && node && node.hasChildren)
</span><span class="lines">@@ -1812,9 +1815,9 @@
</span><span class="cx"> return null;
</span><span class="cx">
</span><span class="cx"> return this.parent;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- isEventWithinDisclosureTriangle: function(event)
</del><ins>+ isEventWithinDisclosureTriangle(event)
</ins><span class="cx"> {
</span><span class="cx"> if (!this.hasChildren)
</span><span class="cx"> return false;
</span><span class="lines">@@ -1824,9 +1827,9 @@
</span><span class="cx">
</span><span class="cx"> var left = cell.totalOffsetLeft + this.leftPadding;
</span><span class="cx"> return event.pageX >= left && event.pageX <= left + this.disclosureToggleWidth;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _attach: function()
</del><ins>+ _attach()
</ins><span class="cx"> {
</span><span class="cx"> if (!this.dataGrid || this._attached)
</span><span class="cx"> return;
</span><span class="lines">@@ -1854,9 +1857,9 @@
</span><span class="cx"> if (this.expanded)
</span><span class="cx"> for (var i = 0; i < this.children.length; ++i)
</span><span class="cx"> this.children[i]._attach();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _detach: function()
</del><ins>+ _detach()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._attached)
</span><span class="cx"> return;
</span><span class="lines">@@ -1868,9 +1871,9 @@
</span><span class="cx">
</span><span class="cx"> for (var i = 0; i < this.children.length; ++i)
</span><span class="cx"> this.children[i]._detach();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- savePosition: function()
</del><ins>+ savePosition()
</ins><span class="cx"> {
</span><span class="cx"> if (this._savedPosition)
</span><span class="cx"> return;
</span><span class="lines">@@ -1883,9 +1886,9 @@
</span><span class="cx"> parent: this.parent,
</span><span class="cx"> index: this.parent.children.indexOf(this)
</span><span class="cx"> };
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- restorePosition: function()
</del><ins>+ restorePosition()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._savedPosition)
</span><span class="cx"> return;
</span><span class="lines">@@ -1895,23 +1898,19 @@
</span><span class="cx">
</span><span class="cx"> delete this._savedPosition;
</span><span class="cx"> }
</span><del>-}
</del><ins>+};
</ins><span class="cx">
</span><del>-WebInspector.DataGridNode.prototype.__proto__ = WebInspector.Object.prototype;
-
</del><span class="cx"> // Used to create a new table row when entering new data by editing cells.
</span><del>-WebInspector.PlaceholderDataGridNode = function(data)
</del><ins>+WebInspector.PlaceholderDataGridNode = class PlaceholderDataGridNode extends WebInspector.DataGridNode
</ins><span class="cx"> {
</span><del>- WebInspector.DataGridNode.call(this, data, false);
- this.isPlaceholderNode = true;
-}
</del><ins>+ constructor(data)
+ {
+ super(data, false);
+ this.isPlaceholderNode = true;
+ }
</ins><span class="cx">
</span><del>-WebInspector.PlaceholderDataGridNode.prototype = {
- constructor: WebInspector.PlaceholderDataGridNode,
- __proto__: WebInspector.DataGridNode.prototype,
-
- makeNormal: function()
</del><ins>+ makeNormal()
</ins><span class="cx"> {
</span><span class="cx"> this.isPlaceholderNode = false;
</span><span class="cx"> }
</span><del>-}
</del><ins>+};
</ins></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsDatabaseTableContentViewjs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/DatabaseTableContentView.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/DatabaseTableContentView.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/DatabaseTableContentView.js 2015-12-03 18:35:53 UTC (rev 193053)
</span><span class="lines">@@ -86,7 +86,7 @@
</span><span class="cx"> // how to sort arbitrary columns.
</span><span class="cx"> this.element.removeChildren();
</span><span class="cx">
</span><del>- this._dataGrid = new WebInspector.DataGrid.createSortableDataGrid(columnNames, values);
</del><ins>+ this._dataGrid = WebInspector.DataGrid.createSortableDataGrid(columnNames, values);
</ins><span class="cx"> if (!this._dataGrid || !this._dataGrid.element) {
</span><span class="cx"> this._dataGrid = undefined;
</span><span class="cx">
</span></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsIndexedDatabaseEntryDataGridNodejs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseEntryDataGridNode.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseEntryDataGridNode.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseEntryDataGridNode.js 2015-12-03 18:35:53 UTC (rev 193053)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2014 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2014, 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,30 +23,28 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.IndexedDatabaseEntryDataGridNode = function(entry)
</del><ins>+WebInspector.IndexedDatabaseEntryDataGridNode = class IndexedDatabaseEntryDataGridNode extends WebInspector.DataGridNode
</ins><span class="cx"> {
</span><del>- WebInspector.DataGridNode.call(this, entry);
</del><ins>+ constructor(entry)
+ {
+ super(entry);
</ins><span class="cx">
</span><del>- this._entry = entry;
-};
</del><ins>+ this._entry = entry;
+ }
</ins><span class="cx">
</span><del>-WebInspector.IndexedDatabaseEntryDataGridNode.prototype = {
- constructor: WebInspector.IndexedDatabaseEntryDataGridNode,
- __proto__: WebInspector.DataGridNode.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get entry()
</span><span class="cx"> {
</span><span class="cx"> return this._entry;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- createCellContent: function(columnIdentifier, cell)
</del><ins>+ createCellContent(columnIdentifier, cell)
</ins><span class="cx"> {
</span><span class="cx"> var value = this._entry[columnIdentifier];
</span><span class="cx"> if (value instanceof WebInspector.RemoteObject)
</span><span class="cx"> return WebInspector.FormattedValue.createObjectTreeOrFormattedValueForRemoteObject(value, null, true);
</span><span class="cx">
</span><del>- return WebInspector.DataGridNode.prototype.createCellContent.call(this, columnIdentifier, cell);
</del><ins>+ return super.createCellContent(columnIdentifier, cell);
</ins><span class="cx"> }
</span><span class="cx"> };
</span></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsLayerTreeDataGridNodejs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/LayerTreeDataGridNode.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/LayerTreeDataGridNode.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/LayerTreeDataGridNode.js 2015-12-03 18:35:53 UTC (rev 193053)
</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,40 +23,38 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.LayerTreeDataGridNode = function(layer)
</del><ins>+WebInspector.LayerTreeDataGridNode = class LayerTreeDataGridNode extends WebInspector.DataGridNode
</ins><span class="cx"> {
</span><del>- WebInspector.DataGridNode.call(this);
</del><ins>+ constructor(layer)
+ {
+ super();
</ins><span class="cx">
</span><del>- this._outlets = {};
</del><ins>+ this._outlets = {};
+ this.layer = layer;
+ }
</ins><span class="cx">
</span><del>- this.layer = layer;
-};
-
-WebInspector.LayerTreeDataGridNode.prototype = {
- constructor: WebInspector.DataGridNode,
-
</del><span class="cx"> // DataGridNode Overrides.
</span><span class="cx">
</span><del>- createCells: function()
</del><ins>+ createCells()
</ins><span class="cx"> {
</span><del>- WebInspector.DataGridNode.prototype.createCells.call(this);
</del><ins>+ super.createCells();
</ins><span class="cx">
</span><span class="cx"> this._cellsWereCreated = true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- createCellContent: function(columnIdentifier, cell)
</del><ins>+ createCellContent(columnIdentifier, cell)
</ins><span class="cx"> {
</span><span class="cx"> var cell = columnIdentifier === "name" ? this._makeNameCell() : this._makeOutlet(columnIdentifier, document.createTextNode());
</span><span class="cx"> this._updateCell(columnIdentifier);
</span><span class="cx"> return cell;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get layer()
</span><span class="cx"> {
</span><span class="cx"> return this._layer;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set layer(layer)
</span><span class="cx"> {
</span><span class="lines">@@ -69,12 +67,12 @@
</span><span class="cx"> paintCount: layer.paintCount || "\u2014",
</span><span class="cx"> memory: Number.bytesToString(layer.memory || 0)
</span><span class="cx"> };
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get data()
</span><span class="cx"> {
</span><span class="cx"> return this._data;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set data(data)
</span><span class="cx"> {
</span><span class="lines">@@ -86,17 +84,17 @@
</span><span class="cx"> if (this._cellsWereCreated)
</span><span class="cx"> this._updateCell(columnIdentifier);
</span><span class="cx"> }, this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _makeOutlet: function(name, element)
</del><ins>+ _makeOutlet(name, element)
</ins><span class="cx"> {
</span><span class="cx"> this._outlets[name] = element;
</span><span class="cx"> return element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _makeNameCell: function()
</del><ins>+ _makeNameCell()
</ins><span class="cx"> {
</span><span class="cx"> var fragment = document.createDocumentFragment();
</span><span class="cx">
</span><span class="lines">@@ -119,18 +117,18 @@
</span><span class="cx"> reflectionLabel.textContent = " \u2014 " + WebInspector.UIString("Reflection");
</span><span class="cx">
</span><span class="cx"> return fragment;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateCell: function(columnIdentifier)
</del><ins>+ _updateCell(columnIdentifier)
</ins><span class="cx"> {
</span><span class="cx"> var data = this._data[columnIdentifier];
</span><span class="cx"> if (columnIdentifier === "name")
</span><span class="cx"> this._updateNameCellData(data);
</span><span class="cx"> else
</span><span class="cx"> this._outlets[columnIdentifier].textContent = data;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateNameCellData: function(data)
</del><ins>+ _updateNameCellData(data)
</ins><span class="cx"> {
</span><span class="cx"> var layer = this._layer;
</span><span class="cx"> var label = this._outlets.label;
</span><span class="lines">@@ -157,13 +155,11 @@
</span><span class="cx"> element.classList.add("reflection");
</span><span class="cx"> else if (layer.pseudoElement)
</span><span class="cx"> element.classList.add("pseudo-element");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _goToArrowWasClicked: function()
</del><ins>+ _goToArrowWasClicked()
</ins><span class="cx"> {
</span><span class="cx"> var domNode = WebInspector.domTreeManager.nodeForId(this._layer.nodeId);
</span><span class="cx"> WebInspector.showMainFrameDOMTree(domNode);
</span><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.LayerTreeDataGridNode.prototype.__proto__ = WebInspector.DataGridNode.prototype;
</del></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsLayoutTimelineDataGridjs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGrid.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGrid.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGrid.js 2015-12-03 18:35:53 UTC (rev 193053)
</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,20 +23,17 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.LayoutTimelineDataGrid = function(treeOutline, columns, delegate, editCallback, deleteCallback)
</del><ins>+WebInspector.LayoutTimelineDataGrid = class LayoutTimelineDataGrid extends WebInspector.TimelineDataGrid
</ins><span class="cx"> {
</span><del>- WebInspector.TimelineDataGrid.call(this, treeOutline, columns, delegate, editCallback, deleteCallback);
-};
</del><ins>+ constructor(treeOutline, columns, delegate, editCallback, deleteCallback)
+ {
+ super(treeOutline, columns, delegate, editCallback, deleteCallback);
+ }
</ins><span class="cx">
</span><del>-WebInspector.LayoutTimelineDataGrid.prototype = {
- constructor: WebInspector.LayoutTimelineDataGrid,
-
</del><span class="cx"> // Protected
</span><span class="cx">
</span><del>- callFramePopoverAnchorElement: function()
</del><ins>+ callFramePopoverAnchorElement()
</ins><span class="cx"> {
</span><span class="cx"> return this.selectedNode.elementWithColumnIdentifier("location");
</span><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.LayoutTimelineDataGrid.prototype.__proto__ = WebInspector.TimelineDataGrid.prototype;
</del></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsLayoutTimelineDataGridNodejs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js 2015-12-03 18:35:53 UTC (rev 193053)
</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,42 +23,34 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.LayoutTimelineDataGridNode = function(layoutTimelineRecord, baseStartTime)
</del><ins>+WebInspector.LayoutTimelineDataGridNode = class LayoutTimelineDataGridNode extends WebInspector.TimelineDataGridNode
</ins><span class="cx"> {
</span><del>- WebInspector.TimelineDataGridNode.call(this, false, null);
</del><ins>+ constructor(layoutTimelineRecord, baseStartTime)
+ {
+ super(false, null);
</ins><span class="cx">
</span><del>- this._record = layoutTimelineRecord;
- this._baseStartTime = baseStartTime || 0;
-};
</del><ins>+ this._record = layoutTimelineRecord;
+ this._baseStartTime = baseStartTime || 0;
+ }
</ins><span class="cx">
</span><del>-// FIXME: Move to a WebInspector.Object subclass and we can remove this.
-WebInspector.Object.deprecatedAddConstructorFunctions(WebInspector.LayoutTimelineDataGridNode);
-
-WebInspector.LayoutTimelineDataGridNode.IconStyleClassName = "icon";
-WebInspector.LayoutTimelineDataGridNode.SubtitleStyleClassName = "subtitle";
-
-WebInspector.LayoutTimelineDataGridNode.prototype = {
- constructor: WebInspector.LayoutTimelineDataGridNode,
- __proto__: WebInspector.TimelineDataGridNode.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get record()
</span><span class="cx"> {
</span><span class="cx"> return this._record;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get records()
</span><span class="cx"> {
</span><span class="cx"> return [this._record];
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get data()
</span><span class="cx"> {
</span><span class="cx"> return {eventType: this._record.eventType, width: this._record.width, height: this._record.height, area: this._record.width * this._record.height, startTime: this._record.startTime, totalTime: this._record.duration, location: this._record.initiatorCallFrame};
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- createCellContent: function(columnIdentifier, cell)
</del><ins>+ createCellContent(columnIdentifier, cell)
</ins><span class="cx"> {
</span><span class="cx"> const emptyValuePlaceholderString = "\u2014";
</span><span class="cx"> var value = this.data[columnIdentifier];
</span><span class="lines">@@ -81,6 +73,6 @@
</span><span class="cx"> return isNaN(value) ? emptyValuePlaceholderString : Number.secondsToString(value, true);
</span><span class="cx"> }
</span><span class="cx">
</span><del>- return WebInspector.TimelineDataGridNode.prototype.createCellContent.call(this, columnIdentifier, cell);
</del><ins>+ return super.createCellContent(columnIdentifier, cell);
</ins><span class="cx"> }
</span><span class="cx"> };
</span></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsProbeSetDataGridjs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ProbeSetDataGrid.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ProbeSetDataGrid.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ProbeSetDataGrid.js 2015-12-03 18:35:53 UTC (rev 193053)
</span><span class="lines">@@ -1,6 +1,6 @@
</span><span class="cx"> /*
</span><span class="cx"> * Copyright (C) 2013 University of Washington. All rights reserved.
</span><del>- * Copyright (C) 2014 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2014, 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">@@ -24,75 +24,67 @@
</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.ProbeSetDataGrid = function(probeSet)
</del><ins>+WebInspector.ProbeSetDataGrid = class ProbeSetDataGrid extends WebInspector.DataGrid
</ins><span class="cx"> {
</span><del>- console.assert(probeSet instanceof WebInspector.ProbeSet, "Invalid ProbeSet argument: ", probeSet);
- this.probeSet = probeSet;
</del><ins>+ constructor(probeSet)
+ {
+ console.assert(probeSet instanceof WebInspector.ProbeSet, "Invalid ProbeSet argument: ", probeSet);
+ this.probeSet = probeSet;
</ins><span class="cx">
</span><del>- var columnsData = {};
- for (var probe of probeSet.probes) {
- var probeTitle = probe.expression || WebInspector.UIString("(uninitialized)");
- columnsData[probe.id] = { title: probeTitle };
- }
</del><ins>+ var columns = {};
+ for (var probe of probeSet.probes) {
+ var title = probe.expression || WebInspector.UIString("(uninitialized)");
+ columns[probe.id] = {title};
+ }
</ins><span class="cx">
</span><del>- WebInspector.DataGrid.call(this, columnsData);
</del><ins>+ super(columns);
</ins><span class="cx">
</span><del>- this.element.classList.add("inline");
</del><ins>+ this.element.classList.add("inline");
</ins><span class="cx">
</span><del>- this._frameNodes = new Map;
- this._nodesSinceLastNavigation = [];
</del><ins>+ this._frameNodes = new Map;
+ this._nodesSinceLastNavigation = [];
</ins><span class="cx">
</span><del>- this._listeners = new WebInspector.EventListenerSet(this, "ProbeSetDataGrid instance listeners");
- this._listeners.register(probeSet, WebInspector.ProbeSet.Event.ProbeAdded, this._setupProbe);
- this._listeners.register(probeSet, WebInspector.ProbeSet.Event.ProbeRemoved, this._teardownProbe);
- this._listeners.register(probeSet, WebInspector.ProbeSet.Event.SamplesCleared, this._setupData);
- this._listeners.register(WebInspector.Probe, WebInspector.Probe.Event.ExpressionChanged, this._probeExpressionChanged);
- this._listeners.install();
</del><ins>+ this._listeners = new WebInspector.EventListenerSet(this, "ProbeSetDataGrid instance listeners");
+ this._listeners.register(probeSet, WebInspector.ProbeSet.Event.ProbeAdded, this._setupProbe);
+ this._listeners.register(probeSet, WebInspector.ProbeSet.Event.ProbeRemoved, this._teardownProbe);
+ this._listeners.register(probeSet, WebInspector.ProbeSet.Event.SamplesCleared, this._setupData);
+ this._listeners.register(WebInspector.Probe, WebInspector.Probe.Event.ExpressionChanged, this._probeExpressionChanged);
+ this._listeners.install();
</ins><span class="cx">
</span><del>- this._setupData();
-};
</del><ins>+ this._setupData();
+ }
</ins><span class="cx">
</span><del>-WebInspector.ProbeSetDataGrid.DataUpdatedStyleClassName = "data-updated";
-WebInspector.ProbeSetDataGrid.PastFrameStyleClassName = "past-value";
-WebInspector.ProbeSetDataGrid.HighlightedFrameStyleClassName = "highlighted";
-
-WebInspector.ProbeSetDataGrid.DataUpdatedAnimationDuration = 300; // milliseconds
-
-WebInspector.ProbeSetDataGrid.prototype = {
- constructor: WebInspector.ProbeSetDataGrid,
- __proto__: WebInspector.DataGrid.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><del>- closed: function()
</del><ins>+ closed()
</ins><span class="cx"> {
</span><span class="cx"> for (var probe of this.probeSet)
</span><span class="cx"> this._teardownProbe(probe);
</span><span class="cx">
</span><span class="cx"> this._listeners.uninstall(true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _setupProbe: function(event)
</del><ins>+ _setupProbe(event)
</ins><span class="cx"> {
</span><span class="cx"> var probe = event.data;
</span><span class="cx"> this.insertColumn(probe.id, {title: probe.expression});
</span><span class="cx">
</span><span class="cx"> for (var frame of this._data.frames)
</span><span class="cx"> this._updateNodeForFrame(frame);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _teardownProbe: function(event)
</del><ins>+ _teardownProbe(event)
</ins><span class="cx"> {
</span><span class="cx"> var probe = event.data;
</span><span class="cx"> this.removeColumn(probe.id);
</span><span class="cx">
</span><span class="cx"> for (var frame of this._data.frames)
</span><span class="cx"> this._updateNodeForFrame(frame);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _setupData: function()
</del><ins>+ _setupData()
</ins><span class="cx"> {
</span><span class="cx"> this._data = this.probeSet.dataTable;
</span><span class="cx"> for (var frame of this._data.frames)
</span><span class="lines">@@ -103,18 +95,18 @@
</span><span class="cx"> this._dataListeners.register(this._data, WebInspector.ProbeSetDataTable.Event.SeparatorInserted, this._dataSeparatorInserted);
</span><span class="cx"> this._dataListeners.register(this._data, WebInspector.ProbeSetDataTable.Event.WillRemove, this._teardownData);
</span><span class="cx"> this._dataListeners.install();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _teardownData: function()
</del><ins>+ _teardownData()
</ins><span class="cx"> {
</span><span class="cx"> this._dataListeners.uninstall(true);
</span><span class="cx"> this.removeChildren();
</span><span class="cx"> this._frameNodes = new Map;
</span><span class="cx"> this._separators = new Map;
</span><span class="cx"> delete this._lastUpdatedFrame;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateNodeForFrame: function(frame)
</del><ins>+ _updateNodeForFrame(frame)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(frame instanceof WebInspector.ProbeSetDataFrame, "Invalid ProbeSetDataFrame argument: ", frame);
</span><span class="cx"> var node = null;
</span><span class="lines">@@ -142,39 +134,39 @@
</span><span class="cx"> }
</span><span class="cx"> console.assert(node);
</span><span class="cx">
</span><del>- node.element.classList.add(WebInspector.ProbeSetDataGrid.DataUpdatedStyleClassName);
</del><ins>+ node.element.classList.add("data-updated");
</ins><span class="cx"> window.setTimeout(function() {
</span><del>- node.element.classList.remove(WebInspector.ProbeSetDataGrid.DataUpdatedStyleClassName);
</del><ins>+ node.element.classList.remove("data-updated");
</ins><span class="cx"> }, WebInspector.ProbeSetDataGrid.DataUpdatedAnimationDuration);
</span><span class="cx">
</span><span class="cx"> this._nodesSinceLastNavigation.push(node);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateNodeForSeparator: function(frame)
</del><ins>+ _updateNodeForSeparator(frame)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(this._frameNodes.has(frame), "Tried to add separator for unknown data frame: ", frame);
</span><span class="cx"> this._frameNodes.get(frame).updateCellsForSeparator(frame, this.probeSet);
</span><span class="cx">
</span><span class="cx"> for (var node of this._nodesSinceLastNavigation)
</span><del>- node.element.classList.add(WebInspector.ProbeSetDataGrid.PastFrameStyleClassName);
</del><ins>+ node.element.classList.add("past-value");
</ins><span class="cx">
</span><span class="cx"> this._nodesSinceLastNavigation = [];
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _dataFrameInserted: function(event)
</del><ins>+ _dataFrameInserted(event)
</ins><span class="cx"> {
</span><span class="cx"> var frame = event.data;
</span><span class="cx"> this._lastUpdatedFrame = frame;
</span><span class="cx"> this._updateNodeForFrame(frame);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _dataSeparatorInserted: function(event)
</del><ins>+ _dataSeparatorInserted(event)
</ins><span class="cx"> {
</span><span class="cx"> var frame = event.data;
</span><span class="cx"> this._updateNodeForSeparator(frame);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _probeExpressionChanged: function(event)
</del><ins>+ _probeExpressionChanged(event)
</ins><span class="cx"> {
</span><span class="cx"> var probe = event.target;
</span><span class="cx"> if (probe.breakpoint !== this.probeSet.breakpoint)
</span><span class="lines">@@ -193,3 +185,5 @@
</span><span class="cx"> this._updateNodeForFrame(frame);
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.ProbeSetDataGrid.DataUpdatedAnimationDuration = 300; // milliseconds
</ins></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsProfileNodeDataGridNodejs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ProfileNodeDataGridNode.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ProfileNodeDataGridNode.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ProfileNodeDataGridNode.js 2015-12-03 18:35:53 UTC (rev 193053)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2014 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2014, 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,63 +23,56 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ProfileNodeDataGridNode = function(profileNode, baseStartTime, rangeStartTime, rangeEndTime)
</del><ins>+WebInspector.ProfileNodeDataGridNode = class ProfileNodeDataGridNode extends WebInspector.TimelineDataGridNode
</ins><span class="cx"> {
</span><del>- var hasChildren = !!profileNode.childNodes.length;
</del><ins>+ constructor(profileNode, baseStartTime, rangeStartTime, rangeEndTime)
+ {
+ var hasChildren = !!profileNode.childNodes.length;
</ins><span class="cx">
</span><del>- WebInspector.TimelineDataGridNode.call(this, false, null, hasChildren);
</del><ins>+ super(false, null, hasChildren);
</ins><span class="cx">
</span><del>- this._profileNode = profileNode;
- this._baseStartTime = baseStartTime || 0;
- this._rangeStartTime = rangeStartTime || 0;
- this._rangeEndTime = typeof rangeEndTime === "number" ? rangeEndTime : Infinity;
</del><ins>+ this._profileNode = profileNode;
+ this._baseStartTime = baseStartTime || 0;
+ this._rangeStartTime = rangeStartTime || 0;
+ this._rangeEndTime = typeof rangeEndTime === "number" ? rangeEndTime : Infinity;
</ins><span class="cx">
</span><del>- this._data = this._profileNode.computeCallInfoForTimeRange(this._rangeStartTime, this._rangeEndTime);
- this._data.location = this._profileNode.sourceCodeLocation;
-};
</del><ins>+ this._data = this._profileNode.computeCallInfoForTimeRange(this._rangeStartTime, this._rangeEndTime);
+ this._data.location = this._profileNode.sourceCodeLocation;
+ }
</ins><span class="cx">
</span><del>-// FIXME: Move to a WebInspector.Object subclass and we can remove this.
-WebInspector.Object.deprecatedAddConstructorFunctions(WebInspector.ProfileNodeDataGridNode);
-
-WebInspector.ProfileNodeDataGridNode.IconStyleClassName = "icon";
-
-WebInspector.ProfileNodeDataGridNode.prototype = {
- constructor: WebInspector.ProfileNodeDataGridNode,
- __proto__: WebInspector.TimelineDataGridNode.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get profileNode()
</span><span class="cx"> {
</span><span class="cx"> return this._profileNode;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get records()
</span><span class="cx"> {
</span><span class="cx"> return null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get baseStartTime()
</span><span class="cx"> {
</span><span class="cx"> return this._baseStartTime;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get rangeStartTime()
</span><span class="cx"> {
</span><span class="cx"> return this._rangeStartTime;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get rangeEndTime()
</span><span class="cx"> {
</span><span class="cx"> return this._rangeEndTime;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get data()
</span><span class="cx"> {
</span><span class="cx"> return this._data;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- updateRangeTimes: function(startTime, endTime)
</del><ins>+ updateRangeTimes(startTime, endTime)
</ins><span class="cx"> {
</span><span class="cx"> var oldRangeStartTime = this._rangeStartTime;
</span><span class="cx"> var oldRangeEndTime = this._rangeEndTime;
</span><span class="lines">@@ -100,17 +93,17 @@
</span><span class="cx">
</span><span class="cx"> if (oldStartBoundary !== newStartBoundary || oldEndBoundary !== newEndBoundary)
</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"> this._data = this._profileNode.computeCallInfoForTimeRange(this._rangeStartTime, this._rangeEndTime);
</span><span class="cx"> this._data.location = this._profileNode.sourceCodeLocation;
</span><span class="cx">
</span><del>- WebInspector.TimelineDataGridNode.prototype.refresh.call(this);
- },
</del><ins>+ super.refresh();
+ }
</ins><span class="cx">
</span><del>- createCellContent: function(columnIdentifier, cell)
</del><ins>+ createCellContent(columnIdentifier, cell)
</ins><span class="cx"> {
</span><span class="cx"> const emptyValuePlaceholderString = "\u2014";
</span><span class="cx"> var value = this.data[columnIdentifier];
</span><span class="lines">@@ -125,6 +118,6 @@
</span><span class="cx"> return isNaN(value) ? emptyValuePlaceholderString : Number.secondsToString(value, true);
</span><span class="cx"> }
</span><span class="cx">
</span><del>- return WebInspector.TimelineDataGridNode.prototype.createCellContent.call(this, columnIdentifier, cell);
</del><ins>+ return super.createCellContent(columnIdentifier, cell);
</ins><span class="cx"> }
</span><span class="cx"> };
</span></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsRenderingFrameTimelineDataGridNodejs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineDataGridNode.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineDataGridNode.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineDataGridNode.js 2015-12-03 18:35:53 UTC (rev 193053)
</span><span class="lines">@@ -23,32 +23,27 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.RenderingFrameTimelineDataGridNode = function(renderingFrameTimelineRecord, baseStartTime)
</del><ins>+WebInspector.RenderingFrameTimelineDataGridNode = class RenderingFrameTimelineDataGridNode extends WebInspector.TimelineDataGridNode
</ins><span class="cx"> {
</span><del>- WebInspector.TimelineDataGridNode.call(this, false, null);
</del><ins>+ constructor(renderingFrameTimelineRecord, baseStartTime)
+ {
+ super(false, null);
</ins><span class="cx">
</span><del>- this._record = renderingFrameTimelineRecord;
- this._baseStartTime = baseStartTime || 0;
-};
</del><ins>+ this._record = renderingFrameTimelineRecord;
+ this._baseStartTime = baseStartTime || 0;
+ }
</ins><span class="cx">
</span><del>-WebInspector.RenderingFrameTimelineDataGridNode.IconStyleClassName = "icon";
-WebInspector.RenderingFrameTimelineDataGridNode.SubtitleStyleClassName = "subtitle";
-
-WebInspector.RenderingFrameTimelineDataGridNode.prototype = {
- constructor: WebInspector.RenderingFrameTimelineDataGridNode,
- __proto__: WebInspector.TimelineDataGridNode.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get record()
</span><span class="cx"> {
</span><span class="cx"> return this._record;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get records()
</span><span class="cx"> {
</span><span class="cx"> return [this._record];
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get data()
</span><span class="cx"> {
</span><span class="lines">@@ -57,9 +52,9 @@
</span><span class="cx"> var paintTime = this._record.durationForTask(WebInspector.RenderingFrameTimelineRecord.TaskType.Paint);
</span><span class="cx"> var otherTime = this._record.durationForTask(WebInspector.RenderingFrameTimelineRecord.TaskType.Other);
</span><span class="cx"> return {startTime: this._record.startTime, scriptTime, layoutTime, paintTime, otherTime, totalTime: this._record.duration};
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- createCellContent: function(columnIdentifier, cell)
</del><ins>+ createCellContent(columnIdentifier, cell)
</ins><span class="cx"> {
</span><span class="cx"> const emptyValuePlaceholderString = "\u2014";
</span><span class="cx"> var value = this.data[columnIdentifier];
</span><span class="lines">@@ -76,6 +71,6 @@
</span><span class="cx"> return (isNaN(value) || value === 0) ? emptyValuePlaceholderString : Number.secondsToString(value, true);
</span><span class="cx"> }
</span><span class="cx">
</span><del>- return WebInspector.TimelineDataGridNode.prototype.createCellContent.call(this, columnIdentifier, cell);
</del><ins>+ return super.createCellContent(columnIdentifier, cell);
</ins><span class="cx"> }
</span><span class="cx"> };
</span></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsResourceTimelineDataGridNodejs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.js 2015-12-03 18:35:53 UTC (rev 193053)
</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,46 +23,38 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ResourceTimelineDataGridNode = function(resourceTimelineRecord, graphOnly, graphDataSource)
</del><ins>+WebInspector.ResourceTimelineDataGridNode = class ResourceTimelineDataGridNode extends WebInspector.TimelineDataGridNode
</ins><span class="cx"> {
</span><del>- WebInspector.TimelineDataGridNode.call(this, graphOnly, graphDataSource);
</del><ins>+ constructor(resourceTimelineRecord, graphOnly, graphDataSource)
+ {
+ super(graphOnly, graphDataSource);
</ins><span class="cx">
</span><del>- this._resource = resourceTimelineRecord.resource;
- this._record = resourceTimelineRecord;
</del><ins>+ this._resource = resourceTimelineRecord.resource;
+ this._record = resourceTimelineRecord;
</ins><span class="cx">
</span><del>- this._record.addEventListener(WebInspector.TimelineRecord.Event.Updated, graphOnly ? this._timelineRecordUpdated : this._needsRefresh, this);
</del><ins>+ this._record.addEventListener(WebInspector.TimelineRecord.Event.Updated, graphOnly ? this._timelineRecordUpdated : this._needsRefresh, this);
</ins><span class="cx">
</span><del>- if (!graphOnly) {
- this._resource.addEventListener(WebInspector.Resource.Event.URLDidChange, this._needsRefresh, this);
- this._resource.addEventListener(WebInspector.Resource.Event.TypeDidChange, this._needsRefresh, this);
- this._resource.addEventListener(WebInspector.Resource.Event.LoadingDidFinish, this._needsRefresh, this);
- this._resource.addEventListener(WebInspector.Resource.Event.LoadingDidFail, this._needsRefresh, this);
- this._resource.addEventListener(WebInspector.Resource.Event.SizeDidChange, this._needsRefresh, this);
- this._resource.addEventListener(WebInspector.Resource.Event.TransferSizeDidChange, this._needsRefresh, this);
</del><ins>+ if (!graphOnly) {
+ this._resource.addEventListener(WebInspector.Resource.Event.URLDidChange, this._needsRefresh, this);
+ this._resource.addEventListener(WebInspector.Resource.Event.TypeDidChange, this._needsRefresh, this);
+ this._resource.addEventListener(WebInspector.Resource.Event.LoadingDidFinish, this._needsRefresh, this);
+ this._resource.addEventListener(WebInspector.Resource.Event.LoadingDidFail, this._needsRefresh, this);
+ this._resource.addEventListener(WebInspector.Resource.Event.SizeDidChange, this._needsRefresh, this);
+ this._resource.addEventListener(WebInspector.Resource.Event.TransferSizeDidChange, this._needsRefresh, this);
+ }
</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.ResourceTimelineDataGridNode);
-
-WebInspector.ResourceTimelineDataGridNode.IconStyleClassName = "icon";
-WebInspector.ResourceTimelineDataGridNode.ErrorStyleClassName = "error";
-
-WebInspector.ResourceTimelineDataGridNode.prototype = {
- constructor: WebInspector.ResourceTimelineDataGridNode,
- __proto__: WebInspector.TimelineDataGridNode.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get records()
</span><span class="cx"> {
</span><span class="cx"> return [this._record];
</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"> get data()
</span><span class="cx"> {
</span><span class="lines">@@ -92,14 +84,14 @@
</span><span class="cx">
</span><span class="cx"> this._cachedData = data;
</span><span class="cx"> return data;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- createCellContent: function(columnIdentifier, cell)
</del><ins>+ createCellContent(columnIdentifier, cell)
</ins><span class="cx"> {
</span><span class="cx"> var resource = this._resource;
</span><span class="cx">
</span><span class="cx"> if (resource.failed || resource.canceled || resource.statusCode >= 400)
</span><del>- cell.classList.add(WebInspector.ResourceTimelineDataGridNode.ErrorStyleClassName);
</del><ins>+ cell.classList.add("error");
</ins><span class="cx">
</span><span class="cx"> const emptyValuePlaceholderString = "\u2014";
</span><span class="cx"> var value = this.data[columnIdentifier];
</span><span class="lines">@@ -128,10 +120,10 @@
</span><span class="cx"> return isNaN(value) ? emptyValuePlaceholderString : Number.secondsToString(value, true);
</span><span class="cx"> }
</span><span class="cx">
</span><del>- return WebInspector.TimelineDataGridNode.prototype.createCellContent.call(this, columnIdentifier, cell);
- },
</del><ins>+ return super.createCellContent(columnIdentifier, cell);
+ }
</ins><span class="cx">
</span><del>- refresh: function()
</del><ins>+ refresh()
</ins><span class="cx"> {
</span><span class="cx"> if (this._scheduledRefreshIdentifier) {
</span><span class="cx"> cancelAnimationFrame(this._scheduledRefreshIdentifier);
</span><span class="lines">@@ -140,12 +132,12 @@
</span><span class="cx">
</span><span class="cx"> delete this._cachedData;
</span><span class="cx">
</span><del>- WebInspector.TimelineDataGridNode.prototype.refresh.call(this);
- },
</del><ins>+ super.refresh();
+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _needsRefresh: function()
</del><ins>+ _needsRefresh()
</ins><span class="cx"> {
</span><span class="cx"> if (this.dataGrid instanceof WebInspector.TimelineDataGrid) {
</span><span class="cx"> this.dataGrid.dataGridNodeNeedsRefresh(this);
</span><span class="lines">@@ -156,9 +148,9 @@
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._scheduledRefreshIdentifier = requestAnimationFrame(this.refresh.bind(this));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _timelineRecordUpdated: function(event)
</del><ins>+ _timelineRecordUpdated(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this.isRecordVisible(this._record))
</span><span class="cx"> this.needsGraphRefresh();
</span></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsScriptTimelineDataGridjs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ScriptTimelineDataGrid.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ScriptTimelineDataGrid.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ScriptTimelineDataGrid.js 2015-12-03 18:35:53 UTC (rev 193053)
</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,20 +23,17 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ScriptTimelineDataGrid = function(treeOutline, columns, delegate, editCallback, deleteCallback)
</del><ins>+WebInspector.ScriptTimelineDataGrid = class ScriptTimelineDataGrid extends WebInspector.TimelineDataGrid
</ins><span class="cx"> {
</span><del>- WebInspector.TimelineDataGrid.call(this, treeOutline, columns, delegate, editCallback, deleteCallback);
-};
</del><ins>+ constructor(treeOutline, columns, delegate, editCallback, deleteCallback)
+ {
+ super(treeOutline, columns, delegate, editCallback, deleteCallback);
+ }
</ins><span class="cx">
</span><del>-WebInspector.ScriptTimelineDataGrid.prototype = {
- constructor: WebInspector.ScriptTimelineDataGrid,
-
</del><span class="cx"> // Protected
</span><span class="cx">
</span><del>- callFramePopoverAnchorElement: function()
</del><ins>+ callFramePopoverAnchorElement()
</ins><span class="cx"> {
</span><span class="cx"> return this.selectedNode.elementWithColumnIdentifier("location");
</span><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.ScriptTimelineDataGrid.prototype.__proto__ = WebInspector.TimelineDataGrid.prototype;
</del></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsScriptTimelineDataGridNodejs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ScriptTimelineDataGridNode.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ScriptTimelineDataGridNode.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/ScriptTimelineDataGridNode.js 2015-12-03 18:35:53 UTC (rev 193053)
</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,51 +23,44 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ScriptTimelineDataGridNode = function(scriptTimelineRecord, baseStartTime, rangeStartTime, rangeEndTime)
</del><ins>+WebInspector.ScriptTimelineDataGridNode = class ScriptTimelineDataGridNode extends WebInspector.TimelineDataGridNode
</ins><span class="cx"> {
</span><del>- WebInspector.TimelineDataGridNode.call(this, false, null);
</del><ins>+ constructor(scriptTimelineRecord, baseStartTime, rangeStartTime, rangeEndTime)
+ {
+ super(false, null);
</ins><span class="cx">
</span><del>- this._record = scriptTimelineRecord;
- this._baseStartTime = baseStartTime || 0;
- this._rangeStartTime = rangeStartTime || 0;
- this._rangeEndTime = typeof rangeEndTime === "number" ? rangeEndTime : Infinity;
-};
</del><ins>+ this._record = scriptTimelineRecord;
+ this._baseStartTime = baseStartTime || 0;
+ this._rangeStartTime = rangeStartTime || 0;
+ this._rangeEndTime = typeof rangeEndTime === "number" ? rangeEndTime : Infinity;
+ }
</ins><span class="cx">
</span><del>-// FIXME: Move to a WebInspector.Object subclass and we can remove this.
-WebInspector.Object.deprecatedAddConstructorFunctions(WebInspector.ScriptTimelineDataGridNode);
-
-WebInspector.ScriptTimelineDataGridNode.IconStyleClassName = "icon";
-
-WebInspector.ScriptTimelineDataGridNode.prototype = {
- constructor: WebInspector.ScriptTimelineDataGridNode,
- __proto__: WebInspector.TimelineDataGridNode.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get record()
</span><span class="cx"> {
</span><span class="cx"> return this._record;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get records()
</span><span class="cx"> {
</span><span class="cx"> return [this._record];
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get baseStartTime()
</span><span class="cx"> {
</span><span class="cx"> return this._baseStartTime;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get rangeStartTime()
</span><span class="cx"> {
</span><span class="cx"> return this._rangeStartTime;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get rangeEndTime()
</span><span class="cx"> {
</span><span class="cx"> return this._rangeEndTime;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get data()
</span><span class="cx"> {
</span><span class="lines">@@ -86,9 +79,9 @@
</span><span class="cx">
</span><span class="cx"> return {eventType: this._record.eventType, startTime, selfTime: duration, totalTime: duration,
</span><span class="cx"> averageTime: duration, callCount: 1, location: callFrameOrSourceCodeLocation};
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- updateRangeTimes: function(startTime, endTime)
</del><ins>+ updateRangeTimes(startTime, endTime)
</ins><span class="cx"> {
</span><span class="cx"> var oldRangeStartTime = this._rangeStartTime;
</span><span class="cx"> var oldRangeEndTime = this._rangeEndTime;
</span><span class="lines">@@ -113,9 +106,9 @@
</span><span class="cx">
</span><span class="cx"> if (oldStartBoundary !== newStartBoundary || oldEndBoundary !== newEndBoundary)
</span><span class="cx"> this.needsRefresh();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- createCellContent: function(columnIdentifier, cell)
</del><ins>+ createCellContent(columnIdentifier, cell)
</ins><span class="cx"> {
</span><span class="cx"> const emptyValuePlaceholderString = "\u2014";
</span><span class="cx"> var value = this.data[columnIdentifier];
</span><span class="lines">@@ -133,6 +126,6 @@
</span><span class="cx"> return isNaN(value) ? emptyValuePlaceholderString : Number.secondsToString(value, true);
</span><span class="cx"> }
</span><span class="cx">
</span><del>- return WebInspector.TimelineDataGridNode.prototype.createCellContent.call(this, columnIdentifier, cell);
</del><ins>+ return super.createCellContent(columnIdentifier, cell);
</ins><span class="cx"> }
</span><span class="cx"> };
</span></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsSourceCodeTimelineTimelineDataGridNodejs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/SourceCodeTimelineTimelineDataGridNode.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/SourceCodeTimelineTimelineDataGridNode.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/SourceCodeTimelineTimelineDataGridNode.js 2015-12-03 18:35:53 UTC (rev 193053)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2014 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2014, 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,41 +23,36 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.SourceCodeTimelineTimelineDataGridNode = function(sourceCodeTimeline, graphDataSource)
</del><ins>+WebInspector.SourceCodeTimelineTimelineDataGridNode = class SourceCodeTimelineTimelineDataGridNode extends WebInspector.TimelineDataGridNode
</ins><span class="cx"> {
</span><del>- WebInspector.TimelineDataGridNode.call(this, true, graphDataSource);
</del><ins>+ constructor(sourceCodeTimeline, graphDataSource)
+ {
+ super(true, graphDataSource);
</ins><span class="cx">
</span><del>- this._sourceCodeTimeline = sourceCodeTimeline;
- this._sourceCodeTimeline.addEventListener(WebInspector.Timeline.Event.RecordAdded, this._timelineRecordAdded, this);
-};
</del><ins>+ this._sourceCodeTimeline = sourceCodeTimeline;
+ this._sourceCodeTimeline.addEventListener(WebInspector.Timeline.Event.RecordAdded, this._timelineRecordAdded, this);
+ }
</ins><span class="cx">
</span><del>-// FIXME: Move to a WebInspector.Object subclass and we can remove this.
-WebInspector.Object.deprecatedAddConstructorFunctions(WebInspector.SourceCodeTimelineTimelineDataGridNode);
-
-WebInspector.SourceCodeTimelineTimelineDataGridNode.prototype = {
- constructor: WebInspector.SourceCodeTimelineTimelineDataGridNode,
- __proto__: WebInspector.TimelineDataGridNode.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get records()
</span><span class="cx"> {
</span><span class="cx"> return this._sourceCodeTimeline.records;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get sourceCodeTimeline()
</span><span class="cx"> {
</span><span class="cx"> return this._sourceCodeTimeline;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get data()
</span><span class="cx"> {
</span><span class="cx"> return {graph: this._sourceCodeTimeline.startTime};
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _timelineRecordAdded: function(event)
</del><ins>+ _timelineRecordAdded(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this.isRecordVisible(event.data.record))
</span><span class="cx"> this.needsGraphRefresh();
</span></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsTimelineDataGridjs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.js 2015-12-03 18:35:53 UTC (rev 193053)
</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,115 +23,104 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.TimelineDataGrid = function(treeOutline, columns, delegate, editCallback, deleteCallback)
</del><ins>+WebInspector.TimelineDataGrid = class TimelineDataGrid extends WebInspector.DataGrid
</ins><span class="cx"> {
</span><del>- WebInspector.DataGrid.call(this, columns, editCallback, deleteCallback);
</del><ins>+ constructor(treeOutline, columns, delegate, editCallback, deleteCallback)
+ {
+ super(columns, editCallback, deleteCallback);
</ins><span class="cx">
</span><del>- this._treeOutlineDataGridSynchronizer = new WebInspector.TreeOutlineDataGridSynchronizer(treeOutline, this, delegate);
</del><ins>+ this._treeOutlineDataGridSynchronizer = new WebInspector.TreeOutlineDataGridSynchronizer(treeOutline, this, delegate);
</ins><span class="cx">
</span><del>- this.element.classList.add(WebInspector.TimelineDataGrid.StyleClassName);
</del><ins>+ this.element.classList.add("timeline");
</ins><span class="cx">
</span><del>- this._filterableColumns = [];
</del><ins>+ this._filterableColumns = [];
</ins><span class="cx">
</span><del>- // Check if any of the cells can be filtered.
- for (var [identifier, column] of this.columns) {
- var scopeBar = column.scopeBar;
</del><ins>+ // Check if any of the cells can be filtered.
+ for (var [identifier, column] of this.columns) {
+ var scopeBar = column.scopeBar;
</ins><span class="cx">
</span><del>- if (!scopeBar)
- continue;
</del><ins>+ if (!scopeBar)
+ continue;
</ins><span class="cx">
</span><del>- this._filterableColumns.push(identifier);
- scopeBar.columnIdentifier = identifier;
- scopeBar.addEventListener(WebInspector.ScopeBar.Event.SelectionChanged, this._scopeBarSelectedItemsDidChange, this);
- }
</del><ins>+ this._filterableColumns.push(identifier);
+ scopeBar.columnIdentifier = identifier;
+ scopeBar.addEventListener(WebInspector.ScopeBar.Event.SelectionChanged, this._scopeBarSelectedItemsDidChange, this);
+ }
</ins><span class="cx">
</span><del>- if (this._filterableColumns.length > 1) {
- console.error("Creating a TimelineDataGrid with more than one filterable column is not yet supported.");
- return;
- }
</del><ins>+ if (this._filterableColumns.length > 1) {
+ console.error("Creating a TimelineDataGrid with more than one filterable column is not yet supported.");
+ return;
+ }
</ins><span class="cx">
</span><del>- this.addEventListener(WebInspector.DataGrid.Event.SelectedNodeChanged, this._dataGridSelectedNodeChanged, this);
- this.addEventListener(WebInspector.DataGrid.Event.SortChanged, this._sort, this);
</del><ins>+ this.addEventListener(WebInspector.DataGrid.Event.SelectedNodeChanged, this._dataGridSelectedNodeChanged, this);
+ this.addEventListener(WebInspector.DataGrid.Event.SortChanged, this._sort, this);
</ins><span class="cx">
</span><del>- window.addEventListener("resize", this);
-};
</del><ins>+ window.addEventListener("resize", this);
+ }
</ins><span class="cx">
</span><del>-WebInspector.TimelineDataGrid.StyleClassName = "timeline";
-WebInspector.TimelineDataGrid.HasNonDefaultFilterStyleClassName = "has-non-default-filter";
-WebInspector.TimelineDataGrid.DelayedPopoverShowTimeout = 250;
-WebInspector.TimelineDataGrid.DelayedPopoverHideContentClearTimeout = 500;
</del><ins>+ static createColumnScopeBar(prefix, map)
+ {
+ prefix = prefix + "-timeline-data-grid-";
</ins><span class="cx">
</span><del>-WebInspector.TimelineDataGrid.Event = {
- FiltersDidChange: "timelinedatagrid-filters-did-change"
-};
</del><ins>+ var scopeBarItems = [];
+ for (var [key, value] of map) {
+ var id = prefix + key;
+ var item = new WebInspector.ScopeBarItem(id, value);
+ item.value = key;
+ scopeBarItems.push(item);
+ }
</ins><span class="cx">
</span><del>-WebInspector.TimelineDataGrid.createColumnScopeBar = function(prefix, map)
-{
- prefix = prefix + "-timeline-data-grid-";
</del><ins>+ var allItem = new WebInspector.ScopeBarItem(prefix + "type-all", WebInspector.UIString("All"));
+ scopeBarItems.unshift(allItem);
</ins><span class="cx">
</span><del>- var scopeBarItems = [];
- for (var [key, value] of map) {
- var id = prefix + key;
- var item = new WebInspector.ScopeBarItem(id, value);
- item.value = key;
- scopeBarItems.push(item);
</del><ins>+ return new WebInspector.ScopeBar(prefix + "scope-bar", scopeBarItems, allItem, true);
</ins><span class="cx"> }
</span><span class="cx">
</span><del>- var allItem = new WebInspector.ScopeBarItem(prefix + "type-all", WebInspector.UIString("All"));
- scopeBarItems.unshift(allItem);
-
- return new WebInspector.ScopeBar(prefix + "scope-bar", scopeBarItems, allItem, true);
-};
-
-WebInspector.TimelineDataGrid.prototype = {
- constructor: WebInspector.TimelineDataGrid,
- __proto__: WebInspector.DataGrid.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><del>- reset: function()
</del><ins>+ reset()
</ins><span class="cx"> {
</span><span class="cx"> // May be overridden by subclasses. If so, they should call the superclass.
</span><span class="cx">
</span><span class="cx"> this._hidePopover();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- shown: function()
</del><ins>+ shown()
</ins><span class="cx"> {
</span><span class="cx"> // May be overridden by subclasses. If so, they should call the superclass.
</span><span class="cx">
</span><span class="cx"> this._treeOutlineDataGridSynchronizer.synchronize();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- hidden: function()
</del><ins>+ hidden()
</ins><span class="cx"> {
</span><span class="cx"> // May be overridden by subclasses. If so, they should call the superclass.
</span><span class="cx">
</span><span class="cx"> this._hidePopover();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- closed: function()
</del><ins>+ closed()
</ins><span class="cx"> {
</span><span class="cx"> window.removeEventListener("resize", this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- treeElementForDataGridNode: function(dataGridNode)
</del><ins>+ treeElementForDataGridNode(dataGridNode)
</ins><span class="cx"> {
</span><span class="cx"> return this._treeOutlineDataGridSynchronizer.treeElementForDataGridNode(dataGridNode);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- dataGridNodeForTreeElement: function(treeElement)
</del><ins>+ dataGridNodeForTreeElement(treeElement)
</ins><span class="cx"> {
</span><span class="cx"> return this._treeOutlineDataGridSynchronizer.dataGridNodeForTreeElement(treeElement);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- callFramePopoverAnchorElement: function()
</del><ins>+ callFramePopoverAnchorElement()
</ins><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses.
</span><span class="cx"> return null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- treeElementMatchesActiveScopeFilters: function(treeElement)
</del><ins>+ treeElementMatchesActiveScopeFilters(treeElement)
</ins><span class="cx"> {
</span><span class="cx"> var dataGridNode = this._treeOutlineDataGridSynchronizer.dataGridNodeForTreeElement(treeElement);
</span><span class="cx"> console.assert(dataGridNode);
</span><span class="lines">@@ -151,9 +140,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> return true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- addRowInSortOrder: function(treeElement, dataGridNode, parentElement)
</del><ins>+ addRowInSortOrder(treeElement, dataGridNode, parentElement)
</ins><span class="cx"> {
</span><span class="cx"> this._treeOutlineDataGridSynchronizer.associate(treeElement, dataGridNode);
</span><span class="cx">
</span><span class="lines">@@ -171,23 +160,23 @@
</span><span class="cx"> // Append to the parent, which will cause the synchronizer to append to the data grid.
</span><span class="cx"> parentElement.appendChild(treeElement);
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- shouldIgnoreSelectionEvent: function()
</del><ins>+ shouldIgnoreSelectionEvent()
</ins><span class="cx"> {
</span><span class="cx"> return this._ignoreSelectionEvent || false;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Protected
</span><span class="cx">
</span><del>- handleEvent: function(event)
</del><ins>+ handleEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> console.assert(event.type === "resize");
</span><span class="cx">
</span><span class="cx"> this._windowResized(event);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- dataGridNodeNeedsRefresh: function(dataGridNode)
</del><ins>+ dataGridNodeNeedsRefresh(dataGridNode)
</ins><span class="cx"> {
</span><span class="cx"> if (!this._dirtyDataGridNodes)
</span><span class="cx"> this._dirtyDataGridNodes = new Set;
</span><span class="lines">@@ -197,11 +186,11 @@
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._scheduledDataGridNodeRefreshIdentifier = requestAnimationFrame(this._refreshDirtyDataGridNodes.bind(this));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _refreshDirtyDataGridNodes: function()
</del><ins>+ _refreshDirtyDataGridNodes()
</ins><span class="cx"> {
</span><span class="cx"> if (this._scheduledDataGridNodeRefreshIdentifier) {
</span><span class="cx"> cancelAnimationFrame(this._scheduledDataGridNodeRefreshIdentifier);
</span><span class="lines">@@ -254,9 +243,9 @@
</span><span class="cx"> this._treeOutlineDataGridSynchronizer.enabled = true;
</span><span class="cx">
</span><span class="cx"> delete this._dirtyDataGridNodes;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _sort: function()
</del><ins>+ _sort()
</ins><span class="cx"> {
</span><span class="cx"> var sortColumnIdentifier = this.sortColumnIdentifier;
</span><span class="cx"> if (!sortColumnIdentifier)
</span><span class="lines">@@ -312,9 +301,9 @@
</span><span class="cx"> selectedNode.revealAndSelect();
</span><span class="cx">
</span><span class="cx"> delete this._ignoreSelectionEvent;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _sortComparator: function(node1, node2)
</del><ins>+ _sortComparator(node1, node2)
</ins><span class="cx"> {
</span><span class="cx"> var sortColumnIdentifier = this.sortColumnIdentifier;
</span><span class="cx"> if (!sortColumnIdentifier)
</span><span class="lines">@@ -351,9 +340,9 @@
</span><span class="cx">
</span><span class="cx"> // For everything else (mostly booleans).
</span><span class="cx"> return (value1 < value2 ? -1 : (value1 > value2 ? 1 : 0)) * sortDirection;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateScopeBarForcedVisibility: function()
</del><ins>+ _updateScopeBarForcedVisibility()
</ins><span class="cx"> {
</span><span class="cx"> for (var identifier of this._filterableColumns) {
</span><span class="cx"> var scopeBar = this.columns.get(identifier).scopeBar;
</span><span class="lines">@@ -362,17 +351,17 @@
</span><span class="cx"> break;
</span><span class="cx"> }
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _scopeBarSelectedItemsDidChange: function(event)
</del><ins>+ _scopeBarSelectedItemsDidChange(event)
</ins><span class="cx"> {
</span><span class="cx"> this._updateScopeBarForcedVisibility();
</span><span class="cx">
</span><span class="cx"> var columnIdentifier = event.target.columnIdentifier;
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.TimelineDataGrid.Event.FiltersDidChange, {columnIdentifier});
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _dataGridSelectedNodeChanged: function(event)
</del><ins>+ _dataGridSelectedNodeChanged(event)
</ins><span class="cx"> {
</span><span class="cx"> if (!this.selectedNode) {
</span><span class="cx"> this._hidePopover();
</span><span class="lines">@@ -386,15 +375,15 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> this._showPopoverForSelectedNodeSoon();
</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(false);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _showPopoverForSelectedNodeSoon: function()
</del><ins>+ _showPopoverForSelectedNodeSoon()
</ins><span class="cx"> {
</span><span class="cx"> if (this._showPopoverTimeout)
</span><span class="cx"> return;
</span><span class="lines">@@ -408,9 +397,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> this._showPopoverTimeout = setTimeout(delayedWork.bind(this), WebInspector.TimelineDataGrid.DelayedPopoverShowTimeout);
</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._showPopoverTimeout) {
</span><span class="cx"> clearTimeout(this._showPopoverTimeout);
</span><span class="lines">@@ -429,9 +418,9 @@
</span><span class="cx"> if (this._hidePopoverContentClearTimeout)
</span><span class="cx"> clearTimeout(this._hidePopoverContentClearTimeout);
</span><span class="cx"> this._hidePopoverContentClearTimeout = setTimeout(delayedWork.bind(this), WebInspector.TimelineDataGrid.DelayedPopoverHideContentClearTimeout);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updatePopoverForSelectedNode: function(updateContent)
</del><ins>+ _updatePopoverForSelectedNode(updateContent)
</ins><span class="cx"> {
</span><span class="cx"> if (!this._popover || !this.selectedNode)
</span><span class="cx"> return;
</span><span class="lines">@@ -456,9 +445,9 @@
</span><span class="cx"> this._popover.content = this._createPopoverContent();
</span><span class="cx">
</span><span class="cx"> this._popover.present(targetFrame.pad(2), [WebInspector.RectEdge.MAX_Y, WebInspector.RectEdge.MIN_Y, WebInspector.RectEdge.MAX_X]);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _createPopoverContent: function()
</del><ins>+ _createPopoverContent()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._popoverCallStackTreeOutline) {
</span><span class="cx"> var contentElement = document.createElement("ol");
</span><span class="lines">@@ -478,9 +467,9 @@
</span><span class="cx"> content.className = "timeline-data-grid-popover";
</span><span class="cx"> content.appendChild(this._popoverCallStackTreeOutline.element);
</span><span class="cx"> return content;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _popoverCallStackTreeElementSelected: function(treeElement, selectedByUser)
</del><ins>+ _popoverCallStackTreeElementSelected(treeElement, selectedByUser)
</ins><span class="cx"> {
</span><span class="cx"> this._popover.dismiss();
</span><span class="cx">
</span><span class="lines">@@ -492,3 +481,12 @@
</span><span class="cx"> WebInspector.showSourceCodeLocation(callFrame.sourceCodeLocation);
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.TimelineDataGrid.HasNonDefaultFilterStyleClassName = "has-non-default-filter";
+WebInspector.TimelineDataGrid.DelayedPopoverShowTimeout = 250;
+WebInspector.TimelineDataGrid.DelayedPopoverHideContentClearTimeout = 500;
+
+WebInspector.TimelineDataGrid.Event = {
+ FiltersDidChange: "timelinedatagrid-filters-did-change"
+};
+
</ins></span></pre></div>
<a id="branchessafari601branchSourceWebInspectorUIUserInterfaceViewsTimelineDataGridNodejs"></a>
<div class="modfile"><h4>Modified: branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/TimelineDataGridNode.js (193052 => 193053)</h4>
<pre class="diff"><span>
<span class="info">--- branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/TimelineDataGridNode.js 2015-12-03 18:35:42 UTC (rev 193052)
+++ branches/safari-601-branch/Source/WebInspectorUI/UserInterface/Views/TimelineDataGridNode.js 2015-12-03 18:35:53 UTC (rev 193053)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2014 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2014, 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,40 +23,35 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.TimelineDataGridNode = function(graphOnly, graphDataSource, hasChildren)
</del><ins>+WebInspector.TimelineDataGridNode = class TimelineDataGridNode extends WebInspector.DataGridNode
</ins><span class="cx"> {
</span><del>- WebInspector.DataGridNode.call(this, {}, hasChildren);
</del><ins>+ constructor(graphOnly, graphDataSource, hasChildren)
+ {
+ super({}, hasChildren);
</ins><span class="cx">
</span><del>- this.copyable = false;
</del><ins>+ this.copyable = false;
</ins><span class="cx">
</span><del>- this._graphOnly = graphOnly || false;
- this._graphDataSource = graphDataSource || null;
</del><ins>+ this._graphOnly = graphOnly || false;
+ this._graphDataSource = graphDataSource || null;
</ins><span class="cx">
</span><del>- if (graphDataSource) {
- this._graphContainerElement = document.createElement("div");
- this._timelineRecordBars = [];
</del><ins>+ if (graphDataSource) {
+ this._graphContainerElement = document.createElement("div");
+ this._timelineRecordBars = [];
+ }
</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.TimelineDataGridNode);
-
-WebInspector.TimelineDataGridNode.prototype = {
- constructor: WebInspector.TimelineDataGridNode,
- __proto__: WebInspector.DataGridNode.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get records()
</span><span class="cx"> {
</span><span class="cx"> // Implemented by subclasses.
</span><span class="cx"> return [];
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get graphDataSource()
</span><span class="cx"> {
</span><span class="cx"> return this._graphDataSource;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get data()
</span><span class="cx"> {
</span><span class="lines">@@ -65,22 +60,22 @@
</span><span class="cx">
</span><span class="cx"> var records = this.records || [];
</span><span class="cx"> return {graph: records.length ? records[0].startTime : 0};
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- collapse: function()
</del><ins>+ collapse()
</ins><span class="cx"> {
</span><del>- WebInspector.DataGridNode.prototype.collapse.call(this);
</del><ins>+ super.collapse();
</ins><span class="cx">
</span><span class="cx"> if (!this._graphDataSource || !this.revealed)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> // Refresh to show child bars in our graph now that we collapsed.
</span><span class="cx"> this.refreshGraph();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- expand: function()
</del><ins>+ expand()
</ins><span class="cx"> {
</span><del>- WebInspector.DataGridNode.prototype.expand.call(this);
</del><ins>+ super.expand();
</ins><span class="cx">
</span><span class="cx"> if (!this._graphDataSource || !this.revealed)
</span><span class="cx"> return;
</span><span class="lines">@@ -95,9 +90,9 @@
</span><span class="cx"> childNode.refreshGraph();
</span><span class="cx"> childNode = childNode.traverseNextNode(true, this);
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- createCellContent: function(columnIdentifier, cell)
</del><ins>+ createCellContent(columnIdentifier, cell)
</ins><span class="cx"> {
</span><span class="cx"> if (columnIdentifier === "graph" && this._graphDataSource) {
</span><span class="cx"> this.needsGraphRefresh();
</span><span class="lines">@@ -162,7 +157,7 @@
</span><span class="cx"> fragment.appendChild(goToArrowButtonLink);
</span><span class="cx">
</span><span class="cx"> var icon = document.createElement("div");
</span><del>- icon.className = WebInspector.LayoutTimelineDataGridNode.IconStyleClassName;
</del><ins>+ icon.classList.add("icon");
</ins><span class="cx"> fragment.appendChild(icon);
</span><span class="cx">
</span><span class="cx"> if (isAnonymousFunction) {
</span><span class="lines">@@ -190,7 +185,7 @@
</span><span class="cx"> fragment.appendChild(document.createTextNode(functionName));
</span><span class="cx">
</span><span class="cx"> var subtitleElement = document.createElement("span");
</span><del>- subtitleElement.className = WebInspector.LayoutTimelineDataGridNode.SubtitleStyleClassName;
</del><ins>+ subtitleElement.classList.add("subtitle");
</ins><span class="cx"> callFrame.sourceCodeLocation.populateLiveDisplayLocationString(subtitleElement, "textContent");
</span><span class="cx">
</span><span class="cx"> fragment.appendChild(subtitleElement);
</span><span class="lines">@@ -200,28 +195,28 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> var icon = document.createElement("div");
</span><del>- icon.className = WebInspector.LayoutTimelineDataGridNode.IconStyleClassName;
- fragment.appendChild(icon);
</del><ins>+ icon.classList.add("icon");
</ins><span class="cx">
</span><ins>+ fragment.appendChild(icon);
</ins><span class="cx"> fragment.appendChild(document.createTextNode(functionName));
</span><span class="cx">
</span><span class="cx"> return fragment;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- return WebInspector.DataGridNode.prototype.createCellContent.call(this, columnIdentifier, cell);
- },
</del><ins>+ return super.createCellContent(columnIdentifier, cell);
+ }
</ins><span class="cx">
</span><del>- refresh: function()
</del><ins>+ refresh()
</ins><span class="cx"> {
</span><span class="cx"> if (this._graphDataSource && this._graphOnly) {
</span><span class="cx"> this.needsGraphRefresh();
</span><span class="cx"> return;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- WebInspector.DataGridNode.prototype.refresh.call(this);
- },
</del><ins>+ super.refresh();
+ }
</ins><span class="cx">
</span><del>- refreshGraph: function()
</del><ins>+ refreshGraph()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._graphDataSource)
</span><span class="cx"> return;
</span><span class="lines">@@ -257,6 +252,19 @@
</span><span class="cx"> ++recordBarIndex;
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+ function collectRecordsByType(records, recordsByTypeMap)
+ {
+ for (var record of records) {
+ var typedRecords = recordsByTypeMap.get(record.type);
+ if (!typedRecords) {
+ typedRecords = [];
+ recordsByTypeMap.set(record.type, typedRecords);
+ }
+
+ typedRecords.push(record);
+ }
+ }
+
</ins><span class="cx"> var boundCreateBar = createBar.bind(this);
</span><span class="cx">
</span><span class="cx"> if (this.expanded) {
</span><span class="lines">@@ -267,26 +275,12 @@
</span><span class="cx"> // To share bars better, group records by type.
</span><span class="cx">
</span><span class="cx"> var recordTypeMap = new Map;
</span><ins>+ collectRecordsByType(this.records, recordTypeMap);
</ins><span class="cx">
</span><del>- function collectRecordsByType(records)
- {
- for (var record of records) {
- var typedRecords = recordTypeMap.get(record.type);
- if (!typedRecords) {
- typedRecords = [];
- recordTypeMap.set(record.type, typedRecords);
- }
-
- typedRecords.push(record);
- }
- }
-
- collectRecordsByType(this.records);
-
</del><span class="cx"> var childNode = this.children[0];
</span><span class="cx"> while (childNode) {
</span><span class="cx"> if (childNode instanceof WebInspector.TimelineDataGridNode)
</span><del>- collectRecordsByType(childNode.records);
</del><ins>+ collectRecordsByType(childNode.records, recordTypeMap);
</ins><span class="cx"> childNode = childNode.traverseNextNode(false, this);
</span><span class="cx"> }
</span><span class="cx">
</span><span class="lines">@@ -299,9 +293,9 @@
</span><span class="cx"> this._timelineRecordBars[recordBarIndex].records = null;
</span><span class="cx"> this._timelineRecordBars[recordBarIndex].element.remove();
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- needsGraphRefresh: function()
</del><ins>+ needsGraphRefresh()
</ins><span class="cx"> {
</span><span class="cx"> if (!this.revealed) {
</span><span class="cx"> // We are not visible, but an ancestor will be drawing our graph.
</span><span class="lines">@@ -323,11 +317,11 @@
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._scheduledGraphRefreshIdentifier = requestAnimationFrame(this.refreshGraph.bind(this));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Protected
</span><span class="cx">
</span><del>- isRecordVisible: function(record)
</del><ins>+ isRecordVisible(record)
</ins><span class="cx"> {
</span><span class="cx"> if (!this._graphDataSource)
</span><span class="cx"> return false;
</span></span></pre>
</div>
</div>
</body>
</html>