<!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>[182660] trunk/Source</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/182660">182660</a></dd>
<dt>Author</dt> <dd>commit-queue@webkit.org</dd>
<dt>Date</dt> <dd>2015-04-11 12:36:39 -0700 (Sat, 11 Apr 2015)</dd>
</dl>
<h3>Log Message</h3>
<pre>Web Inspector: create content view and details sidebar for Frames timeline
https://bugs.webkit.org/show_bug.cgi?id=143533
Patch by Matt Baker <mattbaker@apple.com> on 2015-04-11
Reviewed by Timothy Hatcher.
Source/JavaScriptCore:
Refactoring: RunLoop prefix changed to RenderingFrame.
* inspector/protocol/Timeline.json:
Source/WebCore:
Refactoring: RunLoop prefix changed to RenderingFrame.
* inspector/InspectorTimelineAgent.cpp:
(WebCore::InspectorTimelineAgent::internalStart):
(WebCore::toProtocol):
* inspector/InspectorTimelineAgent.h:
Source/WebInspectorUI:
Added new Rendering Frames timeline content view and details sidebar, and added minor visual tweeks to the
timeline graph such as ensuring 60 FPS budget line is always visible, and large combined frames are split
up once they reach a maximum pixel width.
* Localizations/en.lproj/localizedStrings.js:
New UI strings.
* UserInterface/Base/Main.js:
(WebInspector.contentLoaded):
Support for new details sidebar panel.
* UserInterface/Controllers/TimelineManager.js:
(WebInspector.TimelineManager.shouldShowViewForTimeline):
(WebInspector.TimelineManager.prototype._processRecord):
(WebInspector.TimelineManager.prototype._loadNewRecording):
Layout timeline is no longer added to timeline graphs, skip Rendering Frame records that have no child events.
* UserInterface/Images/NavigationItemDoughnutChart.svg: Added.
* UserInterface/Images/TimelineRecordRenderingFrame.svg: Added.
New artwork.
* UserInterface/Main.html:
* UserInterface/Test.html:
New files.
* UserInterface/Models/RenderingFrameTimelineRecord.js: Renamed from Source/WebInspectorUI/UserInterface/Models/RunLoopTimelineRecord.js.
(WebInspector.RenderingFrameTimelineRecord):
(WebInspector.RenderingFrameTimelineRecord.resetFrameNumber):
(WebInspector.RenderingFrameTimelineRecord.prototype.get frameNumber):
(WebInspector.RenderingFrameTimelineRecord.prototype.get children):
(WebInspector.RenderingFrameTimelineRecord.prototype.get durationRemainder):
(WebInspector.RenderingFrameTimelineRecord.prototype.durationForRecords.get var):
Added frame numbering and improved the accuracy of sub-frame duratation calculation.
Refactoring: RunLoop prefix changed to RenderingFrame.
* UserInterface/Models/Timeline.js:
(WebInspector.Timeline):
(WebInspector.Timeline.create):
(WebInspector.Timeline.prototype.get recording):
(WebInspector.Timeline.prototype.get displayName):
(WebInspector.Timeline.prototype.get iconClassName):
Added up-pointer to parent recording.
* UserInterface/Models/TimelineRecord.js:
Refactoring: RunLoop prefix changed to RenderingFrame.
* UserInterface/Models/TimelineRecording.js:
(WebInspector.TimelineRecording.prototype.reset):
Support for new timeline type.
* UserInterface/Views/ChartDetailsSectionLegendRow.js: Added.
(WebInspector.ChartDetailsSectionLegendRow):
New details section row type for chart legend items.
* UserInterface/Views/ChartDetailsSectionRow.css: Added.
(.details-section .row.chart):
(.details-section .row.chart canvas):
(.details-section .row.chart.empty canvas):
(.details-section > .content > .group > .row.legend-item > .label > .color-swatch):
* UserInterface/Views/ChartDetailsSectionRow.js: Added.
(WebInspector.ChartDetailsSectionRow):
(WebInspector.ChartDetailsSectionRow.prototype.get legendGroup):
(WebInspector.ChartDetailsSectionRow.prototype.set innerLabel):
(WebInspector.ChartDetailsSectionRow.prototype.addChartValue):
(WebInspector.ChartDetailsSectionRow.prototype.clearChart):
(WebInspector.ChartDetailsSectionRow.prototype._refresh.drawSlice):
(WebInspector.ChartDetailsSectionRow.prototype._refresh):
New details section row type for pie/doughnut charts.
* UserInterface/Views/ContentView.js:
(WebInspector.ContentView):
Support for new timeline view type.
* UserInterface/Views/LayoutTimelineDataGridNode.js:
(WebInspector.LayoutTimelineDataGridNode.prototype.get data):
(WebInspector.LayoutTimelineDataGridNode.prototype.createCellContent):
Updated for use in rendering frame timeline view.
* UserInterface/Views/LayoutTimelineView.js:
(WebInspector.LayoutTimelineView.prototype._layoutTimelineRecordAdded):
Removed references to old RunLoop objects.
* UserInterface/Views/RenderingFrameDetailsSidebarPanel.js: Added.
(WebInspector.RenderingFrameDetailsSidebarPanel.formatChartValue):
(WebInspector.RenderingFrameDetailsSidebarPanel):
(WebInspector.RenderingFrameDetailsSidebarPanel.prototype.inspect):
(WebInspector.RenderingFrameDetailsSidebarPanel.prototype.updateRangeSelection):
(WebInspector.RenderingFrameDetailsSidebarPanel.prototype.get renderingFrameTimeline):
(WebInspector.RenderingFrameDetailsSidebarPanel.prototype.set renderingFrameTimeline):
(WebInspector.RenderingFrameDetailsSidebarPanel.prototype.refresh.durationForRecordType):
(WebInspector.RenderingFrameDetailsSidebarPanel.prototype.refresh):
(WebInspector.RenderingFrameDetailsSidebarPanel.prototype._resetAll):
(WebInspector.RenderingFrameDetailsSidebarPanel.prototype._recordAdded):
(WebInspector.RenderingFrameDetailsSidebarPanel.prototype._timelineReset):
(WebInspector.RenderingFrameDetailsSidebarPanel.prototype._getSelectedRecords):
New sidebar panel for showing time breakdown for current frame selection.
* UserInterface/Views/RenderingFrameTimelineDataGridNode.js: Added.
(WebInspector.RenderingFrameTimelineDataGridNode):
(WebInspector.RenderingFrameTimelineDataGridNode.prototype.get record):
(WebInspector.RenderingFrameTimelineDataGridNode.prototype.get records):
(WebInspector.RenderingFrameTimelineDataGridNode.prototype.get data):
(WebInspector.RenderingFrameTimelineDataGridNode.prototype.createCellContent):
New data grid row type.
* UserInterface/Views/RenderingFrameTimelineOverviewGraph.css: Renamed from Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.css.
(.timeline-overview-graph.rendering-frame > .divider):
(.timeline-overview-graph.rendering-frame > .divider > .label):
* UserInterface/Views/RenderingFrameTimelineOverviewGraph.js: Renamed from Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.js.
(WebInspector.RenderingFrameTimelineOverviewGraph):
(WebInspector.RenderingFrameTimelineOverviewGraph.prototype.get graphHeightSeconds):
(WebInspector.RenderingFrameTimelineOverviewGraph.prototype.updateLayout.createFrame):
(WebInspector.RenderingFrameTimelineOverviewGraph.prototype._updateDividers.createDividerAtPosition.get if):
* UserInterface/Views/RenderingFrameTimelineView.css: Renamed from Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.css.
(.timeline-view.rendering-frame > .data-grid):
(.sidebar > .panel.navigation.timeline.timeline-recording-content-view-showing .navigation-sidebar-panel-content-tree-outline.rendering-frame .item .subtitle):
Visual tweeks.
Refactoring: RunLoop prefix changed to RenderingFrame.
* UserInterface/Views/RenderingFrameTimelineView.js: Added.
(WebInspector.RenderingFrameTimelineView):
(WebInspector.RenderingFrameTimelineView.prototype.get navigationSidebarTreeOutlineLabel):
(WebInspector.RenderingFrameTimelineView.prototype.shown):
(WebInspector.RenderingFrameTimelineView.prototype.hidden):
(WebInspector.RenderingFrameTimelineView.prototype.updateLayout):
(WebInspector.RenderingFrameTimelineView.prototype.get selectionPathComponents):
(WebInspector.RenderingFrameTimelineView.prototype.filterDidChange):
(WebInspector.RenderingFrameTimelineView.prototype.matchTreeElementAgainstCustomFilters):
(WebInspector.RenderingFrameTimelineView.prototype.reset):
(WebInspector.RenderingFrameTimelineView.prototype.treeElementPathComponentSelected):
(WebInspector.RenderingFrameTimelineView.prototype.dataGridNodeForTreeElement):
(WebInspector.RenderingFrameTimelineView.prototype._processPendingRecords):
(WebInspector.RenderingFrameTimelineView.prototype._renderingFrameTimelineRecordAdded):
(WebInspector.RenderingFrameTimelineView.prototype._dataGridNodeSelected):
New content view type.
* UserInterface/Views/TimelineIcons.css:
(.rendering-frame-icon .icon):
(.rendering-frame-icon.large .icon):
(.rendering-frame-record .icon):
(.runloop-record .icon):
(.runloop-icon .icon): Deleted.
(.runloop-icon.large .icon): Deleted.
Refactoring: runloop prefix changed to rendering-frame.
* UserInterface/Views/TimelineOverview.js:
(WebInspector.TimelineOverview.prototype._timelineRemoved):
Support for timelines without associated views.
* UserInterface/Views/TimelineOverviewGraph.js:
(WebInspector.TimelineOverviewGraph):
Refactoring: RunLoop prefix changed to RenderingFrame.
* UserInterface/Views/TimelineRecordFrame.css:
(.timeline-record-frame):
(.timeline-record-frame > .frame):
* UserInterface/Views/TimelineRecordFrame.js:
(WebInspector.TimelineRecordFrame.createCombinedFrames):
Visual tweeks, splitting up large combined frames.
* UserInterface/Views/TimelineRecordTreeElement.js:
(WebInspector.TimelineRecordTreeElement):
Refactoring: runloop prefix changed to rendering-frame.
* UserInterface/Views/TimelineRecordingContentView.js:
(WebInspector.TimelineRecordingContentView.prototype._timelineRemoved):
(WebInspector.TimelineRecordingContentView.prototype._timelineCountChanged):
(WebInspector.TimelineRecordingContentView.prototype._timeRangeSelectionChanged):
Added support for new details sidebar and timelines without associated views.
* UserInterface/Views/TimelineSidebarPanel.js:
(WebInspector.TimelineSidebarPanel._timelineAdded.set this):
Support for timelines without associated views.
Refactoring: runloop prefix changed to rendering-frame.
* WebInspectorUI.vcxproj/WebInspectorUI.vcxproj:
* WebInspectorUI.vcxproj/WebInspectorUI.vcxproj.filters:
New files.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkSourceJavaScriptCoreChangeLog">trunk/Source/JavaScriptCore/ChangeLog</a></li>
<li><a href="#trunkSourceJavaScriptCoreinspectorprotocolTimelinejson">trunk/Source/JavaScriptCore/inspector/protocol/Timeline.json</a></li>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCoreinspectorInspectorTimelineAgentcpp">trunk/Source/WebCore/inspector/InspectorTimelineAgent.cpp</a></li>
<li><a href="#trunkSourceWebCoreinspectorInspectorTimelineAgenth">trunk/Source/WebCore/inspector/InspectorTimelineAgent.h</a></li>
<li><a href="#trunkSourceWebInspectorUIChangeLog">trunk/Source/WebInspectorUI/ChangeLog</a></li>
<li><a href="#trunkSourceWebInspectorUILocalizationsenlprojlocalizedStringsjs">trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceBaseMainjs">trunk/Source/WebInspectorUI/UserInterface/Base/Main.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceControllersTimelineManagerjs">trunk/Source/WebInspectorUI/UserInterface/Controllers/TimelineManager.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceMainhtml">trunk/Source/WebInspectorUI/UserInterface/Main.html</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceModelsTimelinejs">trunk/Source/WebInspectorUI/UserInterface/Models/Timeline.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceModelsTimelineRecordjs">trunk/Source/WebInspectorUI/UserInterface/Models/TimelineRecord.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceModelsTimelineRecordingjs">trunk/Source/WebInspectorUI/UserInterface/Models/TimelineRecording.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceTesthtml">trunk/Source/WebInspectorUI/UserInterface/Test.html</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsContentViewjs">trunk/Source/WebInspectorUI/UserInterface/Views/ContentView.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsLayoutTimelineDataGridNodejs">trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsLayoutTimelineViewjs">trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineView.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsTimelineIconscss">trunk/Source/WebInspectorUI/UserInterface/Views/TimelineIcons.css</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsTimelineOverviewjs">trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsTimelineOverviewGraphjs">trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverviewGraph.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsTimelineRecordFramecss">trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordFrame.css</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsTimelineRecordFramejs">trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordFrame.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsTimelineRecordTreeElementjs">trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordTreeElement.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsTimelineRecordingContentViewjs">trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordingContentView.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsTimelineSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/TimelineSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIWebInspectorUIvcxprojWebInspectorUIvcxproj">trunk/Source/WebInspectorUI/WebInspectorUI.vcxproj/WebInspectorUI.vcxproj</a></li>
<li><a href="#trunkSourceWebInspectorUIWebInspectorUIvcxprojWebInspectorUIvcxprojfilters">trunk/Source/WebInspectorUI/WebInspectorUI.vcxproj/WebInspectorUI.vcxproj.filters</a></li>
</ul>
<h3>Added Paths</h3>
<ul>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceImagesNavigationItemDoughnutChartsvg">trunk/Source/WebInspectorUI/UserInterface/Images/NavigationItemDoughnutChart.svg</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceImagesTimelineRecordRenderingFramesvg">trunk/Source/WebInspectorUI/UserInterface/Images/TimelineRecordRenderingFrame.svg</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceModelsRenderingFrameTimelineRecordjs">trunk/Source/WebInspectorUI/UserInterface/Models/RenderingFrameTimelineRecord.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsChartDetailsSectionLegendRowjs">trunk/Source/WebInspectorUI/UserInterface/Views/ChartDetailsSectionLegendRow.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsChartDetailsSectionRowcss">trunk/Source/WebInspectorUI/UserInterface/Views/ChartDetailsSectionRow.css</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsChartDetailsSectionRowjs">trunk/Source/WebInspectorUI/UserInterface/Views/ChartDetailsSectionRow.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsRenderingFrameDetailsSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameDetailsSidebarPanel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsRenderingFrameTimelineDataGridNodejs">trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineDataGridNode.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsRenderingFrameTimelineOverviewGraphcss">trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineOverviewGraph.css</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsRenderingFrameTimelineOverviewGraphjs">trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineOverviewGraph.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsRenderingFrameTimelineViewcss">trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineView.css</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsRenderingFrameTimelineViewjs">trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineView.js</a></li>
</ul>
<h3>Removed Paths</h3>
<ul>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceModelsRunLoopTimelineRecordjs">trunk/Source/WebInspectorUI/UserInterface/Models/RunLoopTimelineRecord.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsRunLoopTimelineOverviewGraphcss">trunk/Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.css</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsRunLoopTimelineOverviewGraphjs">trunk/Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.js</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkSourceJavaScriptCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/JavaScriptCore/ChangeLog (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/JavaScriptCore/ChangeLog 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/JavaScriptCore/ChangeLog 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -1,3 +1,14 @@
</span><ins>+2015-04-11 Matt Baker <mattbaker@apple.com>
+
+ Web Inspector: create content view and details sidebar for Frames timeline
+ https://bugs.webkit.org/show_bug.cgi?id=143533
+
+ Reviewed by Timothy Hatcher.
+
+ Refactoring: RunLoop prefix changed to RenderingFrame.
+
+ * inspector/protocol/Timeline.json:
+
</ins><span class="cx"> 2015-04-11 Yusuke Suzuki <utatane.tea@gmail.com>
</span><span class="cx">
</span><span class="cx"> [ES6] Enable Symbol in web pages
</span></span></pre></div>
<a id="trunkSourceJavaScriptCoreinspectorprotocolTimelinejson"></a>
<div class="modfile"><h4>Modified: trunk/Source/JavaScriptCore/inspector/protocol/Timeline.json (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/JavaScriptCore/inspector/protocol/Timeline.json 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/JavaScriptCore/inspector/protocol/Timeline.json 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -13,7 +13,7 @@
</span><span class="cx"> "InvalidateLayout",
</span><span class="cx"> "Layout",
</span><span class="cx"> "Paint",
</span><del>- "RunLoop",
</del><ins>+ "RenderingFrame",
</ins><span class="cx"> "ScrollLayer",
</span><span class="cx"> "ParseHTML",
</span><span class="cx"> "TimerInstall",
</span></span></pre></div>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebCore/ChangeLog 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -1,3 +1,17 @@
</span><ins>+2015-04-11 Matt Baker <mattbaker@apple.com>
+
+ Web Inspector: create content view and details sidebar for Frames timeline
+ https://bugs.webkit.org/show_bug.cgi?id=143533
+
+ Reviewed by Timothy Hatcher.
+
+ Refactoring: RunLoop prefix changed to RenderingFrame.
+
+ * inspector/InspectorTimelineAgent.cpp:
+ (WebCore::InspectorTimelineAgent::internalStart):
+ (WebCore::toProtocol):
+ * inspector/InspectorTimelineAgent.h:
+
</ins><span class="cx"> 2015-04-11 Chris Dumez <cdumez@apple.com>
</span><span class="cx">
</span><span class="cx"> Stop referring to outdated RFC2616 in CacheValidation.cpp
</span></span></pre></div>
<a id="trunkSourceWebCoreinspectorInspectorTimelineAgentcpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/inspector/InspectorTimelineAgent.cpp (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/inspector/InspectorTimelineAgent.cpp 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebCore/inspector/InspectorTimelineAgent.cpp 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -156,7 +156,7 @@
</span><span class="cx"> if (!m_enabled || m_didStartRecordingRunLoop)
</span><span class="cx"> return;
</span><span class="cx">
</span><del>- pushCurrentRecord(InspectorObject::create(), TimelineRecordType::RunLoop, false, nullptr);
</del><ins>+ pushCurrentRecord(InspectorObject::create(), TimelineRecordType::RenderingFrame, false, nullptr);
</ins><span class="cx"> m_didStartRecordingRunLoop = true;
</span><span class="cx"> });
</span><span class="cx">
</span><span class="lines">@@ -164,7 +164,7 @@
</span><span class="cx"> if (!m_enabled || !m_didStartRecordingRunLoop)
</span><span class="cx"> return;
</span><span class="cx">
</span><del>- didCompleteCurrentRecord(TimelineRecordType::RunLoop);
</del><ins>+ didCompleteCurrentRecord(TimelineRecordType::RenderingFrame);
</ins><span class="cx"> m_didStartRecordingRunLoop = false;
</span><span class="cx"> });
</span><span class="cx">
</span><span class="lines">@@ -172,7 +172,7 @@
</span><span class="cx"> m_frameStopObserver->schedule(currentRunLoop(), kCFRunLoopBeforeWaiting | kCFRunLoopExit);
</span><span class="cx">
</span><span class="cx"> // Create a runloop record immediately in order to capture the rest of the current runloop.
</span><del>- pushCurrentRecord(InspectorObject::create(), TimelineRecordType::RunLoop, false, nullptr);
</del><ins>+ pushCurrentRecord(InspectorObject::create(), TimelineRecordType::RenderingFrame, false, nullptr);
</ins><span class="cx"> m_didStartRecordingRunLoop = true;
</span><span class="cx"> #endif
</span><span class="cx">
</span><span class="lines">@@ -598,8 +598,8 @@
</span><span class="cx"> return Inspector::Protocol::Timeline::EventType::Layout;
</span><span class="cx"> case TimelineRecordType::Paint:
</span><span class="cx"> return Inspector::Protocol::Timeline::EventType::Paint;
</span><del>- case TimelineRecordType::RunLoop:
- return Inspector::Protocol::Timeline::EventType::RunLoop;
</del><ins>+ case TimelineRecordType::RenderingFrame:
+ return Inspector::Protocol::Timeline::EventType::RenderingFrame;
</ins><span class="cx"> case TimelineRecordType::ScrollLayer:
</span><span class="cx"> return Inspector::Protocol::Timeline::EventType::ScrollLayer;
</span><span class="cx">
</span></span></pre></div>
<a id="trunkSourceWebCoreinspectorInspectorTimelineAgenth"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/inspector/InspectorTimelineAgent.h (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/inspector/InspectorTimelineAgent.h 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebCore/inspector/InspectorTimelineAgent.h 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -72,7 +72,7 @@
</span><span class="cx"> InvalidateLayout,
</span><span class="cx"> Layout,
</span><span class="cx"> Paint,
</span><del>- RunLoop,
</del><ins>+ RenderingFrame,
</ins><span class="cx"> ScrollLayer,
</span><span class="cx">
</span><span class="cx"> ParseHTML,
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/ChangeLog (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/ChangeLog 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/ChangeLog 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -1,3 +1,189 @@
</span><ins>+2015-04-11 Matt Baker <mattbaker@apple.com>
+
+ Web Inspector: create content view and details sidebar for Frames timeline
+ https://bugs.webkit.org/show_bug.cgi?id=143533
+
+ Reviewed by Timothy Hatcher.
+
+ Added new Rendering Frames timeline content view and details sidebar, and added minor visual tweeks to the
+ timeline graph such as ensuring 60 FPS budget line is always visible, and large combined frames are split
+ up once they reach a maximum pixel width.
+
+ * Localizations/en.lproj/localizedStrings.js:
+ New UI strings.
+
+ * UserInterface/Base/Main.js:
+ (WebInspector.contentLoaded):
+ Support for new details sidebar panel.
+
+ * UserInterface/Controllers/TimelineManager.js:
+ (WebInspector.TimelineManager.shouldShowViewForTimeline):
+ (WebInspector.TimelineManager.prototype._processRecord):
+ (WebInspector.TimelineManager.prototype._loadNewRecording):
+ Layout timeline is no longer added to timeline graphs, skip Rendering Frame records that have no child events.
+
+ * UserInterface/Images/NavigationItemDoughnutChart.svg: Added.
+ * UserInterface/Images/TimelineRecordRenderingFrame.svg: Added.
+ New artwork.
+
+ * UserInterface/Main.html:
+ * UserInterface/Test.html:
+ New files.
+
+ * UserInterface/Models/RenderingFrameTimelineRecord.js: Renamed from Source/WebInspectorUI/UserInterface/Models/RunLoopTimelineRecord.js.
+ (WebInspector.RenderingFrameTimelineRecord):
+ (WebInspector.RenderingFrameTimelineRecord.resetFrameNumber):
+ (WebInspector.RenderingFrameTimelineRecord.prototype.get frameNumber):
+ (WebInspector.RenderingFrameTimelineRecord.prototype.get children):
+ (WebInspector.RenderingFrameTimelineRecord.prototype.get durationRemainder):
+ (WebInspector.RenderingFrameTimelineRecord.prototype.durationForRecords.get var):
+ Added frame numbering and improved the accuracy of sub-frame duratation calculation.
+ Refactoring: RunLoop prefix changed to RenderingFrame.
+
+ * UserInterface/Models/Timeline.js:
+ (WebInspector.Timeline):
+ (WebInspector.Timeline.create):
+ (WebInspector.Timeline.prototype.get recording):
+ (WebInspector.Timeline.prototype.get displayName):
+ (WebInspector.Timeline.prototype.get iconClassName):
+ Added up-pointer to parent recording.
+
+ * UserInterface/Models/TimelineRecord.js:
+ Refactoring: RunLoop prefix changed to RenderingFrame.
+
+ * UserInterface/Models/TimelineRecording.js:
+ (WebInspector.TimelineRecording.prototype.reset):
+ Support for new timeline type.
+
+ * UserInterface/Views/ChartDetailsSectionLegendRow.js: Added.
+ (WebInspector.ChartDetailsSectionLegendRow):
+ New details section row type for chart legend items.
+
+ * UserInterface/Views/ChartDetailsSectionRow.css: Added.
+ (.details-section .row.chart):
+ (.details-section .row.chart canvas):
+ (.details-section .row.chart.empty canvas):
+ (.details-section > .content > .group > .row.legend-item > .label > .color-swatch):
+ * UserInterface/Views/ChartDetailsSectionRow.js: Added.
+ (WebInspector.ChartDetailsSectionRow):
+ (WebInspector.ChartDetailsSectionRow.prototype.get legendGroup):
+ (WebInspector.ChartDetailsSectionRow.prototype.set innerLabel):
+ (WebInspector.ChartDetailsSectionRow.prototype.addChartValue):
+ (WebInspector.ChartDetailsSectionRow.prototype.clearChart):
+ (WebInspector.ChartDetailsSectionRow.prototype._refresh.drawSlice):
+ (WebInspector.ChartDetailsSectionRow.prototype._refresh):
+ New details section row type for pie/doughnut charts.
+
+ * UserInterface/Views/ContentView.js:
+ (WebInspector.ContentView):
+ Support for new timeline view type.
+
+ * UserInterface/Views/LayoutTimelineDataGridNode.js:
+ (WebInspector.LayoutTimelineDataGridNode.prototype.get data):
+ (WebInspector.LayoutTimelineDataGridNode.prototype.createCellContent):
+ Updated for use in rendering frame timeline view.
+
+ * UserInterface/Views/LayoutTimelineView.js:
+ (WebInspector.LayoutTimelineView.prototype._layoutTimelineRecordAdded):
+ Removed references to old RunLoop objects.
+
+ * UserInterface/Views/RenderingFrameDetailsSidebarPanel.js: Added.
+ (WebInspector.RenderingFrameDetailsSidebarPanel.formatChartValue):
+ (WebInspector.RenderingFrameDetailsSidebarPanel):
+ (WebInspector.RenderingFrameDetailsSidebarPanel.prototype.inspect):
+ (WebInspector.RenderingFrameDetailsSidebarPanel.prototype.updateRangeSelection):
+ (WebInspector.RenderingFrameDetailsSidebarPanel.prototype.get renderingFrameTimeline):
+ (WebInspector.RenderingFrameDetailsSidebarPanel.prototype.set renderingFrameTimeline):
+ (WebInspector.RenderingFrameDetailsSidebarPanel.prototype.refresh.durationForRecordType):
+ (WebInspector.RenderingFrameDetailsSidebarPanel.prototype.refresh):
+ (WebInspector.RenderingFrameDetailsSidebarPanel.prototype._resetAll):
+ (WebInspector.RenderingFrameDetailsSidebarPanel.prototype._recordAdded):
+ (WebInspector.RenderingFrameDetailsSidebarPanel.prototype._timelineReset):
+ (WebInspector.RenderingFrameDetailsSidebarPanel.prototype._getSelectedRecords):
+ New sidebar panel for showing time breakdown for current frame selection.
+
+ * UserInterface/Views/RenderingFrameTimelineDataGridNode.js: Added.
+ (WebInspector.RenderingFrameTimelineDataGridNode):
+ (WebInspector.RenderingFrameTimelineDataGridNode.prototype.get record):
+ (WebInspector.RenderingFrameTimelineDataGridNode.prototype.get records):
+ (WebInspector.RenderingFrameTimelineDataGridNode.prototype.get data):
+ (WebInspector.RenderingFrameTimelineDataGridNode.prototype.createCellContent):
+ New data grid row type.
+
+ * UserInterface/Views/RenderingFrameTimelineOverviewGraph.css: Renamed from Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.css.
+ (.timeline-overview-graph.rendering-frame > .divider):
+ (.timeline-overview-graph.rendering-frame > .divider > .label):
+ * UserInterface/Views/RenderingFrameTimelineOverviewGraph.js: Renamed from Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.js.
+ (WebInspector.RenderingFrameTimelineOverviewGraph):
+ (WebInspector.RenderingFrameTimelineOverviewGraph.prototype.get graphHeightSeconds):
+ (WebInspector.RenderingFrameTimelineOverviewGraph.prototype.updateLayout.createFrame):
+ (WebInspector.RenderingFrameTimelineOverviewGraph.prototype._updateDividers.createDividerAtPosition.get if):
+ * UserInterface/Views/RenderingFrameTimelineView.css: Renamed from Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.css.
+ (.timeline-view.rendering-frame > .data-grid):
+ (.sidebar > .panel.navigation.timeline.timeline-recording-content-view-showing .navigation-sidebar-panel-content-tree-outline.rendering-frame .item .subtitle):
+ Visual tweeks.
+ Refactoring: RunLoop prefix changed to RenderingFrame.
+
+ * UserInterface/Views/RenderingFrameTimelineView.js: Added.
+ (WebInspector.RenderingFrameTimelineView):
+ (WebInspector.RenderingFrameTimelineView.prototype.get navigationSidebarTreeOutlineLabel):
+ (WebInspector.RenderingFrameTimelineView.prototype.shown):
+ (WebInspector.RenderingFrameTimelineView.prototype.hidden):
+ (WebInspector.RenderingFrameTimelineView.prototype.updateLayout):
+ (WebInspector.RenderingFrameTimelineView.prototype.get selectionPathComponents):
+ (WebInspector.RenderingFrameTimelineView.prototype.filterDidChange):
+ (WebInspector.RenderingFrameTimelineView.prototype.matchTreeElementAgainstCustomFilters):
+ (WebInspector.RenderingFrameTimelineView.prototype.reset):
+ (WebInspector.RenderingFrameTimelineView.prototype.treeElementPathComponentSelected):
+ (WebInspector.RenderingFrameTimelineView.prototype.dataGridNodeForTreeElement):
+ (WebInspector.RenderingFrameTimelineView.prototype._processPendingRecords):
+ (WebInspector.RenderingFrameTimelineView.prototype._renderingFrameTimelineRecordAdded):
+ (WebInspector.RenderingFrameTimelineView.prototype._dataGridNodeSelected):
+ New content view type.
+
+ * UserInterface/Views/TimelineIcons.css:
+ (.rendering-frame-icon .icon):
+ (.rendering-frame-icon.large .icon):
+ (.rendering-frame-record .icon):
+ (.runloop-record .icon):
+ (.runloop-icon .icon): Deleted.
+ (.runloop-icon.large .icon): Deleted.
+ Refactoring: runloop prefix changed to rendering-frame.
+
+ * UserInterface/Views/TimelineOverview.js:
+ (WebInspector.TimelineOverview.prototype._timelineRemoved):
+ Support for timelines without associated views.
+
+ * UserInterface/Views/TimelineOverviewGraph.js:
+ (WebInspector.TimelineOverviewGraph):
+ Refactoring: RunLoop prefix changed to RenderingFrame.
+
+ * UserInterface/Views/TimelineRecordFrame.css:
+ (.timeline-record-frame):
+ (.timeline-record-frame > .frame):
+ * UserInterface/Views/TimelineRecordFrame.js:
+ (WebInspector.TimelineRecordFrame.createCombinedFrames):
+ Visual tweeks, splitting up large combined frames.
+
+ * UserInterface/Views/TimelineRecordTreeElement.js:
+ (WebInspector.TimelineRecordTreeElement):
+ Refactoring: runloop prefix changed to rendering-frame.
+
+ * UserInterface/Views/TimelineRecordingContentView.js:
+ (WebInspector.TimelineRecordingContentView.prototype._timelineRemoved):
+ (WebInspector.TimelineRecordingContentView.prototype._timelineCountChanged):
+ (WebInspector.TimelineRecordingContentView.prototype._timeRangeSelectionChanged):
+ Added support for new details sidebar and timelines without associated views.
+
+ * UserInterface/Views/TimelineSidebarPanel.js:
+ (WebInspector.TimelineSidebarPanel._timelineAdded.set this):
+ Support for timelines without associated views.
+ Refactoring: runloop prefix changed to rendering-frame.
+
+ * WebInspectorUI.vcxproj/WebInspectorUI.vcxproj:
+ * WebInspectorUI.vcxproj/WebInspectorUI.vcxproj.filters:
+ New files.
+
</ins><span class="cx"> 2015-04-11 Nikita Vasilyev <nvasilyev@apple.com>
</span><span class="cx">
</span><span class="cx"> Web Inspector: Use semi-transparent map item dividers
</span></span></pre></div>
<a id="trunkSourceWebInspectorUILocalizationsenlprojlocalizedStringsjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -22,6 +22,7 @@
</span><span class="cx"> localizedStrings["%d \xd7 %d pixels"] = "%d \xd7 %d pixels";
</span><span class="cx"> localizedStrings["%d \xd7 %d pixels (Natural: %d \xd7 %d pixels)"] = "%d \xd7 %d pixels (Natural: %d \xd7 %d pixels)";
</span><span class="cx"> localizedStrings["%d matches"] = "%d matches";
</span><ins>+localizedStrings["%d %d"] = "%d %d";
</ins><span class="cx"> localizedStrings["%fpx"] = "%fpx";
</span><span class="cx"> localizedStrings["%fpx\xB2"] = "%fpx\xB2";
</span><span class="cx"> localizedStrings["%s (computed)"] = "%s (computed)";
</span><span class="lines">@@ -29,6 +30,7 @@
</span><span class="cx"> localizedStrings["%s (hidden)"] = "%s (hidden)";
</span><span class="cx"> localizedStrings["%s Event Dispatched"] = "%s Event Dispatched";
</span><span class="cx"> localizedStrings["%s Prototype"] = "%s Prototype";
</span><ins>+localizedStrings["%s %s"] = "%s %s";
</ins><span class="cx"> localizedStrings["(Index)"] = "(Index)";
</span><span class="cx"> localizedStrings["(anonymous function)"] = "(anonymous function)";
</span><span class="cx"> localizedStrings["(many)"] = "(many)";
</span><span class="lines">@@ -86,6 +88,7 @@
</span><span class="cx"> localizedStrings["Capturing"] = "Capturing";
</span><span class="cx"> localizedStrings["Catch Variables"] = "Catch Variables";
</span><span class="cx"> localizedStrings["Character Data"] = "Character Data";
</span><ins>+localizedStrings["Chart"] = "Chart";
</ins><span class="cx"> localizedStrings["Checked"] = "Checked";
</span><span class="cx"> localizedStrings["Child Layers"] = "Child Layers";
</span><span class="cx"> localizedStrings["Children"] = "Children";
</span><span class="lines">@@ -226,6 +229,8 @@
</span><span class="cx"> localizedStrings["Forced Pseudo-Classes"] = "Forced Pseudo-Classes";
</span><span class="cx"> localizedStrings["Forward (%s)"] = "Forward (%s)";
</span><span class="cx"> localizedStrings["Fragment"] = "Fragment";
</span><ins>+localizedStrings["Frame"] = "Frame";
+localizedStrings["Frame %d"] = "Frame %d";
</ins><span class="cx"> localizedStrings["Frame URL"] = "Frame URL";
</span><span class="cx"> localizedStrings["Frames"] = "Frames";
</span><span class="cx"> localizedStrings["Full URL"] = "Full URL";
</span><span class="lines">@@ -252,6 +257,7 @@
</span><span class="cx"> localizedStrings["Icon and Text (Horizontal)"] = "Icon and Text (Horizontal)";
</span><span class="cx"> localizedStrings["Icon and Text (Vertical)"] = "Icon and Text (Vertical)";
</span><span class="cx"> localizedStrings["Identity"] = "Identity";
</span><ins>+localizedStrings["Idle"] = "Idle";
</ins><span class="cx"> localizedStrings["Ignored"] = "Ignored";
</span><span class="cx"> localizedStrings["Image"] = "Image";
</span><span class="cx"> localizedStrings["Image Size"] = "Image Size";
</span><span class="lines">@@ -314,6 +320,7 @@
</span><span class="cx"> localizedStrings["No Attributes"] = "No Attributes";
</span><span class="cx"> localizedStrings["No Box Model Information"] = "No Box Model Information";
</span><span class="cx"> localizedStrings["No Call Frames"] = "No Call Frames";
</span><ins>+localizedStrings["No Chart Available"] = "No Chart Available";
</ins><span class="cx"> localizedStrings["No Child Layers"] = "No Child Layers";
</span><span class="cx"> localizedStrings["No Entries."] = "No Entries.";
</span><span class="cx"> localizedStrings["No Event Listeners"] = "No Event Listeners";
</span><span class="lines">@@ -377,6 +384,7 @@
</span><span class="cx"> localizedStrings["Reload page (%s)\nReload ignoring cache (%s)"] = "Reload page (%s)\nReload ignoring cache (%s)";
</span><span class="cx"> localizedStrings["Removals"] = "Removals";
</span><span class="cx"> localizedStrings["Remove this breakpoint action"] = "Remove this breakpoint action";
</span><ins>+localizedStrings["Rendering Frames"] = "Rendering Frames";
</ins><span class="cx"> localizedStrings["Repeating Linear Gradient"] = "Repeating Linear Gradient";
</span><span class="cx"> localizedStrings["Repeating Radial Gradient"] = "Repeating Radial Gradient";
</span><span class="cx"> localizedStrings["Request"] = "Request";
</span><span class="lines">@@ -397,7 +405,6 @@
</span><span class="cx"> localizedStrings["Reveal in Original Resource"] = "Reveal in Original Resource";
</span><span class="cx"> localizedStrings["Role"] = "Role";
</span><span class="cx"> localizedStrings["Rules"] = "Rules";
</span><del>-localizedStrings["Runloop Executed"] = "Runloop Executed";
</del><span class="cx"> localizedStrings["Scheme"] = "Scheme";
</span><span class="cx"> localizedStrings["Scope Chain"] = "Scope Chain";
</span><span class="cx"> localizedStrings["Script"] = "Script";
</span><span class="lines">@@ -409,6 +416,7 @@
</span><span class="cx"> localizedStrings["Selected"] = "Selected";
</span><span class="cx"> localizedStrings["Selected Item"] = "Selected Item";
</span><span class="cx"> localizedStrings["Selected Items"] = "Selected Items";
</span><ins>+localizedStrings["Selected Range"] = "Selected Range";
</ins><span class="cx"> localizedStrings["Selected Symbol"] = "Selected Symbol";
</span><span class="cx"> localizedStrings["Selected Value"] = "Selected Value";
</span><span class="cx"> localizedStrings["Self Time"] = "Self Time";
</span><span class="lines">@@ -462,6 +470,7 @@
</span><span class="cx"> localizedStrings["Text Node"] = "Text Node";
</span><span class="cx"> localizedStrings["Text Only"] = "Text Only";
</span><span class="cx"> localizedStrings["The %s \ntable is empty."] = "The %s \ntable is empty.";
</span><ins>+localizedStrings["Time"] = "Time";
</ins><span class="cx"> localizedStrings["Time until the load event fired, click to show the Network Requests timeline"] = "Time until the load event fired, click to show the Network Requests timeline";
</span><span class="cx"> localizedStrings["Timeline Events"] = "Timeline Events";
</span><span class="cx"> localizedStrings["Timeline Recording %d"] = "Timeline Recording %d";
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceBaseMainjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Main.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Base/Main.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Main.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -303,9 +303,10 @@
</span><span class="cx"> this.applicationCacheDetailsSidebarPanel = new WebInspector.ApplicationCacheDetailsSidebarPanel;
</span><span class="cx"> this.scopeChainDetailsSidebarPanel = new WebInspector.ScopeChainDetailsSidebarPanel;
</span><span class="cx"> this.probeDetailsSidebarPanel = new WebInspector.ProbeDetailsSidebarPanel;
</span><ins>+ this.renderingFrameDetailsSidebarPanel = new WebInspector.RenderingFrameDetailsSidebarPanel;
</ins><span class="cx">
</span><span class="cx"> this.detailsSidebarPanels = [this.resourceDetailsSidebarPanel, this.applicationCacheDetailsSidebarPanel, this.scopeChainDetailsSidebarPanel,
</span><del>- this.domNodeDetailsSidebarPanel, this.cssStyleDetailsSidebarPanel, this.probeDetailsSidebarPanel];
</del><ins>+ this.domNodeDetailsSidebarPanel, this.cssStyleDetailsSidebarPanel, this.probeDetailsSidebarPanel, this.renderingFrameDetailsSidebarPanel];
</ins><span class="cx">
</span><span class="cx"> if (window.LayerTreeAgent) {
</span><span class="cx"> this.layerTreeDetailsSidebarPanel = new WebInspector.LayerTreeDetailsSidebarPanel;
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceControllersTimelineManagerjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Controllers/TimelineManager.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Controllers/TimelineManager.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Controllers/TimelineManager.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -50,6 +50,13 @@
</span><span class="cx"> setTimeout(delayedWork.bind(this), 0);
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+ // Static
+
+ static shouldShowViewForTimeline(timeline)
+ {
+ return timeline.type !== WebInspector.TimelineRecord.Type.Layout;
+ }
+
</ins><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> // The current recording that new timeline records will be appended to, if any.
</span><span class="lines">@@ -254,12 +261,14 @@
</span><span class="cx"> else
</span><span class="cx"> return new WebInspector.LayoutTimelineRecord(WebInspector.LayoutTimelineRecord.EventType.Paint, startTime, endTime, callFrames, sourceCodeLocation, recordPayload.data.x, recordPayload.data.y, recordPayload.data.width, recordPayload.data.height);
</span><span class="cx">
</span><del>- case TimelineAgent.EventType.RunLoop:
</del><ins>+ case TimelineAgent.EventType.RenderingFrame:
</ins><span class="cx"> if (!recordPayload.children)
</span><span class="cx"> return null;
</span><span class="cx">
</span><span class="cx"> var children = this._processNestedRecords(recordPayload.children, recordPayload);
</span><del>- return new WebInspector.RunLoopTimelineRecord(startTime, endTime, children);
</del><ins>+ if (!children.length)
+ return null;
+ return new WebInspector.RenderingFrameTimelineRecord(startTime, endTime, children);
</ins><span class="cx">
</span><span class="cx"> case TimelineAgent.EventType.EvaluateScript:
</span><span class="cx"> if (!sourceCodeLocation) {
</span><span class="lines">@@ -420,7 +429,7 @@
</span><span class="cx"> var identifier = this._nextRecordingIdentifier++;
</span><span class="cx"> var newRecording = new WebInspector.TimelineRecording(identifier, WebInspector.UIString("Timeline Recording %d").format(identifier));
</span><span class="cx"> newRecording.addTimeline(WebInspector.Timeline.create(WebInspector.TimelineRecord.Type.Network, newRecording));
</span><del>- newRecording.addTimeline(WebInspector.Timeline.create(WebInspector.TimelineRecord.Type.RunLoop, newRecording));
</del><ins>+ newRecording.addTimeline(WebInspector.Timeline.create(WebInspector.TimelineRecord.Type.RenderingFrame, newRecording));
</ins><span class="cx"> newRecording.addTimeline(WebInspector.Timeline.create(WebInspector.TimelineRecord.Type.Layout, newRecording));
</span><span class="cx"> newRecording.addTimeline(WebInspector.Timeline.create(WebInspector.TimelineRecord.Type.Script, newRecording));
</span><span class="cx">
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceImagesNavigationItemDoughnutChartsvg"></a>
<div class="addfile"><h4>Added: trunk/Source/WebInspectorUI/UserInterface/Images/NavigationItemDoughnutChart.svg (0 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Images/NavigationItemDoughnutChart.svg (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Images/NavigationItemDoughnutChart.svg 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -0,0 +1,5 @@
</span><ins>+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright © 2015 Apple Inc. All rights reserved. -->
+<svg viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg">
+ <path d="M 5.37429912 13.9462607 C 6.17726141 14.3022717 7.06560591 14.5 8 14.5 C 11.5898509 14.5 14.5 11.5814876 14.5 7.98132007 C 14.5 7.04424071 14.3028383 6.15334327 13.9478475 5.34807342 L 13.9478475 5.34807342 L 11.8426159 6.56702248 C 12.0090316 7.01308754 12.0999999 7.49592037 12.0999999 8 C 12.0999999 10.2643674 10.2643674 12.0999999 8 12.0999999 C 7.50160696 12.0999999 7.02398405 12.0110724 6.58213286 11.8482191 L 5.37429912 13.9462607 Z M 4.16246106 13.2432112 C 2.54820632 12.0571351 1.5 10.1419902 1.5 7.98132007 C 1.5 4.61832804 4.03934379 1.850136 7.30000001 1.5 L 7.30000001 3.95951995 C 5.36910249 4.2916812 3.9000001 5.97427697 3.9000001 8 C 3.9000001 9.2634575 4.47149612 10.393435 5.37008678 11.145531 L 4.16246106 13.2432112 Z M 13.2468127 4.13275273 C 12.1939572 2.69156387 10.5649628 1.70026355 8.69999999 1.5 L 8.69999999 1.5 L 8.69999999 3.95951995 C 9.67061775 4.12648977 10.5245472 4.634693 11.1338417 5.35618297 L 13.2468127 4.13275273 L 13.2468
127 4.13275273 Z" fill="black" stroke-width="1"/>
+</svg>
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceImagesTimelineRecordRenderingFramesvg"></a>
<div class="addfile"><h4>Added: trunk/Source/WebInspectorUI/UserInterface/Images/TimelineRecordRenderingFrame.svg (0 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Images/TimelineRecordRenderingFrame.svg (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Images/TimelineRecordRenderingFrame.svg 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -0,0 +1,8 @@
</span><ins>+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright © 2015 Apple Inc. All rights reserved. -->
+<svg viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg">
+ <path fill="rgb(203, 203, 203)" d="M 13 1 L 3 1 C 1.898438 1 1 1.898438 1 3 L 1 13 C 1 14.101562 1.898438 15 3 15 L 13 15 C 14.101562 15 15 14.101562 15 13 L 15 3 C 15 1.898438 14.101562 1 13 1 Z"/>
+ <path fill="rgb(153, 153, 153)" d="M 13 1 L 3 1 C 1.898438 1 1 1.898438 1 3 L 1 13 C 1 14.101562 1.898438 15 3 15 L 13 15 C 14.101562 15 15 14.101562 15 13 L 15 3 C 15 1.898438 14.101562 1 13 1 M 13 2 C 13.550781 2 14 2.449219 14 3 L 14 13 C 14 13.550781 13.550781 14 13 14 L 3 14 C 2.449219 14 2 13.550781 2 13 L 2 3 C 2 2.449219 2.449219 2 3 2 L 13 2"/>
+ <path fill="rgb(166, 166, 166)" d="M 12 3 L 11 3 L 5 3 L 4 3 L 4 4 L 4 12 L 4 12.962999 L 4.962 12.999 L 6.962 13.075 L 8 13.115 L 8 12.076 L 8 9 L 10 9 L 11 9 L 11 8 L 11 7 L 11 6 L 10 6 L 8 6 L 11 6 L 12 6 L 12 5 L 12 4 L 12 3 Z M 11 4 L 11 5 L 7 5 L 7 7 L 10 7 L 10 8 L 7 8 L 7 12.076 L 5 12 L 5 4 L 11 4 Z"/>
+ <path fill="white" d="M 5 12 L 5 4 L 11 4 L 11 5 L 7 5 L 7 7 L 10 7 L 10 8 L 7 8 L 7 12.076 L 5 12 Z"/>
+</svg>
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceMainhtml"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Main.html (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Main.html 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Main.html 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -42,6 +42,7 @@
</span><span class="cx"> <link rel="stylesheet" href="Views/CSSStyleDeclarationTextEditor.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/CSSStyleDetailsSidebarPanel.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/CallFrameIcons.css">
</span><ins>+ <link rel="stylesheet" href="Views/ChartDetailsSectionRow.css">
</ins><span class="cx"> <link rel="stylesheet" href="Views/ClusterContentView.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/CodeMirrorOverrides.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/ColorPicker.css">
</span><span class="lines">@@ -110,13 +111,14 @@
</span><span class="cx"> <link rel="stylesheet" href="Views/ProbeSetDataGrid.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/QuickConsole.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/RadioButtonNavigationItem.css">
</span><ins>+ <link rel="stylesheet" href="Views/RenderingFrameTimelineOverviewGraph.css">
+ <link rel="stylesheet" href="Views/RenderingFrameTimelineView.css">
</ins><span class="cx"> <link rel="stylesheet" href="Views/ReplayDashboardView.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/Resizer.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/ResourceIcons.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/ResourceSidebarPanel.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/ResourceTreeElement.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/RulesStyleDetailsPanel.css">
</span><del>- <link rel="stylesheet" href="Views/RunLoopTimelineOverviewGraph.css">
</del><span class="cx"> <link rel="stylesheet" href="Views/ScopeBar.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/ScriptContentView.css">
</span><span class="cx"> <link rel="stylesheet" href="Views/ScriptTimelineOverviewGraph.css">
</span><span class="lines">@@ -271,6 +273,7 @@
</span><span class="cx"> <script src="Models/PropertyDescriptor.js"></script>
</span><span class="cx"> <script src="Models/PropertyPath.js"></script>
</span><span class="cx"> <script src="Models/PropertyPreview.js"></script>
</span><ins>+ <script src="Models/RenderingFrameTimelineRecord.js"></script>
</ins><span class="cx"> <script src="Models/ReplayDashboard.js"></script>
</span><span class="cx"> <script src="Models/ReplaySession.js"></script>
</span><span class="cx"> <script src="Models/ReplaySessionSegment.js"></script>
</span><span class="lines">@@ -278,7 +281,6 @@
</span><span class="cx"> <script src="Models/ResourceCollection.js"></script>
</span><span class="cx"> <script src="Models/ResourceTimelineRecord.js"></script>
</span><span class="cx"> <script src="Models/Revision.js"></script>
</span><del>- <script src="Models/RunLoopTimelineRecord.js"></script>
</del><span class="cx"> <script src="Models/ScopeChainNode.js"></script>
</span><span class="cx"> <script src="Models/Script.js"></script>
</span><span class="cx"> <script src="Models/ScriptSyntaxTree.js"></script>
</span><span class="lines">@@ -333,6 +335,13 @@
</span><span class="cx">
</span><span class="cx"> <script src="Views/ResourceTreeElement.js"></script>
</span><span class="cx">
</span><ins>+ <script src="Views/DetailsSection.js"></script>
+ <script src="Views/DetailsSectionDataGridRow.js"></script>
+ <script src="Views/DetailsSectionGroup.js"></script>
+ <script src="Views/DetailsSectionPropertiesRow.js"></script>
+ <script src="Views/DetailsSectionSimpleRow.js"></script>
+ <script src="Views/DetailsSectionTextRow.js"></script>
+
</ins><span class="cx"> <script src="Views/ActivateButtonNavigationItem.js"></script>
</span><span class="cx"> <script src="Views/ActivateButtonToolbarItem.js"></script>
</span><span class="cx"> <script src="Views/ApplicationCacheDetailsSidebarPanel.js"></script>
</span><span class="lines">@@ -347,6 +356,8 @@
</span><span class="cx"> <script src="Views/CSSStyleDeclarationTextEditor.js"></script>
</span><span class="cx"> <script src="Views/CSSStyleDetailsSidebarPanel.js"></script>
</span><span class="cx"> <script src="Views/CallFrameTreeElement.js"></script>
</span><ins>+ <script src="Views/ChartDetailsSectionLegendRow.js"></script>
+ <script src="Views/ChartDetailsSectionRow.js"></script>
</ins><span class="cx"> <script src="Views/ClusterContentView.js"></script>
</span><span class="cx"> <script src="Views/CodeMirrorAdditions.js"></script>
</span><span class="cx"> <script src="Views/CodeMirrorFormatters.js"></script>
</span><span class="lines">@@ -384,12 +395,6 @@
</span><span class="cx"> <script src="Views/DebuggerDashboardView.js"></script>
</span><span class="cx"> <script src="Views/DebuggerSidebarPanel.js"></script>
</span><span class="cx"> <script src="Views/DefaultDashboardView.js"></script>
</span><del>- <script src="Views/DetailsSection.js"></script>
- <script src="Views/DetailsSectionDataGridRow.js"></script>
- <script src="Views/DetailsSectionGroup.js"></script>
- <script src="Views/DetailsSectionPropertiesRow.js"></script>
- <script src="Views/DetailsSectionSimpleRow.js"></script>
- <script src="Views/DetailsSectionTextRow.js"></script>
</del><span class="cx"> <script src="Views/DividerNavigationItem.js"></script>
</span><span class="cx"> <script src="Views/EditingSupport.js"></script>
</span><span class="cx"> <script src="Views/EventListenerSection.js"></script>
</span><span class="lines">@@ -446,6 +451,10 @@
</span><span class="cx"> <script src="Views/QuickConsole.js"></script>
</span><span class="cx"> <script src="Views/QuickConsoleNavigationBar.js"></script>
</span><span class="cx"> <script src="Views/RadioButtonNavigationItem.js"></script>
</span><ins>+ <script src="Views/RenderingFrameDetailsSidebarPanel.js"></script>
+ <script src="Views/RenderingFrameTimelineDataGridNode.js"></script>
+ <script src="Views/RenderingFrameTimelineOverviewGraph.js"></script>
+ <script src="Views/RenderingFrameTimelineView.js"></script>
</ins><span class="cx"> <script src="Views/ReplayDashboardView.js"></script>
</span><span class="cx"> <script src="Views/Resizer.js"></script>
</span><span class="cx"> <script src="Views/ResourceClusterContentView.js"></script>
</span><span class="lines">@@ -454,7 +463,6 @@
</span><span class="cx"> <script src="Views/ResourceTimelineDataGridNode.js"></script>
</span><span class="cx"> <script src="Views/ResourceTimelineDataGridNodePathComponent.js"></script>
</span><span class="cx"> <script src="Views/RulesStyleDetailsPanel.js"></script>
</span><del>- <script src="Views/RunLoopTimelineOverviewGraph.js"></script>
</del><span class="cx"> <script src="Views/ScopeBar.js"></script>
</span><span class="cx"> <script src="Views/ScopeBarItem.js"></script>
</span><span class="cx"> <script src="Views/ScopeChainDetailsSidebarPanel.js"></script>
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceModelsRenderingFrameTimelineRecordjsfromrev182659trunkSourceWebInspectorUIUserInterfaceModelsRunLoopTimelineRecordjs"></a>
<div class="copfile"><h4>Copied: trunk/Source/WebInspectorUI/UserInterface/Models/RenderingFrameTimelineRecord.js (from rev 182659, trunk/Source/WebInspectorUI/UserInterface/Models/RunLoopTimelineRecord.js) (0 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Models/RenderingFrameTimelineRecord.js (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/RenderingFrameTimelineRecord.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -0,0 +1,101 @@
</span><ins>+/*
+ * Copyright (C) 2015 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WebInspector.RenderingFrameTimelineRecord = class RenderingFrameTimelineRecord extends WebInspector.TimelineRecord
+{
+ constructor(startTime, endTime, children)
+ {
+ super(WebInspector.TimelineRecord.Type.RenderingFrame, startTime, endTime);
+
+ this._children = children || [];
+ this._durationByRecordType = new Map;
+ this._durationRemainder = NaN;
+ this._frameNumber = WebInspector.RenderingFrameTimelineRecord._nextFrameNumber++;
+ }
+
+ // Static
+
+ static resetFrameNumber()
+ {
+ WebInspector.RenderingFrameTimelineRecord._nextFrameNumber = 1;
+ }
+
+ // Public
+
+ get frameNumber()
+ {
+ return this._frameNumber;
+ }
+
+ get children()
+ {
+ return this._children.slice();
+ }
+
+ get durationRemainder()
+ {
+ if (!isNaN(this._durationRemainder))
+ return this._durationRemainder;
+
+ this._durationRemainder = this.duration;
+ for (var recordType in WebInspector.TimelineRecord.Type)
+ this._durationRemainder -= this.durationForRecords(WebInspector.TimelineRecord.Type[recordType]);
+
+ return this._durationRemainder;
+ }
+
+ durationForRecords(recordType)
+ {
+ if (this._durationByRecordType.has(recordType))
+ return this._durationByRecordType.get(recordType);
+
+ var duration = this._children.reduce(function(previousValue, currentValue) {
+ if (currentValue.type !== recordType)
+ return previousValue;
+
+ var currentDuration = currentValue.duration;
+ if (currentValue.usesActiveStartTime)
+ currentDuration -= currentValue.inactiveDuration;
+ return previousValue + currentDuration;
+ }, 0);
+
+ // Time spent in layout events which were synchronously triggered from JavaScript must be deducted from the
+ // rendering frame's script duration, to prevent the time from being counted twice.
+ if (recordType === WebInspector.TimelineRecord.Type.Script) {
+ duration -= this._children.reduce(function(previousValue, currentValue) {
+ if (currentValue.type === WebInspector.TimelineRecord.Type.Layout && (currentValue.sourceCodeLocation || currentValue.callFrames))
+ return previousValue + currentValue.duration;
+ return previousValue;
+ }, 0);
+ }
+
+ this._durationByRecordType.set(recordType, duration);
+ return duration;
+ }
+};
+
+WebInspector.RenderingFrameTimelineRecord.TypeIdentifier = "rendering-frame-timeline-record";
+
+WebInspector.RenderingFrameTimelineRecord._nextFrameNumber = 1;
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceModelsRunLoopTimelineRecordjs"></a>
<div class="delfile"><h4>Deleted: trunk/Source/WebInspectorUI/UserInterface/Models/RunLoopTimelineRecord.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Models/RunLoopTimelineRecord.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/RunLoopTimelineRecord.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -1,76 +0,0 @@
</span><del>-/*
- * Copyright (C) 2015 Apple Inc. All rights reserved.
- *
- * Redistribution and use in source and binary forms, with or without
- * modification, are permitted provided that the following conditions
- * are met:
- * 1. Redistributions of source code must retain the above copyright
- * notice, this list of conditions and the following disclaimer.
- * 2. Redistributions in binary form must reproduce the above copyright
- * notice, this list of conditions and the following disclaimer in the
- * documentation and/or other materials provided with the distribution.
- *
- * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
- * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
- * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
- * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
- * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
- * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
- * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
- * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
- * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
- * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
- * THE POSSIBILITY OF SUCH DAMAGE.
- */
-
-WebInspector.RunLoopTimelineRecord = class RunLoopTimelineRecord extends WebInspector.TimelineRecord
-{
- constructor(startTime, endTime, children)
- {
- super(WebInspector.TimelineRecord.Type.RunLoop, startTime, endTime);
-
- this._children = children || [];
- this._durationByRecordType = new Map;
- this._durationRemainder = NaN;
- }
-
- // Public
-
- get children()
- {
- return this._children.slice();
- }
-
- get durationRemainder()
- {
- if (!isNaN(this._durationRemainder))
- return this._durationRemainder;
-
- this._durationRemainder = this.duration;
- for (var recordType in WebInspector.TimelineRecord.Type)
- this._durationRemainder -= this.durationForRecords(WebInspector.TimelineRecord.Type[recordType]);
-
- return this._durationRemainder;
- }
-
- durationForRecords(recordType)
- {
- if (this._durationByRecordType.has(recordType))
- return this._durationByRecordType.get(recordType);
-
- var duration = this._children.reduce(function(previousValue, currentValue) {
- if (currentValue.type === recordType) {
- var currentDuration = currentValue.duration;
- if (currentValue.usesActiveStartTime)
- currentDuration -= currentValue.inactiveDuration;
- return previousValue + currentDuration;
- }
- return previousValue;
- }, 0);
-
- this._durationByRecordType.set(recordType, duration);
- return duration;
- }
-};
-
-WebInspector.RunLoopTimelineRecord.TypeIdentifier = "runloop-timeline-record";
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceModelsTimelinejs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Models/Timeline.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Models/Timeline.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/Timeline.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -25,23 +25,24 @@
</span><span class="cx">
</span><span class="cx"> WebInspector.Timeline = class Timeline extends WebInspector.Object
</span><span class="cx"> {
</span><del>- constructor(type)
</del><ins>+ constructor(type, recording)
</ins><span class="cx"> {
</span><span class="cx"> super();
</span><span class="cx">
</span><span class="cx"> this._type = type;
</span><ins>+ this._recording = recording;
</ins><span class="cx">
</span><span class="cx"> this.reset(true);
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> // Static
</span><span class="cx">
</span><del>- static create(type)
</del><ins>+ static create(type, recording)
</ins><span class="cx"> {
</span><span class="cx"> if (type === WebInspector.TimelineRecord.Type.Network)
</span><del>- return new WebInspector.NetworkTimeline(type);
</del><ins>+ return new WebInspector.NetworkTimeline(type, recording);
</ins><span class="cx">
</span><del>- return new WebInspector.Timeline(type);
</del><ins>+ return new WebInspector.Timeline(type, recording);
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> // Public
</span><span class="lines">@@ -66,6 +67,11 @@
</span><span class="cx"> return this._type;
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+ get recording()
+ {
+ return this._recording;
+ }
+
</ins><span class="cx"> get displayName()
</span><span class="cx"> {
</span><span class="cx"> if (this._type === WebInspector.TimelineRecord.Type.Network)
</span><span class="lines">@@ -74,8 +80,8 @@
</span><span class="cx"> return WebInspector.UIString("Layout & Rendering");
</span><span class="cx"> if (this._type === WebInspector.TimelineRecord.Type.Script)
</span><span class="cx"> return WebInspector.UIString("JavaScript & Events");
</span><del>- if (this._type === WebInspector.TimelineRecord.Type.RunLoop)
- return WebInspector.UIString("Frames");
</del><ins>+ if (this._type === WebInspector.TimelineRecord.Type.RenderingFrame)
+ return WebInspector.UIString("Rendering Frames");
</ins><span class="cx">
</span><span class="cx"> console.error("Timeline has unknown type:", this._type, this);
</span><span class="cx"> }
</span><span class="lines">@@ -86,10 +92,10 @@
</span><span class="cx"> return WebInspector.TimelineSidebarPanel.NetworkIconStyleClass;
</span><span class="cx"> if (this._type === WebInspector.TimelineRecord.Type.Layout)
</span><span class="cx"> return WebInspector.TimelineSidebarPanel.ColorsIconStyleClass;
</span><del>- if (this._type === WebInspector.TimelineRecord.Type.RunLoop)
- return WebInspector.TimelineSidebarPanel.RunLoopIconStyleClass;
</del><span class="cx"> if (this._type === WebInspector.TimelineRecord.Type.Script)
</span><span class="cx"> return WebInspector.TimelineSidebarPanel.ScriptIconStyleClass;
</span><ins>+ if (this._type === WebInspector.TimelineRecord.Type.RenderingFrame)
+ return WebInspector.TimelineSidebarPanel.RenderingFrameIconStyleClass;
</ins><span class="cx">
</span><span class="cx"> console.error("Timeline has unknown type:", this._type, this);
</span><span class="cx"> }
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceModelsTimelineRecordjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Models/TimelineRecord.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Models/TimelineRecord.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/TimelineRecord.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -138,7 +138,7 @@
</span><span class="cx"> Network: "timeline-record-type-network",
</span><span class="cx"> Layout: "timeline-record-type-layout",
</span><span class="cx"> Script: "timeline-record-type-script",
</span><del>- RunLoop: "timeline-record-type-runloop"
</del><ins>+ RenderingFrame: "timeline-record-type-rendering-frame"
</ins><span class="cx"> };
</span><span class="cx">
</span><span class="cx"> WebInspector.TimelineRecord.TypeIdentifier = "timeline-record";
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceModelsTimelineRecordingjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Models/TimelineRecording.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Models/TimelineRecording.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/TimelineRecording.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -109,6 +109,8 @@
</span><span class="cx"> for (var timeline of this._timelines.values())
</span><span class="cx"> timeline.reset(suppressEvents);
</span><span class="cx">
</span><ins>+ WebInspector.RenderingFrameTimelineRecord.resetFrameNumber();
+
</ins><span class="cx"> if (!suppressEvents) {
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.TimelineRecording.Event.Reset);
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.TimelineRecording.Event.TimesUpdated);
</span><span class="lines">@@ -161,8 +163,8 @@
</span><span class="cx"> // Add the record to the global timeline by type.
</span><span class="cx"> this._timelines.get(record.type).addRecord(record);
</span><span class="cx">
</span><del>- // Network records don't have source code timelines.
- if (record.type === WebInspector.TimelineRecord.Type.Network)
</del><ins>+ // Network and RenderingFrame records don't have source code timelines.
+ if (record.type === WebInspector.TimelineRecord.Type.Network || record.type === WebInspector.TimelineRecord.Type.RenderingFrame)
</ins><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> // Add the record to the source code timelines.
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceTesthtml"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Test.html (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Test.html 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Test.html 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -107,13 +107,13 @@
</span><span class="cx"> <script src="Models/ProfileNodeCall.js"></script>
</span><span class="cx"> <script src="Models/PropertyDescriptor.js"></script>
</span><span class="cx"> <script src="Models/PropertyPreview.js"></script>
</span><ins>+ <script src="Models/RenderingFrameTimelineRecord.js"></script>
</ins><span class="cx"> <script src="Models/ReplaySession.js"></script>
</span><span class="cx"> <script src="Models/ReplaySessionSegment.js"></script>
</span><span class="cx"> <script src="Models/Resource.js"></script>
</span><span class="cx"> <script src="Models/ResourceCollection.js"></script>
</span><span class="cx"> <script src="Models/ResourceTimelineRecord.js"></script>
</span><span class="cx"> <script src="Models/Revision.js"></script>
</span><del>- <script src="Models/RunLoopTimelineRecord.js"></script>
</del><span class="cx"> <script src="Models/ScopeChainNode.js"></script>
</span><span class="cx"> <script src="Models/Script.js"></script>
</span><span class="cx"> <script src="Models/ScriptSyntaxTree.js"></script>
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsChartDetailsSectionLegendRowjsfromrev182659trunkSourceWebInspectorUIUserInterfaceViewsRunLoopTimelineOverviewGraphcss"></a>
<div class="copfile"><h4>Copied: trunk/Source/WebInspectorUI/UserInterface/Views/ChartDetailsSectionLegendRow.js (from rev 182659, trunk/Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.css) (0 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ChartDetailsSectionLegendRow.js (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ChartDetailsSectionLegendRow.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -0,0 +1,40 @@
</span><ins>+/*
+ * Copyright (C) 2015 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WebInspector.ChartDetailsSectionLegendRow = class ChartDetailsSectionLegendRow extends WebInspector.DetailsSectionSimpleRow
+{
+ constructor(label, value, color)
+ {
+ super(label, value);
+
+ this.element.classList.add("legend-item");
+
+ var colorSwatchElement = document.createElement("div");
+ colorSwatchElement.className = "color-swatch";
+ colorSwatchElement.style.backgroundColor = color;
+
+ this._labelElement.appendChild(colorSwatchElement);
+ }
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsChartDetailsSectionRowcssfromrev182659trunkSourceWebInspectorUIUserInterfaceViewsRunLoopTimelineOverviewGraphcss"></a>
<div class="copfile"><h4>Copied: trunk/Source/WebInspectorUI/UserInterface/Views/ChartDetailsSectionRow.css (from rev 182659, trunk/Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.css) (0 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ChartDetailsSectionRow.css (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ChartDetailsSectionRow.css 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -0,0 +1,46 @@
</span><ins>+/*
+ * Copyright (C) 2015 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+.details-section .row.chart {
+ text-align: center;
+}
+
+.details-section .row.chart canvas {
+ width: 150px;
+ height: 150px;
+}
+
+.details-section .row.chart.empty canvas {
+ display: none;
+}
+
+.details-section > .content > .group > .row.legend-item > .label > .color-swatch {
+ display: inline-block;
+ margin-left: 6px;
+ width: 8px;
+ height: 8px;
+
+ border: solid 1px #666;
+}
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsChartDetailsSectionRowjs"></a>
<div class="addfile"><h4>Added: trunk/Source/WebInspectorUI/UserInterface/Views/ChartDetailsSectionRow.js (0 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ChartDetailsSectionRow.js (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ChartDetailsSectionRow.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -0,0 +1,158 @@
</span><ins>+/*
+ * Copyright (C) 2015 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WebInspector.ChartDetailsSectionRow = class ChartDetailsSectionRow extends WebInspector.DetailsSectionRow
+{
+ constructor(formatValueCallback)
+ {
+ super(WebInspector.UIString("No Chart Available"));
+
+ this.element.classList.add("chart");
+
+ this._legendGroup = new WebInspector.DetailsSectionGroup;
+ this._formatValueCallback = formatValueCallback;
+ this._chartItems = [];
+ this._innerLabel = "";
+ this._innerRadius = 0.5;
+ this._innerLabelFontSize = 11;
+ this._shadowColor = "rgba(0, 0, 0, 0.5)";
+ this._total = 0;
+
+ this._refresh();
+ }
+
+ // Public
+
+ get legendGroup()
+ {
+ return this._legendGroup;
+ }
+
+ set innerLabel(x)
+ {
+ if (this._innerLabel === x)
+ return;
+
+ this._innerLabel = x;
+
+ this._refresh();
+ }
+
+ addChartValue(label, value, color)
+ {
+ console.assert(value >= 0);
+ if (value < 0)
+ return;
+
+ this._chartItems.push({label, value, color});
+ this._total += value
+
+ this._refresh();
+
+ if (!this._legendGroup)
+ return;
+
+ var rows = this._legendGroup.rows;
+ var formattedValue = this._formatValueCallback ? this._formatValueCallback(value) : value;
+ rows.push(new WebInspector.ChartDetailsSectionLegendRow(label, formattedValue, color));
+ this._legendGroup.rows = rows;
+ }
+
+ clearChart()
+ {
+ this._chartItems = [];
+ this._total = 0;
+
+ this._refresh();
+
+ if (!this._legendGroup)
+ return;
+
+ this._legendGroup.rows = [];
+ }
+
+ // Private
+
+ _refresh()
+ {
+ if (!this._chartItems.length) {
+ this._canvas = null;
+ this.showEmptyMessage();
+ return;
+ }
+
+ if (!this._canvas) {
+ this.hideEmptyMessage();
+
+ this._canvas = document.createElement("canvas");
+ this.element.appendChild(this._canvas);
+
+ this._canvas.width = this._canvas.offsetWidth * window.devicePixelRatio;
+ this._canvas.height = this._canvas.offsetHeight * window.devicePixelRatio;
+ }
+
+ var context = this._canvas.getContext("2d");
+ context.clearRect(0, 0, this._canvas.width, this._canvas.height);
+
+ var centerX = Math.floor(this._canvas.width / 2);
+ var centerY = Math.floor(this._canvas.height / 2);
+ var radius = Math.floor(Math.min(centerX, centerY) * 0.96); // Add a small margin to prevent clipping of the chart shadow.
+ var innerRadius = Math.floor(radius * this._innerRadius);
+ var startAngle = 1.5 * Math.PI;
+ var endAngle = startAngle;
+
+ function drawSlice(x, y, startAngle, endAngle, color)
+ {
+ context.beginPath();
+ context.moveTo(x, y);
+ context.arc(x, y, radius, startAngle, endAngle, false);
+ if (innerRadius > 0)
+ context.arc(x, y, innerRadius, endAngle, startAngle, true);
+ context.fillStyle = color;
+ context.fill();
+ }
+
+ context.save();
+ context.shadowBlur = 2 * window.devicePixelRatio;
+ context.shadowOffsetY = window.devicePixelRatio;
+ context.shadowColor = this._shadowColor;
+ drawSlice(centerX, centerY, 0, 2.0 * Math.PI, "rgb(255, 255, 255)");
+ context.restore();
+
+ for (var item of this._chartItems) {
+ endAngle += (item.value / this._total) * 2.0 * Math.PI;
+ drawSlice(centerX, centerY, startAngle, endAngle, item.color);
+ startAngle = endAngle;
+ }
+
+ if (this._innerLabel) {
+ context.font = (this._innerLabelFontSize * window.devicePixelRatio) + "px sans-serif";
+ var metrics = context.measureText(this._innerLabel);
+ var offsetX = centerX - metrics.width / 2;
+ context.fillStyle = "rgb(68, 68, 68)";
+ context.fillText(this._innerLabel, offsetX, centerY);
+ }
+ }
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsContentViewjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ContentView.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ContentView.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ContentView.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -47,11 +47,14 @@
</span><span class="cx"> if (timelineType === WebInspector.TimelineRecord.Type.Network)
</span><span class="cx"> return new WebInspector.NetworkTimelineView(representedObject);
</span><span class="cx">
</span><del>- if (timelineType === WebInspector.TimelineRecord.Type.Layout || timelineType === WebInspector.TimelineRecord.Type.RunLoop)
</del><ins>+ if (timelineType === WebInspector.TimelineRecord.Type.Layout)
</ins><span class="cx"> return new WebInspector.LayoutTimelineView(representedObject);
</span><span class="cx">
</span><span class="cx"> if (timelineType === WebInspector.TimelineRecord.Type.Script)
</span><span class="cx"> return new WebInspector.ScriptTimelineView(representedObject);
</span><ins>+
+ if (timelineType === WebInspector.TimelineRecord.Type.RenderingFrame)
+ return new WebInspector.RenderingFrameTimelineView(representedObject);
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> if (representedObject instanceof WebInspector.DOMStorageObject)
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsLayoutTimelineDataGridNodejs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -55,7 +55,7 @@
</span><span class="cx">
</span><span class="cx"> get data()
</span><span class="cx"> {
</span><del>- return this._record;
</del><ins>+ return {eventType: this._record.eventType, startTime: this._record.startTime, totalTime: this._record.duration, location: this._record.initiatorCallFrame};
</ins><span class="cx"> },
</span><span class="cx">
</span><span class="cx"> createCellContent: function(columnIdentifier, cell)
</span><span class="lines">@@ -77,7 +77,7 @@
</span><span class="cx"> case "startTime":
</span><span class="cx"> return isNaN(value) ? emptyValuePlaceholderString : Number.secondsToString(value - this._baseStartTime, true);
</span><span class="cx">
</span><del>- case "duration":
</del><ins>+ case "totalTime":
</ins><span class="cx"> return isNaN(value) ? emptyValuePlaceholderString : Number.secondsToString(value, true);
</span><span class="cx"> }
</span><span class="cx">
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsLayoutTimelineViewjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineView.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineView.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineView.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -27,7 +27,7 @@
</span><span class="cx"> {
</span><span class="cx"> WebInspector.TimelineView.call(this, timeline);
</span><span class="cx">
</span><del>- console.assert(timeline.type === WebInspector.TimelineRecord.Type.Layout || WebInspector.TimelineRecord.Type.RunLoop);
</del><ins>+ console.assert(timeline.type === WebInspector.TimelineRecord.Type.Layout);
</ins><span class="cx">
</span><span class="cx"> this.navigationSidebarTreeOutline.onselect = this._treeElementSelected.bind(this);
</span><span class="cx"> this.navigationSidebarTreeOutline.ondeselect = this._treeElementDeselected.bind(this);
</span><span class="lines">@@ -185,7 +185,7 @@
</span><span class="cx"> _layoutTimelineRecordAdded: function(event)
</span><span class="cx"> {
</span><span class="cx"> var layoutTimelineRecord = event.data.record;
</span><del>- console.assert(layoutTimelineRecord instanceof WebInspector.LayoutTimelineRecord || layoutTimelineRecord instanceof WebInspector.RunLoopTimelineRecord);
</del><ins>+ console.assert(layoutTimelineRecord instanceof WebInspector.LayoutTimelineRecord);
</ins><span class="cx">
</span><span class="cx"> this._pendingRecords.push(layoutTimelineRecord);
</span><span class="cx">
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsRenderingFrameDetailsSidebarPaneljs"></a>
<div class="addfile"><h4>Added: trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameDetailsSidebarPanel.js (0 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameDetailsSidebarPanel.js (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameDetailsSidebarPanel.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -0,0 +1,189 @@
</span><ins>+/*
+ * Copyright (C) 2015 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WebInspector.RenderingFrameDetailsSidebarPanel = class RenderingFrameDetailsSidebarPanel extends WebInspector.DetailsSidebarPanel
+{
+ constructor()
+ {
+ super("rendering-frame-details", WebInspector.UIString("Frames"), WebInspector.UIString("Frames"), "Images/NavigationItemDoughnutChart.svg");
+
+ this._frameRangeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Frames"));
+ this._timeRangeRow = new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Time"));
+ var rangeGroup = new WebInspector.DetailsSectionGroup([this._frameRangeRow, this._timeRangeRow]);
+
+ function formatChartValue(value)
+ {
+ return Number.secondsToString(value);
+ }
+
+ this._chartRow = new WebInspector.ChartDetailsSectionRow(formatChartValue);
+ var chartGroup = new WebInspector.DetailsSectionGroup([this._chartRow]);
+
+ var rangeSection = new WebInspector.DetailsSection("rendering-frames-range", WebInspector.UIString("Selected Range"), [rangeGroup]);
+ var chartSection = new WebInspector.DetailsSection("rendering-frames-chart", WebInspector.UIString("Chart"), [chartGroup]);
+ var detailsSection = new WebInspector.DetailsSection("rendering-frames-details", WebInspector.UIString("Details"), [this._chartRow.legendGroup]);
+
+ this.contentElement.appendChild(rangeSection.element);
+ this.contentElement.appendChild(chartSection.element);
+ this.contentElement.appendChild(detailsSection.element);
+
+ this._renderingFrameTimeline = null;
+ this._startTime = 0;
+ this._endTime = 0;
+
+ this._emptyValuePlaceholderString = "\u2014";
+
+ this._chartColors = {
+ layout: "rgb(212, 108, 108)",
+ script: "rgb(153, 113, 185)",
+ other: "rgb(221, 221, 221)",
+ idle: "rgb(255, 255, 255)"
+ };
+ }
+
+ // Public
+
+ inspect(objects)
+ {
+ return !!this._renderingFrameTimeline;
+ }
+
+ updateRangeSelection(startTime, endTime)
+ {
+ if (this._startTime === startTime && this._endTime === endTime)
+ return;
+
+ this._startTime = startTime || 0;
+ this._endTime = endTime || 0;
+
+ this.needsRefresh();
+ }
+
+ get renderingFrameTimeline()
+ {
+ return this._renderingFrameTimeline;
+ }
+
+ set renderingFrameTimeline(renderingFrameTimeline)
+ {
+ if (renderingFrameTimeline === this._renderingFrameTimeline)
+ return;
+
+ if (this._renderingFrameTimeline) {
+ this._renderingFrameTimeline.removeEventListener(WebInspector.Timeline.Event.RecordAdded, this._recordAdded, this);
+ this._renderingFrameTimeline.removeEventListener(WebInspector.Timeline.Event.Reset, this._timelineReset, this);
+ }
+
+ this._renderingFrameTimeline = renderingFrameTimeline;
+
+ if (this._renderingFrameTimeline) {
+ this._renderingFrameTimeline.addEventListener(WebInspector.Timeline.Event.RecordAdded, this._recordAdded, this);
+ this._renderingFrameTimeline.addEventListener(WebInspector.Timeline.Event.Reset, this._timelineReset, this);
+ }
+
+ this.needsRefresh();
+ }
+
+ refresh()
+ {
+ var records = this._getSelectedRecords();
+ if (!records.length) {
+ this._resetAll();
+ return;
+ }
+
+ var firstRecord = records[0];
+ var lastRecord = records.lastValue;
+
+ this._frameRangeRow.label = records.length > 1 ? WebInspector.UIString("Frames") : WebInspector.UIString("Frame");
+ this._frameRangeRow.value = records.length > 1 ? WebInspector.UIString("%d – %d").format(firstRecord.frameNumber, lastRecord.frameNumber) : firstRecord.frameNumber;
+ this._timeRangeRow.value = WebInspector.UIString("%s – %s").format(Number.secondsToString(firstRecord.startTime), Number.secondsToString(lastRecord.endTime));
+
+ function durationForRecordType(type)
+ {
+ return records.reduce(function(previousValue, currentValue) {
+ return previousValue + (type ? currentValue.durationForRecords(type) : currentValue.durationRemainder);
+ }, 0);
+ }
+
+ var totalTime = lastRecord.endTime - firstRecord.startTime;
+ var layoutTime = durationForRecordType(WebInspector.TimelineRecord.Type.Layout);
+ var scriptTime = durationForRecordType(WebInspector.TimelineRecord.Type.Script);
+ var otherTime = durationForRecordType();
+ var idleTime = totalTime - layoutTime - scriptTime - otherTime;
+
+ this._chartRow.clearChart();
+
+ this._chartRow.addChartValue(WebInspector.UIString("Layout"), layoutTime, this._chartColors.layout);
+ this._chartRow.addChartValue(WebInspector.UIString("Script"), scriptTime, this._chartColors.script);
+ this._chartRow.addChartValue(WebInspector.UIString("Other"), otherTime, this._chartColors.other);
+ this._chartRow.addChartValue(WebInspector.UIString("Idle"), idleTime, this._chartColors.idle);
+
+ this._chartRow.innerLabel = Number.secondsToString(totalTime)
+ }
+
+ // Private
+
+ _resetAll()
+ {
+ this._frameRangeRow.value = this._emptyValuePlaceholderString;
+ this._timeRangeRow.value = this._emptyValuePlaceholderString;
+
+ this._chartRow.clearChart();
+ }
+
+ _recordAdded(event)
+ {
+ this.needsRefresh();
+ }
+
+ _timelineReset(event)
+ {
+ this.needsRefresh();
+ }
+
+ _getSelectedRecords()
+ {
+ if (!this._renderingFrameTimeline)
+ return [];
+
+ var records = [];
+ for (var record of this._renderingFrameTimeline.records) {
+ console.assert(record instanceof WebInspector.RenderingFrameTimelineRecord);
+ // If this frame is completely before the bounds of the graph, skip this record.
+ if (record.endTime < this._startTime)
+ continue;
+
+ // If this record is completely after the end time, break out now.
+ // Records are sorted, so all records after this will be beyond the end time too.
+ if (record.startTime > this._endTime)
+ break;
+
+ records.push(record);
+ }
+
+ return records;
+ }
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsRenderingFrameTimelineDataGridNodejsfromrev182659trunkSourceWebInspectorUIUserInterfaceViewsLayoutTimelineDataGridNodejs"></a>
<div class="copfile"><h4>Copied: trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineDataGridNode.js (from rev 182659, trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js) (0 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineDataGridNode.js (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineDataGridNode.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -0,0 +1,78 @@
</span><ins>+/*
+ * Copyright (C) 2015 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WebInspector.RenderingFrameTimelineDataGridNode = function(renderingFrameTimelineRecord, baseStartTime)
+{
+ WebInspector.TimelineDataGridNode.call(this, false, null);
+
+ this._record = renderingFrameTimelineRecord;
+ this._baseStartTime = baseStartTime || 0;
+};
+
+WebInspector.RenderingFrameTimelineDataGridNode.IconStyleClassName = "icon";
+WebInspector.RenderingFrameTimelineDataGridNode.SubtitleStyleClassName = "subtitle";
+
+WebInspector.RenderingFrameTimelineDataGridNode.prototype = {
+ constructor: WebInspector.RenderingFrameTimelineDataGridNode,
+ __proto__: WebInspector.TimelineDataGridNode.prototype,
+
+ // Public
+
+ get record()
+ {
+ return this._record;
+ },
+
+ get records()
+ {
+ return [this._record];
+ },
+
+ get data()
+ {
+ var layoutTime = this._record.durationForRecords(WebInspector.TimelineRecord.Type.Layout);
+ var scriptTime = this._record.durationForRecords(WebInspector.TimelineRecord.Type.Script);
+ return {startTime: this._record.startTime, layoutTime, scriptTime, otherTime: this._record.durationRemainder, totalTime: this._record.duration};
+ },
+
+ createCellContent: function(columnIdentifier, cell)
+ {
+ const emptyValuePlaceholderString = "\u2014";
+ var value = this.data[columnIdentifier];
+
+ switch (columnIdentifier) {
+ case "startTime":
+ return isNaN(value) ? emptyValuePlaceholderString : Number.secondsToString(value - this._baseStartTime, true);
+
+ case "layoutTime":
+ case "scriptTime":
+ case "otherTime":
+ case "totalTime":
+ return (isNaN(value) || value === 0) ? emptyValuePlaceholderString : Number.secondsToString(value, true);
+ }
+
+ return WebInspector.TimelineDataGridNode.prototype.createCellContent.call(this, columnIdentifier, cell);
+ }
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsRenderingFrameTimelineOverviewGraphcssfromrev182659trunkSourceWebInspectorUIUserInterfaceViewsRunLoopTimelineOverviewGraphcss"></a>
<div class="copfile"><h4>Copied: trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineOverviewGraph.css (from rev 182659, trunk/Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.css) (0 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineOverviewGraph.css (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineOverviewGraph.css 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -0,0 +1,43 @@
</span><ins>+/*
+ * Copyright (C) 2015 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+.timeline-overview-graph.rendering-frame > .divider {
+ position: absolute;
+ z-index: 10;
+
+ width: 100%;
+ height: 1px;
+
+ background-color: rgba(0, 0, 0, 0.075);
+ text-align: right;
+}
+
+.timeline-overview-graph.rendering-frame > .divider > .label {
+ padding: 2px;
+ font-family: Helvetica, sans-serif;
+ font-size: 8px;
+
+ color: rgb(155, 155, 155);
+}
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsRenderingFrameTimelineOverviewGraphjsfromrev182659trunkSourceWebInspectorUIUserInterfaceViewsRunLoopTimelineOverviewGraphjs"></a>
<div class="copfile"><h4>Copied: trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineOverviewGraph.js (from rev 182659, trunk/Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.js) (0 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineOverviewGraph.js (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineOverviewGraph.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -0,0 +1,165 @@
</span><ins>+/*
+ * Copyright (C) 2015 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WebInspector.RenderingFrameTimelineOverviewGraph = function(timeline)
+{
+ WebInspector.TimelineOverviewGraph.call(this, timeline);
+
+ this.element.classList.add(WebInspector.RenderingFrameTimelineOverviewGraph.StyleClassName);
+
+ this._renderingFrameTimeline = timeline;
+ this._timelineRecordFrames = [];
+ this._graphHeightSeconds = NaN;
+ this._framesPerSecondDividers = new Map;
+
+ this._renderingFrameTimeline.addEventListener(WebInspector.Timeline.Event.RecordAdded, this._timelineRecordAdded, this);
+
+ this.reset();
+};
+
+WebInspector.RenderingFrameTimelineOverviewGraph.StyleClassName = "rendering-frame";
+WebInspector.RenderingFrameTimelineOverviewGraph.MaximumGraphHeightSeconds = 0.05;
+WebInspector.RenderingFrameTimelineOverviewGraph.MinimumGraphHeightSeconds = 0.0185;
+
+WebInspector.RenderingFrameTimelineOverviewGraph.prototype = {
+ constructor: WebInspector.RenderingFrameTimelineOverviewGraph,
+ __proto__: WebInspector.TimelineOverviewGraph.prototype,
+
+ // Public
+
+ get graphHeightSeconds()
+ {
+ if (!isNaN(this._graphHeightSeconds))
+ return this._graphHeightSeconds;
+
+ var maximumFrameDuration = this._renderingFrameTimeline.records.reduce(function(previousValue, currentValue) {
+ return Math.max(previousValue, currentValue.duration);
+ }, 0);
+
+ this._graphHeightSeconds = maximumFrameDuration * 1.1; // Add 10% margin above frames.
+ this._graphHeightSeconds = Math.min(this._graphHeightSeconds, WebInspector.RenderingFrameTimelineOverviewGraph.MaximumGraphHeightSeconds);
+ this._graphHeightSeconds = Math.max(this._graphHeightSeconds, WebInspector.RenderingFrameTimelineOverviewGraph.MinimumGraphHeightSeconds);
+ return this._graphHeightSeconds;
+ },
+
+ reset()
+ {
+ WebInspector.TimelineOverviewGraph.prototype.reset.call(this);
+
+ this.element.removeChildren();
+
+ this._framesPerSecondDividers.clear();
+ },
+
+ updateLayout()
+ {
+ WebInspector.TimelineOverviewGraph.prototype.updateLayout.call(this);
+
+ if (!this._renderingFrameTimeline.records.length)
+ return;
+
+ var secondsPerPixel = this.timelineOverview.secondsPerPixel;
+ var recordFrameIndex = 0;
+
+ function createFrame(records)
+ {
+ var timelineRecordFrame = this._timelineRecordFrames[recordFrameIndex];
+ if (!timelineRecordFrame)
+ timelineRecordFrame = this._timelineRecordFrames[recordFrameIndex] = new WebInspector.TimelineRecordFrame(this, records);
+ else
+ timelineRecordFrame.records = records;
+
+ timelineRecordFrame.refresh(this);
+ if (!timelineRecordFrame.element.parentNode)
+ this.element.appendChild(timelineRecordFrame.element);
+ ++recordFrameIndex;
+ }
+
+ WebInspector.TimelineRecordFrame.createCombinedFrames(this._renderingFrameTimeline.records, secondsPerPixel, this, createFrame.bind(this));
+
+ // Remove the remaining unused TimelineRecordFrames.
+ for (; recordFrameIndex < this._timelineRecordFrames.length; ++recordFrameIndex) {
+ this._timelineRecordFrames[recordFrameIndex].records = null;
+ this._timelineRecordFrames[recordFrameIndex].element.remove();
+ }
+
+ this._updateDividers();
+ },
+
+ // Private
+
+ _timelineRecordAdded(event)
+ {
+ this._graphHeightSeconds = NaN;
+
+ this.needsLayout();
+ },
+
+ _updateDividers()
+ {
+ if (this.graphHeightSeconds === 0)
+ return;
+
+ var overviewGraphHeight = this.element.offsetHeight;
+
+ function createDividerAtPosition(framesPerSecond)
+ {
+ var secondsPerFrame = 1 / framesPerSecond;
+ var dividerTop = 1 - secondsPerFrame / this.graphHeightSeconds;
+ if (dividerTop < 0.01 || dividerTop >= 1)
+ return;
+
+ var divider = this._framesPerSecondDividers.get(framesPerSecond);
+ if (!divider) {
+ divider = document.createElement("div");
+ divider.classList.add("divider");
+
+ var label = document.createElement("div");
+ label.classList.add("label");
+ label.innerText = framesPerSecond + " fps";
+ divider.appendChild(label);
+
+ this.element.appendChild(divider);
+
+ this._framesPerSecondDividers.set(framesPerSecond, divider);
+ }
+
+ divider.style.marginTop = (dividerTop * overviewGraphHeight).toFixed(2) + "px";
+ }
+
+ createDividerAtPosition.call(this, 60);
+ createDividerAtPosition.call(this, 30);
+ },
+
+ _updateElementPosition(element, newPosition, property)
+ {
+ newPosition *= 100;
+ newPosition = newPosition.toFixed(2);
+
+ var currentPosition = parseFloat(element.style[property]).toFixed(2);
+ if (currentPosition !== newPosition)
+ element.style[property] = newPosition + "%";
+ }
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsRenderingFrameTimelineViewcssfromrev182659trunkSourceWebInspectorUIUserInterfaceViewsRunLoopTimelineOverviewGraphcss"></a>
<div class="copfile"><h4>Copied: trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineView.css (from rev 182659, trunk/Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.css) (0 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineView.css (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineView.css 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -0,0 +1,36 @@
</span><ins>+/*
+ * Copyright (C) 2015 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+.timeline-view.rendering-frame > .data-grid {
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+}
+
+.sidebar > .panel.navigation.timeline.timeline-recording-content-view-showing .navigation-sidebar-panel-content-tree-outline.rendering-frame .item .subtitle {
+ display: none;
+}
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsRenderingFrameTimelineViewjs"></a>
<div class="addfile"><h4>Added: trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineView.js (0 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineView.js (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineView.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -0,0 +1,234 @@
</span><ins>+/*
+ * Copyright (C) 2015 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WebInspector.RenderingFrameTimelineView = function(timeline)
+{
+ WebInspector.TimelineView.call(this, timeline);
+
+ console.assert(WebInspector.TimelineRecord.Type.RenderingFrame);
+
+ this.navigationSidebarTreeOutline.element.classList.add("rendering-frame");
+
+ var columns = {location: {}, startTime: {}, layoutTime: {}, scriptTime: {}, otherTime: {}, totalTime: {}};
+
+ columns.location.title = WebInspector.UIString("Location");
+
+ columns.startTime.title = WebInspector.UIString("Start Time");
+ columns.startTime.width = "15%";
+ columns.startTime.aligned = "right";
+
+ columns.layoutTime.title = WebInspector.UIString("Layout");
+ columns.layoutTime.width = "10%";
+ columns.layoutTime.aligned = "right";
+
+ columns.scriptTime.title = WebInspector.UIString("Script");
+ columns.scriptTime.width = "10%";
+ columns.scriptTime.aligned = "right";
+
+ columns.otherTime.title = WebInspector.UIString("Other");
+ columns.otherTime.width = "10%";
+ columns.otherTime.aligned = "right";
+
+ columns.totalTime.title = WebInspector.UIString("Total Time");
+ columns.totalTime.width = "15%";
+ columns.totalTime.aligned = "right";
+
+ for (var column in columns)
+ columns[column].sortable = true;
+
+ this._dataGrid = new WebInspector.TimelineDataGrid(this.navigationSidebarTreeOutline, columns, this);
+ this._dataGrid.addEventListener(WebInspector.DataGrid.Event.SelectedNodeChanged, this._dataGridNodeSelected, this);
+ this._dataGrid.sortColumnIdentifier = "startTime";
+ this._dataGrid.sortOrder = WebInspector.DataGrid.SortOrder.Ascending;
+
+ this.element.classList.add("rendering-frame");
+ this.element.appendChild(this._dataGrid.element);
+
+ timeline.addEventListener(WebInspector.Timeline.Event.RecordAdded, this._renderingFrameTimelineRecordAdded, this);
+
+ this._pendingRecords = [];
+};
+
+WebInspector.RenderingFrameTimelineView.prototype = {
+ constructor: WebInspector.RenderingFrameTimelineView,
+ __proto__: WebInspector.TimelineView.prototype,
+
+ // Public
+
+ get navigationSidebarTreeOutlineLabel()
+ {
+ return WebInspector.UIString("Records");
+ },
+
+ shown: function()
+ {
+ WebInspector.ContentView.prototype.shown.call(this);
+
+ WebInspector.renderingFrameDetailsSidebarPanel.renderingFrameTimeline = this.representedObject;
+
+ this._dataGrid.shown();
+ },
+
+ hidden: function()
+ {
+ WebInspector.renderingFrameDetailsSidebarPanel.renderingFrameTimeline = null;
+
+ this._dataGrid.hidden();
+
+ WebInspector.ContentView.prototype.hidden.call(this);
+ },
+
+ updateLayout: function()
+ {
+ WebInspector.TimelineView.prototype.updateLayout.call(this);
+
+ this._dataGrid.updateLayout();
+
+ this._processPendingRecords();
+ },
+
+ get selectionPathComponents()
+ {
+ var dataGridNode = this._dataGrid.selectedNode;
+ if (!dataGridNode)
+ return null;
+
+ var pathComponents = [];
+
+ while (dataGridNode && !dataGridNode.root) {
+ var treeElement = this._dataGrid.treeElementForDataGridNode(dataGridNode);
+ console.assert(treeElement);
+ if (!treeElement)
+ break;
+
+ if (treeElement.hidden)
+ return null;
+
+ var pathComponent = new WebInspector.GeneralTreeElementPathComponent(treeElement);
+ pathComponent.addEventListener(WebInspector.HierarchicalPathComponent.Event.SiblingWasSelected, this.treeElementPathComponentSelected, this);
+ pathComponents.unshift(pathComponent);
+ dataGridNode = dataGridNode.parent;
+ }
+
+ return pathComponents;
+ },
+
+ filterDidChange: function()
+ {
+ WebInspector.TimelineView.prototype.filterDidChange.call(this);
+ },
+
+ matchTreeElementAgainstCustomFilters: function(treeElement)
+ {
+ return this._dataGrid.treeElementMatchesActiveScopeFilters(treeElement);
+ },
+
+ reset: function()
+ {
+ WebInspector.TimelineView.prototype.reset.call(this);
+
+ this._dataGrid.reset();
+ },
+
+ // Protected
+
+ treeElementPathComponentSelected: function(event)
+ {
+ var dataGridNode = this._dataGrid.dataGridNodeForTreeElement(event.data.pathComponent.generalTreeElement);
+ if (!dataGridNode)
+ return;
+ dataGridNode.revealAndSelect();
+ },
+
+ dataGridNodeForTreeElement: function(treeElement)
+ {
+ if (treeElement instanceof WebInspector.ProfileNodeTreeElement)
+ return new WebInspector.ProfileNodeDataGridNode(treeElement.profileNode, this.zeroTime, this.startTime, this.endTime);
+ return null;
+ },
+
+ // Private
+
+ _processPendingRecords: function()
+ {
+ if (!this._pendingRecords.length)
+ return;
+
+ for (var renderingFrameTimelineRecord of this._pendingRecords) {
+ console.assert(renderingFrameTimelineRecord instanceof WebInspector.RenderingFrameTimelineRecord);
+
+ var treeElement = new WebInspector.TimelineRecordTreeElement(renderingFrameTimelineRecord);
+ var dataGridNode = new WebInspector.RenderingFrameTimelineDataGridNode(renderingFrameTimelineRecord, this.zeroTime);
+
+ this._dataGrid.addRowInSortOrder(treeElement, dataGridNode);
+
+ for (var childRecord of renderingFrameTimelineRecord.children) {
+ if (childRecord.type === WebInspector.TimelineRecord.Type.Layout) {
+ var layoutTreeElement = new WebInspector.TimelineRecordTreeElement(childRecord, WebInspector.SourceCodeLocation.NameStyle.Short);
+ var layoutDataGridNode = new WebInspector.LayoutTimelineDataGridNode(childRecord, this.zeroTime);
+
+ this._dataGrid.addRowInSortOrder(layoutTreeElement, layoutDataGridNode, treeElement);
+ } else if (childRecord.type === WebInspector.TimelineRecord.Type.Script) {
+ if (childRecord.profile) {
+ // FIXME: Support using the bottom-up tree once it is implemented.
+ rootNodes = childRecord.profile.topDownRootNodes;
+ }
+
+ var zeroTime = this.zeroTime;
+ var scriptTreeElement = new WebInspector.TimelineRecordTreeElement(childRecord, WebInspector.SourceCodeLocation.NameStyle.Short, rootNodes.length);
+ var scriptDataGridNode = new WebInspector.ScriptTimelineDataGridNode(childRecord, zeroTime);
+
+ this._dataGrid.addRowInSortOrder(scriptTreeElement, scriptDataGridNode, treeElement);
+
+ var startTime = this.startTime;
+ var endTime = this.endTime;
+
+ for (var profileNode of rootNodes) {
+ var profileNodeTreeElement = new WebInspector.ProfileNodeTreeElement(profileNode, this);
+ var profileNodeDataGridNode = new WebInspector.ProfileNodeDataGridNode(profileNode, zeroTime, startTime, endTime);
+ this._dataGrid.addRowInSortOrder(profileNodeTreeElement, profileNodeDataGridNode, scriptTreeElement);
+ }
+ }
+ }
+ }
+
+ this._pendingRecords = [];
+ },
+
+ _renderingFrameTimelineRecordAdded: function(event)
+ {
+ var renderingFrameTimelineRecord = event.data.record;
+ console.assert(renderingFrameTimelineRecord instanceof WebInspector.RenderingFrameTimelineRecord);
+
+ this._pendingRecords.push(renderingFrameTimelineRecord);
+
+ this.needsLayout();
+ },
+
+ _dataGridNodeSelected: function(event)
+ {
+ this.dispatchEventToListeners(WebInspector.ContentView.Event.SelectionPathComponentsDidChange);
+ }
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsRunLoopTimelineOverviewGraphcss"></a>
<div class="delfile"><h4>Deleted: trunk/Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.css (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.css 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.css 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -1,44 +0,0 @@
</span><del>-/*
- * Copyright (C) 2015 Apple Inc. All rights reserved.
- *
- * Redistribution and use in source and binary forms, with or without
- * modification, are permitted provided that the following conditions
- * are met:
- * 1. Redistributions of source code must retain the above copyright
- * notice, this list of conditions and the following disclaimer.
- * 2. Redistributions in binary form must reproduce the above copyright
- * notice, this list of conditions and the following disclaimer in the
- * documentation and/or other materials provided with the distribution.
- *
- * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
- * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
- * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
- * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
- * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
- * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
- * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
- * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
- * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
- * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
- * THE POSSIBILITY OF SUCH DAMAGE.
- */
-
-.timeline-overview-graph.runloop > .divider {
- position: absolute;
- z-index: 10;
-
- width: 100%;
- height: 1px;
-
- background-color: rgba(0, 0, 0, 0.05);
- text-align: right;
-}
-
-.timeline-overview-graph.runloop > .divider > span {
- padding-right: 1px;
-
- font-family: Helvetica, sans-serif;
- font-size: 8px;
-
- color: rgba(0, 0, 0, 0.2);
-}
</del><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsRunLoopTimelineOverviewGraphjs"></a>
<div class="delfile"><h4>Deleted: trunk/Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RunLoopTimelineOverviewGraph.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -1,160 +0,0 @@
</span><del>-/*
- * Copyright (C) 2015 Apple Inc. All rights reserved.
- *
- * Redistribution and use in source and binary forms, with or without
- * modification, are permitted provided that the following conditions
- * are met:
- * 1. Redistributions of source code must retain the above copyright
- * notice, this list of conditions and the following disclaimer.
- * 2. Redistributions in binary form must reproduce the above copyright
- * notice, this list of conditions and the following disclaimer in the
- * documentation and/or other materials provided with the distribution.
- *
- * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
- * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
- * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
- * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
- * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
- * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
- * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
- * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
- * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
- * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
- * THE POSSIBILITY OF SUCH DAMAGE.
- */
-
-WebInspector.RunLoopTimelineOverviewGraph = function(timeline)
-{
- WebInspector.TimelineOverviewGraph.call(this, timeline);
-
- this.element.classList.add(WebInspector.RunLoopTimelineOverviewGraph.StyleClassName);
-
- this._runLoopTimeline = timeline;
- this._timelineRecordFrames = [];
- this._graphHeightSeconds = NaN;
- this._framesPerSecondDividers = new Map;
-
- this._runLoopTimeline.addEventListener(WebInspector.Timeline.Event.RecordAdded, this._timelineRecordAdded, this);
-
- this.reset();
-};
-
-WebInspector.RunLoopTimelineOverviewGraph.StyleClassName = "runloop";
-WebInspector.RunLoopTimelineOverviewGraph.MaximumGraphHeightSeconds = 0.05;
-
-WebInspector.RunLoopTimelineOverviewGraph.prototype = {
- constructor: WebInspector.RunLoopTimelineOverviewGraph,
- __proto__: WebInspector.TimelineOverviewGraph.prototype,
-
- // Public
-
- get graphHeightSeconds()
- {
- if (!isNaN(this._graphHeightSeconds))
- return this._graphHeightSeconds;
-
- var maximumFrameDuration = this._runLoopTimeline.records.reduce(function(previousValue, currentValue) {
- return Math.max(previousValue, currentValue.duration);
- }, 0);
-
- this._graphHeightSeconds = maximumFrameDuration * 1.1; // Add 10% margin above frames.
- this._graphHeightSeconds = Math.min(this._graphHeightSeconds, WebInspector.RunLoopTimelineOverviewGraph.MaximumGraphHeightSeconds);
- return this._graphHeightSeconds;
- },
-
- reset()
- {
- WebInspector.TimelineOverviewGraph.prototype.reset.call(this);
-
- this.element.removeChildren();
-
- this._framesPerSecondDividers.clear();
- },
-
- updateLayout()
- {
- WebInspector.TimelineOverviewGraph.prototype.updateLayout.call(this);
-
- var secondsPerPixel = this.timelineOverview.secondsPerPixel;
-
- var recordFrameIndex = 0;
-
- function createFrame(records)
- {
- var timelineRecordFrame = this._timelineRecordFrames[recordFrameIndex];
- if (!timelineRecordFrame)
- timelineRecordFrame = this._timelineRecordFrames[recordFrameIndex] = new WebInspector.TimelineRecordFrame(this, records);
- else
- timelineRecordFrame.records = records;
-
- timelineRecordFrame.refresh(this);
- if (!timelineRecordFrame.element.parentNode)
- this.element.appendChild(timelineRecordFrame.element);
- ++recordFrameIndex;
- }
-
- WebInspector.TimelineRecordFrame.createCombinedFrames(this._runLoopTimeline.records, secondsPerPixel, this, createFrame.bind(this));
-
- // Remove the remaining unused TimelineRecordFrames.
- for (; recordFrameIndex < this._timelineRecordFrames.length; ++recordFrameIndex) {
- this._timelineRecordFrames[recordFrameIndex].records = null;
- this._timelineRecordFrames[recordFrameIndex].element.remove();
- }
-
- this._updateDividers();
- },
-
- // Private
-
- _timelineRecordAdded(event)
- {
- this._graphHeightSeconds = NaN;
-
- this.needsLayout();
- },
-
- _updateDividers()
- {
- if (this.graphHeightSeconds === 0)
- return;
-
- var overviewGraphHeight = this.element.offsetHeight;
-
- function createDividerAtPosition(framesPerSecond)
- {
- var secondsPerFrame = 1 / framesPerSecond;
- var dividerTop = 1 - secondsPerFrame / this.graphHeightSeconds;
- if (dividerTop < 0.01 || dividerTop >= 1)
- return;
-
- var divider = this._framesPerSecondDividers.get(framesPerSecond);
- if (!divider) {
- divider = document.createElement("div");
- divider.classList.add("divider");
-
- var label = document.createElement("span");
- label.innerText = framesPerSecond + " fps";
- divider.appendChild(label);
-
- this.element.appendChild(divider);
-
- this._framesPerSecondDividers.set(framesPerSecond, divider);
- }
-
- divider.style.marginTop = (dividerTop * overviewGraphHeight).toFixed(2) + "px";
- }
-
- createDividerAtPosition.call(this, 60);
- createDividerAtPosition.call(this, 30);
- },
-
- _updateElementPosition(element, newPosition, property)
- {
- newPosition *= 100;
- newPosition = newPosition.toFixed(2);
-
- var currentPosition = parseFloat(element.style[property]).toFixed(2);
- if (currentPosition !== newPosition)
- element.style[property] = newPosition + "%";
- }
-};
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsTimelineIconscss"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineIcons.css (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineIcons.css 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineIcons.css 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -63,11 +63,11 @@
</span><span class="cx"> content: -webkit-image-set(url(../Images/ScriptLarge.png) 1x, url(../Images/ScriptLarge@2x.png) 2x);
</span><span class="cx"> }
</span><span class="cx">
</span><del>-.runloop-icon .icon {
</del><ins>+.rendering-frame-icon .icon {
</ins><span class="cx"> content: -webkit-image-set(url(../Images/Frames.png) 1x, url(../Images/Frames@2x.png) 2x);
</span><span class="cx"> }
</span><span class="cx">
</span><del>-.runloop-icon.large .icon {
</del><ins>+.rendering-frame-icon.large .icon {
</ins><span class="cx"> content: -webkit-image-set(url(../Images/FramesLarge.png) 1x, url(../Images/FramesLarge@2x.png) 2x);
</span><span class="cx"> }
</span><span class="cx">
</span><span class="lines">@@ -91,8 +91,8 @@
</span><span class="cx"> content: url(../Images/TimelineRecordPaint.svg);
</span><span class="cx"> }
</span><span class="cx">
</span><del>-.runloop-record .icon {
- content: -webkit-image-set(url(../Images/Frames.png) 1x, url(../Images/Frames@2x.png) 2x);
</del><ins>+.rendering-frame-record .icon {
+ content: url(../Images/TimelineRecordRenderingFrame.svg);
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> .evaluated-record .icon {
</span><span class="lines">@@ -107,6 +107,10 @@
</span><span class="cx"> content: url(../Images/TimelineRecordProbeSampled.svg);
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+.runloop-record .icon {
+ width: 0 !important;
+}
+
</ins><span class="cx"> .console-profile-record .icon {
</span><span class="cx"> content: url(../Images/TimelineRecordConsoleProfile.svg);
</span><span class="cx"> }
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsTimelineOverviewjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -397,6 +397,9 @@
</span><span class="cx"> console.assert(timeline instanceof WebInspector.Timeline, timeline);
</span><span class="cx"> console.assert(!this._timelineOverviewGraphsMap.has(timeline), timeline);
</span><span class="cx">
</span><ins>+ if (!WebInspector.TimelineManager.shouldShowViewForTimeline(timeline))
+ return;
+
</ins><span class="cx"> var overviewGraph = new WebInspector.TimelineOverviewGraph(timeline);
</span><span class="cx"> overviewGraph.timelineOverview = this;
</span><span class="cx"> this._timelineOverviewGraphsMap.set(timeline, overviewGraph);
</span><span class="lines">@@ -407,6 +410,9 @@
</span><span class="cx"> {
</span><span class="cx"> var timeline = event.data.timeline;
</span><span class="cx"> console.assert(timeline instanceof WebInspector.Timeline, timeline);
</span><ins>+ if (!WebInspector.TimelineManager.shouldShowViewForTimeline(timeline))
+ return;
+
</ins><span class="cx"> console.assert(this._timelineOverviewGraphsMap.has(timeline), timeline);
</span><span class="cx">
</span><span class="cx"> var overviewGraph = this._timelineOverviewGraphsMap.take(timeline);
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsTimelineOverviewGraphjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverviewGraph.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverviewGraph.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverviewGraph.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -40,8 +40,8 @@
</span><span class="cx"> if (timelineType === WebInspector.TimelineRecord.Type.Script)
</span><span class="cx"> return new WebInspector.ScriptTimelineOverviewGraph(timeline);
</span><span class="cx">
</span><del>- if (timelineType === WebInspector.TimelineRecord.Type.RunLoop)
- return new WebInspector.RunLoopTimelineOverviewGraph(timeline);
</del><ins>+ if (timelineType === WebInspector.TimelineRecord.Type.RenderingFrame)
+ return new WebInspector.RenderingFrameTimelineOverviewGraph(timeline);
</ins><span class="cx">
</span><span class="cx"> throw Error("Can't make a graph for an unknown timeline.");
</span><span class="cx"> }
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsTimelineRecordFramecss"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordFrame.css (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordFrame.css 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordFrame.css 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -26,7 +26,7 @@
</span><span class="cx"> .timeline-record-frame {
</span><span class="cx"> position: absolute;
</span><span class="cx"> height: 36px;
</span><del>- min-width: 6px;
</del><ins>+ min-width: 4px;
</ins><span class="cx">
</span><span class="cx"> overflow: hidden;
</span><span class="cx">
</span><span class="lines">@@ -37,7 +37,7 @@
</span><span class="cx"> position: absolute;
</span><span class="cx"> z-index: 1;
</span><span class="cx"> bottom: 1px;
</span><del>- min-width: 6px;
</del><ins>+ min-width: 4px;
</ins><span class="cx">
</span><span class="cx"> box-sizing: border-box;
</span><span class="cx"> }
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsTimelineRecordFramejs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordFrame.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordFrame.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordFrame.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -40,7 +40,8 @@
</span><span class="cx">
</span><span class="cx"> WebInspector.TimelineRecordFrame.StyleClassName = "timeline-record-frame";
</span><span class="cx"> WebInspector.TimelineRecordFrame.SixtyFpsFrameBudget = 0.0166;
</span><del>-WebInspector.TimelineRecordFrame.MinimumWidthPixels = 6;
</del><ins>+WebInspector.TimelineRecordFrame.MaximumCombinedWidthPixels = 12;
+WebInspector.TimelineRecordFrame.MinimumWidthPixels = 4;
</ins><span class="cx"> WebInspector.TimelineRecordFrame.MinimumMarginPixels = 1;
</span><span class="cx">
</span><span class="cx"> WebInspector.TimelineRecordFrame.createCombinedFrames = function(records, secondsPerPixel, graphDataSource, createFrameCallback)
</span><span class="lines">@@ -73,6 +74,7 @@
</span><span class="cx"> if (!visibleRecords.length)
</span><span class="cx"> return;
</span><span class="cx">
</span><ins>+ var maximumCombinedFrameDuration = secondsPerPixel * WebInspector.TimelineRecordFrame.MaximumCombinedWidthPixels;
</ins><span class="cx"> var minimumFrameDuration = secondsPerPixel * WebInspector.TimelineRecordFrame.MinimumWidthPixels;
</span><span class="cx"> var minimumMargin = secondsPerPixel * WebInspector.TimelineRecordFrame.MinimumMarginPixels;
</span><span class="cx">
</span><span class="lines">@@ -80,15 +82,23 @@
</span><span class="cx"> var activeEndTime = NaN;
</span><span class="cx"> var activeRecords = [];
</span><span class="cx">
</span><ins>+ function createFrameFromActiveRecords()
+ {
+ createFrameCallback(activeRecords);
+ activeRecords = [];
+ activeStartTime = NaN;
+ activeEndTime = NaN;
+ }
+
</ins><span class="cx"> for (var record of visibleRecords) {
</span><span class="cx"> // Check if the previous record is far enough away to create the frame.
</span><del>- if (!isNaN(activeStartTime) && (activeStartTime + Math.max(activeEndTime - activeStartTime, minimumFrameDuration) + minimumMargin <= record.startTime)) {
- createFrameCallback(activeRecords);
- activeRecords = [];
- activeStartTime = NaN;
- activeEndTime = NaN;
- }
</del><ins>+ if (!isNaN(activeStartTime) && (activeStartTime + Math.max(activeEndTime - activeStartTime, minimumFrameDuration) + minimumMargin <= record.startTime))
+ createFrameFromActiveRecords();
</ins><span class="cx">
</span><ins>+ // Check if active records exceeds the maximum combined frame width.
+ if (!isNaN(activeStartTime) && (activeEndTime - activeStartTime) > maximumCombinedFrameDuration)
+ createFrameFromActiveRecords();
+
</ins><span class="cx"> // If this is a new frame, peg the start time.
</span><span class="cx"> if (isNaN(activeStartTime))
</span><span class="cx"> activeStartTime = record.startTime;
</span><span class="lines">@@ -169,7 +179,7 @@
</span><span class="cx"> var recordLeftPosition = (frameStartTime - graphStartTime) / graphDuration;
</span><span class="cx"> this._updateElementPosition(this._element, recordLeftPosition, "left");
</span><span class="cx">
</span><del>- var recordWidth = ((frameEndTime - graphStartTime) / graphDuration) - recordLeftPosition;
</del><ins>+ var recordWidth = (frameEndTime - frameStartTime) / graphDuration;
</ins><span class="cx"> this._updateElementPosition(this._element, recordWidth, "width");
</span><span class="cx">
</span><span class="cx"> this._updateChildElements(graphDataSource);
</span><span class="lines">@@ -212,6 +222,9 @@
</span><span class="cx"> return element;
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+ if (displayRecord.durationRemainder > 0)
+ frameElement.appendChild(createDurationElement.call(this, displayRecord.durationRemainder));
+
</ins><span class="cx"> for (var type in WebInspector.TimelineRecord.Type) {
</span><span class="cx"> var recordType = WebInspector.TimelineRecord.Type[type];
</span><span class="cx"> var duration = displayRecord.durationForRecords(recordType);
</span><span class="lines">@@ -220,9 +233,6 @@
</span><span class="cx"> frameElement.appendChild(createDurationElement.call(this, duration, recordType));
</span><span class="cx"> }
</span><span class="cx">
</span><del>- if (displayRecord.durationRemainder > 0)
- frameElement.appendChild(createDurationElement.call(this, displayRecord.durationRemainder));
-
</del><span class="cx"> // Add "includes-dropped" style class if multiple records are being combined in the frame,
</span><span class="cx"> // and one of those records exceeds the 60 fps frame budget.
</span><span class="cx"> if (this.records.length > 1 && displayRecord.duration > WebInspector.TimelineRecordFrame.SixtyFpsFrameBudget)
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsTimelineRecordTreeElementjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordTreeElement.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordTreeElement.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordTreeElement.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -100,9 +100,9 @@
</span><span class="cx">
</span><span class="cx"> break;
</span><span class="cx">
</span><del>- case WebInspector.TimelineRecord.Type.RunLoop:
- title = WebInspector.UIString("Runloop Executed");
- iconStyleClass = WebInspector.TimelineRecordTreeElement.RunLoopRecordIconStyleClass;
</del><ins>+ case WebInspector.TimelineRecord.Type.RenderingFrame:
+ title = WebInspector.UIString("Frame %d").format(timelineRecord.frameNumber);
+ iconStyleClass = WebInspector.TimelineRecordTreeElement.RenderingFrameRecordIconStyleClass;
</ins><span class="cx"> break;
</span><span class="cx">
</span><span class="cx"> default:
</span><span class="lines">@@ -152,7 +152,7 @@
</span><span class="cx"> WebInspector.TimelineRecordTreeElement.StyleRecordIconStyleClass = "style-record";
</span><span class="cx"> WebInspector.TimelineRecordTreeElement.LayoutRecordIconStyleClass = "layout-record";
</span><span class="cx"> WebInspector.TimelineRecordTreeElement.PaintRecordIconStyleClass = "paint-record";
</span><del>-WebInspector.TimelineRecordTreeElement.RunLoopRecordIconStyleClass = "runloop-record";
</del><ins>+WebInspector.TimelineRecordTreeElement.RenderingFrameRecordIconStyleClass = "rendering-frame-record";
</ins><span class="cx"> WebInspector.TimelineRecordTreeElement.EvaluatedRecordIconStyleClass = "evaluated-record";
</span><span class="cx"> WebInspector.TimelineRecordTreeElement.EventRecordIconStyleClass = "event-record";
</span><span class="cx"> WebInspector.TimelineRecordTreeElement.TimerRecordIconStyleClass = "timer-record";
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsTimelineRecordingContentViewjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordingContentView.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordingContentView.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordingContentView.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -494,6 +494,9 @@
</span><span class="cx"> timeline = timelineOrEvent.data.timeline;
</span><span class="cx">
</span><span class="cx"> console.assert(timeline instanceof WebInspector.Timeline, timeline);
</span><ins>+ if (!WebInspector.TimelineManager.shouldShowViewForTimeline(timeline))
+ return;
+
</ins><span class="cx"> console.assert(!this._timelineViewMap.has(timeline), timeline);
</span><span class="cx">
</span><span class="cx"> this._timelineViewMap.set(timeline, new WebInspector.ContentView(timeline));
</span><span class="lines">@@ -509,6 +512,9 @@
</span><span class="cx"> {
</span><span class="cx"> var timeline = event.data.timeline;
</span><span class="cx"> console.assert(timeline instanceof WebInspector.Timeline, timeline);
</span><ins>+ if (!WebInspector.TimelineManager.shouldShowViewForTimeline(timeline))
+ return;
+
</ins><span class="cx"> console.assert(this._timelineViewMap.has(timeline), timeline);
</span><span class="cx">
</span><span class="cx"> var timelineView = this._timelineViewMap.take(timeline);
</span><span class="lines">@@ -532,7 +538,7 @@
</span><span class="cx"> previousPathComponent = pathComponent;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- var timelineCount = this._recording.timelines.size;
</del><ins>+ var timelineCount = this._timelineViewMap.size;
</ins><span class="cx"> const timelineHeight = 36;
</span><span class="cx"> const extraOffset = 22;
</span><span class="cx"> this._timelineOverview.element.style.height = (timelineCount * timelineHeight + extraOffset) + "px";
</span><span class="lines">@@ -574,6 +580,8 @@
</span><span class="cx"> if (this.currentTimelineView) {
</span><span class="cx"> this.currentTimelineView.startTime = this._timelineOverview.selectionStartTime;
</span><span class="cx"> this.currentTimelineView.endTime = this._timelineOverview.selectionStartTime + this._timelineOverview.selectionDuration;
</span><ins>+
+ WebInspector.renderingFrameDetailsSidebarPanel.updateRangeSelection(this.currentTimelineView.startTime, this.currentTimelineView.endTime);
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> // Delay until the next frame to stay in sync with the current timeline view's time-based layout changes.
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsTimelineSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineSidebarPanel.js (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineSidebarPanel.js 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineSidebarPanel.js 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -437,6 +437,9 @@
</span><span class="cx"> timeline = timelineOrEvent.data.timeline;
</span><span class="cx">
</span><span class="cx"> console.assert(timeline instanceof WebInspector.Timeline, timeline);
</span><ins>+ if (!WebInspector.TimelineManager.shouldShowViewForTimeline(timeline))
+ return;
+
</ins><span class="cx"> console.assert(!this._timelineTreeElementMap.has(timeline), timeline);
</span><span class="cx">
</span><span class="cx"> var timelineTreeElement = new WebInspector.GeneralTreeElement([timeline.iconClassName, WebInspector.TimelineSidebarPanel.LargeIconStyleClass], timeline.displayName, null, timeline);
</span><span class="lines">@@ -456,6 +459,9 @@
</span><span class="cx"> {
</span><span class="cx"> var timeline = event.data.timeline;
</span><span class="cx"> console.assert(timeline instanceof WebInspector.Timeline, timeline);
</span><ins>+ if (!WebInspector.TimelineManager.shouldShowViewForTimeline(timeline))
+ return;
+
</ins><span class="cx"> console.assert(this._timelineTreeElementMap.has(timeline), timeline);
</span><span class="cx">
</span><span class="cx"> var timelineTreeElement = this._timelineTreeElementMap.take(timeline);
</span><span class="lines">@@ -482,7 +488,7 @@
</span><span class="cx"> var timelineHeight = 36;
</span><span class="cx"> var eventTitleBarOffset = 51;
</span><span class="cx"> var contentElementOffset = 74;
</span><del>- var timelineCount = this._displayedRecording.timelines.size;
</del><ins>+ var timelineCount = this._timelineTreeElementMap.size;
</ins><span class="cx"> this._timelinesContentContainerElement.style.height = (timelineHeight * timelineCount) + "px";
</span><span class="cx"> this._timelineEventsTitleBarElement.style.top = (timelineHeight * timelineCount + eventTitleBarOffset) + "px";
</span><span class="cx"> this.contentElement.style.top = (timelineHeight * timelineCount + contentElementOffset) + "px";
</span><span class="lines">@@ -614,7 +620,7 @@
</span><span class="cx"> WebInspector.TimelineSidebarPanel.NetworkIconStyleClass = "network-icon";
</span><span class="cx"> WebInspector.TimelineSidebarPanel.ColorsIconStyleClass = "colors-icon";
</span><span class="cx"> WebInspector.TimelineSidebarPanel.ScriptIconStyleClass = "script-icon";
</span><del>-WebInspector.TimelineSidebarPanel.RunLoopIconStyleClass = "runloop-icon";
</del><ins>+WebInspector.TimelineSidebarPanel.RenderingFrameIconStyleClass = "rendering-frame-icon";
</ins><span class="cx"> WebInspector.TimelineSidebarPanel.TimelineRecordingContentViewShowingStyleClass = "timeline-recording-content-view-showing";
</span><span class="cx">
</span><span class="cx"> WebInspector.TimelineSidebarPanel.ShowingTimelineRecordingContentViewCookieKey = "timeline-sidebar-panel-showing-timeline-recording-content-view";
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIWebInspectorUIvcxprojWebInspectorUIvcxproj"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/WebInspectorUI.vcxproj/WebInspectorUI.vcxproj (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/WebInspectorUI.vcxproj/WebInspectorUI.vcxproj 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/WebInspectorUI.vcxproj/WebInspectorUI.vcxproj 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -297,6 +297,9 @@
</span><span class="cx"> <None Include="..\UserInterface\CanvasProfileObject.js" />
</span><span class="cx"> <None Include="..\UserInterface\CanvasProfileType.js" />
</span><span class="cx"> <None Include="..\UserInterface\CanvasProfileView.js" />
</span><ins>+ <None Include="..\UserInterface\ChartDetailsSectionLegendRow.js" />
+ <None Include="..\UserInterface\ChartDetailsSectionRow.js" />
+ <None Include="..\UserInterface\ChartDetailsSectionRow.css" />
</ins><span class="cx"> <None Include="..\UserInterface\ClusterContentView.css" />
</span><span class="cx"> <None Include="..\UserInterface\ClusterContentView.js" />
</span><span class="cx"> <None Include="..\UserInterface\CodeMirrorAdditions.js" />
</span><span class="lines">@@ -563,6 +566,7 @@
</span><span class="cx"> <None Include="..\UserInterface\Images\NavigationItemBrushAndRuler.svg" />
</span><span class="cx"> <None Include="..\UserInterface\Images\NavigationItemBug.svg" />
</span><span class="cx"> <None Include="..\UserInterface\Images\NavigationItemCurleyBraces.svg" />
</span><ins>+ <None Include="..\UserInterface\Images\NavigationItemDoughnutChart.svg" />
</ins><span class="cx"> <None Include="..\UserInterface\Images\NavigationItemFile.svg" />
</span><span class="cx"> <None Include="..\UserInterface\Images\NavigationItemLayers.svg" />
</span><span class="cx"> <None Include="..\UserInterface\Images\NavigationItemLog.svg" />
</span><span class="lines">@@ -686,7 +690,6 @@
</span><span class="cx"> <None Include="..\UserInterface\LayerTreeObserver.js" />
</span><span class="cx"> <None Include="..\UserInterface\LayerTreeDetailsSidebarPanel.css" />
</span><span class="cx"> <None Include="..\UserInterface\LayerTreeDetailsSidebarPanel.js" />
</span><del>- <None Include="..\UserInterface\LayoutTimelineDataGrid.js" />
</del><span class="cx"> <None Include="..\UserInterface\LayoutTimelineDataGridNode.js" />
</span><span class="cx"> <None Include="..\UserInterface\LayoutTimelineRecord.js" />
</span><span class="cx"> <None Include="..\UserInterface\Legacy\6.0\InspectorBackendCommands.js" />
</span><span class="lines">@@ -734,6 +737,13 @@
</span><span class="cx"> <None Include="..\UserInterface\RadioButtonNavigationItem.css" />
</span><span class="cx"> <None Include="..\UserInterface\RadioButtonNavigationItem.js" />
</span><span class="cx"> <None Include="..\UserInterface\RemoteObject.js" />
</span><ins>+ <None Include="..\UserInterface\RenderingFrameDetailsSidebarPanel.js" />
+ <None Include="..\UserInterface\RenderingFrameTimeDataGridNode.js" />
+ <None Include="..\UserInterface\RenderingFrameTimelineOverviewGraph.css" />
+ <None Include="..\UserInterface\RenderingFrameTimelineOverviewGraph.js" />
+ <None Include="..\UserInterface\RenderingFrameTimelineRecord.js" />
+ <None Include="..\UserInterface\RenderingFrameTimelineView.css" />
+ <None Include="..\UserInterface\RenderingFrameTimelineView.js" />
</ins><span class="cx"> <None Include="..\UserInterface\Resource.js" />
</span><span class="cx"> <None Include="..\UserInterface\ResourceClusterContentView.js" />
</span><span class="cx"> <None Include="..\UserInterface\ResourceCollection.js" />
</span><span class="lines">@@ -750,9 +760,6 @@
</span><span class="cx"> <None Include="..\UserInterface\Revision.js" />
</span><span class="cx"> <None Include="..\UserInterface\RulesStyleDetailsPanel.css" />
</span><span class="cx"> <None Include="..\UserInterface\RulesStyleDetailsPanel.js" />
</span><del>- <None Include="..\UserInterface\RunLoopTimelineOverviewGraph.css" />
- <None Include="..\UserInterface\RunLoopTimelineOverviewGraph.js" />
- <None Include="..\UserInterface\RunLoopTimelineRecord.js" />
</del><span class="cx"> <None Include="..\UserInterface\RuntimeObserver.js" />
</span><span class="cx"> <None Include="..\UserInterface\ScopeBar.css" />
</span><span class="cx"> <None Include="..\UserInterface\ScopeBar.js" />
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIWebInspectorUIvcxprojWebInspectorUIvcxprojfilters"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/WebInspectorUI.vcxproj/WebInspectorUI.vcxproj.filters (182659 => 182660)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/WebInspectorUI.vcxproj/WebInspectorUI.vcxproj.filters 2015-04-11 18:25:49 UTC (rev 182659)
+++ trunk/Source/WebInspectorUI/WebInspectorUI.vcxproj/WebInspectorUI.vcxproj.filters 2015-04-11 19:36:39 UTC (rev 182660)
</span><span class="lines">@@ -141,6 +141,15 @@
</span><span class="cx"> <None Include="..\UserInterface\CanvasProfileView.js">
</span><span class="cx"> <Filter>UserInterface</Filter>
</span><span class="cx"> </None>
</span><ins>+ <None Include="..\UserInterface\ChartDetailsSectionLegendRow.js">
+ <Filter>UserInterface</Filter>
+ </None>
+ <None Include="..\UserInterface\ChartDetailsSectionRow.js">
+ <Filter>UserInterface</Filter>
+ </None>
+ <None Include="..\UserInterface\ChartDetailsSectionRow.css">
+ <Filter>UserInterface</Filter>
+ </None>
</ins><span class="cx"> <None Include="..\UserInterface\ClusterContentView.css">
</span><span class="cx"> <Filter>UserInterface</Filter>
</span><span class="cx"> </None>
</span><span class="lines">@@ -639,9 +648,6 @@
</span><span class="cx"> <None Include="..\UserInterface\LayerTreeDetailsSidebarPanel.js">
</span><span class="cx"> <Filter>UserInterface</Filter>
</span><span class="cx"> </None>
</span><del>- <None Include="..\UserInterface\LayoutTimelineDataGrid.js">
- <Filter>UserInterface</Filter>
- </None>
</del><span class="cx"> <None Include="..\UserInterface\LayoutTimelineDataGridNode.js">
</span><span class="cx"> <Filter>UserInterface</Filter>
</span><span class="cx"> </None>
</span><span class="lines">@@ -774,6 +780,27 @@
</span><span class="cx"> <None Include="..\UserInterface\RemoteObject.js">
</span><span class="cx"> <Filter>UserInterface</Filter>
</span><span class="cx"> </None>
</span><ins>+ <None Include="..\UserInterface\RenderingFrameDetailsSidebarPanel.js">
+ <Filter>UserInterface</Filter>
+ </None>
+ <None Include="..\UserInterface\RenderingFrameTimelineDataGridNode.js">
+ <Filter>UserInterface</Filter>
+ </None>
+ <None Include="..\UserInterface\RenderingFrameTimelineOverviewGraph.css">
+ <Filter>UserInterface</Filter>
+ </None>
+ <None Include="..\UserInterface\RenderingFrameTimelineOverviewGraph.js">
+ <Filter>UserInterface</Filter>
+ </None>
+ <None Include="..\UserInterface\RenderingFrameTimelineRecord.js">
+ <Filter>UserInterface</Filter>
+ </None>
+ <None Include="..\UserInterface\RenderingFrameTimelineView.css">
+ <Filter>UserInterface</Filter>
+ </None>
+ <None Include="..\UserInterface\RenderingFrameTimelineView.js">
+ <Filter>UserInterface</Filter>
+ </None>
</ins><span class="cx"> <None Include="..\UserInterface\Resource.js">
</span><span class="cx"> <Filter>UserInterface</Filter>
</span><span class="cx"> </None>
</span><span class="lines">@@ -822,15 +849,6 @@
</span><span class="cx"> <None Include="..\UserInterface\RulesStyleDetailsPanel.js">
</span><span class="cx"> <Filter>UserInterface</Filter>
</span><span class="cx"> </None>
</span><del>- <None Include="..\UserInterface\RunLoopTimelineOverviewGraph.css">
- <Filter>UserInterface</Filter>
- </None>
- <None Include="..\UserInterface\RunLoopTimelineOverviewGraph.js">
- <Filter>UserInterface</Filter>
- </None>
- <None Include="..\UserInterface\RunLoopTimelineRecord.js">
- <Filter>UserInterface</Filter>
- </None>
</del><span class="cx"> <None Include="..\UserInterface\RuntimeObserver.js">
</span><span class="cx"> <Filter>UserInterface</Filter>
</span><span class="cx"> </None>
</span><span class="lines">@@ -1422,6 +1440,9 @@
</span><span class="cx"> <None Include="..\UserInterface\Images\NavigationItemCurleyBraces.svg">
</span><span class="cx"> <Filter>Images</Filter>
</span><span class="cx"> </None>
</span><ins>+ <None Include="..\UserInterface\Images\NavigationItemDoughnutChart.svg">
+ <Filter>Images</Filter>
+ </None>
</ins><span class="cx"> <None Include="..\UserInterface\Images\NavigationItemFile.svg">
</span><span class="cx"> <Filter>Images</Filter>
</span><span class="cx"> </None>
</span></span></pre>
</div>
</div>
</body>
</html>