Changeset 106550 in webkit


Ignore:
Timestamp:
Feb 2, 2012 6:25:15 AM (12 years ago)
Author:
pfeldman@chromium.org
Message:

Web Inspector: add experiment for single click styles editing.
https://bugs.webkit.org/show_bug.cgi?id=77624

Reviewed by Vsevolod Vlasov.

  • inspector/front-end/Settings.js:

(WebInspector.ExperimentsSettings):

  • inspector/front-end/StylesSidebarPane.js:

(WebInspector.StylePropertiesSection):
(WebInspector.StylePropertyTreeElement.prototype.onattach):
(WebInspector.StylePropertyTreeElement.prototype._mouseDown):
(WebInspector.StylePropertyTreeElement.prototype._resetMouseDownElement):
(WebInspector.StylePropertyTreeElement.prototype):
(WebInspector.StylePropertyTreeElement.prototype.selectElement.context):

Location:
trunk/Source/WebCore
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • trunk/Source/WebCore/ChangeLog

    r106547 r106550  
     12012-02-02  Pavel Feldman  <pfeldman@google.com>
     2
     3        Web Inspector: add experiment for single click styles editing.
     4        https://bugs.webkit.org/show_bug.cgi?id=77624
     5
     6        Reviewed by Vsevolod Vlasov.
     7
     8        * inspector/front-end/Settings.js:
     9        (WebInspector.ExperimentsSettings):
     10        * inspector/front-end/StylesSidebarPane.js:
     11        (WebInspector.StylePropertiesSection):
     12        (WebInspector.StylePropertyTreeElement.prototype.onattach):
     13        (WebInspector.StylePropertyTreeElement.prototype._mouseDown):
     14        (WebInspector.StylePropertyTreeElement.prototype._resetMouseDownElement):
     15        (WebInspector.StylePropertyTreeElement.prototype):
     16        (WebInspector.StylePropertyTreeElement.prototype.selectElement.context):
     17
    1182012-02-02  Kenneth Rohde Christiansen  <kenneth@webkit.org>
    219
  • trunk/Source/WebCore/inspector/front-end/Settings.js

    r105877 r106550  
    173173    this.freeFlowDOMEditing = this._createExperiment("freeFlowDOMEditing", "Enable free flow DOM editing");
    174174    this.showMemoryCounters = this._createExperiment("showMemoryCounters", "Show memory counters in Timeline panel");
     175    this.singleClickEditing = this._createExperiment("singleClickEditing", "Single click CSS editing");
    175176
    176177    this._cleanUpSetting();
  • trunk/Source/WebCore/inspector/front-end/StylesSidebarPane.js

    r106237 r106550  
    900900    this.element.appendChild(closeBrace);
    901901
    902     this._selectorElement.addEventListener("dblclick", this._handleSelectorDoubleClick.bind(this), false);
    903     this.element.addEventListener("dblclick", this._handleEmptySpaceDoubleClick.bind(this), false);
     902    var eventName = WebInspector.experimentsSettings.singleClickEditing.isEnabled() ? "click" : "dblclick";
     903    this._selectorElement.addEventListener(eventName, this._handleSelectorDoubleClick.bind(this), false);
     904    this.element.addEventListener(eventName, this._handleEmptySpaceDoubleClick.bind(this), false);
    904905
    905906    this._parentPane = parentPane;
     
    15231524    {
    15241525        this.updateTitle();
     1526        var eventName;
     1527        if (WebInspector.experimentsSettings.singleClickEditing.isEnabled()) {
     1528            this.listItemElement.addEventListener("mousedown", this._mouseDown.bind(this));
     1529            this.listItemElement.addEventListener("mouseup", this._resetMouseDownElement.bind(this));
     1530            eventName = "click";
     1531        } else
     1532            eventName = "dblclick";
     1533        this.listItemElement.addEventListener(eventName, this._startEditing.bind(this));
     1534    },
     1535
     1536    _mouseDown: function(event)
     1537    {
     1538        this._parentPane._mouseDownTreeElement = this;
     1539        this._parentPane._mouseDownTreeElementIsName = this._isNameElement(event.target);
     1540        this._parentPane._mouseDownTreeElementIsValue = this._isValueElement(event.target);
     1541    },
     1542
     1543    _resetMouseDownElement: function()
     1544    {
     1545        delete this._parentPane._mouseDownTreeElement;
     1546        delete this._parentPane._mouseDownTreeElementIsName;
     1547        delete this._parentPane._mouseDownTreeElementIsValue;
    15251548    },
    15261549
     
    18101833    },
    18111834
    1812     ondblclick: function(event)
    1813     {
    1814         this.startEditing(event.target);
    1815         event.stopPropagation();
    1816     },
    1817 
    18181835    restoreNameElement: function()
    18191836    {
     
    18261843        this.nameElement.textContent = "";
    18271844        this.listItemElement.insertBefore(this.nameElement, this.listItemElement.firstChild);
     1845    },
     1846
     1847    _startEditing: function(event)
     1848    {
     1849        this.startEditing(event.target);
     1850        event.stopPropagation();
     1851    },
     1852
     1853    _isNameElement: function(element)
     1854    {
     1855        return element.enclosingNodeOrSelfWithClass("webkit-css-property") === this.nameElement;
     1856    },
     1857
     1858    _isValueElement: function(element)
     1859    {
     1860        return !!element.enclosingNodeOrSelfWithClass("value");
    18281861    },
    18291862
     
    18931926        function blurListener(context, event)
    18941927        {
    1895             this.editingCommitted(null, event.target.textContent, context.previousContent, context, "");
     1928            var treeElement = this._parentPane._mouseDownTreeElement;
     1929            var moveDirection = "";
     1930            if (treeElement === this) {
     1931                if (isEditingName && this._parentPane._mouseDownTreeElementIsValue)
     1932                    moveDirection = "forward";
     1933                if (!isEditingName && this._parentPane._mouseDownTreeElementIsName)
     1934                    moveDirection = "backward";
     1935            }
     1936            this.editingCommitted(null, event.target.textContent, context.previousContent, context, moveDirection);
    18961937        }
    18971938
     
    20052046    editingEnded: function(context)
    20062047    {
     2048        this._resetMouseDownElement();
    20072049        if (this._applyFreeFlowStyleTextEditTimer)
    20082050            clearTimeout(this._applyFreeFlowStyleTextEditTimer);
Note: See TracChangeset for help on using the changeset viewer.