DevTools: adopt FilmStripModel to new screenshot recorder trace format

Source/devtools/front_end/components_lazy/FilmStripModel.js

Index: Source/devtools/front_end/components_lazy/FilmStripModel.js
diff --git a/Source/devtools/front_end/components_lazy/FilmStripModel.js b/Source/devtools/front_end/components_lazy/FilmStripModel.js
index 9dd1f8fd879807862f4dbf286119dde9f6063303..08d43950154f9766a0d0de1c031972f0614420f5 100644
--- a/Source/devtools/front_end/components_lazy/FilmStripModel.js
+++ b/Source/devtools/front_end/components_lazy/FilmStripModel.js
@@ -24,15 +24,23 @@ WebInspector.FilmStripModel = function(tracingModel)
 
     var events = mainThread.events();
     for (var i = 0; i < events.length; ++i) {
-        if (events[i].category === "disabled-by-default-devtools.screenshot" && events[i].name === "CaptureFrame") {
+        if (events[i].category !== "disabled-by-default-devtools.screenshot")
+            continue;
+
+        if (events[i].name === WebInspector.FilmStripModel.TraceEvents.CaptureFrame) {
             var data = events[i].args.data;

[alph, 2015/06/17 09:41:59]

nit: we usually write args["data"]

-            if (!data)
-                continue;
-            this._frames.push(new WebInspector.FilmStripModel.Frame(this, data, events[i].startTime, this._frames.length));
+            if (data)
+                this._frames.push(WebInspector.FilmStripModel.Frame._fromEvent(this, events[i], this._frames.length));
+        } else if (events[i].name === WebInspector.FilmStripModel.TraceEvents.Screenshot) {
+            this._frames.push(WebInspector.FilmStripModel.Frame._fromSnapshot(this, /** @type {!WebInspector.TracingModel.ObjectSnapshot} */ (events[i]), this._frames.length));
         }
     }
 }
 
+WebInspector.FilmStripModel.TraceEvents = {
+    CaptureFrame: "CaptureFrame",
+    Screenshot: "Screenshot"
+}

[alph, 2015/06/17 09:41:59]

nit: add a line

 WebInspector.FilmStripModel.prototype = {
     /**
      * @return {!Array<!WebInspector.FilmStripModel.Frame>}
@@ -73,16 +81,42 @@ WebInspector.FilmStripModel.prototype = {
 /**
  * @constructor
  * @param {!WebInspector.FilmStripModel} model
- * @param {string} imageData
  * @param {number} timestamp
  * @param {number} index
  */
-WebInspector.FilmStripModel.Frame = function(model, imageData, timestamp, index)
+WebInspector.FilmStripModel.Frame = function(model, timestamp, index)
 {
     this._model = model;
-    this.imageData = imageData;
     this.timestamp = timestamp;
     this.index = index;
+    /** @type {?string} */
+    this._imageData = null;
+    /** @type {?WebInspector.TracingModel.ObjectSnapshot} */
+    this._snapshot = null;
+}
+
+/**
+ * @param {!WebInspector.FilmStripModel} model
+ * @param {!WebInspector.TracingModel.Event} event
+ * @param {number} index
+ */
+WebInspector.FilmStripModel.Frame._fromEvent = function(model, event, index)
+{
+    var frame = new WebInspector.FilmStripModel.Frame(model, event.startTime, index);
+    frame._imageData = event.args.data;
+    return frame;
+}
+
+/**
+ * @param {!WebInspector.FilmStripModel} model
+ * @param {!WebInspector.TracingModel.ObjectSnapshot} snapshot
+ * @param {number} index
+ */
+WebInspector.FilmStripModel.Frame._fromSnapshot = function(model, snapshot, index)
+{
+    var frame = new WebInspector.FilmStripModel.Frame(model, snapshot.startTime, index);
+    frame._snapshot = snapshot;
+    return frame;
 }
 
 WebInspector.FilmStripModel.Frame.prototype = {
@@ -92,5 +126,17 @@ WebInspector.FilmStripModel.Frame.prototype = {
     model: function()
     {
         return this._model;
+    },
+
+    /**
+     * @param {function(?string)} callback
+     */
+    requestImageData: function(callback)
+    {
+        if (this._imageData || !this._snapshot) {
+            callback(this._imageData);

[alph, 2015/06/17 09:41:59]

Consider setting up frame.imageData rather than provide an async interface. So
you could get rid of the map in the FilmStripView.

+            return;
+        }
+        this._snapshot.requestObject(/** @type {function(?Object)} */ (callback));
     }
 }