Draw marker events on Timeline flame chart

Source/devtools/front_end/timeline/TracingTimelineUIUtils.js

Index: Source/devtools/front_end/timeline/TracingTimelineUIUtils.js
diff --git a/Source/devtools/front_end/timeline/TracingTimelineUIUtils.js b/Source/devtools/front_end/timeline/TracingTimelineUIUtils.js
index c3f8a24128bf3f21570e5730ee73fd62258f3593..f68db8fb8108c9487c4ea38256d070a59c76a930 100644
--- a/Source/devtools/front_end/timeline/TracingTimelineUIUtils.js
+++ b/Source/devtools/front_end/timeline/TracingTimelineUIUtils.js
@@ -212,7 +212,7 @@ WebInspector.TracingTimelineUIUtils._initEventStyles = function()
     eventStyles[recordTypes.Layout] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Layout"), categories["rendering"]);
     eventStyles[recordTypes.PaintSetup] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Paint Setup"), categories["painting"]);
     eventStyles[recordTypes.UpdateLayer] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Update Layer"), categories["painting"], true);
-    eventStyles[recordTypes.UpdateLayerTree] = { title: WebInspector.UIString("Update Layer Tree"), category: categories["rendering"] };
+    eventStyles[recordTypes.UpdateLayerTree] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Update Layer Tree"), categories["rendering"], true);
     eventStyles[recordTypes.Paint] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Paint"), categories["painting"]);
     eventStyles[recordTypes.Rasterize] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Paint"), categories["painting"]);
     eventStyles[recordTypes.RasterTask] = new WebInspector.TimelineRecordStyle(WebInspector.UIString("Paint"), categories["painting"]);
@@ -283,6 +283,30 @@ WebInspector.TracingTimelineUIUtils.styleForTraceEvent = function(name)
 }
 
 /**
+ * @param {string} eventName
+ * @return {string}
+ */
+WebInspector.TimelineUIUtilsImpl.markerEventColor = function(eventName)
+{
+    var red = "rgb(255, 0, 0)";
+    var blue = "rgb(0, 0, 255)";
+    var orange = "rgb(255, 178, 23)";
+    var green = "rgb(0, 130, 0)";
+
+    var recordTypes = WebInspector.TracingTimelineModel.RecordType;
+    if (eventName === recordTypes.MarkDOMContent)

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

switch?

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

Done.

+        return blue;
+    if (eventName === recordTypes.MarkLoad)
+        return red;
+    if (eventName === recordTypes.MarkFirstPaint)
+        return green;
+    if (eventName === recordTypes.TimeStamp)
+        return orange;
+    //else if (eventName === recordTypes.BeginFrame)

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

nuke?

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

Done.

+    return green;
+}
+
+/**
  * @param {!WebInspector.TracingTimelineModel.TraceEventRecord} record
  * @return {string}
  */
@@ -300,6 +324,23 @@ WebInspector.TracingTimelineUIUtils._recordTitle = function(record)
 }
 
 /**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @param {!WebInspector.TracingTimelineModel} model
+ * @return {string}
+ */
+WebInspector.TracingTimelineUIUtils.eventTitle = function(event, model)
+{
+    if (event.name === WebInspector.TracingTimelineModel.RecordType.TimeStamp)
+        return event.args.data["message"];
+    var title = WebInspector.TracingTimelineUIUtils.eventStyle(event).title;
+    if (WebInspector.TracingTimelineUIUtils.isMarkerEvent(event)) {
+        var startTime = Number.millisToString(event.startTime - model.minimumRecordTime());
+        return WebInspector.UIString("%s at %s", title, startTime);
+    }
+    return title;
+}
+
+/**
  * @param {!WebInspector.TimelineModel.Record} record
  * @return {boolean}
  */
@@ -317,6 +358,23 @@ WebInspector.TracingTimelineUIUtils.isEventDivider = function(record)
 
 /**
  * @param {!WebInspector.TracingModel.Event} event
+ * @return {boolean}
+ */
+WebInspector.TracingTimelineUIUtils.isMarkerEvent = function(event)
+{
+    var recordTypes = WebInspector.TracingTimelineModel.RecordType;
+    var name = event.name;
+    if (name === recordTypes.TimeStamp)
+        return true;
+    if (name === recordTypes.MarkFirstPaint)
+        return true;
+    if (name === recordTypes.MarkDOMContent || name === recordTypes.MarkLoad)
+        return event.args.data["isMainFrame"];
+    return false;
+}
+
+/**
+ * @param {!WebInspector.TracingModel.Event} event
  * @param {!WebInspector.Linkifier} linkifier
  * @return {?Node}
  */