<!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>[162418] trunk/Source/WebInspectorUI</title>
</head>
<body>

<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt;  }
#msg dl a { font-weight: bold}
#msg dl a:link    { color:#fc3; }
#msg dl a:active  { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff  {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/162418">162418</a></dd>
<dt>Author</dt> <dd>timothy@apple.com</dd>
<dt>Date</dt> <dd>2014-01-20 18:56:17 -0800 (Mon, 20 Jan 2014)</dd>
</dl>

<h3>Log Message</h3>
<pre>Clean up Timelines code by using ES6 features and less global access of TimelineRecording.
Also don't recreate Timeline objects when TimelineRecording is reset, reset them instead.

https://bugs.webkit.org/show_bug.cgi?id=127157

Reviewed by Joseph Pecoraro.

* UserInterface/LayoutTimelineView.js:
(WebInspector.LayoutTimelineView.prototype.reset):
* UserInterface/NetworkTimeline.js:
(WebInspector.NetworkTimeline):
(WebInspector.NetworkTimeline.prototype.reset):
* UserInterface/NetworkTimelineView.js:
(WebInspector.NetworkTimelineView.prototype.reset):
* UserInterface/OverviewTimelineView.js:
(WebInspector.OverviewTimelineView.prototype._networkTimelineRecordAdded):
* UserInterface/ScriptTimelineView.js:
(WebInspector.ScriptTimelineView.prototype.reset):
* UserInterface/Timeline.js:
(WebInspector.Timeline):
(WebInspector.Timeline.prototype.reset):
* UserInterface/TimelineContentView.js:
(WebInspector.TimelineContentView.set createPathComponent):
(WebInspector.TimelineContentView.set var):
(WebInspector.TimelineContentView.prototype.showOverviewTimelineView):
(WebInspector.TimelineContentView.prototype.showTimelineView):
(WebInspector.TimelineContentView.prototype._showTimelineView):
(WebInspector.TimelineContentView.prototype._update):
(WebInspector.TimelineContentView.prototype._recordingReset):
* UserInterface/TimelineRecording.js:
(WebInspector.TimelineRecording.prototype.reset):</pre>

<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkSourceWebInspectorUIChangeLog">trunk/Source/WebInspectorUI/ChangeLog</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceLayoutTimelineViewjs">trunk/Source/WebInspectorUI/UserInterface/LayoutTimelineView.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceNetworkTimelinejs">trunk/Source/WebInspectorUI/UserInterface/NetworkTimeline.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceNetworkTimelineViewjs">trunk/Source/WebInspectorUI/UserInterface/NetworkTimelineView.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceOverviewTimelineViewjs">trunk/Source/WebInspectorUI/UserInterface/OverviewTimelineView.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceScriptTimelineViewjs">trunk/Source/WebInspectorUI/UserInterface/ScriptTimelineView.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceTimelinejs">trunk/Source/WebInspectorUI/UserInterface/Timeline.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceTimelineContentViewjs">trunk/Source/WebInspectorUI/UserInterface/TimelineContentView.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceTimelineRecordingjs">trunk/Source/WebInspectorUI/UserInterface/TimelineRecording.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceTimelineSidebarPaneljs">trunk/Source/WebInspectorUI/UserInterface/TimelineSidebarPanel.js</a></li>
</ul>

</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkSourceWebInspectorUIChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/ChangeLog (162417 => 162418)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/ChangeLog        2014-01-21 02:56:10 UTC (rev 162417)
+++ trunk/Source/WebInspectorUI/ChangeLog        2014-01-21 02:56:17 UTC (rev 162418)
</span><span class="lines">@@ -1,5 +1,39 @@
</span><span class="cx"> 2014-01-16  Timothy Hatcher  &lt;timothy@apple.com&gt;
</span><span class="cx"> 
</span><ins>+        Clean up Timelines code by using ES6 features and less global access of TimelineRecording.
+        Also don't recreate Timeline objects when TimelineRecording is reset, reset them instead.
+
+        https://bugs.webkit.org/show_bug.cgi?id=127157
+
+        Reviewed by Joseph Pecoraro.
+
+        * UserInterface/LayoutTimelineView.js:
+        (WebInspector.LayoutTimelineView.prototype.reset):
+        * UserInterface/NetworkTimeline.js:
+        (WebInspector.NetworkTimeline):
+        (WebInspector.NetworkTimeline.prototype.reset):
+        * UserInterface/NetworkTimelineView.js:
+        (WebInspector.NetworkTimelineView.prototype.reset):
+        * UserInterface/OverviewTimelineView.js:
+        (WebInspector.OverviewTimelineView.prototype._networkTimelineRecordAdded):
+        * UserInterface/ScriptTimelineView.js:
+        (WebInspector.ScriptTimelineView.prototype.reset):
+        * UserInterface/Timeline.js:
+        (WebInspector.Timeline):
+        (WebInspector.Timeline.prototype.reset):
+        * UserInterface/TimelineContentView.js:
+        (WebInspector.TimelineContentView.set createPathComponent):
+        (WebInspector.TimelineContentView.set var):
+        (WebInspector.TimelineContentView.prototype.showOverviewTimelineView):
+        (WebInspector.TimelineContentView.prototype.showTimelineView):
+        (WebInspector.TimelineContentView.prototype._showTimelineView):
+        (WebInspector.TimelineContentView.prototype._update):
+        (WebInspector.TimelineContentView.prototype._recordingReset):
+        * UserInterface/TimelineRecording.js:
+        (WebInspector.TimelineRecording.prototype.reset):
+
+2014-01-16  Timothy Hatcher  &lt;timothy@apple.com&gt;
+
</ins><span class="cx">         Improve WebInspector.TimelineOverview by not putting WebInspector.TimelineRuler in a scroll area.
</span><span class="cx"> 
</span><span class="cx">         https://bugs.webkit.org/show_bug.cgi?id=127145
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceLayoutTimelineViewjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/LayoutTimelineView.js (162417 => 162418)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/LayoutTimelineView.js        2014-01-21 02:56:10 UTC (rev 162417)
+++ trunk/Source/WebInspectorUI/UserInterface/LayoutTimelineView.js        2014-01-21 02:56:17 UTC (rev 162418)
</span><span class="lines">@@ -23,7 +23,7 @@
</span><span class="cx">  * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx">  */
</span><span class="cx"> 
</span><del>-WebInspector.LayoutTimelineView = function()
</del><ins>+WebInspector.LayoutTimelineView = function(recording)
</ins><span class="cx"> {
</span><span class="cx">     WebInspector.TimelineView.call(this);
</span><span class="cx"> 
</span><span class="lines">@@ -65,6 +65,9 @@
</span><span class="cx">     this.element.classList.add(WebInspector.LayoutTimelineView.StyleClassName);
</span><span class="cx">     this.element.appendChild(this._dataGrid.element);
</span><span class="cx"> 
</span><ins>+    var layoutTimeline = recording.timelines.get(WebInspector.TimelineRecord.Type.Layout);
+    layoutTimeline.addEventListener(WebInspector.Timeline.Event.RecordAdded, this._layoutTimelineRecordAdded, this);
+
</ins><span class="cx">     this._pendingRecords = [];
</span><span class="cx"> };
</span><span class="cx"> 
</span><span class="lines">@@ -115,14 +118,6 @@
</span><span class="cx">         WebInspector.TimelineView.prototype.reset.call(this);
</span><span class="cx"> 
</span><span class="cx">         this._dataGrid.reset();
</span><del>-
-        if (this._layoutTimeline)
-            this._layoutTimeline.removeEventListener(null, null, this);
-
-        this._layoutTimeline = WebInspector.timelineManager.recording.timelines.get(WebInspector.TimelineRecord.Type.Layout);
-        console.assert(this._layoutTimeline);
-
-        this._layoutTimeline.addEventListener(WebInspector.Timeline.Event.RecordAdded, this._layoutTimelineRecordAdded, this);
</del><span class="cx">     },
</span><span class="cx"> 
</span><span class="cx">     // Private
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceNetworkTimelinejs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/NetworkTimeline.js (162417 => 162418)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/NetworkTimeline.js        2014-01-21 02:56:10 UTC (rev 162417)
+++ trunk/Source/WebInspectorUI/UserInterface/NetworkTimeline.js        2014-01-21 02:56:17 UTC (rev 162418)
</span><span class="lines">@@ -26,8 +26,6 @@
</span><span class="cx"> WebInspector.NetworkTimeline = function()
</span><span class="cx"> {
</span><span class="cx">     WebInspector.Timeline.call(this);
</span><del>-
-    this._resourceRecordMap = new Map;
</del><span class="cx"> };
</span><span class="cx"> 
</span><span class="cx"> WebInspector.NetworkTimeline.prototype = {
</span><span class="lines">@@ -43,6 +41,13 @@
</span><span class="cx">         return this._resourceRecordMap.get(resource) || null;
</span><span class="cx">     },
</span><span class="cx"> 
</span><ins>+    reset: function(suppressEvents)
+    {
+        this._resourceRecordMap = new Map;
+
+        WebInspector.Timeline.prototype.reset.call(this, suppressEvents);
+    },
+
</ins><span class="cx">     addRecord: function(record)
</span><span class="cx">     {
</span><span class="cx">         console.assert(record instanceof WebInspector.ResourceTimelineRecord);
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceNetworkTimelineViewjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/NetworkTimelineView.js (162417 => 162418)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/NetworkTimelineView.js        2014-01-21 02:56:10 UTC (rev 162417)
+++ trunk/Source/WebInspectorUI/UserInterface/NetworkTimelineView.js        2014-01-21 02:56:17 UTC (rev 162418)
</span><span class="lines">@@ -23,7 +23,7 @@
</span><span class="cx">  * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx">  */
</span><span class="cx"> 
</span><del>-WebInspector.NetworkTimelineView = function()
</del><ins>+WebInspector.NetworkTimelineView = function(recording)
</ins><span class="cx"> {
</span><span class="cx">     WebInspector.TimelineView.call(this);
</span><span class="cx"> 
</span><span class="lines">@@ -82,6 +82,9 @@
</span><span class="cx">     this.element.classList.add(WebInspector.NetworkTimelineView.StyleClassName);
</span><span class="cx">     this.element.appendChild(this._dataGrid.element);
</span><span class="cx"> 
</span><ins>+    var networkTimeline = recording.timelines.get(WebInspector.TimelineRecord.Type.Network);
+    networkTimeline.addEventListener(WebInspector.Timeline.Event.RecordAdded, this._networkTimelineRecordAdded, this);
+
</ins><span class="cx">     this._pendingRecords = [];
</span><span class="cx"> };
</span><span class="cx"> 
</span><span class="lines">@@ -132,14 +135,6 @@
</span><span class="cx">         WebInspector.TimelineView.prototype.reset.call(this);
</span><span class="cx"> 
</span><span class="cx">         this._dataGrid.reset();
</span><del>-
-        if (this._networkTimeline)
-            this._networkTimeline.removeEventListener(null, null, this);
-
-        this._networkTimeline = WebInspector.timelineManager.recording.timelines.get(WebInspector.TimelineRecord.Type.Network);
-        console.assert(this._networkTimeline);
-
-        this._networkTimeline.addEventListener(WebInspector.Timeline.Event.RecordAdded, this._networkTimelineRecordAdded, this);
</del><span class="cx">     },
</span><span class="cx"> 
</span><span class="cx">     // Private
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceOverviewTimelineViewjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/OverviewTimelineView.js (162417 => 162418)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/OverviewTimelineView.js        2014-01-21 02:56:10 UTC (rev 162417)
+++ trunk/Source/WebInspectorUI/UserInterface/OverviewTimelineView.js        2014-01-21 02:56:17 UTC (rev 162418)
</span><span class="lines">@@ -23,10 +23,12 @@
</span><span class="cx">  * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx">  */
</span><span class="cx"> 
</span><del>-WebInspector.OverviewTimelineView = function()
</del><ins>+WebInspector.OverviewTimelineView = function(recording)
</ins><span class="cx"> {
</span><span class="cx">     WebInspector.TimelineView.call(this);
</span><span class="cx"> 
</span><ins>+    this._recording = recording;
+
</ins><span class="cx">     this.navigationSidebarTreeOutline.onselect = this._treeElementSelected.bind(this);
</span><span class="cx"> 
</span><span class="cx">     var columns = {&quot;graph&quot;: {width: &quot;100%&quot;}};
</span><span class="lines">@@ -44,9 +46,12 @@
</span><span class="cx">     this.element.classList.add(WebInspector.OverviewTimelineView.StyleClassName);
</span><span class="cx">     this.element.appendChild(this._dataGrid.element);
</span><span class="cx"> 
</span><del>-    this._pendingRepresentedObjects = [];
</del><ins>+    this._networkTimeline = recording.timelines.get(WebInspector.TimelineRecord.Type.Network);
+    this._networkTimeline.addEventListener(WebInspector.Timeline.Event.RecordAdded, this._networkTimelineRecordAdded, this);
</ins><span class="cx"> 
</span><del>-    WebInspector.timelineManager.recording.addEventListener(WebInspector.TimelineRecording.Event.SourceCodeTimelineAdded, this._sourceCodeTimelineAdded, this);
</del><ins>+    recording.addEventListener(WebInspector.TimelineRecording.Event.SourceCodeTimelineAdded, this._sourceCodeTimelineAdded, this);
+
+    this._pendingRepresentedObjects = [];
</ins><span class="cx"> };
</span><span class="cx"> 
</span><span class="cx"> WebInspector.OverviewTimelineView.StyleClassName = &quot;overview&quot;;
</span><span class="lines">@@ -62,16 +67,6 @@
</span><span class="cx">         return WebInspector.UIString(&quot;Timeline Events&quot;);
</span><span class="cx">     },
</span><span class="cx"> 
</span><del>-    reset: function()
-    {
-        WebInspector.TimelineView.prototype.reset.call(this);
-
-        this._networkTimeline = WebInspector.timelineManager.recording.timelines.get(WebInspector.TimelineRecord.Type.Network);
-        console.assert(this._networkTimeline);
-
-        this._networkTimeline.addEventListener(WebInspector.Timeline.Event.RecordAdded, this._networkTimelineRecordAdded, this);
-    },
-
</del><span class="cx">     shown: function()
</span><span class="cx">     {
</span><span class="cx">         WebInspector.TimelineView.prototype.shown.call(this);
</span><span class="lines">@@ -256,7 +251,7 @@
</span><span class="cx">         this.needsLayout();
</span><span class="cx"> 
</span><span class="cx">         // We don't expect to have any source code timelines yet. Those should be added with _sourceCodeTimelineAdded.
</span><del>-        console.assert(!WebInspector.timelineManager.recording.sourceCodeTimelinesForSourceCode(resourceTimelineRecord.resource).length);
</del><ins>+        console.assert(!this._recording.sourceCodeTimelinesForSourceCode(resourceTimelineRecord.resource).length);
</ins><span class="cx">     },
</span><span class="cx"> 
</span><span class="cx">     _sourceCodeTimelineAdded: function(event)
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceScriptTimelineViewjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/ScriptTimelineView.js (162417 => 162418)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/ScriptTimelineView.js        2014-01-21 02:56:10 UTC (rev 162417)
+++ trunk/Source/WebInspectorUI/UserInterface/ScriptTimelineView.js        2014-01-21 02:56:17 UTC (rev 162418)
</span><span class="lines">@@ -23,7 +23,7 @@
</span><span class="cx">  * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx">  */
</span><span class="cx"> 
</span><del>-WebInspector.ScriptTimelineView = function()
</del><ins>+WebInspector.ScriptTimelineView = function(recording)
</ins><span class="cx"> {
</span><span class="cx">     WebInspector.TimelineView.call(this);
</span><span class="cx"> 
</span><span class="lines">@@ -62,6 +62,9 @@
</span><span class="cx">     this.element.classList.add(WebInspector.ScriptTimelineView.StyleClassName);
</span><span class="cx">     this.element.appendChild(this._dataGrid.element);
</span><span class="cx"> 
</span><ins>+    var scriptTimeline = recording.timelines.get(WebInspector.TimelineRecord.Type.Script);
+    scriptTimeline.addEventListener(WebInspector.Timeline.Event.RecordAdded, this._scriptTimelineRecordAdded, this);
+
</ins><span class="cx">     this._pendingRecords = [];
</span><span class="cx"> };
</span><span class="cx"> 
</span><span class="lines">@@ -112,14 +115,6 @@
</span><span class="cx">         WebInspector.TimelineView.prototype.reset.call(this);
</span><span class="cx"> 
</span><span class="cx">         this._dataGrid.reset();
</span><del>-
-        if (this._scriptTimeline)
-            this._scriptTimeline.removeEventListener(null, null, this);
-
-        this._scriptTimeline = WebInspector.timelineManager.recording.timelines.get(WebInspector.TimelineRecord.Type.Script);
-        console.assert(this._scriptTimeline);
-
-        this._scriptTimeline.addEventListener(WebInspector.Timeline.Event.RecordAdded, this._scriptTimelineRecordAdded, this);
</del><span class="cx">     },
</span><span class="cx"> 
</span><span class="cx">     // Private
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceTimelinejs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Timeline.js (162417 => 162418)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Timeline.js        2014-01-21 02:56:10 UTC (rev 162417)
+++ trunk/Source/WebInspectorUI/UserInterface/Timeline.js        2014-01-21 02:56:17 UTC (rev 162418)
</span><span class="lines">@@ -27,12 +27,11 @@
</span><span class="cx"> {
</span><span class="cx">     WebInspector.Object.call(this);
</span><span class="cx"> 
</span><del>-    this._records = [];
-    this._startTime = NaN;
-    this._endTime = NaN;
</del><ins>+    this.reset(true);
</ins><span class="cx"> };
</span><span class="cx"> 
</span><span class="cx"> WebInspector.Timeline.Event = {
</span><ins>+    Reset: &quot;timeline-reset&quot;,
</ins><span class="cx">     RecordAdded: &quot;timeline-record-added&quot;,
</span><span class="cx">     TimesUpdated: &quot;timeline-times-updated&quot;
</span><span class="cx"> };
</span><span class="lines">@@ -58,6 +57,18 @@
</span><span class="cx">         return this._records;
</span><span class="cx">     },
</span><span class="cx"> 
</span><ins>+    reset: function(suppressEvents)
+    {
+        this._records = [];
+        this._startTime = NaN;
+        this._endTime = NaN;
+
+        if (!suppressEvents) {
+            this.dispatchEventToListeners(WebInspector.Timeline.Event.Reset);
+            this.dispatchEventToListeners(WebInspector.Timeline.Event.TimesUpdated);
+        }
+    },
+
</ins><span class="cx">     addRecord: function(record)
</span><span class="cx">     {
</span><span class="cx">         if (record.updatesDynamically)
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceTimelineContentViewjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/TimelineContentView.js (162417 => 162418)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/TimelineContentView.js        2014-01-21 02:56:10 UTC (rev 162417)
+++ trunk/Source/WebInspectorUI/UserInterface/TimelineContentView.js        2014-01-21 02:56:17 UTC (rev 162418)
</span><span class="lines">@@ -27,6 +27,8 @@
</span><span class="cx"> {
</span><span class="cx">     WebInspector.ContentView.call(this, recording);
</span><span class="cx"> 
</span><ins>+    this._recording = recording;
+
</ins><span class="cx">     this.element.classList.add(WebInspector.TimelineContentView.StyleClassName);
</span><span class="cx"> 
</span><span class="cx">     this._timelineOverview = new WebInspector.TimelineOverview;
</span><span class="lines">@@ -40,13 +42,13 @@
</span><span class="cx">     this._viewContainer.classList.add(WebInspector.TimelineContentView.ViewContainerStyleClassName);
</span><span class="cx">     this.element.appendChild(this._viewContainer);
</span><span class="cx"> 
</span><del>-    this._overviewTimelineView = new WebInspector.OverviewTimelineView;
-    this._discreteTimelineViewMap = {
-        [WebInspector.TimelineRecord.Type.Network]: new WebInspector.NetworkTimelineView,
-        [WebInspector.TimelineRecord.Type.Layout]: new WebInspector.LayoutTimelineView,
-        [WebInspector.TimelineRecord.Type.Script]: new WebInspector.ScriptTimelineView
-    };
</del><ins>+    this._overviewTimelineView = new WebInspector.OverviewTimelineView(recording);
</ins><span class="cx"> 
</span><ins>+    this._discreteTimelineViewMap = new Map;
+    this._discreteTimelineViewMap.set(WebInspector.TimelineRecord.Type.Network, new WebInspector.NetworkTimelineView(recording));
+    this._discreteTimelineViewMap.set(WebInspector.TimelineRecord.Type.Layout, new WebInspector.LayoutTimelineView(recording));
+    this._discreteTimelineViewMap.set(WebInspector.TimelineRecord.Type.Script, new WebInspector.ScriptTimelineView(recording));
+
</ins><span class="cx">     function createPathComponent(displayName, className, representedObject)
</span><span class="cx">     {
</span><span class="cx">         var pathComponent = new WebInspector.HierarchicalPathComponent(displayName, className, representedObject);
</span><span class="lines">@@ -54,20 +56,20 @@
</span><span class="cx">         return pathComponent;
</span><span class="cx">     }
</span><span class="cx"> 
</span><del>-    var networkPathComponent = createPathComponent.call(this, WebInspector.UIString(&quot;Network Requests&quot;), WebInspector.TimelineSidebarPanel.NetworkIconStyleClass, WebInspector.TimelineRecord.Type.Network);
-    var layoutPathComponent = createPathComponent.call(this, WebInspector.UIString(&quot;Layout &amp; Rendering&quot;), WebInspector.TimelineSidebarPanel.ColorsIconStyleClass, WebInspector.TimelineRecord.Type.Layout);
-    var scriptPathComponent = createPathComponent.call(this, WebInspector.UIString(&quot;JavaScript &amp; Events&quot;), WebInspector.TimelineSidebarPanel.ScriptIconStyleClass, WebInspector.TimelineRecord.Type.Script);
</del><ins>+    this._pathComponentMap = new Map;
+    this._pathComponentMap.set(WebInspector.TimelineRecord.Type.Network, createPathComponent.call(this, WebInspector.UIString(&quot;Network Requests&quot;), WebInspector.TimelineSidebarPanel.NetworkIconStyleClass, WebInspector.TimelineRecord.Type.Network));
+    this._pathComponentMap.set(WebInspector.TimelineRecord.Type.Layout, createPathComponent.call(this, WebInspector.UIString(&quot;Layout &amp; Rendering&quot;), WebInspector.TimelineSidebarPanel.ColorsIconStyleClass, WebInspector.TimelineRecord.Type.Layout));
+    this._pathComponentMap.set(WebInspector.TimelineRecord.Type.Script, createPathComponent.call(this, WebInspector.UIString(&quot;JavaScript &amp; Events&quot;), WebInspector.TimelineSidebarPanel.ScriptIconStyleClass, WebInspector.TimelineRecord.Type.Script));
</ins><span class="cx"> 
</span><del>-    networkPathComponent.nextSibling = layoutPathComponent;
-    layoutPathComponent.previousSibling = networkPathComponent;
-    layoutPathComponent.nextSibling = scriptPathComponent;
-    scriptPathComponent.previousSibling = layoutPathComponent;
</del><ins>+    var previousPathComponent = null;
+    for (var pathComponent of this._pathComponentMap.values()) {
+        if (previousPathComponent) {
+            previousPathComponent.nextSibling = pathComponent;
+            pathComponent.previousSibling = previousPathComponent;
+        }
</ins><span class="cx"> 
</span><del>-    this._pathComponentMap = {
-        [WebInspector.TimelineRecord.Type.Network]: networkPathComponent,
-        [WebInspector.TimelineRecord.Type.Layout]: layoutPathComponent,
-        [WebInspector.TimelineRecord.Type.Script]: scriptPathComponent
-    };
</del><ins>+        previousPathComponent = pathComponent;
+    }
</ins><span class="cx"> 
</span><span class="cx">     this._currentTimelineView = null;
</span><span class="cx">     this._currentTimelineViewIdentifier = null;
</span><span class="lines">@@ -75,7 +77,8 @@
</span><span class="cx">     this._updating = false;
</span><span class="cx">     this._lastUpdateTimestamp = NaN;
</span><span class="cx"> 
</span><del>-    WebInspector.timelineManager.recording.addEventListener(WebInspector.TimelineRecording.Event.Reset, this._recordingReset, this);
</del><ins>+    recording.addEventListener(WebInspector.TimelineRecording.Event.Reset, this._recordingReset, this);
+
</ins><span class="cx">     WebInspector.timelineManager.addEventListener(WebInspector.TimelineManager.Event.RecordingStarted, this._recordingStarted, this);
</span><span class="cx">     WebInspector.timelineManager.addEventListener(WebInspector.TimelineManager.Event.RecordingStopped, this._recordingStopped, this);
</span><span class="cx"> 
</span><span class="lines">@@ -98,11 +101,11 @@
</span><span class="cx"> 
</span><span class="cx">     showTimelineView: function(identifier)
</span><span class="cx">     {
</span><del>-        console.assert(identifier in this._discreteTimelineViewMap);
-        if (!(identifier in this._discreteTimelineViewMap))
</del><ins>+        console.assert(this._discreteTimelineViewMap.has(identifier));
+        if (!this._discreteTimelineViewMap.has(identifier))
</ins><span class="cx">             return;
</span><span class="cx"> 
</span><del>-        this._showTimelineView(this._discreteTimelineViewMap[identifier], identifier);
</del><ins>+        this._showTimelineView(this._discreteTimelineViewMap.get(identifier), identifier);
</ins><span class="cx">     },
</span><span class="cx"> 
</span><span class="cx">     get allowedNavigationSidebarPanels()
</span><span class="lines">@@ -120,7 +123,7 @@
</span><span class="cx">     {
</span><span class="cx">         if (!this._currentTimelineViewIdentifier)
</span><span class="cx">             return [];
</span><del>-        return [this._pathComponentMap[this._currentTimelineViewIdentifier]];
</del><ins>+        return [this._pathComponentMap.get(this._currentTimelineViewIdentifier)];
</ins><span class="cx">     },
</span><span class="cx"> 
</span><span class="cx">     shown: function()
</span><span class="lines">@@ -156,7 +159,7 @@
</span><span class="cx"> 
</span><span class="cx">         var startTime = this._timelineOverview.selectionStartTime;
</span><span class="cx">         var endTime = this._timelineOverview.selectionStartTime + this._timelineOverview.selectionDuration;
</span><del>-        var currentTime = this._currentTimeMarker.time || WebInspector.timelineManager.recording.startTime;
</del><ins>+        var currentTime = this._currentTimeMarker.time || this._recording.startTime;
</ins><span class="cx"> 
</span><span class="cx">         function checkTimeBounds(itemStartTime, itemEndTime)
</span><span class="cx">         {
</span><span class="lines">@@ -236,9 +239,9 @@
</span><span class="cx"> 
</span><span class="cx">     _update: function(timestamp)
</span><span class="cx">     {
</span><del>-        var startTime = WebInspector.timelineManager.recording.startTime;
</del><ins>+        var startTime = this._recording.startTime;
</ins><span class="cx">         var currentTime = this._currentTimeMarker.time || startTime;
</span><del>-        var endTime = WebInspector.timelineManager.recording.endTime;
</del><ins>+        var endTime = this._recording.endTime;
</ins><span class="cx">         var timespanSinceLastUpdate = (timestamp - this._lastUpdateTimestamp) / 1000 || 0;
</span><span class="cx"> 
</span><span class="cx">         currentTime += timespanSinceLastUpdate;
</span><span class="lines">@@ -250,8 +253,8 @@
</span><span class="cx">             this._timelineOverview.selectionStartTime = startTime + selectionOffset;
</span><span class="cx"> 
</span><span class="cx">             this._overviewTimelineView.zeroTime = startTime;
</span><del>-            for (var identifier in this._discreteTimelineViewMap)
-                this._discreteTimelineViewMap[identifier].zeroTime = startTime;
</del><ins>+            for (var timelineView of this._discreteTimelineViewMap.values())
+                timelineView.zeroTime = startTime;
</ins><span class="cx"> 
</span><span class="cx">             delete this._startTimeNeedsReset;
</span><span class="cx">         }
</span><span class="lines">@@ -314,8 +317,8 @@
</span><span class="cx">         this._currentTimeMarker.time = 0;
</span><span class="cx"> 
</span><span class="cx">         this._overviewTimelineView.reset();
</span><del>-        for (var identifier in this._discreteTimelineViewMap)
-            this._discreteTimelineViewMap[identifier].reset();
</del><ins>+        for (var timelineView of this._discreteTimelineViewMap.values())
+            timelineView.reset();
</ins><span class="cx">     },
</span><span class="cx"> 
</span><span class="cx">     _timeRangeSelectionChanged: function(event)
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceTimelineRecordingjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/TimelineRecording.js (162417 => 162418)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/TimelineRecording.js        2014-01-21 02:56:10 UTC (rev 162417)
+++ trunk/Source/WebInspectorUI/UserInterface/TimelineRecording.js        2014-01-21 02:56:17 UTC (rev 162418)
</span><span class="lines">@@ -27,6 +27,14 @@
</span><span class="cx"> {
</span><span class="cx">     WebInspector.Object.call(this);
</span><span class="cx"> 
</span><ins>+    this._timelines = new Map;
+    this._timelines.set(WebInspector.TimelineRecord.Type.Network, new WebInspector.NetworkTimeline);
+    this._timelines.set(WebInspector.TimelineRecord.Type.Script, new WebInspector.Timeline);
+    this._timelines.set(WebInspector.TimelineRecord.Type.Layout, new WebInspector.Timeline);
+
+    for (var timeline of this._timelines.values())
+        timeline.addEventListener(WebInspector.Timeline.Event.TimesUpdated, this._timelineTimesUpdated, this);
+
</ins><span class="cx">     this.reset(true);
</span><span class="cx"> };
</span><span class="cx"> 
</span><span class="lines">@@ -57,30 +65,20 @@
</span><span class="cx">         return this._endTime;
</span><span class="cx">     },
</span><span class="cx"> 
</span><del>-    reset: function(newObject)
</del><ins>+    reset: function(suppressEvents)
</ins><span class="cx">     {
</span><del>-        if (this._timelines) {
-            this._timelines.forEach(function(timeline) {
-                timeline.removeEventListener(null, null, this);
-            }, this);
-        }
-
-        this._timelines = new Map;
-        this._timelines.set(WebInspector.TimelineRecord.Type.Network, new WebInspector.NetworkTimeline);
-        this._timelines.set(WebInspector.TimelineRecord.Type.Script, new WebInspector.Timeline);
-        this._timelines.set(WebInspector.TimelineRecord.Type.Layout, new WebInspector.Timeline);
-
-        this._timelines.forEach(function(timeline) {
-            timeline.addEventListener(WebInspector.Timeline.Event.TimesUpdated, this._timelineTimesUpdated, this);
-        }, this);
-
</del><span class="cx">         this._sourceCodeTimelinesMap = new Map;
</span><span class="cx">         this._eventMarkers = [];
</span><span class="cx">         this._startTime = NaN;
</span><span class="cx">         this._endTime = NaN;
</span><span class="cx"> 
</span><del>-        if (!newObject)
</del><ins>+        for (var timeline of this._timelines.values())
+            timeline.reset(suppressEvents);
+
+        if (!suppressEvents) {
</ins><span class="cx">             this.dispatchEventToListeners(WebInspector.TimelineRecording.Event.Reset);
</span><ins>+            this.dispatchEventToListeners(WebInspector.TimelineRecording.Event.TimesUpdated);
+        }
</ins><span class="cx">     },
</span><span class="cx"> 
</span><span class="cx">     sourceCodeTimelinesForSourceCode: function(sourceCode)
</span><span class="lines">@@ -88,15 +86,7 @@
</span><span class="cx">         var timelines = this._sourceCodeTimelinesMap.get(sourceCode);
</span><span class="cx">         if (!timelines)
</span><span class="cx">             return [];
</span><del>-
-        var result = [];
-
-        // FIXME: This could use a for..of loop once they are supported on Maps.
-        timelines.forEach(function(sourceCodeTimeline) {
-            result.push(sourceCodeTimeline);
-        });
-
-        return result;
</del><ins>+        return timelines.values();
</ins><span class="cx">     },
</span><span class="cx"> 
</span><span class="cx">     addEventMarker: function(eventMarker)
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceTimelineSidebarPaneljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/TimelineSidebarPanel.js (162417 => 162418)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/TimelineSidebarPanel.js        2014-01-21 02:56:10 UTC (rev 162417)
+++ trunk/Source/WebInspectorUI/UserInterface/TimelineSidebarPanel.js        2014-01-21 02:56:17 UTC (rev 162418)
</span><span class="lines">@@ -62,20 +62,14 @@
</span><span class="cx">         return treeElement;
</span><span class="cx">     }
</span><span class="cx"> 
</span><del>-    var networkTimelineTreeElement = createTimelineTreeElement.call(this, WebInspector.UIString(&quot;Network Requests&quot;), WebInspector.TimelineSidebarPanel.NetworkIconStyleClass, WebInspector.TimelineRecord.Type.Network);
-    var layoutTimelineTreeElement = createTimelineTreeElement.call(this, WebInspector.UIString(&quot;Layout &amp; Rendering&quot;), WebInspector.TimelineSidebarPanel.ColorsIconStyleClass, WebInspector.TimelineRecord.Type.Layout);
-    var scriptTimelineTreeElement = createTimelineTreeElement.call(this, WebInspector.UIString(&quot;JavaScript &amp; Events&quot;), WebInspector.TimelineSidebarPanel.ScriptIconStyleClass, WebInspector.TimelineRecord.Type.Script);
</del><ins>+    this._timelineTreeElementMap = new Map;
+    this._timelineTreeElementMap.set(WebInspector.TimelineRecord.Type.Network, createTimelineTreeElement.call(this, WebInspector.UIString(&quot;Network Requests&quot;), WebInspector.TimelineSidebarPanel.NetworkIconStyleClass, WebInspector.TimelineRecord.Type.Network));
+    this._timelineTreeElementMap.set(WebInspector.TimelineRecord.Type.Layout, createTimelineTreeElement.call(this, WebInspector.UIString(&quot;Layout &amp; Rendering&quot;), WebInspector.TimelineSidebarPanel.ColorsIconStyleClass, WebInspector.TimelineRecord.Type.Layout));
+    this._timelineTreeElementMap.set(WebInspector.TimelineRecord.Type.Script, createTimelineTreeElement.call(this, WebInspector.UIString(&quot;JavaScript &amp; Events&quot;), WebInspector.TimelineSidebarPanel.ScriptIconStyleClass, WebInspector.TimelineRecord.Type.Script));
</ins><span class="cx"> 
</span><del>-    this._timelinesTreeOutline.appendChild(networkTimelineTreeElement);
-    this._timelinesTreeOutline.appendChild(layoutTimelineTreeElement);
-    this._timelinesTreeOutline.appendChild(scriptTimelineTreeElement);
</del><ins>+    for (var timelineTreeElement of this._timelineTreeElementMap.values())
+        this._timelinesTreeOutline.appendChild(timelineTreeElement);
</ins><span class="cx"> 
</span><del>-    this._timelineTreeElementMap = {
-        [WebInspector.TimelineRecord.Type.Network]: networkTimelineTreeElement,
-        [WebInspector.TimelineRecord.Type.Layout]: layoutTimelineTreeElement,
-        [WebInspector.TimelineRecord.Type.Script]: scriptTimelineTreeElement
-    };
-
</del><span class="cx">     this._timelineOverviewTreeElement = new WebInspector.GeneralTreeElement(WebInspector.TimelineSidebarPanel.StopwatchIconStyleClass, WebInspector.UIString(&quot;Timelines&quot;), null, WebInspector.timelineManager.recording);
</span><span class="cx">     this._timelineOverviewTreeElement.addEventListener(WebInspector.HierarchicalPathComponent.Event.SiblingWasSelected, this.showTimelineOverview, this);
</span><span class="cx"> 
</span><span class="lines">@@ -202,10 +196,11 @@
</span><span class="cx"> 
</span><span class="cx">     showTimelineView: function(identifier)
</span><span class="cx">     {
</span><del>-        if (!this._timelineTreeElementMap[identifier])
</del><ins>+        console.assert(this._timelineTreeElementMap.has(identifier));
+        if (!this._timelineTreeElementMap.has(identifier))
</ins><span class="cx">             return;
</span><span class="cx"> 
</span><del>-        this._timelineTreeElementMap[identifier].select(true, false, true, true);
</del><ins>+        this._timelineTreeElementMap.get(identifier).select(true, false, true, true);
</ins><span class="cx"> 
</span><span class="cx">         this._timelineContentView.showTimelineView(identifier);
</span><span class="cx">         WebInspector.contentBrowser.showContentView(this._timelineContentView);
</span><span class="lines">@@ -283,7 +278,7 @@
</span><span class="cx"> 
</span><span class="cx">     _timelinesTreeElementSelected: function(treeElement, selectedByUser)
</span><span class="cx">     {
</span><del>-        console.assert(this._timelineTreeElementMap[treeElement.representedObject] === treeElement);
</del><ins>+        console.assert(this._timelineTreeElementMap.get(treeElement.representedObject) === treeElement);
</ins><span class="cx">         this.showTimelineView(treeElement.representedObject);
</span><span class="cx">     },
</span><span class="cx"> 
</span></span></pre>
</div>
</div>

</body>
</html>