[Devtools] Added row decoration to canvas timeline experiment

third_party/WebKit/Source/devtools/front_end/network/NetworkTimelineColumn.js

Index: third_party/WebKit/Source/devtools/front_end/network/NetworkTimelineColumn.js
diff --git a/third_party/WebKit/Source/devtools/front_end/network/NetworkTimelineColumn.js b/third_party/WebKit/Source/devtools/front_end/network/NetworkTimelineColumn.js
index 4337f1f52443d8b363e9d12698d6fc9d0c80ae83..2b516fe9c97d73c247a4cdb8be16e572b5d56c41 100644
--- a/third_party/WebKit/Source/devtools/front_end/network/NetworkTimelineColumn.js
+++ b/third_party/WebKit/Source/devtools/front_end/network/NetworkTimelineColumn.js
@@ -157,6 +157,8 @@ WebInspector.NetworkTimelineColumn.prototype = {
         var lastRequestIndex = Math.min(requests.length, firstRequestIndex + Math.ceil(this._offsetHeight / rowHeight));
         for (var i = firstRequestIndex; i < lastRequestIndex; i++) {
             var rowOffset = rowHeight * i;
+            var rowNumber = i - firstRequestIndex;
+            this._decorateRow(context, rowNumber, rowOffset - scrollTop, rowHeight);
             var request = requests[i];
             var ranges = WebInspector.RequestTimingView.calculateRequestTimeRanges(request, 0);
             for (var range of ranges) {
@@ -232,5 +234,24 @@ WebInspector.NetworkTimelineColumn.prototype = {
         context.restore();
     },
 
+    /**
+     * @param {!CanvasRenderingContext2D} context
+     * @param {number} rowNumber
+     * @param {number} y
+     * @param {number} rowHeight
+     */
+    _decorateRow: function(context, rowNumber, y, rowHeight)
+    {
+        context.save();
+        if (rowNumber % 2 === 1)
+            return;
+
+        context.beginPath();
+        context.fillStyle = WebInspector.themeSupport.patchColor("#f5f5f5", WebInspector.ThemeSupport.ColorUsage.Background);
+        context.rect(0, y, this._offsetWidth, rowHeight);
+        context.fill();
+        context.restore();
+    },
+
     __proto__: WebInspector.VBox.prototype
 }