Web Inspector: Layout & Rendering timeline should show paint and layout records in...
authormattbaker@apple.com <mattbaker@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 23 Jun 2015 16:26:08 +0000 (16:26 +0000)
committermattbaker@apple.com <mattbaker@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 23 Jun 2015 16:26:08 +0000 (16:26 +0000)
commit8f20264b2e159dfbc27e208f14787d045d721f58
tree9c4817aba16e7d3b1d9bf395da90b8175fe9b79e
parent4461fdd037cd118465580a2efc612912afa94c64
Web Inspector: Layout & Rendering timeline should show paint and layout records in separate rows
https://bugs.webkit.org/show_bug.cgi?id=146119

Reviewed by Timothy Hatcher.

This patch makes the original Layout & Rendering timeline visually consistent with the Rendering Frames
timeline, which uses green to distinguish Paint from Layout. In order to support having record bars with
different colors in the same overview graph, the timeline has been split into two rows.

* UserInterface/Views/LayoutTimelineOverviewGraph.css:
(.timeline-overview-graph.layout > .graph-row):
(.timeline-overview-graph.layout > .graph-row > .timeline-record-bar):
(.timeline-overview-graph.layout > .graph-row > .timeline-record-bar > .segment):
New row styles.

* UserInterface/Views/LayoutTimelineOverviewGraph.js:
(WebInspector.LayoutTimelineOverviewGraph.prototype.reset.createRecordRow):
(WebInspector.LayoutTimelineOverviewGraph.prototype.reset):
(WebInspector.LayoutTimelineOverviewGraph.prototype.updateLayout):
(WebInspector.LayoutTimelineOverviewGraph.prototype._updateRowLayout.createBar):
(WebInspector.LayoutTimelineOverviewGraph.prototype._updateRowLayout):
(WebInspector.LayoutTimelineOverviewGraph.prototype._layoutTimelineRecordAdded):
(WebInspector.LayoutTimelineOverviewGraph): Deleted.
Added bookkeeping objects for timeline row elements and their associated records.

* UserInterface/Views/TimelineRecordBar.css:
(.timeline-record-bar.timeline-record-type-layout.layout-timeline-record-paint > .segment):
New style for layout record event types.

* UserInterface/Views/TimelineRecordBar.js:
(WebInspector.TimelineRecordBar.prototype.set records):
Add style class for eventType, if present.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@185875 268f45cc-cd09-0410-ab3c-d52691b4dbfc
Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Views/LayoutTimelineOverviewGraph.css
Source/WebInspectorUI/UserInterface/Views/LayoutTimelineOverviewGraph.js
Source/WebInspectorUI/UserInterface/Views/TimelineRecordBar.css
Source/WebInspectorUI/UserInterface/Views/TimelineRecordBar.js