Draw marker events on Timeline flame chart

Source/devtools/front_end/timeline/TimelineFlameChart.js

 /*
  * Copyright (C) 2014 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 98 matching lines @@
     /**
      * @param {number} startTime
      * @param {number} endTime
      * @return {?Array.<number>}
      */
     dividerOffsets: function(startTime, endTime)
     {
         return null;
     },
 
+    /**
+     * @param {number} startTime
+     * @param {number} endTime
+     * @return {?Array.<!WebInspector.FlameChartDataProvider.Marker>}
+     */
+    timelineMarkers: function(startTime, endTime)
+    {
+        function compare(time, event)
+        {
+            return time - event.startTime;
+        }
+        var left = this._markerEvents.lowerBound(startTime, compare);
+        var right = this._markerEvents.upperBound(endTime, compare);
+        var result = [];
+        for (var i = left; i < right; i++) {
+            var event = this._markerEvents[i];
+            var title = WebInspector.TracingTimelineUIUtils.eventTitle(event, this._model);
+            var color = WebInspector.TimelineUIUtilsImpl.markerEventColor(event.name);
+            result.push(new WebInspector.FlameChartDataProvider.Marker(event.startTime, title, color));
+        }
+        return result;
+    },
+
     reset: function()
     {
         this._timelineData = null;
         /** @type {!Array.<!WebInspector.TracingModel.Event>} */
         this._entryEvents = [];
         this._entryIndexToTitle = {};
+        this._markerEvents = [];
     },
 
     /**
      * @return {!WebInspector.FlameChart.TimelineData}
      */
     timelineData: function()
     {
         if (this._timelineData)
             return this._timelineData;
 
@@ skipping 26 matching lines @@
     {
         var maxStackDepth = 0;
         var openEvents = [];
         var levels = [];
         var jsHeights = [];
         var headerAppended = false;
         var level = 0;
         var jsStackHeight = 0;
         for (var i = 0; i < events.length; ++i) {
             var e = events[i];
-            if (!e.endTime && e.phase !== WebInspector.TracingModel.Phase.Instant)
+            if (!e.endTime && e.phase !== WebInspector.TracingModel.Phase.Instant && e.phase !== "I")

[alph, 2014/07/21 12:05:30]

 && e.phase !== "I" seems to be not needed anymore.

[yurys, 2014/07/21 13:49:48]

Done.

                 continue;
+            if (WebInspector.TracingTimelineUIUtils.isMarkerEvent(e))
+                this._markerEvents.push(e);
             if (!this._isVisible(e))
                 continue;
             while (openEvents.length && openEvents.peekLast().endTime <= e.startTime) {
                 openEvents.pop();
                 level = levels.pop();
                 jsStackHeight = jsHeights.pop();
             }
             if (!headerAppended) {
                 this._appendHeaderRecord(headerName, this._currentLevel);
                 ++level;
@@ skipping 442 matching lines @@
 /**
   * @constructor
   * @param {!WebInspector.TimelineSelection} selection
   * @param {number} entryIndex
   */
 WebInspector.TimelineFlameChart.Selection = function(selection, entryIndex)
 {
     this.timelineSelection = selection;
     this.entryIndex = entryIndex;
 }