Draw marker events on Timeline flame chart

Source/devtools/front_end/timeline/TimelineFlameChart.js

Index: Source/devtools/front_end/timeline/TimelineFlameChart.js
diff --git a/Source/devtools/front_end/timeline/TimelineFlameChart.js b/Source/devtools/front_end/timeline/TimelineFlameChart.js
index d2abe42878a5c6b9c29c2ff342777e7cf5ebeb1d..72210f04413806132f6e15bd126d49bde18724c6 100644
--- a/Source/devtools/front_end/timeline/TimelineFlameChart.js
+++ b/Source/devtools/front_end/timeline/TimelineFlameChart.js
@@ -116,12 +116,33 @@ WebInspector.TimelineFlameChartDataProvider.prototype = {
         return null;
     },
 
+    /**
+     * @param {number} index

[alph, 2014/07/21 14:21:07]

@override

[yurys, 2014/07/21 14:30:00]

Done.

+     * @return {string}
+     */
+    markerColor: function(index)
+    {
+        var event = this._markerEvents[index];
+        return WebInspector.TimelineUIUtilsImpl.markerEventColor(event.name);
+    },
+
+    /**
+     * @param {number} index

[alph, 2014/07/21 14:21:07]

ditto

[yurys, 2014/07/21 14:30:00]

Done.

+     * @return {string}
+     */
+    markerTitle: function(index)
+    {
+        var event = this._markerEvents[index];
+        return WebInspector.TracingTimelineUIUtils.eventTitle(event, this._model);
+    },
+
     reset: function()
     {
         this._timelineData = null;
         /** @type {!Array.<!WebInspector.TracingModel.Event>} */
         this._entryEvents = [];
         this._entryIndexToTitle = {};
+        this._markerEvents = [];
     },
 
     /**
@@ -132,14 +153,7 @@ WebInspector.TimelineFlameChartDataProvider.prototype = {
         if (this._timelineData)
             return this._timelineData;
 
-        /**
-         * @type {?WebInspector.FlameChart.TimelineData}
-         */
-        this._timelineData = {
-            entryLevels: [],
-            entryTotalTimes: [],
-            entryStartTimes: []
-        };
+        this._timelineData = new WebInspector.FlameChart.TimelineData([], [], []);
 
         this._minimumBoundary = this._model.minimumRecordTime();
         this._timeSpan = Math.max(this._model.maximumRecordTime() - this._minimumBoundary, 1000);
@@ -168,8 +182,13 @@ WebInspector.TimelineFlameChartDataProvider.prototype = {
         var jsStackHeight = 0;
         for (var i = 0; i < events.length; ++i) {
             var e = events[i];
-            if (!e.endTime && e.phase !== WebInspector.TracingModel.Phase.Instant)
+            // FIXME: clean up once phase name is unified between Blink and Chromium.
+            if (!e.endTime && e.phase !== WebInspector.TracingModel.Phase.Instant && e.phase !== "I")
                 continue;
+            if (WebInspector.TracingTimelineUIUtils.isMarkerEvent(e)) {
+                this._markerEvents.push(e);
+                this._timelineData.markerTimestamps.push(e.startTime);
+            }
             if (!this._isVisible(e))
                 continue;
             while (openEvents.length && openEvents.peekLast().endTime <= e.startTime) {