Changeset 116954 in webkit


Ignore:
Timestamp:
May 14, 2012 8:53:05 AM (12 years ago)
Author:
pfeldman@chromium.org
Message:

Web Inspector: preserve tab index while widening / shrinking tabbed pane area.
https://bugs.webkit.org/show_bug.cgi?id=86359

Reviewed by Vsevolod Vlasov.

After the drag'n'drop reorder, we should preserve tab index while widening /
shrinking the tabbed pane area.

  • inspector/front-end/TabbedPane.js:

(WebInspector.TabbedPane.prototype._innerCloseTab):
(WebInspector.TabbedPane.prototype._showTabElement):
(WebInspector.TabbedPane.prototype._hideTabElement):
(WebInspector.TabbedPane.prototype._updateTabsDropDown):
(WebInspector.TabbedPane.prototype.elementsToRestoreScrollPositionsFor):
(WebInspector.TabbedPane.prototype._insertBefore):
(WebInspector.TabbedPaneTab):
(WebInspector.TabbedPaneTab.prototype._createTabElement):
(WebInspector.TabbedPaneTab.prototype._tabDragging):

Location:
trunk/Source/WebCore
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/Source/WebCore/ChangeLog

    r116952 r116954  
     12012-05-14  Pavel Feldman  <pfeldman@chromium.org>
     2
     3        Web Inspector: preserve tab index while widening / shrinking tabbed pane area.
     4        https://bugs.webkit.org/show_bug.cgi?id=86359
     5
     6        Reviewed by Vsevolod Vlasov.
     7
     8        After the drag'n'drop reorder, we should preserve tab index while widening /
     9        shrinking the tabbed pane area.
     10
     11        * inspector/front-end/TabbedPane.js:
     12        (WebInspector.TabbedPane.prototype._innerCloseTab):
     13        (WebInspector.TabbedPane.prototype._showTabElement):
     14        (WebInspector.TabbedPane.prototype._hideTabElement):
     15        (WebInspector.TabbedPane.prototype._updateTabsDropDown):
     16        (WebInspector.TabbedPane.prototype.elementsToRestoreScrollPositionsFor):
     17        (WebInspector.TabbedPane.prototype._insertBefore):
     18        (WebInspector.TabbedPaneTab):
     19        (WebInspector.TabbedPaneTab.prototype._createTabElement):
     20        (WebInspector.TabbedPaneTab.prototype._tabDragging):
     21
    1222012-05-14  Vsevolod Vlasov  <vsevik@chromium.org>
    223
  • trunk/Source/WebCore/inspector/front-end/TabbedPane.js

    r116930 r116954  
    140140        this._tabsHistory.splice(this._tabsHistory.indexOf(tab), 1);
    141141        this._tabs.splice(this._tabs.indexOf(tab), 1);
    142         if (tab.shown)
     142        if (tab._shown)
    143143            this._hideTabElement(tab);
    144144
     
    282282        else
    283283            this._tabsElement.insertBefore(tab.tabElement, this._tabsElement.children[index]);
    284         tab.shown = true;
     284        tab._shown = true;
    285285    },
    286286
     
    291291    {
    292292        this._tabsElement.removeChild(tab.tabElement);
    293         tab.shown = false;
     293        tab._shown = false;
    294294    },
    295295
     
    310310
    311311        for (var i = 0; i < this._tabs.length; ++i) {
    312             if (this._tabs[i].shown && tabsToShowIndexes.indexOf(i) === -1)
     312            if (this._tabs[i]._shown && tabsToShowIndexes.indexOf(i) === -1)
    313313                this._hideTabElement(this._tabs[i]);
    314314        }
    315315        for (var i = 0; i < tabsToShowIndexes.length; ++i) {
    316316            var tab = this._tabs[tabsToShowIndexes[i]];
    317             if (!tab.shown)
     317            if (!tab._shown)
    318318                this._showTabElement(i, tab);
    319319        }
     
    330330        var tabsToShow = [];
    331331        for (var i = 0; i < this._tabs.length; ++i) {
    332             if (!this._tabs[i].shown)
     332            if (!this._tabs[i]._shown)
    333333                tabsToShow.push(this._tabs[i]);
    334334                continue;
     
    483483    {
    484484        return [ this._contentElement ];
     485    },
     486
     487    /**
     488     * @param {WebInspector.TabbedPaneTab} tab
     489     * @param {number} index
     490     */
     491    _insertBefore: function(tab, index)
     492    {
     493        this._tabsElement.insertBefore(tab._tabElement, this._tabsElement.childNodes[index]);
     494        var oldIndex = this._tabs.indexOf(tab);
     495        this._tabs.splice(oldIndex, 1);
     496        if (oldIndex < index)
     497            --index;
     498        this._tabs.splice(index, 0, tab);
    485499    }
    486500}
     
    508522    this._tooltip = tooltip;
    509523    this._view = view;
    510     this.shown = false;
     524    this._shown = false;
    511525    /** @type {number} */ this._measuredWidth;
    512526    /** @type {Element} */ this._tabElement;
     
    629643            this._tabElement = tabElement;
    630644            tabElement.addEventListener("click", this._tabClicked.bind(this), false);
     645            tabElement.addEventListener("mousedown", this._tabMouseDown.bind(this), false);
    631646            if (this._closeable) {
    632647                tabElement.addEventListener("contextmenu", this._tabContextMenu.bind(this), false);
    633                 tabElement.addEventListener("mousedown", this._tabMouseDown.bind(this), false);
    634648                tabElement.addEventListener("mousemove", this._tabMouseMove.bind(this), false);
    635649            }
     
    664678            return;
    665679        this._tabbedPane.selectTab(this.id, true);
     680        this._dragStartX = event.pageX;
    666681    },
    667682
     
    692707    _tabMouseMove: function(event)
    693708    {
     709        if (isNaN(this._dragStartX))
     710            return;
    694711        if (event.which !== 1)
    695712            return;
    696713        this._tabbedPane.selectTab(this.id, true);
    697714        WebInspector.elementDragStart(this._tabElement, this._tabDragging.bind(this), this._endTabDragging.bind(this), event, "pointer");
    698         this._dragStartX = event.pageX;
    699715    },
    700716
     
    709725            if (tabElement === this._tabElement)
    710726                continue;
    711             var offset = tabElement.totalOffsetLeft();
    712             if (event.offsetX < offset || event.offsetX > offset + tabElement.clientWidth)
     727
     728            var intersects = tabElement.offsetLeft + tabElement.clientWidth > this._tabElement.offsetLeft &&
     729                this._tabElement.offsetLeft + this._tabElement.clientWidth > tabElement.offsetLeft;
     730            if (!intersects)
    713731                continue;
    714  
    715             if (tabElement.offsetLeft > this._tabElement.offsetLeft)
     732
     733            if (Math.abs(event.pageX - this._dragStartX) < tabElement.clientWidth / 2 + 5)
     734                break;
     735
     736            if (event.pageX - this._dragStartX > 0) {
    716737                tabElement = tabElement.nextSibling;
     738                ++i;
     739            }
     740
    717741            var oldOffsetLeft = this._tabElement.offsetLeft;
    718             this._tabElement.parentElement.insertBefore(this._tabElement, tabElement);
     742            this._tabbedPane._insertBefore(this, i);
    719743            this._dragStartX += this._tabElement.offsetLeft - oldOffsetLeft;
     744            break;
    720745        }
    721746
     
    740765        this._tabElement.style.removeProperty("position");
    741766        this._tabElement.style.removeProperty("left");
     767        delete this._dragStartX;
    742768        WebInspector.elementDragEnd(event);
    743769    }
Note: See TracChangeset for help on using the changeset viewer.