Timeline: show impl-side frames on the Timeline overview

Source/devtools/front_end/TimelineFrameController.js

Index: Source/devtools/front_end/TimelineFrameController.js
diff --git a/Source/devtools/front_end/TimelineFrameController.js b/Source/devtools/front_end/TimelineFrameController.js
index 057d4a8c7c81d013ca24c216a5e8f3a21ac633e6..80f31fb566288a40733e305b28701819c8a43cd1 100644
--- a/Source/devtools/front_end/TimelineFrameController.js
+++ b/Source/devtools/front_end/TimelineFrameController.js
@@ -36,7 +36,8 @@
  */
 WebInspector.TimelineFrameController = function(model, overviewPane, presentationModel)
 {
-    this._lastFrame = null;
+    this._lastMainThreadFrame = null;
+    this._lastBackgroundFrame = null;
     this._model = model;
     this._overviewPane = overviewPane;
     this._presentationModel = presentationModel;
@@ -56,19 +57,18 @@ WebInspector.TimelineFrameController.prototype = {
 
     _onRecordsCleared: function()
     {
-        this._lastFrame = null;
+        this._lastMainThreadFrame = null;
+        this._lastBackgroundFrame = null;
     },
 
     _addRecord: function(record)
     {
-        if (record.isBackground)
-            return;
         var records;
         var programRecord;
         if (record.type === WebInspector.TimelineModel.RecordType.Program) {
             programRecord = record;
-            if (this._lastFrame)
-                this._lastFrame.timeByCategory["other"] += WebInspector.TimelineModel.durationInSeconds(programRecord);
+            if (this._lastMainThreadFrame)
+                this._lastMainThreadFrame.timeByCategory["other"] += WebInspector.TimelineModel.durationInSeconds(programRecord);
             records = record["children"] || [];
         } else
             records = [record];
@@ -83,34 +83,52 @@ WebInspector.TimelineFrameController.prototype = {
     {
         var isFrameRecord = record.type === WebInspector.TimelineModel.RecordType.BeginFrame;
         var programTimeCarryover = isFrameRecord && programRecord ? WebInspector.TimelineModel.endTimeInSeconds(programRecord) - WebInspector.TimelineModel.startTimeInSeconds(record) : 0;
-        if (isFrameRecord && this._lastFrame)
-            this._flushFrame(record, programTimeCarryover);
-        else {
-            if (!this._lastFrame)
-                this._lastFrame = this._createFrame(record, programTimeCarryover);
-            if (!record.thread)
-                WebInspector.TimelineModel.aggregateTimeForRecord(this._lastFrame.timeByCategory, record);
-            var duration = WebInspector.TimelineModel.durationInSeconds(record);
-            this._lastFrame.cpuTime += duration;
-            this._lastFrame.timeByCategory["other"] -= duration;
+        var lastFrame = this._lastFrameForRecord(record);
+        if (isFrameRecord && lastFrame) {
+            this._flushFrame(lastFrame, record, programTimeCarryover);
+            lastFrame = this._createFrame(record, programTimeCarryover);
+        } else if (record.type === WebInspector.TimelineModel.RecordType.CommitFrame) {
+            if (lastFrame)
+                lastFrame.mainThreadFrameId = record.data.id;
+        } else {
+            if (!lastFrame)
+                lastFrame = this._createFrame(record, programTimeCarryover);
+            if (!record.thread) {
+                WebInspector.TimelineModel.aggregateTimeForRecord(lastFrame.timeByCategory, record);
+                var duration = WebInspector.TimelineModel.durationInSeconds(record);
+                lastFrame.cpuTime += duration;
+                lastFrame.timeByCategory["other"] -= duration;
+            }
         }
+        if (record.thread)
+            this._lastBackgroundFrame = lastFrame;
+        else
+            this._lastMainThreadFrame = lastFrame;
     },
 
     /**
      * @param {Object} record
+     */
+    _lastFrameForRecord: function(record)
+    {
+        return record.thread ? this._lastBackgroundFrame : this._lastMainThreadFrame;

[pfeldman, 2013/11/06 17:21:05]

inline

+    },
+
+    /**
+     * @param {WebInspector.TimelineFrame} frame
+     * @param {Object} record
      * @param {number} programTimeCarryover
      */
-    _flushFrame: function(record, programTimeCarryover)
+    _flushFrame: function(frame, record, programTimeCarryover)
     {
-        this._lastFrame.endTime = WebInspector.TimelineModel.startTimeInSeconds(record);
-        this._lastFrame.duration = this._lastFrame.endTime - this._lastFrame.startTime;
-        this._lastFrame.timeByCategory["other"] -= programTimeCarryover;
+        frame.endTime = WebInspector.TimelineModel.startTimeInSeconds(record);
+        frame.duration = frame.endTime - frame.startTime;
+        frame.timeByCategory["other"] -= programTimeCarryover;
         // Alternatively, we could compute CPU time as sum of all Program events.
         // This way it's a bit more flexible, as it works in case there's no program events.
-        this._lastFrame.cpuTime += this._lastFrame.timeByCategory["other"];
-        this._overviewPane.addFrame(this._lastFrame);
-        this._presentationModel.addFrame(this._lastFrame);
-        this._lastFrame = this._createFrame(record, programTimeCarryover);
+        frame.cpuTime += frame.timeByCategory["other"];
+        this._overviewPane.addFrame(frame);
+        this._presentationModel.addFrame(frame);
     },
 
     /**
@@ -123,6 +141,8 @@ WebInspector.TimelineFrameController.prototype = {
         frame.startTime = WebInspector.TimelineModel.startTimeInSeconds(record);
         frame.startTimeOffset = this._model.recordOffsetInSeconds(record);
         frame.timeByCategory["other"] = programTimeCarryover;
+        frame.isBackground = !!record.thread;
+        frame.id = record.data && record.data["id"];
         return frame;
     },