Correctly track time bounds of WebInspector.Timeline and WebInspector.TimelineRecording.

The startTime and endTime were not correct when Network timeline needed to be taken into
account (due to its dynamic loading nature.) This creates a network Timeline for the purposes
of tracking the ResourceTimelineRecords and getting accurate start and end times.

Also changes the way TimelineRecord tracks the inactive portion of time, needed for later
work on the timeline graphs.

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

Reviewed by Joseph Pecoraro.

* UserInterface/ResourceTimelineRecord.js:
(WebInspector.ResourceTimelineRecord.prototype.get updatesDynamically):
(WebInspector.ResourceTimelineRecord.prototype.get usesActiveStartTime):
(WebInspector.ResourceTimelineRecord.prototype.get startTime):
(WebInspector.ResourceTimelineRecord.prototype.get activeStartTime):
(WebInspector.ResourceTimelineRecord.prototype.get endTime):
* UserInterface/Timeline.js:
(WebInspector.Timeline):
(WebInspector.Timeline.prototype.get startTime):
(WebInspector.Timeline.prototype.get endTime):
(WebInspector.Timeline.prototype.addRecord):
(WebInspector.Timeline.prototype._updateTimesIfNeeded):
(WebInspector.Timeline.prototype._recordUpdated):
* UserInterface/TimelineRecord.js:
(WebInspector.TimelineRecord.prototype.get startTime):
(WebInspector.TimelineRecord.prototype.get activeStartTime):
(WebInspector.TimelineRecord.prototype.get endTime):
(WebInspector.TimelineRecord.prototype.get inactiveDuration):
(WebInspector.TimelineRecord.prototype.get activeDuration):
(WebInspector.TimelineRecord.prototype.get updatesDynamically):
(WebInspector.TimelineRecord.prototype.get usesActiveStartTime):
* UserInterface/TimelineRecording.js:
(WebInspector.TimelineRecording.prototype._timelineTimesUpdated):

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

Source/WebInspectorUI/ChangeLog

+2014-01-08  Timothy Hatcher  <timothy@apple.com>
+
+        Correctly track time bounds of WebInspector.Timeline and WebInspector.TimelineRecording.
+
+        The startTime and endTime were not correct when Network timeline needed to be taken into
+        account (due to its dynamic loading nature.) This creates a network Timeline for the purposes
+        of tracking the ResourceTimelineRecords and getting accurate start and end times.
+
+        Also changes the way TimelineRecord tracks the inactive portion of time, needed for later
+        work on the timeline graphs.
+
+        https://bugs.webkit.org/show_bug.cgi?id=126676
+
+        Reviewed by Joseph Pecoraro.
+
+        * UserInterface/ResourceTimelineRecord.js:
+        (WebInspector.ResourceTimelineRecord.prototype.get updatesDynamically):
+        (WebInspector.ResourceTimelineRecord.prototype.get usesActiveStartTime):
+        (WebInspector.ResourceTimelineRecord.prototype.get startTime):
+        (WebInspector.ResourceTimelineRecord.prototype.get activeStartTime):
+        (WebInspector.ResourceTimelineRecord.prototype.get endTime):
+        * UserInterface/Timeline.js:
+        (WebInspector.Timeline):
+        (WebInspector.Timeline.prototype.get startTime):
+        (WebInspector.Timeline.prototype.get endTime):
+        (WebInspector.Timeline.prototype.addRecord):
+        (WebInspector.Timeline.prototype._updateTimesIfNeeded):
+        (WebInspector.Timeline.prototype._recordUpdated):
+        * UserInterface/TimelineRecord.js:
+        (WebInspector.TimelineRecord.prototype.get startTime):
+        (WebInspector.TimelineRecord.prototype.get activeStartTime):
+        (WebInspector.TimelineRecord.prototype.get endTime):
+        (WebInspector.TimelineRecord.prototype.get inactiveDuration):
+        (WebInspector.TimelineRecord.prototype.get activeDuration):
+        (WebInspector.TimelineRecord.prototype.get updatesDynamically):
+        (WebInspector.TimelineRecord.prototype.get usesActiveStartTime):
+        * UserInterface/TimelineRecording.js:
+        (WebInspector.TimelineRecording.prototype._timelineTimesUpdated):
+
 2013-10-25  Timothy Hatcher  <timothy@apple.com>
 
         Implement TimelineRecording and per-call-site timelines.

Source/WebInspectorUI/UserInterface/ResourceTimelineRecord.js

@@ -41,24 +41,29 @@ WebInspector.ResourceTimelineRecord.prototype = {
         return this._resource;
     },
 
-    get startTime()
+    get updatesDynamically()
     {
-        return this._resource.firstTimestamp;
+        return true;
     },
 
-    get endTime()
+    get usesActiveStartTime()
     {
-        return this._resource.lastTimestamp;
+        return true;
     },
 
-    get waitingDuration()
+    get startTime()
     {
-        return this._resource.latency;
+        return this._resource.requestSentTimestamp;
     },
 
-    get activeDuration()
+    get activeStartTime()
+    {
+        return this._resource.responseReceivedTimestamp;
+    },
+
+    get endTime()
     {
-        return this._resource.receiveDuration;
+        return this._resource.finishedOrFailedTimestamp;
     },
 
     // Private

Source/WebInspectorUI/UserInterface/Timeline.js

@@ -28,6 +28,13 @@ WebInspector.Timeline = function()
     WebInspector.Object.call(this);
 
     this._records = [];
+    this._startTime = NaN;
+    this._endTime = NaN;
+};
+
+WebInspector.Timeline.Event = {
+    RecordAdded: "timeline-record-added",
+    TimesUpdated: "timeline-times-updated"
 };
 
 WebInspector.Timeline.prototype = {
@@ -36,6 +43,16 @@ WebInspector.Timeline.prototype = {
 
     // Public
 
+    get startTime()
+    {
+        return this._startTime;
+    },
+
+    get endTime()
+    {
+        return this._endTime;
+    },
+
     get records()
     {
         return this._records;
@@ -43,6 +60,38 @@ WebInspector.Timeline.prototype = {
 
     addRecord: function(record)
     {
+        if (record.updatesDynamically)
+            record.addEventListener(WebInspector.TimelineRecord.Event.Updated, this._recordUpdated, this);
+
         this._records.push(record);
+
+        this._updateTimesIfNeeded(record);
+
+        this.dispatchEventToListeners(WebInspector.Timeline.Event.RecordAdded, {record: record});
+    },
+
+    // Private
+
+    _updateTimesIfNeeded: function(record)
+    {
+        var changed = false;
+
+        if (isNaN(this._startTime) || record.startTime < this._startTime) {
+            this._startTime = record.startTime;
+            changed = true;
+        }
+
+        if (isNaN(this._endTime) || this._endTime < record.endTime) {
+            this._endTime = record.endTime;
+            changed = true;
+        }
+
+        if (changed)
+            this.dispatchEventToListeners(WebInspector.Timeline.Event.TimesUpdated);
+    },
+
+    _recordUpdated: function(event)
+    {
+        this._updateTimesIfNeeded(event.target);
     }
 };

Source/WebInspectorUI/UserInterface/TimelineRecord.js

@@ -61,11 +61,19 @@ WebInspector.TimelineRecord.prototype = {
 
     get startTime()
     {
+        // Implemented by subclasses if needed.
+        return this._startTime;
+    },
+
+    get activeStartTime()
+    {
+        // Implemented by subclasses if needed.
         return this._startTime;
     },
 
     get endTime()
     {
+        // Implemented by subclasses if needed.
         return this._endTime;
     },
 
@@ -75,16 +83,28 @@ WebInspector.TimelineRecord.prototype = {
         return this.endTime - this.startTime;
     },
 
-    get waitingDuration()
+    get inactiveDuration()
     {
-        // Implemented by subclasses if needed.
-        return NaN;
+        // Use the getters instead of the properties so this works for subclasses that override the getters.
+        return this.activeStartTime - this.startTime;
     },
 
     get activeDuration()
+    {
+        // Use the getters instead of the properties so this works for subclasses that override the getters.
+        return this.endTime - this.activeStartTime;
+    },
+
+    get updatesDynamically()
+    {
+        // Implemented by subclasses if needed.
+        return false;
+    },
+
+    get usesActiveStartTime()
     {
         // Implemented by subclasses if needed.
-        return this.duration;
+        return false;
     },
 
     get callFrames()

Source/WebInspectorUI/UserInterface/TimelineRecording.js

@@ -32,7 +32,8 @@ WebInspector.TimelineRecording = function()
 
 WebInspector.TimelineRecording.Event = {
     Reset: "timeline-recording-reset",
-    SourceCodeTimelineAdded: "timeline-recording-source-code-timeline-added"
+    SourceCodeTimelineAdded: "timeline-recording-source-code-timeline-added",
+    TimesUpdated: "timeline-recording-times-updated"
 };
 
 WebInspector.TimelineRecording.prototype = {
@@ -48,11 +49,21 @@ WebInspector.TimelineRecording.prototype = {
 
     reset: function(newObject)
     {
+        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.Timeline);
         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);
+
         this._sourceCodeTimelinesMap = new Map;
         this._eventMarkers = [];
 
@@ -127,5 +138,24 @@ WebInspector.TimelineRecording.prototype = {
         if (record.sourceCodeLocation)
             key += ":" + record.sourceCodeLocation.lineNumber + ":" + record.sourceCodeLocation.columnNumber;
         return key;
+    },
+
+    _timelineTimesUpdated: function(event)
+    {
+        var timeline = event.target;
+        var changed = false;
+
+        if (isNaN(this._startTime) || timeline.startTime < this._startTime) {
+            this._startTime = timeline.startTime;
+            changed = true;
+        }
+
+        if (isNaN(this._endTime) || this._endTime < timeline.endTime) {
+            this._endTime = timeline.endTime;
+            changed = true;
+        }
+
+        if (changed)
+            this.dispatchEventToListeners(WebInspector.TimelineRecording.Event.TimesUpdated);
     }
 };