Diff
Modified: trunk/Source/WebCore/ChangeLog (107234 => 107235)
--- trunk/Source/WebCore/ChangeLog 2012-02-09 14:35:14 UTC (rev 107234)
+++ trunk/Source/WebCore/ChangeLog 2012-02-09 14:37:12 UTC (rev 107235)
@@ -1,3 +1,52 @@
+2012-02-09 Vsevolod Vlasov <[email protected]>
+
+ Web Inspector: Support hiding scripts panel debug sidebar.
+ https://bugs.webkit.org/show_bug.cgi?id=77543
+
+ Reviewed by Pavel Feldman.
+
+ * English.lproj/localizedStrings.js:
+ * WebCore.gypi:
+ * WebCore.vcproj/WebCore.vcproj:
+ * inspector/compile-front-end.sh:
+ * inspector/front-end/Dialog.js:
+ (WebInspector.Dialog):
+ (WebInspector.DialogDelegate.prototype.show):
+ * inspector/front-end/Images/navigatorPinButton.png: Added.
+ * inspector/front-end/Images/navigatorShowHideButton.png: Added.
+ * inspector/front-end/ScriptsNavigator.js:
+ (WebInspector.ScriptsNavigator):
+ (WebInspector.ScriptsNavigator.prototype.get view):
+ (WebInspector.ScriptsNavigator.prototype.get element):
+ (WebInspector.ScriptsNavigator.prototype.show):
+ (WebInspector.ScriptsNavigator.prototype.focus):
+ * inspector/front-end/ScriptsPanel.js:
+ (WebInspector.ScriptsPanel.prototype._fileSelected):
+ (WebInspector.ScriptsPanel.prototype._createDebugToolbar):
+ (WebInspector.ScriptsPanel.prototype._createNavigatorControls):
+ (WebInspector.ScriptsPanel.prototype._createNavigatorControlButton):
+ (WebInspector.ScriptsPanel.prototype._toggleNavigator):
+ (WebInspector.ScriptsPanel.prototype._hidePinnedNavigator):
+ (WebInspector.ScriptsPanel.prototype.set _pinNavigator):
+ (WebInspector.ScriptsPanel.prototype.set _showNavigatorOverlay):
+ (WebInspector.ScriptsPanel.prototype._hideNavigatorOverlay):
+ (WebInspector.ScriptsPanel.prototype._navigatorOverlayWasShown):
+ (WebInspector.ScriptsPanel.prototype._navigatorOverlayWillHide):
+ * inspector/front-end/SidebarOverlay.js: Added.
+ * inspector/front-end/SplitView.js:
+ (WebInspector.SplitView.prototype.get resizable):
+ (WebInspector.SplitView.prototype.hideMainElement):
+ (WebInspector.SplitView.prototype.showMainElement):
+ (WebInspector.SplitView.prototype.hideSidebarElement):
+ (WebInspector.SplitView.prototype.showSidebarElement):
+ (WebInspector.SplitView.prototype._resizerDragging):
+ * inspector/front-end/TabbedEditorContainer.js:
+ (WebInspector.TabbedEditorContainer.prototype.get element):
+ * inspector/front-end/WebKit.qrc:
+ * inspector/front-end/dialog.css:
+ * inspector/front-end/inspector.html:
+ * inspector/front-end/scriptsPanel.css:
+
2012-02-09 Alexei Filippov <[email protected]>
Web Inspector: Show percentage by default in heap profiler.
Modified: trunk/Source/WebCore/English.lproj/localizedStrings.js
(Binary files differ)
Modified: trunk/Source/WebCore/WebCore.gypi (107234 => 107235)
--- trunk/Source/WebCore/WebCore.gypi 2012-02-09 14:35:14 UTC (rev 107234)
+++ trunk/Source/WebCore/WebCore.gypi 2012-02-09 14:37:12 UTC (rev 107235)
@@ -6168,6 +6168,7 @@
'inspector/front-end/ShowMoreDataGridNode.js',
'inspector/front-end/Section.js',
'inspector/front-end/Settings.js',
+ 'inspector/front-end/SidebarOverlay.js',
'inspector/front-end/SidebarPane.js',
'inspector/front-end/SidebarTreeElement.js',
'inspector/front-end/SoftContextMenu.js',
@@ -6273,6 +6274,8 @@
'inspector/front-end/Images/graphLabelCalloutLeft.png',
'inspector/front-end/Images/graphLabelCalloutRight.png',
'inspector/front-end/Images/localStorage.png',
+ 'inspector/front-end/Images/navigatorShowHideButton.png',
+ 'inspector/front-end/Images/navigatorPinButton.png',
'inspector/front-end/Images/paneAddButtons.png',
'inspector/front-end/Images/paneBottomGrow.png',
'inspector/front-end/Images/paneBottomGrowActive.png',
Modified: trunk/Source/WebCore/WebCore.vcproj/WebCore.vcproj (107234 => 107235)
--- trunk/Source/WebCore/WebCore.vcproj/WebCore.vcproj 2012-02-09 14:35:14 UTC (rev 107234)
+++ trunk/Source/WebCore/WebCore.vcproj/WebCore.vcproj 2012-02-09 14:37:12 UTC (rev 107235)
@@ -72689,6 +72689,10 @@
>
</File>
<File
+ RelativePath="..\inspector\front-end\SidebarOverlay.js"
+ >
+ </File>
+ <File
RelativePath="..\inspector\front-end\SidebarPane.js"
>
</File>
Modified: trunk/Source/WebCore/inspector/compile-front-end.sh (107234 => 107235)
--- trunk/Source/WebCore/inspector/compile-front-end.sh 2012-02-09 14:35:14 UTC (rev 107234)
+++ trunk/Source/WebCore/inspector/compile-front-end.sh 2012-02-09 14:37:12 UTC (rev 107235)
@@ -76,7 +76,7 @@
--js Source/WebCore/inspector/front-end/ResourceUtils.js \
--js Source/WebCore/inspector/front-end/NetworkManager.js \
--js Source/WebCore/inspector/front-end/UISourceCode.js \
- --module jsmodule_ui:34:jsmodule_common \
+ --module jsmodule_ui:35:jsmodule_common \
--js Source/WebCore/inspector/front-end/AdvancedSearchController.js \
--js Source/WebCore/inspector/front-end/Checkbox.js \
--js Source/WebCore/inspector/front-end/ContextMenu.js \
@@ -99,6 +99,7 @@
--js Source/WebCore/inspector/front-end/SidebarTreeElement.js \
--js Source/WebCore/inspector/front-end/ShortcutsScreen.js \
--js Source/WebCore/inspector/front-end/ShowMoreDataGridNode.js \
+ --js Source/WebCore/inspector/front-end/SidebarOverlay.js \
--js Source/WebCore/inspector/front-end/SoftContextMenu.js \
--js Source/WebCore/inspector/front-end/SourceTokenizer.js \
--js Source/WebCore/inspector/front-end/SplitView.js \
Modified: trunk/Source/WebCore/inspector/front-end/Dialog.js (107234 => 107235)
--- trunk/Source/WebCore/inspector/front-end/Dialog.js 2012-02-09 14:35:14 UTC (rev 107234)
+++ trunk/Source/WebCore/inspector/front-end/Dialog.js 2012-02-09 14:37:12 UTC (rev 107235)
@@ -45,7 +45,6 @@
this._glassPaneElement.addEventListener("focus", this._onGlassPaneFocus.bind(this), false);
this._element = this._glassPaneElement.createChild("div");
- this._element.className = "dialog";
this._element.tabIndex = 0;
this._element.addEventListener("focus", this._onFocus.bind(this), false);
this._element.addEventListener("keydown", this._onKeyDown.bind(this), false);
@@ -54,8 +53,7 @@
WebInspector.KeyboardShortcut.Keys.Esc.code,
];
- delegate.element.addStyleClass("dialog-contents");
- this._element.appendChild(delegate.element);
+ delegate.show(this._element);
this._position();
this._windowResizeHandler = this._position.bind(this);
@@ -142,6 +140,7 @@
/**
* @constructor
+ * @extends {WebInspector.Object}
*/
WebInspector.DialogDelegate = function()
{
@@ -150,6 +149,16 @@
WebInspector.DialogDelegate.prototype = {
/**
* @param {Element} element
+ */
+ show: function(element)
+ {
+ element.appendChild(this.element);
+ this.element.addStyleClass("dialog-contents");
+ element.addStyleClass("dialog");
+ },
+
+ /**
+ * @param {Element} element
* @param {Element} relativeToElement
*/
position: function(element, relativeToElement)
@@ -172,3 +181,5 @@
willHide: function() { }
};
+
+WebInspector.DialogDelegate.prototype.__proto__ = WebInspector.Object.prototype;
Added: trunk/Source/WebCore/inspector/front-end/Images/navigatorPinButton.png
(Binary files differ)
Added: svn:mime-type
Added: trunk/Source/WebCore/inspector/front-end/Images/navigatorShowHideButton.png
(Binary files differ)
Added: svn:mime-type
Modified: trunk/Source/WebCore/inspector/front-end/ScriptsNavigator.js (107234 => 107235)
--- trunk/Source/WebCore/inspector/front-end/ScriptsNavigator.js 2012-02-09 14:35:14 UTC (rev 107234)
+++ trunk/Source/WebCore/inspector/front-end/ScriptsNavigator.js 2012-02-09 14:37:12 UTC (rev 107235)
@@ -41,9 +41,13 @@
this._presentationModel = presentationModel;
this._tabbedPane.element.id = "scripts-navigator-tabbed-pane";
+
+ this._tabbedPane.element.tabIndex = 0;
+ this._tabbedPane.element.addEventListener("focus", this.focus.bind(this), false);
this._treeSearchBox = document.createElement("div");
this._treeSearchBox.id = "scripts-navigator-tree-search-box";
+ this._tabbedPane.element.appendChild(this._treeSearchBox);
this._navigatorScriptsTreeElement = document.createElement("ol");
var scriptsView = new WebInspector.View();
@@ -85,14 +89,37 @@
},
/**
+ * @type {WebInspector.View}
+ */
+ get view()
+ {
+ return this._tabbedPane;
+ },
+
+ /**
+ * @type {Element}
+ */
+ get element()
+ {
+ return this._tabbedPane.element;
+ },
+
+ /**
* @param {Element} element
*/
show: function(element)
{
this._tabbedPane.show(element);
- element.appendChild(this._treeSearchBox);
},
+ focus: function()
+ {
+ if (this._tabbedPane.selectedTabId === WebInspector.ScriptsNavigator.ScriptsTab)
+ WebInspector.setCurrentFocusElement(this._navigatorScriptsTreeElement);
+ else
+ WebInspector.setCurrentFocusElement(this._navigatorContentScriptsTreeElement);
+ },
+
/**
* @param {WebInspector.UISourceCode} uiSourceCode
*/
Modified: trunk/Source/WebCore/inspector/front-end/ScriptsPanel.js (107234 => 107235)
--- trunk/Source/WebCore/inspector/front-end/ScriptsPanel.js 2012-02-09 14:35:14 UTC (rev 107234)
+++ trunk/Source/WebCore/inspector/front-end/ScriptsPanel.js 2012-02-09 14:37:12 UTC (rev 107235)
@@ -64,23 +64,26 @@
const initialNavigatorWidth = 225;
const minimalViewsContainerWidthPercent = 50;
this.editorView = new WebInspector.SplitView(WebInspector.SplitView.SidebarPosition.Left, "scriptsPanelNavigatorSidebarWidth", initialNavigatorWidth);
+ this.editorView.element.id = "scripts-editor-view";
this.editorView.minimalSidebarWidth = Preferences.minScriptsSidebarWidth;
this.editorView.minimalMainWidthPercent = minimalViewsContainerWidthPercent;
this.editorView.show(this.splitView.mainElement);
- this._fileSelector = new WebInspector.ScriptsNavigator(this._presentationModel);
-
+ this._navigator = new WebInspector.ScriptsNavigator(this._presentationModel);
+ this._navigatorView = this._navigator.view;
+ this._fileSelector = this._navigator;
this._fileSelector.show(this.editorView.sidebarElement);
- this._navigatorResizeWidgetElement = document.createElement("div");
- this._navigatorResizeWidgetElement.id = "scripts-navigator-resizer-widget";
- this.editorView.installResizer(this._navigatorResizeWidgetElement);
- this.editorView.sidebarElement.appendChild(this._navigatorResizeWidgetElement);
-
- this._editorContainer = new WebInspector.TabbedEditorContainer(this);
+ this._tabbedEditorContainer = new WebInspector.TabbedEditorContainer(this);
+ this._editorContainer = this._tabbedEditorContainer;
this._editorContainer.show(this.editorView.mainElement);
WebInspector.OpenResourceDialog.install(this, this._presentationModel, this.editorView.mainElement);
+
+ this._createNavigatorControls();
+ WebInspector.settings.navigatorHidden = WebInspector.settings.createSetting("navigatorHidden", true);
+ if (WebInspector.settings.navigatorHidden.get())
+ this._toggleNavigator();
} else {
this._fileSelector = new WebInspector.ScriptsPanel.ComboBoxFileSelector(this._presentationModel);
this._fileSelector.show(this.splitView.mainElement);
@@ -647,6 +650,8 @@
_fileSelected: function(event)
{
+ if (this._navigatorOverlayShown)
+ this._hideNavigatorOverlay();
var uiSourceCode = /** @type {WebInspector.UISourceCode} */ event.data;
this._showFile(uiSourceCode);
},
@@ -906,10 +911,116 @@
this.debuggerStatusElement = document.createElement("div");
this.debuggerStatusElement.id = "scripts-debugger-status";
debugToolbar.appendChild(this.debuggerStatusElement);
-
+
return debugToolbar;
},
+ _createNavigatorControls: function()
+ {
+ this._navigatorSidebarResizeWidgetElement = document.createElement("div");
+ this._navigatorSidebarResizeWidgetElement.addStyleClass("scripts-navigator-resizer-widget");
+ this.editorView.installResizer(this._navigatorSidebarResizeWidgetElement);
+ this._navigatorView.element.appendChild(this._navigatorSidebarResizeWidgetElement);
+
+ this._navigatorShowHideButton = this._createNavigatorControlButton(WebInspector.UIString("Show scripts navigator"), "scripts-navigator-show-hide-button", this._toggleNavigator.bind(this));
+ this._navigatorShowHideButton.addStyleClass("toggled-on");
+ this._navigatorShowHideButton.title = WebInspector.UIString("Hide scripts navigator");
+ this.editorView.element.appendChild(this._navigatorShowHideButton);
+
+ this._navigatorPinButton = this._createNavigatorControlButton(WebInspector.UIString("Pin scripts navigator"), "scripts-navigator-pin-button", this._pinNavigator.bind(this));
+ this._navigatorPinButton.addStyleClass("hidden");
+ this._navigatorView.element.appendChild(this._navigatorPinButton);
+ },
+
+ _createNavigatorControlButton: function(title, id, listener)
+ {
+ var button = document.createElement("button");
+ button.title = title;
+ button.id = id;
+ button.addStyleClass("scripts-navigator-control-button");
+ button.addEventListener("click", listener, false);
+ button.createChild("div", "glyph");
+ return button;
+ },
+
+ _toggleNavigator: function()
+ {
+ if (this._navigatorOverlayShown)
+ this._hideNavigatorOverlay();
+ else if (this._navigatorHidden)
+ this._showNavigatorOverlay();
+ else
+ this._hidePinnedNavigator();
+ },
+
+ _hidePinnedNavigator: function()
+ {
+ this._navigatorHidden = true;
+ this._navigatorShowHideButton.removeStyleClass("toggled-on");
+ this._navigatorShowHideButton.title = WebInspector.UIString("Show scripts navigator");
+ this._tabbedEditorContainer.element.addStyleClass("navigator-hidden");
+ this._navigatorSidebarResizeWidgetElement.addStyleClass("hidden");
+
+ this._navigatorPinButton.removeStyleClass("hidden");
+
+ this.editorView.hideSidebarElement();
+ this._navigatorView.detach();
+ WebInspector.settings.navigatorHidden.set(true);
+ },
+
+ _pinNavigator: function()
+ {
+ delete this._navigatorHidden;
+ this._hideNavigatorOverlay();
+
+ this._navigatorPinButton.addStyleClass("hidden");
+ this._navigatorShowHideButton.addStyleClass("toggled-on");
+ this._navigatorShowHideButton.title = WebInspector.UIString("Hide scripts navigator");
+
+ this._tabbedEditorContainer.element.removeStyleClass("navigator-hidden");
+ this._navigatorSidebarResizeWidgetElement.removeStyleClass("hidden");
+
+ this.editorView.showSidebarElement();
+ this._navigator.show(this.editorView.sidebarElement);
+ this._navigator.focus();
+ WebInspector.settings.navigatorHidden.set(false);
+ },
+
+ _showNavigatorOverlay: function()
+ {
+ this._navigatorOverlayShown = true;
+ var sidebarOverlay = new WebInspector.SidebarOverlay(this._navigatorView, "scriptsPanelNavigatorOverlayWidth", Preferences.minScriptsSidebarWidth);
+ sidebarOverlay.addEventListener(WebInspector.SidebarOverlay.EventTypes.WasShown, this._navigatorOverlayWasShown, this);
+ sidebarOverlay.addEventListener(WebInspector.SidebarOverlay.EventTypes.WillHide, this._navigatorOverlayWillHide, this);
+
+ var navigatorOverlayResizeWidgetElement = document.createElement("div");
+ navigatorOverlayResizeWidgetElement.addStyleClass("scripts-navigator-resizer-widget");
+ sidebarOverlay.resizerWidgetElement = navigatorOverlayResizeWidgetElement;
+
+ sidebarOverlay.start(this.editorView.element);
+ },
+
+ _hideNavigatorOverlay: function()
+ {
+ delete this._navigatorOverlayShown;
+ WebInspector.Dialog.hide();
+ },
+
+ _navigatorOverlayWasShown: function(event)
+ {
+ this._navigatorView.element.appendChild(this._navigatorShowHideButton);
+ this._navigatorShowHideButton.addStyleClass("toggled-on");
+ this._navigatorShowHideButton.title = WebInspector.UIString("Hide scripts navigator");
+ this._navigator.focus();
+ },
+
+ _navigatorOverlayWillHide: function(event)
+ {
+ this.editorView.element.appendChild(this._navigatorShowHideButton);
+ this._navigatorShowHideButton.removeStyleClass("toggled-on");
+ this._navigatorShowHideButton.title = WebInspector.UIString("Show scripts navigator");
+ },
+
_createButtonAndRegisterShortcuts: function(buttonId, buttonTitle, handler, shortcuts, shortcutDescription)
{
var button = document.createElement("button");
Added: trunk/Source/WebCore/inspector/front-end/SidebarOverlay.js (0 => 107235)
--- trunk/Source/WebCore/inspector/front-end/SidebarOverlay.js (rev 0)
+++ trunk/Source/WebCore/inspector/front-end/SidebarOverlay.js 2012-02-09 14:37:12 UTC (rev 107235)
@@ -0,0 +1,194 @@
+/*
+ * Copyright (C) 2012 Google Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions are
+ * met:
+ *
+ * * Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * * Redistributions in binary form must reproduce the above
+ * copyright notice, this list of conditions and the following disclaimer
+ * in the documentation and/or other materials provided with the
+ * distribution.
+ * * Neither the name of Google Inc. nor the names of its
+ * contributors may be used to endorse or promote products derived from
+ * this software without specific prior written permission.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+ * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+ * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+ * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+ * OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+ * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+ * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+ * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+ * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+ * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+/**
+ * @constructor
+ * @extends {WebInspector.DialogDelegate}
+ * @param {WebInspector.View} view
+ * @param {string} widthSettingName
+ * @param {number} minimalWidth
+ */
+WebInspector.SidebarOverlay = function(view, widthSettingName, minimalWidth)
+{
+ WebInspector.DialogDelegate.call(this);
+
+ this._view = view;
+ this._widthSettingName = widthSettingName;
+ this._minimalWidth = minimalWidth;
+ this._savedWidth = minimalWidth || 300;
+
+ if (this._widthSettingName)
+ WebInspector.settings[this._widthSettingName] = WebInspector.settings.createSetting(this._widthSettingName, undefined);
+
+ this._resizerElement = document.createElement("div");
+ this._resizerElement.className = "sidebar-overlay-resizer";
+ this._installResizer(this._resizerElement);
+}
+
+WebInspector.SidebarOverlay.EventTypes = {
+ WasShown: "WasShown",
+ WillHide: "WillHide"
+}
+
+WebInspector.SidebarOverlay.prototype = {
+ /**
+ * @param {Element} element
+ */
+ show: function(element)
+ {
+ this._element = element;
+ element.addStyleClass("sidebar-overlay-dialog");
+ this._view.markAsRoot();
+ this._view.show(element);
+ this._element.appendChild(this._resizerElement);
+ if (this._resizerWidgetElement)
+ this._element.appendChild(this._resizerWidgetElement);
+
+ this.dispatchEventToListeners(WebInspector.SidebarOverlay.EventTypes.WasShown, null);
+ },
+
+ /**
+ * @param {Element} element
+ * @param {Element} relativeToElement
+ */
+ position: function(element, relativeToElement)
+ {
+ this._totalWidth = relativeToElement.offsetWidth;
+
+ var offset = relativeToElement.offsetRelativeToWindow(window);
+ element.style.left = offset.x + "px";
+ element.style.top = offset.y + "px";
+ this._setWidth(this._preferredWidth());
+ element.style.height = relativeToElement.offsetHeight + "px";
+ },
+
+ focus: function()
+ {
+ WebInspector.setCurrentFocusElement(this._view.element);
+ },
+
+ willHide: function() {
+ this._view.detach();
+ this.dispatchEventToListeners(WebInspector.SidebarOverlay.EventTypes.WillHide, null);
+ },
+
+ /**
+ * @param {Element} relativeToElement
+ */
+ start: function(relativeToElement)
+ {
+ WebInspector.Dialog.show(relativeToElement, this);
+ },
+
+ /**
+ * @param {number} newWidth
+ */
+ _setWidth: function(newWidth)
+ {
+ var width = Number.constrain(newWidth, this._minimalWidth, this._totalWidth);
+
+ if (this._width === width)
+ return;
+
+ this._element.style.width = width + "px";
+ this._resizerElement.style.left = (width - 3) + "px";
+ this._width = width;
+ this._view.doResize();
+ this._saveWidth();
+ },
+
+ /**
+ * @return {number}
+ */
+ _preferredWidth: function()
+ {
+ if (!this._widthSettingName)
+ return this._savedWidth;
+
+ return WebInspector.settings[this._widthSettingName].get() || this._savedWidth;
+ },
+
+ _saveWidth: function()
+ {
+ this._savedWidth = this._width;
+ if (!this._widthSettingName)
+ return;
+
+ WebInspector.settings[this._widthSettingName].set(this._width);
+ },
+
+ /**
+ * @param {Event} event
+ */
+ _startResizerDragging: function(event)
+ {
+ var width = this._width;
+ this._dragOffset = width - event.pageX;
+ WebInspector.elementDragStart(this._resizerElement, this._resizerDragging.bind(this), this._endResizerDragging.bind(this), event, "ew-resize");
+ },
+
+ /**
+ * @param {Event} event
+ */
+ _resizerDragging: function(event)
+ {
+ var width = event.pageX + this._dragOffset;
+ this._setWidth(width);
+ event.preventDefault();
+ },
+
+ /**
+ * @param {Event} event
+ */
+ _endResizerDragging: function(event)
+ {
+ delete this._dragOffset;
+ WebInspector.elementDragEnd(event);
+ },
+
+ /**
+ * @param {Element} resizerElement
+ */
+ _installResizer: function(resizerElement)
+ {
+ resizerElement.addEventListener("mousedown", this._startResizerDragging.bind(this), false);
+ },
+
+ /**
+ * @type {Element}
+ */
+ set resizerWidgetElement(resizerWidgetElement)
+ {
+ this._resizerWidgetElement = resizerWidgetElement;
+ this._installResizer(resizerWidgetElement);
+ }
+}
+
+WebInspector.SidebarOverlay.prototype.__proto__ = WebInspector.DialogDelegate.prototype;
Property changes on: trunk/Source/WebCore/inspector/front-end/SidebarOverlay.js
___________________________________________________________________
Added: svn:eol-style
Modified: trunk/Source/WebCore/inspector/front-end/SplitView.js (107234 => 107235)
--- trunk/Source/WebCore/inspector/front-end/SplitView.js 2012-02-09 14:35:14 UTC (rev 107234)
+++ trunk/Source/WebCore/inspector/front-end/SplitView.js 2012-02-09 14:37:12 UTC (rev 107235)
@@ -73,7 +73,7 @@
}
WebInspector.SplitView.EventTypes = {
- Resized: "Resized",
+ Resized: "Resized"
}
/**
@@ -114,7 +114,7 @@
*/
get resizable()
{
- return this._resizable && !this._mainElementHidden && !this._sidebarElementHidden
+ return this._resizable && !this._mainElementHidden && !this._sidebarElementHidden;
},
/**
@@ -288,6 +288,7 @@
this._mainElementHidden = true;
this._updateResizer();
this._restoreSidebarWidth();
+ this.doResize();
},
showMainElement: function()
@@ -306,6 +307,7 @@
this._mainElementHidden = false;
this._updateResizer();
this._restoreSidebarWidth();
+ this.doResize();
},
hideSidebarElement: function()
@@ -320,6 +322,7 @@
this._sidebarElementHidden = true;
this._updateResizer();
this._restoreSidebarWidth();
+ this.doResize();
},
showSidebarElement: function()
@@ -331,6 +334,7 @@
this._sidebarElementHidden = false;
this._updateResizer();
this._restoreSidebarWidth();
+ this.doResize();
},
wasShown: function()
@@ -366,7 +370,7 @@
*/
_resizerDragging: function(event)
{
- var leftWidth = event.pageX + this._dragOffset
+ var leftWidth = event.pageX + this._dragOffset;
var rightWidth = this._totalWidth - leftWidth;
var sidebarWidth = this.hasLeftSidebar ? leftWidth : rightWidth;
Modified: trunk/Source/WebCore/inspector/front-end/TabbedEditorContainer.js (107234 => 107235)
--- trunk/Source/WebCore/inspector/front-end/TabbedEditorContainer.js 2012-02-09 14:35:14 UTC (rev 107234)
+++ trunk/Source/WebCore/inspector/front-end/TabbedEditorContainer.js 2012-02-09 14:37:12 UTC (rev 107235)
@@ -65,6 +65,14 @@
},
/**
+ * @type {Element}
+ */
+ get element()
+ {
+ return this._tabbedPane.element;
+ },
+
+ /**
* @param {Element} parentElement
*/
show: function(parentElement)
Modified: trunk/Source/WebCore/inspector/front-end/WebKit.qrc (107234 => 107235)
--- trunk/Source/WebCore/inspector/front-end/WebKit.qrc 2012-02-09 14:35:14 UTC (rev 107234)
+++ trunk/Source/WebCore/inspector/front-end/WebKit.qrc 2012-02-09 14:37:12 UTC (rev 107235)
@@ -126,6 +126,7 @@
<file>SettingsScreen.js</file>
<file>ShortcutsScreen.js</file>
<file>ShowMoreDataGridNode.js</file>
+ <file>SidebarOverlay.js</file>
<file>SidebarPane.js</file>
<file>SidebarTreeElement.js</file>
<file>SoftContextMenu.js</file>
@@ -224,6 +225,8 @@
<file>Images/graphLabelCalloutLeft.png</file>
<file>Images/graphLabelCalloutRight.png</file>
<file>Images/localStorage.png</file>
+ <file>Images/navigatorShowHideButton.png</file>
+ <file>Images/navigatorPinButton.png</file>
<file>Images/paneAddButtons.png</file>
<file>Images/paneBottomGrow.png</file>
<file>Images/paneBottomGrowActive.png</file>
Modified: trunk/Source/WebCore/inspector/front-end/dialog.css (107234 => 107235)
--- trunk/Source/WebCore/inspector/front-end/dialog.css 2012-02-09 14:35:14 UTC (rev 107234)
+++ trunk/Source/WebCore/inspector/front-end/dialog.css 2012-02-09 14:37:12 UTC (rev 107235)
@@ -53,3 +53,24 @@
background-color: rgb(215, 215, 215);
background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(194, 194, 194)), to(rgb(239, 239, 239)));
}
+
+.sidebar-overlay-dialog {
+ position: absolute;
+ display: -webkit-box;
+ height: 0;
+ width: 0;
+ -webkit-box-orient: vertical;
+ z-index: -1;
+ background-color: white;
+ border-right: 1px solid gray;
+ -webkit-box-shadow: rgb(90,90,90) 20px 0px 50px -25px;
+}
+
+.sidebar-overlay-resizer {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ width: 5px;
+ z-index: 500;
+ cursor: ew-resize;
+}
Modified: trunk/Source/WebCore/inspector/front-end/inspector.html (107234 => 107235)
--- trunk/Source/WebCore/inspector/front-end/inspector.html 2012-02-09 14:35:14 UTC (rev 107234)
+++ trunk/Source/WebCore/inspector/front-end/inspector.html 2012-02-09 14:37:12 UTC (rev 107235)
@@ -181,6 +181,7 @@
<script type="text/_javascript_" src=""
<script type="text/_javascript_" src=""
<script type="text/_javascript_" src=""
+ <script type="text/_javascript_" src=""
<script type="text/_javascript_" src=""
<script type="text/_javascript_" src=""
<script type="text/_javascript_" src=""
Modified: trunk/Source/WebCore/inspector/front-end/scriptsPanel.css (107234 => 107235)
--- trunk/Source/WebCore/inspector/front-end/scriptsPanel.css 2012-02-09 14:35:14 UTC (rev 107234)
+++ trunk/Source/WebCore/inspector/front-end/scriptsPanel.css 2012-02-09 14:37:12 UTC (rev 107235)
@@ -142,7 +142,7 @@
z-index: 13;
}
-#scripts-navigator-resizer-widget {
+.scripts-navigator-resizer-widget {
position: absolute;
top: 0;
right: 0;
@@ -154,6 +154,50 @@
background-position: center;
}
+.scripts-navigator-control-button {
+ position: absolute;
+ padding: 0;
+ margin: 0;
+ border: 0 transparent none;
+ background-color: transparent;
+}
+
+#scripts-navigator-show-hide-button {
+ top: 3px;
+ height: 16px;
+ left: 2px;
+ width: 16px;
+}
+
+#scripts-navigator-show-hide-button .glyph {
+ -webkit-mask-image: url(Images/navigatorShowHideButton.png);
+}
+
+#scripts-navigator-show-hide-button:active .glyph {
+ top: 1px;
+ bottom: -1px;
+}
+
+#scripts-navigator-show-hide-button.toggled-on .glyph {
+ background-color: #4281EB;
+}
+
+#scripts-navigator-pin-button {
+ top: 6px;
+ height: 10px;
+ right: 16px;
+ width: 10px;
+}
+
+#scripts-navigator-pin-button .glyph {
+ -webkit-mask-image: url(Images/navigatorPinButton.png);
+}
+
+#scripts-navigator-pin-button:active .glyph {
+ top: 1px;
+ bottom: -1px;
+}
+
.scripts-views-container {
position: absolute;
top: 23px;
@@ -203,7 +247,7 @@
content: url(Images/resourceJSIcon.png);
}
-.scripts.panel .navigator {
+#scripts-navigator-tabbed-pane .navigator {
padding-left: 0;
}
@@ -234,8 +278,8 @@
}
#scripts-navigator-tabbed-pane .tabbed-pane-header-contents {
- margin-left: 1px;
- margin-right: 16px;
+ margin-left: 20px;
+ margin-right: 28px;
}
#scripts-editor-container-tabbed-pane .tabbed-pane-header {
@@ -247,48 +291,52 @@
margin-right: 16px;
}
+#scripts-editor-container-tabbed-pane.navigator-hidden .tabbed-pane-header-contents {
+ margin-left: 20px;
+}
+
#scripts-editor-container-tabbed-pane .tabbed-pane-header-tab {
border-bottom: 1px solid #BBB;
}
-.scripts.panel .navigator li {
+#scripts-navigator-tabbed-pane .navigator li {
height: 17px;
white-space: nowrap;
}
-.scripts.panel .navigator :focus li.selected {
+#scripts-navigator-tabbed-pane .navigator :focus li.selected {
color: white;
}
-.scripts.panel .navigator li.selected .selection {
+#scripts-navigator-tabbed-pane .navigator li.selected .selection {
height: 17px;
background-color: rgb(180, 180, 180);
}
-.scripts.panel .navigator :focus li.selected .selection {
+#scripts-navigator-tabbed-pane .navigator :focus li.selected .selection {
background-color: rgb(111, 140, 210);
}
-.scripts.panel .navigator .search-match-found li.selected .selection {
+#scripts-navigator-tabbed-pane .navigator .search-match-found li.selected .selection {
background-color: rgb(111, 140, 210);
}
-.scripts.panel .navigator .search-match-not-found li.selected .selection {
+#scripts-navigator-tabbed-pane .navigator .search-match-not-found li.selected .selection {
border-color: rgb(111, 140, 210);
background-color: white;
}
-.scripts.panel .navigator .searching li.selected .selection {
+#scripts-navigator-tabbed-pane .navigator .searching li.selected .selection {
background-color: rgb(111, 140, 210);
}
-.scripts.panel .navigator .icon {
+#scripts-navigator-tabbed-pane .navigator .icon {
width: 16px;
height: 16px;
float: left;
}
-.scripts.panel .base-navigator-tree-element-title {
+#scripts-navigator-tabbed-pane .navigator .base-navigator-tree-element-title {
overflow: hidden;
text-overflow: ellipsis;
position: relative;
