Commit eabb6e4a authored by aroben@apple.com's avatar aroben@apple.com

Highlight nodes in the page when you hover over them in the DOM tree

        Part of Bug 16532: Inspector should highlight nodes in page when
        hovering over nodes in Inspector's interface

        <http://bugs.webkit.org/show_bug.cgi?id=16532>
        <rdar://problem/5712896>

        The inspected node is no longer highlighted (unless, of course, you
        hover over it).

        Reviewed by Tim Hatcher.

        * page/inspector/DocumentPanel.js:
        (WebInspector.DocumentPanel):
          - Don't highlight the focused node when the DOM tree is shown
          - Added mousemove/mouseout event listeners to set/clear the
            highlighted node. These are added to the root of the DOM tree
            instead of to each individual list item to avoid flashing as the
            mouse moves between nodes.
        (WebInspector.DocumentPanel.set focusedDOMNode): Don't highlight the
        focused node.
        (WebInspector.DocumentPanel._onmousemove): Highlight the node under
        the mouse.


git-svn-id: http://svn.webkit.org/repository/webkit/trunk@31190 268f45cc-cd09-0410-ab3c-d52691b4dbfc
parent 66ebd579
2008-03-20 Adam Roben <aroben@apple.com>
Highlight nodes in the page when you hover over them in the DOM tree
Part of Bug 16532: Inspector should highlight nodes in page when
hovering over nodes in Inspector's interface
<http://bugs.webkit.org/show_bug.cgi?id=16532>
<rdar://problem/5712896>
The inspected node is no longer highlighted (unless, of course, you
hover over it).
Reviewed by Tim Hatcher.
* page/inspector/DocumentPanel.js:
(WebInspector.DocumentPanel):
- Don't highlight the focused node when the DOM tree is shown
- Added mousemove/mouseout event listeners to set/clear the
highlighted node. These are added to the root of the DOM tree
instead of to each individual list item to avoid flashing as the
mouse moves between nodes.
(WebInspector.DocumentPanel.set focusedDOMNode): Don't highlight the
focused node.
(WebInspector.DocumentPanel._onmousemove): Highlight the node under
the mouse.
2008-03-20 Adam Roben <aroben@apple.com>
Show nodes' content/padding/border/margin boxes in the node highlight
......@@ -38,7 +38,6 @@ WebInspector.DocumentPanel = function(resource, views)
var domView = this.views.dom;
domView.hide = function() { InspectorController.hideDOMNodeHighlight() };
domView.show = function() {
InspectorController.highlightDOMNode(panel.focusedDOMNode);
panel.updateBreadcrumb();
panel.updateTreeSelection();
};
......@@ -49,9 +48,17 @@ WebInspector.DocumentPanel = function(resource, views)
domView.treeContentElement = document.createElement("div");
domView.treeContentElement.className = "content tree outline-disclosure";
function clearNodeHighlight(event)
{
if (event.target === this)
InspectorController.hideDOMNodeHighlight();
}
domView.treeListElement = document.createElement("ol");
domView.treeListElement.addEventListener("mousedown", this._onmousedown.bind(this), false);
domView.treeListElement.addEventListener("dblclick", this._ondblclick.bind(this), false);
domView.treeListElement.addEventListener("mousemove", this._onmousemove.bind(this), false);
domView.treeListElement.addEventListener("mouseout", clearNodeHighlight.bind(domView.treeListElement), false);
domView.treeOutline = new TreeOutline(domView.treeListElement);
domView.treeOutline.panel = this;
......@@ -143,8 +150,6 @@ WebInspector.DocumentPanel.prototype = {
this._focusedNodeChanged();
InspectorController.highlightDOMNode(x);
var nodeItem = this.revealNode(x);
if (nodeItem)
nodeItem.select();
......@@ -819,6 +824,15 @@ WebInspector.DocumentPanel.prototype = {
element.select();
},
_onmousemove: function(event)
{
var element = this._treeElementFromEvent(event);
if (!element)
return;
InspectorController.highlightDOMNode(element.representedObject);
},
}
WebInspector.DocumentPanel.prototype.__proto__ = WebInspector.SourcePanel.prototype;
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment