Diff
Modified: trunk/Source/WebCore/ChangeLog (143005 => 143006)
--- trunk/Source/WebCore/ChangeLog 2013-02-15 16:53:55 UTC (rev 143005)
+++ trunk/Source/WebCore/ChangeLog 2013-02-15 17:05:09 UTC (rev 143006)
@@ -1,3 +1,55 @@
+2013-02-15 Vladislav Kaznacheev <[email protected]>
+
+ Web Inspector: Added an option to split Elements and Sources sidebars in two panes.
+ https://bugs.webkit.org/show_bug.cgi?id=109298.
+
+ Reviewed by Vsevolod Vlasov.
+
+ Introduced the "Split sidebar" context menu option that splits the horizontal sidebar into two panes.
+ The width split ratio is 1:1 by default and is preserved when the Inspector window is resized.
+ Elements sidebar is split into two tabbed panes, Sources sidebar is split into a pane stack and a tabbed pane.
+
+ No new tests.
+
+ * inspector/front-end/DOMBreakpointsSidebarPane.js:
+ (WebInspector.DOMBreakpointsSidebarPane.Proxy.prototype._reattachBody):
+ * inspector/front-end/ElementsPanel.js:
+ (WebInspector.ElementsPanel.get this):
+ (WebInspector.ElementsPanel):
+ (WebInspector.ElementsPanel.prototype._sidebarContextMenuEventFired):
+ (WebInspector.ElementsPanel.prototype._populateContextMenuForSidebar.toggleSetting):
+ (WebInspector.ElementsPanel.prototype.get _arrangeSidebarPanes.get this):
+ (WebInspector.ElementsPanel.prototype.addExtensionSidebarPane):
+ * inspector/front-end/ExtensionServer.js:
+ (WebInspector.ExtensionServer.prototype._onCreateSidebarPane):
+ * inspector/front-end/ScriptsPanel.js:
+ (WebInspector.ScriptsPanel):
+ (WebInspector.ScriptsPanel.prototype._appendUISourceCodeItems):
+ (WebInspector.ScriptsPanel.prototype._contextMenuEventFired):
+ (WebInspector.ScriptsPanel.prototype._sidebarContextMenuEventFired):
+ (WebInspector.ScriptsPanel.prototype._populateContextMenuForSidebar.toggleSetting):
+ (WebInspector.ScriptsPanel.prototype.get _arrangeSidebarPanes.get this):
+ * inspector/front-end/SidebarPane.js:
+ (WebInspector.SidebarPane):
+ (WebInspector.SidebarPane.prototype.expand):
+ (WebInspector.SidebarPane.prototype.onContentReady):
+ (WebInspector.SidebarPane.prototype._setExpandCallback):
+ (WebInspector.SidebarPane.prototype.wasShown):
+ (WebInspector.SidebarPaneTitle):
+ (WebInspector.SidebarPaneTitle.prototype._expand):
+ (WebInspector.SidebarPaneTitle.prototype._collapse):
+ (WebInspector.SidebarPaneTitle.prototype._toggleExpanded):
+ (WebInspector.SidebarPaneTitle.prototype._onTitleKeyDown):
+ (WebInspector.SidebarPaneStack):
+ (WebInspector.SidebarPaneStack.prototype.addPane):
+ (WebInspector.SidebarTabbedPane):
+ (WebInspector.SidebarTabbedPane.prototype.addPane):
+ * inspector/front-end/SidebarView.js:
+ * inspector/front-end/SplitView.js:
+ (WebInspector.SplitView):
+ (WebInspector.SplitView.prototype.get mainElement):
+ (WebInspector.SplitView.prototype.get sidebarElement):
+
2013-02-15 Vsevolod Vlasov <[email protected]>
Web Inspector: Several consecutive Backspace or Delete strikes should not be marked as undoable state.
Modified: trunk/Source/WebCore/inspector/front-end/DOMBreakpointsSidebarPane.js (143005 => 143006)
--- trunk/Source/WebCore/inspector/front-end/DOMBreakpointsSidebarPane.js 2013-02-15 16:53:55 UTC (rev 143005)
+++ trunk/Source/WebCore/inspector/front-end/DOMBreakpointsSidebarPane.js 2013-02-15 17:05:09 UTC (rev 143006)
@@ -366,21 +366,11 @@
}
WebInspector.DOMBreakpointsSidebarPane.Proxy.prototype = {
- expanded: function()
- {
- return this._wrappedPane.expanded();
- },
-
expand: function()
{
this._wrappedPane.expand();
},
- collapse: function()
- {
- this._wrappedPane.collapse();
- },
-
onContentReady: function()
{
if (!this._panel.isShowing())
@@ -398,11 +388,8 @@
_reattachBody: function()
{
- if (this.bodyElement.parentNode == this.element)
- return;
-
- this.bodyElement.removeSelf();
- this.element.appendChild(this.bodyElement);
+ if (this.bodyElement.parentNode !== this.element)
+ this.element.appendChild(this.bodyElement);
},
__proto__: WebInspector.SidebarPane.prototype
Modified: trunk/Source/WebCore/inspector/front-end/ElementsPanel.js (143005 => 143006)
--- trunk/Source/WebCore/inspector/front-end/ElementsPanel.js 2013-02-15 16:53:55 UTC (rev 143005)
+++ trunk/Source/WebCore/inspector/front-end/ElementsPanel.js 2013-02-15 17:05:09 UTC (rev 143006)
@@ -66,6 +66,7 @@
WebInspector.settings.domWordWrap.addChangeListener(this._domWordWrapSettingChanged.bind(this));
this.contentElement.addEventListener("contextmenu", this._contextMenuEventFired.bind(this), true);
+ this.splitView.sidebarElement.addEventListener("contextmenu", this._sidebarContextMenuEventFired.bind(this), false);
this.treeOutline = new WebInspector.ElementsTreeOutline(true, true, false, this._populateContextMenu.bind(this), this._setPseudoClassForNodeId.bind(this));
this.treeOutline.wireToDomAgent();
@@ -85,22 +86,23 @@
this.sidebarPanes.domBreakpoints = WebInspector.domBreakpointsSidebarPane.createProxy(this);
this.sidebarPanes.eventListeners = new WebInspector.EventListenersSidebarPane();
- this.sidebarPanes.styles.setShowCallback(this.updateStyles.bind(this, false));
- this.sidebarPanes.metrics.setShowCallback(this.updateMetrics.bind(this));
- this.sidebarPanes.properties.setShowCallback(this.updateProperties.bind(this));
- this.sidebarPanes.eventListeners.setShowCallback(this.updateEventListeners.bind(this));
+ this.sidebarPanes.styles.addEventListener(WebInspector.SidebarPane.EventTypes.wasShown, this.updateStyles.bind(this, false));
+ this.sidebarPanes.metrics.addEventListener(WebInspector.SidebarPane.EventTypes.wasShown, this.updateMetrics.bind(this));
+ this.sidebarPanes.properties.addEventListener(WebInspector.SidebarPane.EventTypes.wasShown, this.updateProperties.bind(this));
+ this.sidebarPanes.eventListeners.addEventListener(WebInspector.SidebarPane.EventTypes.wasShown, this.updateEventListeners.bind(this));
this.sidebarPanes.styles.addEventListener("style edited", this._stylesPaneEdited, this);
this.sidebarPanes.styles.addEventListener("style property toggled", this._stylesPaneEdited, this);
this.sidebarPanes.metrics.addEventListener("metrics edited", this._metricsPaneEdited, this);
- this.sidebarPaneView = new WebInspector.SidebarPaneGroup();
- for (var pane in this.sidebarPanes)
- this.sidebarPaneView.addPane(this.sidebarPanes[pane]);
- this.sidebarPaneView.attachToPanel(this);
+ this._splitDirectionSetting = WebInspector.settings.createSetting(this.name + "PanelSplitHorizontally", false);
+ this._splitDirectionSetting.addChangeListener(this._arrangeSidebarPanes.bind(this));
- this.sidebarPanes.styles.expand();
+ this._splitSidebarSetting = WebInspector.settings.createSetting(this.name + "PanelSplitSidebar", false);
+ this._splitSidebarSetting.addChangeListener(this._arrangeSidebarPanes.bind(this));
+ this._arrangeSidebarPanes();
+
this._popoverHelper = new WebInspector.PopoverHelper(this.element, this._getPopoverAnchor.bind(this), this._showPopover.bind(this));
this._popoverHelper.setTimeout(0);
@@ -350,7 +352,7 @@
contextMenu.appendSeparator();
contextMenu.appendCheckboxItem(WebInspector.UIString(WebInspector.useLowerCaseMenuTitles() ? "Word wrap" : "Word Wrap"), toggleWordWrap.bind(this), WebInspector.settings.domWordWrap.get());
- this.sidebarPaneView.populateContextMenu(contextMenu);
+ this._populateContextMenuForSidebar(contextMenu);
contextMenu.show();
},
@@ -1092,5 +1094,75 @@
contextMenu.appendItem(WebInspector.UIString("Reveal in Elements Panel"), revealElement.bind(this));
},
+ _sidebarContextMenuEventFired: function(event)
+ {
+ var contextMenu = new WebInspector.ContextMenu(event);
+ this._populateContextMenuForSidebar(contextMenu);
+ contextMenu.show();
+ },
+
+ _populateContextMenuForSidebar: function(contextMenu)
+ {
+ if (!WebInspector.experimentsSettings.horizontalPanelSplit.isEnabled())
+ return;
+
+ function toggleSetting(setting)
+ {
+ setting.set(!setting.get());
+ }
+ contextMenu.appendCheckboxItem(WebInspector.UIString(WebInspector.useLowerCaseMenuTitles() ? "Split horizontally" : "Split Horizontally"), toggleSetting.bind(this, this._splitDirectionSetting), this._splitDirectionSetting.get());
+
+ if (!this.splitView.isVertical())
+ contextMenu.appendCheckboxItem(WebInspector.UIString(WebInspector.useLowerCaseMenuTitles() ? "Split sidebar" : "Split Sidebar"), toggleSetting.bind(this, this._splitSidebarSetting), this._splitSidebarSetting.get());
+ },
+
+ _arrangeSidebarPanes: function()
+ {
+ if (this.sidebarPaneView)
+ this.sidebarPaneView.detach();
+
+ var vertical = !WebInspector.experimentsSettings.horizontalPanelSplit.isEnabled() || !this._splitDirectionSetting.get();
+ this.splitView.setVertical(vertical);
+
+ if (vertical) {
+ this.sidebarPaneView = new WebInspector.SidebarPaneStack();
+ for (var pane in this.sidebarPanes)
+ this.sidebarPaneView.addPane(this.sidebarPanes[pane]);
+ } else if (!this._splitSidebarSetting.get()) {
+ this.sidebarPaneView = new WebInspector.SidebarTabbedPane();
+ for (var pane in this.sidebarPanes)
+ this.sidebarPaneView.addPane(this.sidebarPanes[pane]);
+ } else {
+ this.sidebarPaneView = new WebInspector.SplitView(true, this.name + "PanelSplitSidebarRatio", 0.5);
+
+ var group1 = new WebInspector.SidebarTabbedPane();
+ group1.show(this.sidebarPaneView.firstElement());
+ group1.addPane(this.sidebarPanes.computedStyle);
+ group1.addPane(this.sidebarPanes.styles);
+ group1.addPane(this.sidebarPanes.metrics);
+
+ var group2 = new WebInspector.SidebarTabbedPane();
+ group2.show(this.sidebarPaneView.secondElement());
+ group2.addPane(this.sidebarPanes.properties);
+ group2.addPane(this.sidebarPanes.domBreakpoints);
+ group2.addPane(this.sidebarPanes.eventListeners);
+
+ this.sidebarPaneView.extensionPaneContainer = group2;
+ }
+ this.sidebarPaneView.show(this.splitView.sidebarElement);
+ this.sidebarPanes.styles.expand();
+ },
+
+ /**
+ * @param {string} id
+ * @param {WebInspector.SidebarPane} pane
+ */
+ addExtensionSidebarPane: function(id, pane)
+ {
+ this.sidebarPanes[id] = pane;
+ var container = this.sidebarPaneView.extensionPaneContainer || this.sidebarPaneView;
+ container.addPane(pane);
+ },
+
__proto__: WebInspector.Panel.prototype
}
Modified: trunk/Source/WebCore/inspector/front-end/ExtensionServer.js (143005 => 143006)
--- trunk/Source/WebCore/inspector/front-end/ExtensionServer.js 2013-02-15 16:53:55 UTC (rev 143005)
+++ trunk/Source/WebCore/inspector/front-end/ExtensionServer.js 2013-02-15 17:05:09 UTC (rev 143006)
@@ -231,13 +231,12 @@
var panel = WebInspector.panel(message.panel);
if (!panel)
return this._status.E_NOTFOUND(message.panel);
- if (!panel.sidebarPaneView || !panel.sidebarPanes)
+ if (!panel.addExtensionSidebarPane)
return this._status.E_NOTSUPPORTED();
var id = message.id;
var sidebar = new WebInspector.ExtensionSidebarPane(message.title, message.id);
this._clientObjects[id] = sidebar;
- panel.sidebarPanes[id] = sidebar;
- panel.sidebarPaneView.addPane(sidebar);
+ panel.addExtensionSidebarPane(id, sidebar);
return this._status.OK();
},
Modified: trunk/Source/WebCore/inspector/front-end/ScriptsPanel.js (143005 => 143006)
--- trunk/Source/WebCore/inspector/front-end/ScriptsPanel.js 2013-02-15 16:53:55 UTC (rev 143005)
+++ trunk/Source/WebCore/inspector/front-end/ScriptsPanel.js 2013-02-15 17:05:09 UTC (rev 143006)
@@ -109,6 +109,8 @@
this.splitView.mainElement.appendChild(this.debugSidebarResizeWidgetElement);
this.splitView.mainElement.addEventListener("contextmenu", this._contextMenuEventFired.bind(this), false);
+ this.splitView.sidebarElement.addEventListener("contextmenu", this._sidebarContextMenuEventFired.bind(this), false);
+
this.sidebarPanes = {};
this.sidebarPanes.watchExpressions = new WebInspector.WatchExpressionsSidebarPane();
this.sidebarPanes.callstack = new WebInspector.CallStackSidebarPane();
@@ -123,18 +125,13 @@
this.sidebarPanes.workerList = new WebInspector.WorkersSidebarPane(WebInspector.workerManager);
}
- this.sidebarPaneView = new WebInspector.SidebarPaneGroup();
- this.sidebarPaneView.element.id = "scripts-debug-sidebar-contents";
- for (var pane in this.sidebarPanes)
- this.sidebarPaneView.addPane(this.sidebarPanes[pane]);
- this.sidebarPaneView.attachToPanel(this);
+ this._splitDirectionSetting = WebInspector.settings.createSetting(this.name + "PanelSplitHorizontally", false);
+ this._splitDirectionSetting.addChangeListener(this._arrangeSidebarPanes.bind(this));
- this.sidebarPanes.callstack.expand();
- this.sidebarPanes.scopechain.expand();
- this.sidebarPanes.jsBreakpoints.expand();
+ this._splitSidebarSetting = WebInspector.settings.createSetting(this.name + "PanelSplitSidebar", false);
+ this._splitSidebarSetting.addChangeListener(this._arrangeSidebarPanes.bind(this));
- if (WebInspector.settings.watchExpressions.get().length > 0)
- this.sidebarPanes.watchExpressions.expand();
+ this._arrangeSidebarPanes();
this.sidebarPanes.callstack.registerShortcuts(this.registerShortcuts.bind(this));
this.registerShortcuts(WebInspector.ScriptsPanelDescriptor.ShortcutKeys.EvaluateSelectionInConsole, this._evaluateSelectionInConsole.bind(this));
@@ -1125,7 +1122,7 @@
contextMenu.appendApplicableItems(resource.request);
if (WebInspector.inspectorView.currentPanel() === this)
- this.sidebarPaneView.populateContextMenu(contextMenu);
+ this._populateContextMenuForSidebar(contextMenu);
},
/**
@@ -1167,9 +1164,75 @@
_contextMenuEventFired: function(event)
{
var contextMenu = new WebInspector.ContextMenu(event);
- this.sidebarPaneView.populateContextMenu(contextMenu);
+ this._populateContextMenuForSidebar(contextMenu);
contextMenu.show();
},
+ _sidebarContextMenuEventFired: function(event)
+ {
+ var contextMenu = new WebInspector.ContextMenu(event);
+ this._populateContextMenuForSidebar(contextMenu);
+ contextMenu.show();
+ },
+
+ _populateContextMenuForSidebar: function(contextMenu)
+ {
+ if (!WebInspector.experimentsSettings.horizontalPanelSplit.isEnabled())
+ return;
+
+ function toggleSetting(setting)
+ {
+ setting.set(!setting.get());
+ }
+ contextMenu.appendCheckboxItem(WebInspector.UIString(WebInspector.useLowerCaseMenuTitles() ? "Split horizontally" : "Split Horizontally"), toggleSetting.bind(this, this._splitDirectionSetting), this._splitDirectionSetting.get());
+
+ if (!this.splitView.isVertical())
+ contextMenu.appendCheckboxItem(WebInspector.UIString(WebInspector.useLowerCaseMenuTitles() ? "Split sidebar" : "Split Sidebar"), toggleSetting.bind(this, this._splitSidebarSetting), this._splitSidebarSetting.get());
+ },
+
+ _arrangeSidebarPanes: function()
+ {
+ if (this.sidebarPaneView)
+ this.sidebarPaneView.detach();
+
+ var vertical = !WebInspector.experimentsSettings.horizontalPanelSplit.isEnabled() || !this._splitDirectionSetting.get();
+ this.splitView.setVertical(vertical);
+
+ if (vertical) {
+ this.sidebarPaneView = new WebInspector.SidebarPaneStack();
+ for (var pane in this.sidebarPanes)
+ this.sidebarPaneView.addPane(this.sidebarPanes[pane]);
+ } else if (!this._splitSidebarSetting.get()) {
+ this.sidebarPaneView = new WebInspector.SidebarTabbedPane();
+ for (var pane in this.sidebarPanes)
+ this.sidebarPaneView.addPane(this.sidebarPanes[pane]);
+ } else {
+ this.sidebarPaneView = new WebInspector.SplitView(true, this.name + "PanelSplitSidebarRatio", 0.5);
+
+ var group1 = new WebInspector.SidebarPaneStack();
+ group1.show(this.sidebarPaneView.firstElement());
+ group1.addPane(this.sidebarPanes.watchExpressions);
+ group1.addPane(this.sidebarPanes.callstack);
+ group1.addPane(this.sidebarPanes.scopechain);
+
+ var group2 = new WebInspector.SidebarTabbedPane();
+ group2.show(this.sidebarPaneView.secondElement());
+ group2.addPane(this.sidebarPanes.jsBreakpoints);
+ group2.addPane(this.sidebarPanes.domBreakpoints);
+ group2.addPane(this.sidebarPanes.xhrBreakpoints);
+ group2.addPane(this.sidebarPanes.eventListenerBreakpoints);
+ }
+
+ this.sidebarPaneView.element.id = "scripts-debug-sidebar-contents";
+ this.sidebarPaneView.show(this.splitView.sidebarElement);
+
+ this.sidebarPanes.scopechain.expand();
+ this.sidebarPanes.jsBreakpoints.expand();
+ this.sidebarPanes.callstack.expand();
+
+ if (WebInspector.settings.watchExpressions.get().length > 0)
+ this.sidebarPanes.watchExpressions.expand();
+ },
+
__proto__: WebInspector.Panel.prototype
}
Modified: trunk/Source/WebCore/inspector/front-end/SidebarPane.js (143005 => 143006)
--- trunk/Source/WebCore/inspector/front-end/SidebarPane.js 2013-02-15 16:53:55 UTC (rev 143005)
+++ trunk/Source/WebCore/inspector/front-end/SidebarPane.js 2013-02-15 17:05:09 UTC (rev 143006)
@@ -43,9 +43,12 @@
this._title = title;
this._expandCallback = null;
- this._showCallback = null;
}
+WebInspector.SidebarPane.EventTypes = {
+ wasShown: "wasShown"
+}
+
WebInspector.SidebarPane.prototype = {
title: function()
{
@@ -61,26 +64,17 @@
callback();
},
- expanded: function()
- {
- return this._expanded;
- },
-
expand: function()
{
- this._expanded = true;
this.prepareContent(this.onContentReady.bind(this));
},
- collapse: function()
- {
- this._expanded = false;
- },
-
onContentReady: function()
{
if (this._expandCallback)
this._expandCallback();
+ else
+ this._expandPending = true;
},
/**
@@ -89,21 +83,16 @@
_setExpandCallback: function(callback)
{
this._expandCallback = callback;
+ if (this._expandPending) {
+ delete this._expandPending;
+ this._expandCallback();
+ }
},
- /**
- * @param {function()} callback
- */
- setShowCallback: function(callback)
- {
- this._showCallback = callback;
- },
-
wasShown: function()
{
WebInspector.View.prototype.wasShown.call(this);
- if (this._showCallback)
- this._showCallback();
+ this.dispatchEventToListeners(WebInspector.SidebarPane.EventTypes.wasShown);
},
__proto__: WebInspector.View.prototype
@@ -111,271 +100,100 @@
/**
* @constructor
- * @extends {WebInspector.View}
+ * @param {Element} container
+ * @param {WebInspector.SidebarPane} pane
*/
-WebInspector.SidebarPaneStack = function()
+WebInspector.SidebarPaneTitle = function(container, pane)
{
- WebInspector.View.call(this);
- this.element.className = "sidebar-pane-stack fill";
+ this._pane = pane;
- this._titles = [];
- this._panes = [];
+ this.element = container.createChild("div", "pane-title");
+ this.element.textContent = pane.title();
+ this.element.tabIndex = 0;
+ this.element.addEventListener("click", this._toggleExpanded.bind(this), false);
+ this.element.addEventListener("keydown", this._onTitleKeyDown.bind(this), false);
+ this.element.appendChild(this._pane.titleElement);
+
+ this._pane._setExpandCallback(this._expand.bind(this));
}
-WebInspector.SidebarPaneStack.prototype = {
- /**
- * @param {WebInspector.SidebarPane} pane
- */
- addPane: function(pane)
- {
- var index = this._panes.length;
- this._panes.push(pane);
+WebInspector.SidebarPaneTitle.prototype = {
- var title = this.element.createChild("div", "pane-title");
- title.textContent = pane.title();
- title.tabIndex = 0;
- title.addEventListener("click", this._togglePane.bind(this, index), false);
- title.addEventListener("keydown", this._onTitleKeyDown.bind(this, index), false);
- this._titles.push(title);
-
- pane.titleElement.removeSelf();
- title.appendChild(pane.titleElement);
-
- pane._setExpandCallback(this._onPaneExpanded.bind(this, index));
- this._setExpanded(index, pane.expanded());
- },
-
- activePaneId: function()
+ _expand: function()
{
- return this._activePaneIndex;
+ this.element.addStyleClass("expanded");
+ this._pane.show(this.element.parentNode, this.element.nextSibling);
},
- /**
- * @param {number} index
- */
- setActivePaneId: function(index)
+ _collapse: function()
{
- this._panes[index].expand();
+ this.element.removeStyleClass("expanded");
+ if (this._pane.element.parentNode == this.element.parentNode)
+ this._pane.detach();
},
- /**
- * @param {number} index
- */
- _isExpanded: function(index)
+ _toggleExpanded: function()
{
- var title = this._titles[index];
- return title.hasStyleClass("expanded");
- },
-
- /**
- * @param {number} index
- * @param {boolean} on
- */
- _setExpanded: function(index, on)
- {
- if (on)
- this._panes[index].expand();
+ if (this.element.hasStyleClass("expanded"))
+ this._collapse();
else
- this._collapsePane(index);
+ this._pane.expand();
},
/**
- * @param {number} index
- */
- _onPaneExpanded: function(index)
- {
- this._activePaneIndex = index;
- var pane = this._panes[index];
- var title = this._titles[index];
- title.addStyleClass("expanded");
- pane.show(this.element, title.nextSibling);
- },
-
- /**
- * @param {number} index
- */
- _collapsePane: function(index)
- {
- var pane = this._panes[index];
- var title = this._titles[index];
- title.removeStyleClass("expanded");
- pane.collapse();
- if (pane.element.parentNode == this.element)
- pane.detach();
- },
-
- /**
- * @param {number} index
- * @private
- */
- _togglePane: function(index)
- {
- this._setExpanded(index, !this._isExpanded(index));
- },
-
- /**
- * @param {number} index
* @param {Event} event
- * @private
*/
- _onTitleKeyDown: function(index, event)
+ _onTitleKeyDown: function(event)
{
if (isEnterKey(event) || event.keyCode === WebInspector.KeyboardShortcut.Keys.Space.code)
- this._togglePane(index);
- },
-
- __proto__: WebInspector.View.prototype
+ this._toggleExpanded();
+ }
}
/**
* @constructor
- * @extends {WebInspector.TabbedPane}
+ * @extends {WebInspector.View}
*/
-WebInspector.SidebarTabbedPane = function()
+WebInspector.SidebarPaneStack = function()
{
- WebInspector.TabbedPane.call(this);
- this.element.addStyleClass("sidebar-tabbed-pane");
-
- this._panes = [];
+ WebInspector.View.call(this);
+ this.element.className = "sidebar-pane-stack fill";
}
-WebInspector.SidebarTabbedPane.prototype = {
+WebInspector.SidebarPaneStack.prototype = {
/**
* @param {WebInspector.SidebarPane} pane
*/
addPane: function(pane)
{
- var index = this._panes.length;
- this._panes.push(pane);
- this.appendTab(index.toString(), pane.title(), pane);
-
- pane.titleElement.removeSelf();
- pane.element.appendChild(pane.titleElement);
-
- pane._setExpandCallback(this.setActivePaneId.bind(this, index));
+ new WebInspector.SidebarPaneTitle(this.element, pane);
},
- activePaneId: function()
- {
- return this.selectedTabId;
- },
-
- /**
- * @param {number} index
- */
- setActivePaneId: function(index)
- {
- this.selectTab(index.toString());
- },
-
- __proto__: WebInspector.TabbedPane.prototype
+ __proto__: WebInspector.View.prototype
}
/**
* @constructor
- * @extends {WebInspector.View}
+ * @extends {WebInspector.TabbedPane}
*/
-WebInspector.SidebarPaneGroup = function()
+WebInspector.SidebarTabbedPane = function()
{
- WebInspector.View.call(this);
- this.element.className = "fill";
-
- this._panes = [];
+ WebInspector.TabbedPane.call(this);
+ this.element.addStyleClass("sidebar-tabbed-pane");
}
-WebInspector.SidebarPaneGroup.prototype = {
+WebInspector.SidebarTabbedPane.prototype = {
/**
- * @param {boolean} stacked
- */
- setStacked: function(stacked)
- {
- if (this._stacked === stacked)
- return;
-
- this._stacked = stacked;
-
- var activePaneId;
- if (this._currentView) {
- activePaneId = this._currentView.activePaneId();
- this._currentView.detach();
- }
-
- if (this._stacked)
- this._currentView = new WebInspector.SidebarPaneStack();
- else
- this._currentView = new WebInspector.SidebarTabbedPane();
-
- for (var i = 0; i < this._panes.length; i++)
- this._currentView.addPane(this._panes[i]);
-
- this._currentView.show(this.element);
-
- if (typeof activePaneId !== "undefined")
- this._currentView.setActivePaneId(activePaneId);
- },
-
- /**
* @param {WebInspector.SidebarPane} pane
*/
addPane: function(pane)
{
- this._panes.push(pane);
- if (this._currentView)
- this._currentView.addPane(pane);
- },
+ var title = pane.title();
+ this.appendTab(title, title, pane);
+ pane.element.appendChild(pane.titleElement);
+ pane._setExpandCallback(this.selectTab.bind(this, title));
- /**
- * @param {WebInspector.Panel} panel
- */
- attachToPanel: function(panel)
- {
- this._sidebarView = panel.splitView;
-
- this._sidebarView.sidebarElement.addEventListener("contextmenu", this._contextMenuEventFired.bind(this), false);
-
- var splitDirectionSettingName = panel.name + "PanelSplitHorizontally";
- if (!WebInspector.settings[splitDirectionSettingName])
- WebInspector.settings[splitDirectionSettingName] = WebInspector.settings.createSetting(splitDirectionSettingName, false);
- this._splitDirectionSetting = WebInspector.settings[splitDirectionSettingName];
- this._splitDirectionSetting.addChangeListener(this._onSplitDirectionSettingChanged.bind(this));
-
- this._updateSplitDirection();
-
- this.show(this._sidebarView.sidebarElement);
},
- populateContextMenu: function(contextMenu)
- {
- if (!WebInspector.experimentsSettings.horizontalPanelSplit.isEnabled())
- return;
-
- function toggleSplitDirection()
- {
- this._splitDirectionSetting.set(!this._splitDirectionSetting.get());
- }
- contextMenu.appendCheckboxItem(WebInspector.UIString(WebInspector.useLowerCaseMenuTitles() ? "Split horizontally" : "Split Horizontally"), toggleSplitDirection.bind(this), this._splitDirectionSetting.get());
- },
-
- _contextMenuEventFired: function(event)
- {
- var contextMenu = new WebInspector.ContextMenu(event);
- this.populateContextMenu(contextMenu);
- contextMenu.show();
- },
-
- _updateSplitDirection: function()
- {
- var vertical = !WebInspector.experimentsSettings.horizontalPanelSplit.isEnabled() || !this._splitDirectionSetting.get();
- this._sidebarView.setVertical(vertical);
- this.setStacked(vertical);
- },
-
- _onSplitDirectionSettingChanged: function()
- {
- // Cannot call _updateSplitDirection directly because View.prototype.show() does not work properly from inside notifications.
- setTimeout(this._updateSplitDirection.bind(this), 0);
- },
-
- __proto__: WebInspector.View.prototype
+ __proto__: WebInspector.TabbedPane.prototype
}
-
Modified: trunk/Source/WebCore/inspector/front-end/SidebarView.js (143005 => 143006)
--- trunk/Source/WebCore/inspector/front-end/SidebarView.js 2013-02-15 16:53:55 UTC (rev 143005)
+++ trunk/Source/WebCore/inspector/front-end/SidebarView.js 2013-02-15 17:05:09 UTC (rev 143006)
@@ -62,22 +62,6 @@
WebInspector.SidebarView.prototype = {
/**
- * @return {Element}
- */
- get mainElement()
- {
- return this.isSidebarSecond() ? this.firstElement() : this.secondElement();
- },
-
- /**
- * @return {Element}
- */
- get sidebarElement()
- {
- return this.isSidebarSecond() ? this.secondElement() : this.firstElement();
- },
-
- /**
* @param {number} width
*/
setMinimumSidebarWidth: function(width)
Modified: trunk/Source/WebCore/inspector/front-end/SplitView.js (143005 => 143006)
--- trunk/Source/WebCore/inspector/front-end/SplitView.js 2013-02-15 16:53:55 UTC (rev 143005)
+++ trunk/Source/WebCore/inspector/front-end/SplitView.js 2013-02-15 17:05:09 UTC (rev 143006)
@@ -58,7 +58,7 @@
this._sidebarSizeSettingName = sidebarSizeSettingName;
- this._secondIsSidebar = true;
+ this.setSecondIsSidebar(true);
this._innerSetVertical(isVertical);
}
@@ -121,6 +121,22 @@
},
/**
+ * @return {Element}
+ */
+ get mainElement()
+ {
+ return this.isSidebarSecond() ? this.firstElement() : this.secondElement();
+ },
+
+ /**
+ * @return {Element}
+ */
+ get sidebarElement()
+ {
+ return this.isSidebarSecond() ? this.secondElement() : this.firstElement();
+ },
+
+ /**
* @return {boolean}
*/
isSidebarSecond: function()
