Web Inspector: Timelines UI redesign: use DataGridNode for TimelineView selection...
authormattbaker@apple.com <mattbaker@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 10 Mar 2016 01:38:03 +0000 (01:38 +0000)
committermattbaker@apple.com <mattbaker@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 10 Mar 2016 01:38:03 +0000 (01:38 +0000)
https://bugs.webkit.org/show_bug.cgi?id=154954
<rdar://problem/24947939>

Reviewed by Timothy Hatcher.

This patch adds a new path component, TimelineDataGridNodePathComponent,
for creating a path component from the current grid selection. This is
needed since TimelineViews will no longer have an associated content tree
outline once the navigation sidebar is removed.

TimelineDataGridNode has new protected methods, "displayName" and
"iconClassNames", which are used to populate hierarchical path components,
create grid node data, and create cell content.

TimelineView subclasses share a certain amount of boilerplate code for
getting selection path components and handling path component selection.
In the future we may be able to reduce this code by introducing a new
DataGridTimelineView base class.

* UserInterface/Main.html:
Added/removed files.

* UserInterface/Views/LayoutTimelineDataGridNode.js:
(WebInspector.LayoutTimelineDataGridNode.prototype.get data):
(WebInspector.LayoutTimelineDataGridNode.prototype.createCellContent):
(WebInspector.LayoutTimelineDataGridNode):
(WebInspector.LayoutTimelineDataGridNode.prototype.get record): Deleted.
Moved to base class.

* UserInterface/Views/LayoutTimelineView.js:
(WebInspector.LayoutTimelineView.prototype.get selectionPathComponents):
(WebInspector.LayoutTimelineView.prototype.dataGridNodePathComponentSelected):
(WebInspector.LayoutTimelineView.prototype.treeElementPathComponentSelected): Deleted.
TimelineView tree outlines are going away.

* UserInterface/Views/MemoryTimelineView.js:
(WebInspector.MemoryTimelineView.prototype.treeElementPathComponentSelected): Deleted.
TimelineView tree outlines are going away.

* UserInterface/Views/NetworkTimelineView.js:
(WebInspector.NetworkTimelineView.prototype.get selectionPathComponents):
(WebInspector.NetworkTimelineView.prototype.dataGridNodePathComponentSelected):
(WebInspector.NetworkTimelineView.prototype.treeElementPathComponentSelected): Deleted.
TimelineView tree outlines are going away.

* UserInterface/Views/ProfileNodeDataGridNode.js:
(WebInspector.ProfileNodeDataGridNode.prototype.get data):
(WebInspector.ProfileNodeDataGridNode.prototype.createCellContent):
(WebInspector.ProfileNodeDataGridNode.prototype.displayName):
(WebInspector.ProfileNodeDataGridNode.prototype.iconClassNames):
(WebInspector.ProfileNodeDataGridNode):
(WebInspector.ProfileNodeDataGridNode.prototype._iconClassNameForProfileNode): Deleted.
(WebInspector.ProfileNodeDataGridNode.prototype._titleForProfileNode): Deleted.
Re-implemented as overrides of the base class methods "iconClassNames"
and "displayName".

* UserInterface/Views/RenderingFrameTimelineDataGridNode.js:
(WebInspector.RenderingFrameTimelineDataGridNode.prototype.createCellContent):
(WebInspector.RenderingFrameTimelineDataGridNode):
(WebInspector.RenderingFrameTimelineDataGridNode.prototype.get record): Deleted.
Moved to base class.

* UserInterface/Views/ResourceTimelineDataGridNode.js:
(WebInspector.ResourceTimelineDataGridNode.prototype.createCellContent):
(WebInspector.ResourceTimelineDataGridNode.prototype.displayName):
(WebInspector.ResourceTimelineDataGridNode.prototype.iconClassNames):
Override base class methods, making it possible to remove ResourceTimelineDataGridNodePathComponent,
and treat all TimelineDataGridNodes in a uniform manner.

(WebInspector.ResourceTimelineDataGridNode.prototype._createNameCellDocumentFragment):
Replace duplicated code with call to "displayName".

* UserInterface/Views/ResourceTimelineDataGridNodePathComponent.js: Removed.
Replaced by more generic solution, TimelineDataGridNodePathComponent.

* UserInterface/Views/ScriptDetailsTimelineView.js:
(WebInspector.ScriptDetailsTimelineView.prototype.get selectionPathComponents):
(WebInspector.ScriptDetailsTimelineView.prototype.dataGridNodePathComponentSelected):
(WebInspector.ScriptDetailsTimelineView.prototype.treeElementPathComponentSelected): Deleted.
TimelineView tree outlines are going away.

* UserInterface/Views/ScriptTimelineDataGridNode.js:
(WebInspector.ScriptTimelineDataGridNode.prototype.createCellContent):
(WebInspector.ScriptTimelineDataGridNode.prototype._createNameCellDocumentFragment):
Replace duplicated code with call to "displayName".

(WebInspector.ScriptTimelineDataGridNode):
(WebInspector.ScriptTimelineDataGridNode.prototype.get record): Deleted.
Moved to base class.

* UserInterface/Views/SourceCodeTimelineTimelineDataGridNode.js:
(WebInspector.SourceCodeTimelineTimelineDataGridNode.prototype.createCellContent):
(WebInspector.SourceCodeTimelineTimelineDataGridNode.prototype._createNameCellContent):
Replace duplicated code with call to "displayName".

* UserInterface/Views/TimelineDataGridNode.js:
(WebInspector.TimelineDataGridNode.prototype.get record):
Implemented in terms of the "records" getter, since all subclasses simply returned the
node's first (or only) record.

(WebInspector.TimelineDataGridNode.prototype.displayName):
(WebInspector.TimelineDataGridNode.prototype.iconClassNames):
Base class implementations, using utility methods in TimelineTabContentView
to get display data based on the node's timeline record. Can be overridden
by nodes that either don't have a timeline record (ProfileNodeDataGridNode)

* UserInterface/Views/TimelineDataGridNodePathComponent.js:
(WebInspector.TimelineDataGridNodePathComponent):
(WebInspector.TimelineDataGridNodePathComponent.prototype.get timelineDataGridNode):
(WebInspector.TimelineDataGridNodePathComponent.prototype.get previousSibling):
(WebInspector.TimelineDataGridNodePathComponent.prototype.get nextSibling):

* UserInterface/Views/TimelineView.js:
(WebInspector.TimelineView):
(WebInspector.TimelineView.prototype.get selectionPathComponents):
Must be implemented by subclasses since not all TimelineViews use a DataGrid.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@197909 268f45cc-cd09-0410-ab3c-d52691b4dbfc

15 files changed:
Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Main.html
Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js
Source/WebInspectorUI/UserInterface/Views/LayoutTimelineView.js
Source/WebInspectorUI/UserInterface/Views/MemoryTimelineView.js
Source/WebInspectorUI/UserInterface/Views/NetworkTimelineView.js
Source/WebInspectorUI/UserInterface/Views/ProfileNodeDataGridNode.js
Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineDataGridNode.js
Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.js
Source/WebInspectorUI/UserInterface/Views/ScriptDetailsTimelineView.js
Source/WebInspectorUI/UserInterface/Views/ScriptTimelineDataGridNode.js
Source/WebInspectorUI/UserInterface/Views/SourceCodeTimelineTimelineDataGridNode.js
Source/WebInspectorUI/UserInterface/Views/TimelineDataGridNode.js
Source/WebInspectorUI/UserInterface/Views/TimelineDataGridNodePathComponent.js [moved from Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNodePathComponent.js with 56% similarity]
Source/WebInspectorUI/UserInterface/Views/TimelineView.js

index 336a023..a277071 100644 (file)
@@ -1,5 +1,125 @@
 2016-03-09  Matt Baker  <mattbaker@apple.com>
 
+        Web Inspector: Timelines UI redesign: use DataGridNode for TimelineView selection path components
+        https://bugs.webkit.org/show_bug.cgi?id=154954
+        <rdar://problem/24947939>
+
+        Reviewed by Timothy Hatcher.
+
+        This patch adds a new path component, TimelineDataGridNodePathComponent,
+        for creating a path component from the current grid selection. This is
+        needed since TimelineViews will no longer have an associated content tree
+        outline once the navigation sidebar is removed.
+
+        TimelineDataGridNode has new protected methods, "displayName" and
+        "iconClassNames", which are used to populate hierarchical path components,
+        create grid node data, and create cell content.
+
+        TimelineView subclasses share a certain amount of boilerplate code for
+        getting selection path components and handling path component selection.
+        In the future we may be able to reduce this code by introducing a new
+        DataGridTimelineView base class.
+
+        * UserInterface/Main.html:
+        Added/removed files.
+
+        * UserInterface/Views/LayoutTimelineDataGridNode.js:
+        (WebInspector.LayoutTimelineDataGridNode.prototype.get data):
+        (WebInspector.LayoutTimelineDataGridNode.prototype.createCellContent):
+        (WebInspector.LayoutTimelineDataGridNode):
+        (WebInspector.LayoutTimelineDataGridNode.prototype.get record): Deleted.
+        Moved to base class.
+
+        * UserInterface/Views/LayoutTimelineView.js:
+        (WebInspector.LayoutTimelineView.prototype.get selectionPathComponents):
+        (WebInspector.LayoutTimelineView.prototype.dataGridNodePathComponentSelected):
+        (WebInspector.LayoutTimelineView.prototype.treeElementPathComponentSelected): Deleted.
+        TimelineView tree outlines are going away.
+
+        * UserInterface/Views/MemoryTimelineView.js:
+        (WebInspector.MemoryTimelineView.prototype.treeElementPathComponentSelected): Deleted.
+        TimelineView tree outlines are going away.
+
+        * UserInterface/Views/NetworkTimelineView.js:
+        (WebInspector.NetworkTimelineView.prototype.get selectionPathComponents):
+        (WebInspector.NetworkTimelineView.prototype.dataGridNodePathComponentSelected):
+        (WebInspector.NetworkTimelineView.prototype.treeElementPathComponentSelected): Deleted.
+        TimelineView tree outlines are going away.
+
+        * UserInterface/Views/ProfileNodeDataGridNode.js:
+        (WebInspector.ProfileNodeDataGridNode.prototype.get data):
+        (WebInspector.ProfileNodeDataGridNode.prototype.createCellContent):
+        (WebInspector.ProfileNodeDataGridNode.prototype.displayName):
+        (WebInspector.ProfileNodeDataGridNode.prototype.iconClassNames):
+        (WebInspector.ProfileNodeDataGridNode):
+        (WebInspector.ProfileNodeDataGridNode.prototype._iconClassNameForProfileNode): Deleted.
+        (WebInspector.ProfileNodeDataGridNode.prototype._titleForProfileNode): Deleted.
+        Re-implemented as overrides of the base class methods "iconClassNames"
+        and "displayName".
+
+        * UserInterface/Views/RenderingFrameTimelineDataGridNode.js:
+        (WebInspector.RenderingFrameTimelineDataGridNode.prototype.createCellContent):
+        (WebInspector.RenderingFrameTimelineDataGridNode):
+        (WebInspector.RenderingFrameTimelineDataGridNode.prototype.get record): Deleted.
+        Moved to base class.
+
+        * UserInterface/Views/ResourceTimelineDataGridNode.js:
+        (WebInspector.ResourceTimelineDataGridNode.prototype.createCellContent):
+        (WebInspector.ResourceTimelineDataGridNode.prototype.displayName):
+        (WebInspector.ResourceTimelineDataGridNode.prototype.iconClassNames):
+        Override base class methods, making it possible to remove ResourceTimelineDataGridNodePathComponent,
+        and treat all TimelineDataGridNodes in a uniform manner.
+
+        (WebInspector.ResourceTimelineDataGridNode.prototype._createNameCellDocumentFragment):
+        Replace duplicated code with call to "displayName".
+
+        * UserInterface/Views/ResourceTimelineDataGridNodePathComponent.js: Removed.
+        Replaced by more generic solution, TimelineDataGridNodePathComponent.
+
+        * UserInterface/Views/ScriptDetailsTimelineView.js:
+        (WebInspector.ScriptDetailsTimelineView.prototype.get selectionPathComponents):
+        (WebInspector.ScriptDetailsTimelineView.prototype.dataGridNodePathComponentSelected):
+        (WebInspector.ScriptDetailsTimelineView.prototype.treeElementPathComponentSelected): Deleted.
+        TimelineView tree outlines are going away.
+
+        * UserInterface/Views/ScriptTimelineDataGridNode.js:
+        (WebInspector.ScriptTimelineDataGridNode.prototype.createCellContent):
+        (WebInspector.ScriptTimelineDataGridNode.prototype._createNameCellDocumentFragment):
+        Replace duplicated code with call to "displayName".
+
+        (WebInspector.ScriptTimelineDataGridNode):
+        (WebInspector.ScriptTimelineDataGridNode.prototype.get record): Deleted.
+        Moved to base class.
+
+        * UserInterface/Views/SourceCodeTimelineTimelineDataGridNode.js:
+        (WebInspector.SourceCodeTimelineTimelineDataGridNode.prototype.createCellContent):
+        (WebInspector.SourceCodeTimelineTimelineDataGridNode.prototype._createNameCellContent):
+        Replace duplicated code with call to "displayName".
+
+        * UserInterface/Views/TimelineDataGridNode.js:
+        (WebInspector.TimelineDataGridNode.prototype.get record):
+        Implemented in terms of the "records" getter, since all subclasses simply returned the
+        node's first (or only) record.
+
+        (WebInspector.TimelineDataGridNode.prototype.displayName):
+        (WebInspector.TimelineDataGridNode.prototype.iconClassNames):
+        Base class implementations, using utility methods in TimelineTabContentView
+        to get display data based on the node's timeline record. Can be overridden
+        by nodes that either don't have a timeline record (ProfileNodeDataGridNode)
+
+        * UserInterface/Views/TimelineDataGridNodePathComponent.js:
+        (WebInspector.TimelineDataGridNodePathComponent):
+        (WebInspector.TimelineDataGridNodePathComponent.prototype.get timelineDataGridNode):
+        (WebInspector.TimelineDataGridNodePathComponent.prototype.get previousSibling):
+        (WebInspector.TimelineDataGridNodePathComponent.prototype.get nextSibling):
+
+        * UserInterface/Views/TimelineView.js:
+        (WebInspector.TimelineView):
+        (WebInspector.TimelineView.prototype.get selectionPathComponents):
+        Must be implemented by subclasses since not all TimelineViews use a DataGrid.
+
+2016-03-09  Matt Baker  <mattbaker@apple.com>
+
         Web Inspector: Nodes in Computed Styles > Container Regions formatted incorrectly.
         https://bugs.webkit.org/show_bug.cgi?id=155277
         <rdar://problem/25072711>
index 388c04f..a1650ca 100644 (file)
     <script src="Views/ResourceDetailsSidebarPanel.js"></script>
     <script src="Views/ResourceSidebarPanel.js"></script>
     <script src="Views/ResourceTimelineDataGridNode.js"></script>
-    <script src="Views/ResourceTimelineDataGridNodePathComponent.js"></script>
     <script src="Views/RulesStyleDetailsPanel.js"></script>
     <script src="Views/ScopeBar.js"></script>
     <script src="Views/ScopeBarItem.js"></script>
     <script src="Views/SyntaxHighlightingSupport.js"></script>
     <script src="Views/TextContentView.js"></script>
     <script src="Views/TextResourceContentView.js"></script>
+    <script src="Views/TimelineDataGridNodePathComponent.js"></script>
     <script src="Views/TimelineRecordBar.js"></script>
     <script src="Views/TimelineRecordFrame.js"></script>
     <script src="Views/TimelineRecordingContentView.js"></script>
index dffc203..610867a 100644 (file)
@@ -35,11 +35,6 @@ WebInspector.LayoutTimelineDataGridNode = class LayoutTimelineDataGridNode exten
 
     // Public
 
-    get record()
-    {
-        return this._record;
-    }
-
     get records()
     {
         return [this._record];
@@ -49,7 +44,7 @@ WebInspector.LayoutTimelineDataGridNode = class LayoutTimelineDataGridNode exten
     {
         if (!this._cachedData) {
             this._cachedData = {
-                name: WebInspector.LayoutTimelineRecord.displayNameForEventType(this._record.eventType),
+                name: this.displayName(),
                 width: this._record.width,
                 height: this._record.height,
                 area: this._record.width * this._record.height,
@@ -68,7 +63,7 @@ WebInspector.LayoutTimelineDataGridNode = class LayoutTimelineDataGridNode exten
 
         switch (columnIdentifier) {
         case "name":
-            cell.classList.add(WebInspector.TimelineTabContentView.iconClassNameForRecord(this._record));
+            cell.classList.add(...this.iconClassNames());
             return value;
 
         case "width":
index 5d2756e..7f1b59d 100644 (file)
@@ -102,6 +102,19 @@ WebInspector.LayoutTimelineView = class LayoutTimelineView extends WebInspector.
         return WebInspector.UIString("Records");
     }
 
+    get selectionPathComponents()
+    {
+        if (!this._dataGrid.selectedNode || this._dataGrid.selectedNode.hidden)
+            return null;
+
+        let timelineDataGridNode = this._dataGrid.selectedNode;
+        console.assert(timelineDataGridNode instanceof WebInspector.TimelineDataGridNode);
+
+        let pathComponent = new WebInspector.TimelineDataGridNodePathComponent(timelineDataGridNode);
+        pathComponent.addEventListener(WebInspector.HierarchicalPathComponent.Event.SiblingWasSelected, this.dataGridNodePathComponentSelected, this);
+        return [pathComponent];
+    }
+
     shown()
     {
         super.shown();
@@ -153,11 +166,11 @@ WebInspector.LayoutTimelineView = class LayoutTimelineView extends WebInspector.
 
     // Protected
 
-    treeElementPathComponentSelected(event)
+    dataGridNodePathComponentSelected(event)
     {
-        var dataGridNode = this._dataGrid.dataGridNodeForTreeElement(event.data.pathComponent.generalTreeElement);
-        if (!dataGridNode)
-            return;
+        let dataGridNode = event.data.pathComponent.timelineDataGridNode;
+        console.assert(dataGridNode.dataGrid === this._dataGrid);
+
         dataGridNode.revealAndSelect();
     }
 
index 5f38353..6332f01 100644 (file)
@@ -154,11 +154,6 @@ WebInspector.MemoryTimelineView = class MemoryTimelineView extends WebInspector.
 
     // Protected
 
-    treeElementPathComponentSelected(event)
-    {
-        // Nothing. The sidebar will soon be removed.
-    }
-
     layout()
     {
         // Always update timeline ruler.
index 4daf827..beaba82 100644 (file)
@@ -111,6 +111,18 @@ WebInspector.NetworkTimelineView = class NetworkTimelineView extends WebInspecto
         return WebInspector.UIString("Resources");
     }
 
+    get selectionPathComponents()
+    {
+        if (!this._dataGrid.selectedNode || this._dataGrid.selectedNode.hidden)
+            return null;
+
+        console.assert(this._dataGrid.selectedNode instanceof WebInspector.ResourceTimelineDataGridNode);
+
+        let pathComponent = new WebInspector.TimelineDataGridNodePathComponent(this._dataGrid.selectedNode, this._dataGrid.selectedNode.resource);
+        pathComponent.addEventListener(WebInspector.HierarchicalPathComponent.Event.SiblingWasSelected, this.dataGridNodePathComponentSelected, this);
+        return [pathComponent];
+    }
+
     shown()
     {
         super.shown();
@@ -166,11 +178,14 @@ WebInspector.NetworkTimelineView = class NetworkTimelineView extends WebInspecto
         console.error("Unknown tree element selected.", treeElement);
     }
 
-    treeElementPathComponentSelected(event)
+    dataGridNodePathComponentSelected(event)
     {
-        var dataGridNode = this._dataGrid.dataGridNodeForTreeElement(event.data.pathComponent.generalTreeElement);
-        if (!dataGridNode)
-            return;
+        let pathComponent = event.data.pathComponent;
+        console.assert(pathComponent instanceof WebInspector.TimelineDataGridNodePathComponent);
+
+        let dataGridNode = pathComponent.timelineDataGridNode;
+        console.assert(dataGridNode.dataGrid === this._dataGrid);
+
         dataGridNode.revealAndSelect();
     }
 
index 711b1f5..ce98978 100644 (file)
@@ -70,7 +70,7 @@ WebInspector.ProfileNodeDataGridNode = class ProfileNodeDataGridNode extends Web
     {
         if (!this._cachedData) {
             this._cachedData = this._profileNode.computeCallInfoForTimeRange(this._rangeStartTime, this._rangeEndTime);
-            this._cachedData.name = this._titleForProfileNode();
+            this._cachedData.name = this.displayName();
             this._cachedData.location = this._profileNode.sourceCodeLocation;
         }
 
@@ -114,7 +114,7 @@ WebInspector.ProfileNodeDataGridNode = class ProfileNodeDataGridNode extends Web
 
         switch (columnIdentifier) {
         case "name":
-            cell.classList.add(this._iconClassNameForProfileNode());
+            cell.classList.add(...this.iconClassNames());
             return value;
 
         case "startTime":
@@ -129,9 +129,27 @@ WebInspector.ProfileNodeDataGridNode = class ProfileNodeDataGridNode extends Web
         return super.createCellContent(columnIdentifier, cell);
     }
 
-    // Private
+    displayName()
+    {
+        let title = this._profileNode.functionName;
+        if (!title) {
+            switch (this._profileNode.type) {
+            case WebInspector.ProfileNode.Type.Function:
+                title = WebInspector.UIString("(anonymous function)");
+                break;
+            case WebInspector.ProfileNode.Type.Program:
+                title = WebInspector.UIString("(program)");
+                break;
+            default:
+                title = WebInspector.UIString("(anonymous function)");
+                console.error("Unknown ProfileNode type: " + this._profileNode.type);
+            }
+        }
 
-    _iconClassNameForProfileNode()
+        return title;
+    }
+
+    iconClassNames()
     {
         let className;
         switch (this._profileNode.type) {
@@ -152,26 +170,6 @@ WebInspector.ProfileNodeDataGridNode = class ProfileNodeDataGridNode extends Web
         if (this._profileNode.functionName && this._profileNode.functionName.startsWith("on") && this._profileNode.functionName.length >= 5)
             className = WebInspector.CallFrameView.EventListenerIconStyleClassName;
 
-        return className;
-    }
-
-    _titleForProfileNode()
-    {
-        let title = this._profileNode.functionName;
-        if (!name) {
-            switch (this._profileNode.type) {
-            case WebInspector.ProfileNode.Type.Function:
-                title = WebInspector.UIString("(anonymous function)");
-                break;
-            case WebInspector.ProfileNode.Type.Program:
-                title = WebInspector.UIString("(program)");
-                break;
-            default:
-                title = WebInspector.UIString("(anonymous function)");
-                console.error("Unknown ProfileNode type: " + this._profileNode.type);
-            }
-        }
-
-        return title;
+        return [className];
     }
 };
index 26c8ac8..38ecbf4 100644 (file)
@@ -35,11 +35,6 @@ WebInspector.RenderingFrameTimelineDataGridNode = class RenderingFrameTimelineDa
 
     // Public
 
-    get record()
-    {
-        return this._record;
-    }
-
     get records()
     {
         return [this._record];
@@ -73,7 +68,7 @@ WebInspector.RenderingFrameTimelineDataGridNode = class RenderingFrameTimelineDa
 
         switch (columnIdentifier) {
         case "name":
-            cell.classList.add(WebInspector.TimelineTabContentView.iconClassNameForRecord(this._record));
+            cell.classList.add(...this.iconClassNames());
             return value;
 
         case "startTime":
index b6c62a3..4ff372f 100644 (file)
@@ -98,7 +98,7 @@ WebInspector.ResourceTimelineDataGridNode = class ResourceTimelineDataGridNode e
 
         switch (columnIdentifier) {
         case "name":
-            cell.classList.add(WebInspector.ResourceTreeElement.ResourceIconStyleClassName, resource.type);
+            cell.classList.add(...this.iconClassNames());
             cell.title = resource.displayURL;
             this._updateStatus(cell);
             return this._createNameCellDocumentFragment();
@@ -141,12 +141,17 @@ WebInspector.ResourceTimelineDataGridNode = class ResourceTimelineDataGridNode e
         super.refresh();
     }
 
+    iconClassNames()
+    {
+        return [WebInspector.ResourceTreeElement.ResourceIconStyleClassName, this.resource.type];
+    }
+
     // Private
 
     _createNameCellDocumentFragment()
     {
         let fragment = document.createDocumentFragment();
-        let mainTitle = WebInspector.TimelineTabContentView.displayNameForRecord(this._record);
+        let mainTitle = this.displayName();
         fragment.append(mainTitle);
 
         // Show the host as the subtitle if it is different from the main resource or if this is the main frame's main resource.
index 4437581..8fdd44c 100644 (file)
@@ -126,16 +126,16 @@ WebInspector.ScriptDetailsTimelineView = class ScriptDetailsTimelineView extends
         var pathComponents = [];
 
         while (dataGridNode && !dataGridNode.root) {
-            var treeElement = this._dataGrid.treeElementForDataGridNode(dataGridNode);
-            console.assert(treeElement);
-            if (!treeElement)
-                break;
-
-            if (treeElement.hidden)
+            console.assert(dataGridNode instanceof WebInspector.TimelineDataGridNode);
+            if (dataGridNode.hidden)
                 return null;
 
-            var pathComponent = new WebInspector.GeneralTreeElementPathComponent(treeElement);
-            pathComponent.addEventListener(WebInspector.HierarchicalPathComponent.Event.SiblingWasSelected, this.treeElementPathComponentSelected, this);
+            let representedObject = null;
+            if (dataGridNode instanceof WebInspector.ProfileNodeDataGridNode)
+                representedObject = dataGridNode.profileNode;
+
+            let pathComponent = new WebInspector.TimelineDataGridNodePathComponent(dataGridNode);
+            pathComponent.addEventListener(WebInspector.HierarchicalPathComponent.Event.SiblingWasSelected, this.dataGridNodePathComponentSelected, this);
             pathComponents.unshift(pathComponent);
             dataGridNode = dataGridNode.parent;
         }
@@ -172,11 +172,11 @@ WebInspector.ScriptDetailsTimelineView = class ScriptDetailsTimelineView extends
         super.showContentViewForTreeElement(treeElement);
     }
 
-    treeElementPathComponentSelected(event)
+    dataGridNodePathComponentSelected(event)
     {
-        var dataGridNode = this._dataGrid.dataGridNodeForTreeElement(event.data.pathComponent.generalTreeElement);
-        if (!dataGridNode)
-            return;
+        let dataGridNode = event.data.pathComponent.timelineDataGridNode;
+        console.assert(dataGridNode.dataGrid === this._dataGrid);
+
         dataGridNode.revealAndSelect();
     }
 
index 9130504..1c10037 100644 (file)
@@ -37,11 +37,6 @@ WebInspector.ScriptTimelineDataGridNode = class ScriptTimelineDataGridNode exten
 
     // Public
 
-    get record()
-    {
-        return this._record;
-    }
-
     get records()
     {
         return [this._record];
@@ -125,7 +120,7 @@ WebInspector.ScriptTimelineDataGridNode = class ScriptTimelineDataGridNode exten
 
         switch (columnIdentifier) {
         case "name":
-            cell.classList.add(WebInspector.TimelineTabContentView.iconClassNameForRecord(this._record));
+            cell.classList.add(...this.iconClassNames());
             return this._createNameCellDocumentFragment();
 
         case "startTime":
@@ -148,8 +143,7 @@ WebInspector.ScriptTimelineDataGridNode = class ScriptTimelineDataGridNode exten
     _createNameCellDocumentFragment(cellElement)
     {
         let fragment = document.createDocumentFragment();
-        let mainTitle = WebInspector.TimelineTabContentView.displayNameForRecord(this._record);
-        fragment.append(mainTitle);
+        fragment.append(this.displayName());
 
         if (this._record.eventType === WebInspector.ScriptTimelineRecord.EventType.TimerInstalled) {
             let subtitleElement = document.createElement("span");
index b45de34..0eb2f30 100644 (file)
@@ -53,7 +53,7 @@ WebInspector.SourceCodeTimelineTimelineDataGridNode = class SourceCodeTimelineTi
     createCellContent(columnIdentifier, cell)
     {
         if (columnIdentifier === "name" && this.records.length) {
-            cell.classList.add(WebInspector.TimelineTabContentView.iconClassNameForRecord(this.records[0]));
+            cell.classList.add(...this.iconClassNames());
             return this._createNameCellContent(cell);
         }
 
@@ -68,7 +68,7 @@ WebInspector.SourceCodeTimelineTimelineDataGridNode = class SourceCodeTimelineTi
             return null;
 
         let fragment = document.createDocumentFragment();
-        let mainTitle = WebInspector.TimelineTabContentView.displayNameForRecord(this.records[0]);
+        let mainTitle = this.displayName();
         fragment.append(mainTitle);
 
         let sourceCodeLocation = this._sourceCodeTimeline.sourceCodeLocation;
index 4956a10..c4a7763 100644 (file)
@@ -42,6 +42,11 @@ WebInspector.TimelineDataGridNode = class TimelineDataGridNode extends WebInspec
 
     // Public
 
+    get record()
+    {
+        return this.records && this.records.length ? this.records[0] : null;;
+    }
+
     get records()
     {
         // Implemented by subclasses.
@@ -308,6 +313,18 @@ WebInspector.TimelineDataGridNode = class TimelineDataGridNode extends WebInspec
         this._scheduledGraphRefreshIdentifier = requestAnimationFrame(this.refreshGraph.bind(this));
     }
 
+    displayName()
+    {
+        // Can be overridden by subclasses.
+        return WebInspector.TimelineTabContentView.displayNameForRecord(this.record);
+    }
+
+    iconClassNames()
+    {
+        // Can be overridden by subclasses.
+        return [WebInspector.TimelineTabContentView.iconClassNameForRecord(this.record)];
+    }
+
     // Protected
 
     createGoToArrowButton(cellElement, callback)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
+ * Copyright (C) 2016 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.ResourceTimelineDataGridNodePathComponent = class ResourceTimelineDataGridNodePathComponent extends WebInspector.HierarchicalPathComponent
+WebInspector.TimelineDataGridNodePathComponent = class TimelineDataGridNodePathComponent extends WebInspector.HierarchicalPathComponent
 {
-    constructor(resourceTimelineDataGridNode)
+    constructor(timelineDataGridNode, representedObject)
     {
-        var resource = resourceTimelineDataGridNode.record.resource;
-        var classNames = [WebInspector.ResourceTreeElement.ResourceIconStyleClassName, resource.type];
+        super(timelineDataGridNode.displayName(), timelineDataGridNode.iconClassNames(), representedObject || timelineDataGridNode.record);
 
-        super(resourceTimelineDataGridNode.data.name, classNames, resource);
-
-        this._resourceTimelineDataGridNode = resourceTimelineDataGridNode;
+        this._timelineDataGridNode = timelineDataGridNode;
     }
 
     // Public
 
-    get resourceTimelineDataGridNode()
+    get timelineDataGridNode()
     {
-        return this._resourceTimelineDataGridNode;
+        return this._timelineDataGridNode;
     }
 
     get previousSibling()
     {
-        if (!this._resourceTimelineDataGridNode.previousSibling)
+        let previousSibling = this._timelineDataGridNode.previousSibling;
+        while (previousSibling && previousSibling.hidden)
+            previousSibling = previousSibling.previousSibling;
+
+        if (!previousSibling)
             return null;
-        return new WebInspector.ResourceTimelineDataGridNodePathComponent(this._resourceTimelineDataGridNode.previousSibling);
+
+        return new WebInspector.TimelineDataGridNodePathComponent(previousSibling, this.representedObject);
     }
 
     get nextSibling()
     {
-        if (!this._resourceTimelineDataGridNode.nextSibling)
+        let nextSibling = this._timelineDataGridNode.nextSibling;
+        while (nextSibling && nextSibling.hidden)
+            nextSibling = nextSibling.nextSibling;
+
+        if (!nextSibling)
             return null;
-        return new WebInspector.ResourceTimelineDataGridNodePathComponent(this._resourceTimelineDataGridNode.nextSibling);
+
+        return new WebInspector.TimelineDataGridNodePathComponent(nextSibling, this.representedObject);
     }
 };
index 6fef752..7a7b8b4 100644 (file)
@@ -80,12 +80,8 @@ WebInspector.TimelineView = class TimelineView extends WebInspector.ContentView
 
     get selectionPathComponents()
     {
-        if (!this._contentTreeOutline.selectedTreeElement || this._contentTreeOutline.selectedTreeElement.hidden)
-            return null;
-
-        var pathComponent = new WebInspector.GeneralTreeElementPathComponent(this._contentTreeOutline.selectedTreeElement);
-        pathComponent.addEventListener(WebInspector.HierarchicalPathComponent.Event.SiblingWasSelected, this.treeElementPathComponentSelected, this);
-        return [pathComponent];
+        // Implemented by sub-classes if needed.
+        return null;
     }
 
     get zeroTime()