[Devtools] Added hover support for network timeline experiment

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

 /*
  * Copyright (C) 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2008, 2009 Anthony Ricaud <rik@webkit.org>
  * Copyright (C) 2011 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:
  *
  * 1.  Redistributions of source code must retain the above copyright
@@ skipping 336 matching lines @@
     _createTable: function()
     {
         this._dataGrid = this._columns.createGrid(this._timeCalculator, this._durationCalculator);
         this._dataGrid.setStickToBottom(true);
         this._dataGrid.setName("networkLog");
         this._dataGrid.setResizeMethod(WebInspector.DataGrid.ResizeMethod.Last);
         this._dataGrid.element.classList.add("network-log-grid");
         this._dataGrid.element.addEventListener("contextmenu", this._contextMenu.bind(this), true);
         this._dataGrid.element.addEventListener("mousedown", this._dataGridMouseDown.bind(this), true);
         this._dataGrid.element.addEventListener("mousemove", this._dataGridMouseMove.bind(this), true);
-        this._dataGrid.element.addEventListener("mouseleave", this._highlightInitiatorChain.bind(this, null), true);
+        this._dataGrid.element.addEventListener("mouseleave", this._dataGridMouseLeave.bind(this, null), true);
+    },
+
+    /**
+     * @param {!Event} event
+     */
+    _dataGridMouseMove: function(event)

[dgozman, 2016/10/12 17:31:32]

Where do you disable default data grid highlight?

[allada, 2016/10/12 19:15:29]

There isnt a default highlight... Network panel did it inside NetworkLogView
using CSS.

+    {
+        var node = this._dataGrid.dataGridNodeFromNode(event.target);

[dgozman, 2016/10/12 17:31:32]

Just call this._setHoveredNode(node)

[allada, 2016/10/12 19:15:29]

Done.

+        if (this._hoveredNode)
+            this._hoveredNode.element().classList.remove("hover");
+        this._hoveredNode = node;
+        if (this._hoveredNode)
+            this._hoveredNode.element().classList.add("hover");
+        this._timelineColumn.setHoveredRequest(this._hoveredNode ? this._hoveredNode.request() : null);
+        this._highlightInitiatorChain((event.shiftKey && node) ? node.request() : null);
+    },
+
+    _dataGridMouseLeave: function(event)

[dgozman, 2016/10/12 17:31:32]

JSDocs

[allada, 2016/10/12 19:15:29]

Done.

+    {
+        if (this._hoveredNode) {
+            this._hoveredNode.element().classList.remove("hover");
+            this._hoveredNode = null;
+            this._timelineColumn.setHoveredRequest(null);
+        }
+        this._highlightInitiatorChain(null);
+    },
+
+    setHoveredRequest: function(request)
+    {
+        var requestId = null;
+        if (request)
+            requestId = request.requestId;
+        this._setHoveredNode(this._nodesByRequestId.get(requestId) || null);
+    },
+
+    _setHoveredNode: function(node)
+    {
+        if (this._hoveredNode)
+            this._hoveredNode.element().classList.remove("hover");
+        this._hoveredNode = node;
+        if (this._hoveredNode)
+            this._hoveredNode.element().classList.add("hover");
+        this._timelineColumn.setHoveredRequest(this._hoveredNode ? this._hoveredNode.request() : null);
     },
 
     /**
      * @param {!Event} event
      */
     _dataGridMouseDown: function(event)
     {
         if ((!this._dataGrid.selectedNode && event.button) || event.target.enclosingNodeOrSelfWithNodeName("a"))
             event.consume();
     },
 
     /**
-     * @param {!Event} event
-     */
-    _dataGridMouseMove: function(event)
-    {
-        var node = event.shiftKey ? this._dataGrid.dataGridNodeFromNode(event.target) : null;
-        this._highlightInitiatorChain(node ? node.request() : null);
-    },
-
-    /**
      * @param {?WebInspector.NetworkRequest} request
      */
     _highlightInitiatorChain: function(request)
     {
         if (this._requestWithHighlightedInitiators === request)
             return;
         this._requestWithHighlightedInitiators = request;
 
         if (!request) {
             for (var node of this._nodesByRequestId.values()) {
@@ skipping 1428 matching lines @@
  * @return {boolean}
  */
 WebInspector.NetworkLogView._requestTimeFilter = function(windowStart, windowEnd, request)
 {
     if (request.issueTime() > windowEnd)
         return false;
     if (request.endTime !== -1 && request.endTime < windowStart)
         return false;
     return true;
 }