DevTools: adopt FilmStripModel to new screenshot recorder trace format

Source/devtools/front_end/timeline/TimelineUIUtils.js

Index: Source/devtools/front_end/timeline/TimelineUIUtils.js
diff --git a/Source/devtools/front_end/timeline/TimelineUIUtils.js b/Source/devtools/front_end/timeline/TimelineUIUtils.js
index ffc4d1764e1a1aaf519096abe792c0b39b42bfb7..a4685a752baf0effb67e0976c9189d6a355d6c10 100644
--- a/Source/devtools/front_end/timeline/TimelineUIUtils.js
+++ b/Source/devtools/front_end/timeline/TimelineUIUtils.js
@@ -1324,7 +1324,7 @@ WebInspector.TimelineUIUtils.generateDetailsContentForFrame = function(frameMode
     var contentHelper = new WebInspector.TimelineDetailsContentHelper(null, null, null, true);
     if (filmStripFrame) {
         var filmStripPreview = createElementWithClass("img", "timeline-filmstrip-preview");
-        filmStripPreview.src = "data:image/jpg;base64," + filmStripFrame.imageData;
+        filmStripFrame.imageDataPromise().then(onGotImageData.bind(null, filmStripPreview));
         contentHelper.appendElementRow(WebInspector.UIString("Screenshot"), filmStripPreview);
         filmStripPreview.addEventListener("click", filmStripClicked.bind(null, filmStripFrame), false);
     }
@@ -1338,6 +1338,16 @@ WebInspector.TimelineUIUtils.generateDetailsContentForFrame = function(frameMode
     }
 
     /**
+     * @param {!Element} image
+     * @param {?string} data
+     */
+    function onGotImageData(image, data)
+    {
+        if (data)
+            image.src = "data:image/jpg;base64," + data;
+    }
+
+    /**
      * @param {!WebInspector.FilmStripModel.Frame} filmStripFrame
      */
     function filmStripClicked(filmStripFrame)