Changeset 46339 in webkit


Ignore:
Timestamp:
Jul 24, 2009 1:33:04 AM (15 years ago)
Author:
abarth@webkit.org
Message:

2009-07-24 Joseph Pecoraro <joepeck02@gmail.com>

Reviewed by Timothy Hatcher.

Inspector: Impossible to add an attribute to a node without attributes
https://bugs.webkit.org/show_bug.cgi?id=21108

  • inspector/front-end/ElementsTreeOutline.js: (WebInspector.ElementsTreeElement): (WebInspector.ElementsTreeElement.prototype.set hovered): (WebInspector.ElementsTreeElement.prototype.toggleNewButton): (WebInspector.ElementsTreeElement.prototype.ondblclick): (WebInspector.ElementsTreeElement.prototype._startEditing): (WebInspector.ElementsTreeElement.prototype._addNewAttribute): (WebInspector.ElementsTreeElement.prototype._attributeEditingCommitted):
  • inspector/front-end/inspector.css:
Location:
trunk/WebCore
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • trunk/WebCore/ChangeLog

    r46338 r46339  
     12009-07-24  Joseph Pecoraro  <joepeck02@gmail.com>
     2
     3        Reviewed by Timothy Hatcher.
     4
     5        Inspector: Impossible to add an attribute to a node without attributes
     6        https://bugs.webkit.org/show_bug.cgi?id=21108
     7
     8        * inspector/front-end/ElementsTreeOutline.js:
     9        (WebInspector.ElementsTreeElement):
     10        (WebInspector.ElementsTreeElement.prototype.set hovered):
     11        (WebInspector.ElementsTreeElement.prototype.toggleNewButton):
     12        (WebInspector.ElementsTreeElement.prototype.ondblclick):
     13        (WebInspector.ElementsTreeElement.prototype._startEditing):
     14        (WebInspector.ElementsTreeElement.prototype._addNewAttribute):
     15        (WebInspector.ElementsTreeElement.prototype._attributeEditingCommitted):
     16        * inspector/front-end/inspector.css:
     17
    1182009-07-24  Keishi Hattori  <casey.hattori@gmail.com>
    219
  • trunk/WebCore/inspector/front-end/ElementsTreeOutline.js

    r44280 r46339  
    256256    // The title will be updated in onattach.
    257257    TreeElement.call(this, "", node, titleInfo.hasChildren);
     258   
     259    // Can add attributes
     260    if (this.representedObject.nodeType == Node.ELEMENT_NODE)
     261        this._canAddAttributes = true;
    258262}
    259263
     
    297301            } else
    298302                this.listItemElement.removeStyleClass("hovered");
    299         }
    300     },
    301 
     303            if (this._canAddAttributes)
     304                this.toggleNewAttributeButton();
     305        }
     306    },
     307
     308    toggleNewAttributeButton: function()
     309    {
     310        function removeWhenEditing(event)
     311        {
     312            if (this._addAttributeElement && this._addAttributeElement.parentNode)
     313                this._addAttributeElement.parentNode.removeChild(this._addAttributeElement);
     314            delete this._addAttributeElement;
     315        }
     316
     317        if (!this._addAttributeElement && this._hovered && !this._editing) {
     318            var span = document.createElement("span");
     319            span.className = "add-attribute";
     320            span.textContent = "\u2026";
     321            span.addEventListener("dblclick", removeWhenEditing.bind(this), false);
     322            this._addAttributeElement = span;
     323
     324            var tag = this.listItemElement.getElementsByClassName("webkit-html-tag")[0];
     325            this._insertInLastAttributePosition(tag, span);
     326        } else if (!this._hovered && this._addAttributeElement) {
     327            if (this._addAttributeElement.parentNode)
     328                this._addAttributeElement.parentNode.removeChild(this._addAttributeElement);
     329            delete this._addAttributeElement;
     330        }
     331    },
     332   
    302333    updateSelection: function()
    303334    {
     
    484515            return;
    485516
    486         if (this._startEditing(event))
     517        if (this._startEditing(event, treeElement))
    487518            return;
    488519
     
    496527    },
    497528
    498     _startEditing: function(event)
     529    _insertInLastAttributePosition: function(tag, node)
     530    {
     531        if (tag.getElementsByClassName("webkit-html-attribute").length > 0)
     532            tag.insertBefore(node, tag.lastChild);
     533        else {
     534            var nodeName = tag.textContent.match(/^<(.*?)>$/)[1];
     535            tag.textContent = '';
     536            tag.appendChild(document.createTextNode('<'+nodeName));
     537            tag.appendChild(node);
     538            tag.appendChild(document.createTextNode('>'));
     539        }
     540    },
     541
     542    _startEditing: function(event, treeElement)
    499543    {
    500544        if (this.treeOutline.focusedDOMNode != this.representedObject)
     
    512556            return this._startEditingAttribute(attribute, event);
    513557
     558        var newAttribute = event.target.enclosingNodeOrSelfWithClass("add-attribute");
     559        if (newAttribute)
     560            return this._addNewAttribute(event, treeElement);
     561
    514562        return false;
     563    },
     564
     565    _addNewAttribute: function(event, treeElement)
     566    {
     567        var attr = document.createElement("span");
     568        attr.className = "webkit-html-attribute";
     569        attr.style.marginLeft = "2px"; // overrides the .editing margin rule
     570        attr.style.marginRight = "2px"; // overrides the .editing margin rule
     571        var name = document.createElement("span");
     572        name.className = "webkit-html-attribute-name new-attribute";
     573        name.textContent = " ";
     574        var value = document.createElement("span");
     575        value.className = "webkit-html-attribute-value";
     576        attr.appendChild(name);
     577        attr.appendChild(value);
     578
     579        var tag = treeElement.listItemElement.getElementsByClassName("webkit-html-tag")[0];
     580        this._insertInLastAttributePosition(tag, attr);
     581
     582        // Start editing the attr span and highlight it first
     583        // NOTE: _startEditingAttribute only looks at the "target", so we
     584        // can fake an object here instead of passing the "event" with the
     585        // wrong target element
     586        return this._startEditingAttribute(attr, {target: attr});
    515587    },
    516588
     
    572644        var parseElement = parseContainerElement.firstChild;
    573645        if (!parseElement || !parseElement.hasAttributes()) {
    574             this._editingCancelled(element, context);
     646            this._editingCancelled(element, attributeName);
    575647            return;
    576648        }
  • trunk/WebCore/inspector/front-end/inspector.css

    r46337 r46339  
    645645}
    646646
     647.console-group-messages .add-attribute {
     648    display: none;
     649}
     650
    647651.console-formatted-object, .console-formatted-node {
    648652    position: relative;
     
    10941098    /* Keep this in sync with view-source.css (.webkit-html-external-link:hover) */
    10951099    text-decoration: underline;
     1100}
     1101
     1102.add-attribute {
     1103    margin-left: 1px;
     1104    margin-right: 1px;
    10961105}
    10971106
Note: See TracChangeset for help on using the changeset viewer.