DevTools: draw load/first paint marks as tall vertical delimiters

BUG=424500

Review URL: https://codereview.chromium.org/706313002

git-svn-id: svn://svn.chromium.org/blink/trunk@184990 bbb929c8-8fbe-4397-9dbb-9b2b20218538

third_party/WebKit/Source/devtools/front_end/components/FlameChart.js

@@ -155,6 +155,12 @@ WebInspector.FlameChartDataProvider.prototype = {
      */
     markerTitle: function(index) { },
 
+    /**
+     * @param {number} index
+     * @return {boolean}
+     */
+    isTallMarker: function(index) { },
+
     /**
      * @return {number}
      */
@@ -1038,6 +1044,17 @@ WebInspector.FlameChart.prototype = {
             context.moveTo(position, 0);
             context.lineTo(position, height);
             context.stroke();
+            if (this._dataProvider.isTallMarker(i)) {
+                context.save()
+                context.lineWidth = 0.5;
+                context.translate(0.5, 0.5);
+                context.beginPath();
+                context.moveTo(position, height);
+                context.setLineDash([10, 5]);
+                context.lineTo(position, this._canvas.height);
+                context.stroke();
+                context.restore();
+            }
         }
         context.restore();
     },

third_party/WebKit/Source/devtools/front_end/profiler/CPUProfileFlameChart.js

@@ -128,6 +128,15 @@ WebInspector.CPUFlameChartDataProvider.prototype = {
         throw new Error("Unreachable.");
     },
 
+    /**
+     * @param {number} index
+     * @return {boolean}
+     */
+    isTallMarker: function(index)
+    {
+        throw new Error("Unreachable.");
+    },
+
     /**
      * @return {!WebInspector.FlameChart.TimelineData}
      */

third_party/WebKit/Source/devtools/front_end/timeline/TimelineFlameChart.js

@@ -156,6 +156,17 @@ WebInspector.TimelineFlameChartDataProvider.prototype = {
         return WebInspector.TracingTimelineUIUtils.eventTitle(event, this._model);
     },
 
+    /**
+     * @override
+     * @param {number} index
+     * @return {boolean}
+     */
+    isTallMarker: function(index)
+    {
+        var event = this._markerEvents[index];
+        return WebInspector.TracingTimelineUIUtils.isTallMarkerEvent(event);
+    },
+
     reset: function()
     {
         this._timelineData = null;

third_party/WebKit/Source/devtools/front_end/timeline/TracingTimelineUIUtils.js

@@ -339,6 +339,15 @@ WebInspector.TracingTimelineUIUtils.isMarkerEvent = function(event)
     }
 }
 
+/**
+ * @param {!WebInspector.TracingModel.Event} event
+ * @return {boolean}
+ */
+WebInspector.TracingTimelineUIUtils.isTallMarkerEvent = function(event)
+{
+    return event.name !== WebInspector.TracingTimelineModel.RecordType.TimeStamp;
+}
+
 /**
  * @param {!WebInspector.TracingModel.Event} event
  * @param {!WebInspector.Linkifier} linkifier