Changeset 56395 in webkit


Ignore:
Timestamp:
Mar 23, 2010 8:39:12 AM (14 years ago)
Author:
pfeldman@chromium.org
Message:

2010-03-23 Pavel Feldman <pfeldman@chromium.org>

Reviewed by Timothy Hatcher.

Web Inspector: render nodes in inherited style bars as links.

https://bugs.webkit.org/show_bug.cgi?id=36486

  • English.lproj/localizedStrings.js:
  • inspector/front-end/BreakpointsSidebarPane.js: (WebInspector.BreakpointsSidebarPane.prototype._appendBreakpointElement.breakpointClicked): (WebInspector.BreakpointsSidebarPane.prototype._appendBreakpointElement):
  • inspector/front-end/StylesSidebarPane.js: (WebInspector.StylesSidebarPane.prototype._update.else.insertInheritedNodeSeparator): (WebInspector.StylesSidebarPane.prototype._update): (WebInspector.StylesSidebarPane.prototype._selectNode):
  • inspector/front-end/inspector.js:
Location:
trunk/WebCore
Files:
6 edited

Legend:

Unmodified
Added
Removed
  • trunk/WebCore/ChangeLog

    r56394 r56395  
     12010-03-23  Pavel Feldman  <pfeldman@chromium.org>
     2
     3        Reviewed by Timothy Hatcher.
     4
     5        Web Inspector: render nodes in inherited style bars as links.
     6
     7        https://bugs.webkit.org/show_bug.cgi?id=36486
     8
     9        * English.lproj/localizedStrings.js:
     10        * inspector/front-end/BreakpointsSidebarPane.js:
     11        (WebInspector.BreakpointsSidebarPane.prototype._appendBreakpointElement.breakpointClicked):
     12        (WebInspector.BreakpointsSidebarPane.prototype._appendBreakpointElement):
     13        * inspector/front-end/StylesSidebarPane.js:
     14        (WebInspector.StylesSidebarPane.prototype._update.else.insertInheritedNodeSeparator):
     15        (WebInspector.StylesSidebarPane.prototype._update):
     16        (WebInspector.StylesSidebarPane.prototype._selectNode):
     17        * inspector/front-end/inspector.js:
     18
    1192010-03-23  Julien Chaffraix  <jchaffraix@webkit.org>
    220
  • trunk/WebCore/inspector/front-end/BreakpointsSidebarPane.js

    r55464 r56395  
    8484        function breakpointClicked()
    8585        {
    86             var script = WebInspector.panels.scripts.scriptOrResourceForID(breakpoint.sourceID);
    87             if (script)
    88                 WebInspector.panels.scripts.showScript(script, breakpoint.line);
     86            WebInspector.panels.scripts.showSourceLine(breakpoint.url, breakpoint.line);
    8987        }
    9088
  • trunk/WebCore/inspector/front-end/ElementsPanel.js

    r56393 r56395  
    674674            switch (current.nodeType) {
    675675                case Node.ELEMENT_NODE:
    676                     crumbTitle = current.nodeName.toLowerCase();
    677 
    678                     var nameElement = document.createElement("span");
    679                     nameElement.textContent = crumbTitle;
    680                     crumb.appendChild(nameElement);
    681 
    682                     var idAttribute = current.getAttribute("id");
    683                     if (idAttribute) {
    684                         var idElement = document.createElement("span");
    685                         crumb.appendChild(idElement);
    686 
    687                         var part = "#" + idAttribute;
    688                         crumbTitle += part;
    689                         idElement.appendChild(document.createTextNode(part));
    690 
    691                         // Mark the name as extra, since the ID is more important.
    692                         nameElement.className = "extra";
    693                     }
    694 
    695                     var classAttribute = current.getAttribute("class");
    696                     if (classAttribute) {
    697                         var classes = classAttribute.split(/\s+/);
    698                         var foundClasses = {};
    699 
    700                         if (classes.length) {
    701                             var classesElement = document.createElement("span");
    702                             classesElement.className = "extra";
    703                             crumb.appendChild(classesElement);
    704 
    705                             for (var i = 0; i < classes.length; ++i) {
    706                                 var className = classes[i];
    707                                 if (className && !(className in foundClasses)) {
    708                                     var part = "." + className;
    709                                     crumbTitle += part;
    710                                     classesElement.appendChild(document.createTextNode(part));
    711                                     foundClasses[className] = true;
    712                                 }
    713                             }
    714                         }
    715                     }
    716 
     676                    this.decorateNodeLabel(current, crumb);
    717677                    break;
    718678
     
    740700                nameElement.textContent = crumbTitle;
    741701                crumb.appendChild(nameElement);
    742             }
    743 
    744             crumb.title = crumbTitle;
     702                crumb.title = crumbTitle;
     703            }
    745704
    746705            if (foundRoot)
     
    758717
    759718        this.updateBreadcrumbSizes();
     719    },
     720
     721    decorateNodeLabel: function(node, parentElement)
     722    {
     723        var title = node.nodeName.toLowerCase();
     724
     725        var nameElement = document.createElement("span");
     726        nameElement.textContent = title;
     727        parentElement.appendChild(nameElement);
     728
     729        var idAttribute = node.getAttribute("id");
     730        if (idAttribute) {
     731            var idElement = document.createElement("span");
     732            parentElement.appendChild(idElement);
     733
     734            var part = "#" + idAttribute;
     735            title += part;
     736            idElement.appendChild(document.createTextNode(part));
     737
     738            // Mark the name as extra, since the ID is more important.
     739            nameElement.className = "extra";
     740        }
     741
     742        var classAttribute = node.getAttribute("class");
     743        if (classAttribute) {
     744            var classes = classAttribute.split(/\s+/);
     745            var foundClasses = {};
     746
     747            if (classes.length) {
     748                var classesElement = document.createElement("span");
     749                classesElement.className = "extra";
     750                parentElement.appendChild(classesElement);
     751
     752                for (var i = 0; i < classes.length; ++i) {
     753                    var className = classes[i];
     754                    if (className && !(className in foundClasses)) {
     755                        var part = "." + className;
     756                        title += part;
     757                        classesElement.appendChild(document.createTextNode(part));
     758                        foundClasses[className] = true;
     759                    }
     760                }
     761            }
     762        }
     763        parentElement.title = title;
    760764    },
    761765
  • trunk/WebCore/inspector/front-end/StylesSidebarPane.js

    r56383 r56395  
    191191                var entry = {};
    192192                entry.isInheritedNodeSeparator = true;
    193                 entry.nodeName = node.nodeName;
    194                 entry.nodeClass = node.getAttribute("class");
    195                 entry.nodeId = node.getAttribute("id");
     193                entry.node = node;
    196194                styleRules.push(entry);
    197195            }
     
    335333                    var separatorElement = document.createElement("div");
    336334                    separatorElement.className = "styles-sidebar-separator";
    337                     var title = styleRule.nodeName.toLowerCase();
    338                     if (styleRule.nodeClass)
    339                         title += "." + styleRule.nodeClass;
    340                     if (styleRule.nodeId)
    341                         title += "#" + styleRule.nodeId;
    342                     separatorElement.innerText = WebInspector.UIString("Inherited from %s", title);
     335                    var link = document.createElement("a");
     336                    link.href = "";
     337                    link.addEventListener("mousedown", this._selectNode.bind(this, styleRule.node.id), false);
     338                    WebInspector.panels.elements.decorateNodeLabel(styleRule.node, link);
     339                    separatorElement.appendChild(document.createTextNode(WebInspector.UIString("Inherited from") + " "));
     340                    separatorElement.appendChild(link);
    343341                    this.bodyElement.appendChild(separatorElement);
    344342                    continue;
     
    373371    },
    374372
     373    _selectNode: function(nodeId, e)
     374    {
     375        WebInspector.updateFocusedNode(nodeId);
     376        e.preventDefault();
     377    },
     378
    375379    _containsInherited: function(payload)
    376380    {
     
    447451    WebInspector.PropertiesSection.call(this, styleRule.selectorText);
    448452
    449     this.titleElement.addEventListener("click", this._clickSelector.bind(this), false);
    450453    this.titleElement.addEventListener("dblclick", this._dblclickSelector.bind(this), false);
    451454    this.element.addEventListener("dblclick", this._dblclickEmptySpace.bind(this), false);
     
    670673        item._newProperty = true;
    671674        return item;
    672     },
    673 
    674     _clickSelector: function(event)
    675     {
    676         event.stopPropagation();
    677 
    678         // Don't search "Computed Styles", "Style Attribute", or Mapped Attributes.
    679         if (this.computedStyle || !this.rule || this.rule.isUser)
    680             return;
    681 
    682         var searchElement = document.getElementById("search");
    683         searchElement.value = this.styleRule.selectorText;
    684         WebInspector.performSearch({ target: searchElement });
    685675    },
    686676
  • trunk/WebCore/inspector/front-end/inspector.js

    r56051 r56395  
    639639    // Prevent the link from navigating, since we don't do any navigation by following links normally.
    640640    event.preventDefault();
     641    event.stopPropagation();
    641642
    642643    function followLink()
Note: See TracChangeset for help on using the changeset viewer.