- Revision
- 97264
- Author
- vse...@chromium.org
- Date
- 2011-10-12 08:29:02 -0700 (Wed, 12 Oct 2011)
Log Message
Web Inspector: Fix Drawer to make it possible to show views other than Console.
https://bugs.webkit.org/show_bug.cgi?id=69831
Reviewed by Pavel Feldman.
Animation type extracted to distinguish between slow and normal
animation and immediate show/hide.
Implemented correct console toggle button behavior on showing views
other than console in Drawer.
View shown in Drawer is now shown in drawer-contents div with common
styles moved there.
Removed unused "_safelyRemoveChildren" method from Drawer.
* inspector/front-end/ConsolePanel.js:
(WebInspector.ConsolePanel.prototype.show):
(WebInspector.ConsolePanel.prototype.hide):
* inspector/front-end/Drawer.js:
(WebInspector.Drawer):
(WebInspector.Drawer.prototype.show):
(WebInspector.Drawer.prototype.hide):
(WebInspector.Drawer.prototype._animationDuration):
* inspector/front-end/inspector.css:
(body.drawer-visible #drawer-contents):
* inspector/front-end/inspector.js:
(WebInspector._toggleConsoleButtonClicked):
(WebInspector._escPressed):
(WebInspector.showViewInDrawer):
(WebInspector.documentKeyDown):
Modified Paths
Diff
Modified: trunk/Source/WebCore/ChangeLog (97263 => 97264)
--- trunk/Source/WebCore/ChangeLog 2011-10-12 15:27:09 UTC (rev 97263)
+++ trunk/Source/WebCore/ChangeLog 2011-10-12 15:29:02 UTC (rev 97264)
@@ -1,3 +1,34 @@
+2011-10-12 Vsevolod Vlasov <vse...@chromium.org>
+
+ Web Inspector: Fix Drawer to make it possible to show views other than Console.
+ https://bugs.webkit.org/show_bug.cgi?id=69831
+
+ Reviewed by Pavel Feldman.
+
+ Animation type extracted to distinguish between slow and normal
+ animation and immediate show/hide.
+ Implemented correct console toggle button behavior on showing views
+ other than console in Drawer.
+ View shown in Drawer is now shown in drawer-contents div with common
+ styles moved there.
+ Removed unused "_safelyRemoveChildren" method from Drawer.
+
+ * inspector/front-end/ConsolePanel.js:
+ (WebInspector.ConsolePanel.prototype.show):
+ (WebInspector.ConsolePanel.prototype.hide):
+ * inspector/front-end/Drawer.js:
+ (WebInspector.Drawer):
+ (WebInspector.Drawer.prototype.show):
+ (WebInspector.Drawer.prototype.hide):
+ (WebInspector.Drawer.prototype._animationDuration):
+ * inspector/front-end/inspector.css:
+ (body.drawer-visible #drawer-contents):
+ * inspector/front-end/inspector.js:
+ (WebInspector._toggleConsoleButtonClicked):
+ (WebInspector._escPressed):
+ (WebInspector.showViewInDrawer):
+ (WebInspector.documentKeyDown):
+
2011-10-12 Yury Semikhatsky <yu...@chromium.org>
[v8] Use V8DOMWrapper::isWrapperOfType for determining global object type
Modified: trunk/Source/WebCore/inspector/front-end/ConsolePanel.js (97263 => 97264)
--- trunk/Source/WebCore/inspector/front-end/ConsolePanel.js 2011-10-12 15:27:09 UTC (rev 97263)
+++ trunk/Source/WebCore/inspector/front-end/ConsolePanel.js 2011-10-12 15:29:02 UTC (rev 97264)
@@ -52,7 +52,7 @@
show: function()
{
if (WebInspector.drawer.visible) {
- WebInspector.drawer.hide(true);
+ WebInspector.drawer.hide(WebInspector.Drawer.AnimationType.Immediately);
this._drawerWasVisible = true;
}
WebInspector.Panel.prototype.show.call(this);
@@ -66,7 +66,7 @@
WebInspector.Panel.prototype.hide.call(this);
this.removeChildView(this._view);
if (this._drawerWasVisible) {
- WebInspector.drawer.show(this._view, true);
+ WebInspector.drawer.show(this._view, WebInspector.Drawer.AnimationType.Immediately);
delete this._drawerWasVisible;
}
},
Modified: trunk/Source/WebCore/inspector/front-end/Drawer.js (97263 => 97264)
--- trunk/Source/WebCore/inspector/front-end/Drawer.js 2011-10-12 15:27:09 UTC (rev 97263)
+++ trunk/Source/WebCore/inspector/front-end/Drawer.js 2011-10-12 15:29:02 UTC (rev 97264)
@@ -39,6 +39,12 @@
this._mainStatusBar = document.getElementById("main-status-bar");
this._mainStatusBar.addEventListener("mousedown", this._startStatusBarDragging.bind(this), true);
this._counters = document.getElementById("counters");
+
+ this._drawerContentsElement = document.createElement("div");
+ this._drawerContentsElement.id = "drawer-contents";
+ this._drawerContentsElement.className = "drawer-contents";
+ this.element.appendChild(this._drawerContentsElement);
+
this._drawerStatusBar = document.createElement("div");
this._drawerStatusBar.id = "drawer-status-bar";
this._drawerStatusBar.className = "status-bar";
@@ -48,6 +54,12 @@
this._drawerStatusBar.appendChild(this._viewStatusBar);
}
+WebInspector.Drawer.AnimationType = {
+ Immediately: 0,
+ Normal: 1,
+ Slow: 2
+}
+
WebInspector.Drawer.prototype = {
get visible()
{
@@ -59,28 +71,30 @@
return Number.constrain(height, Preferences.minConsoleHeight, window.innerHeight - this._mainElement.totalOffsetTop() - Preferences.minConsoleHeight);
},
- show: function(view, immediately)
+ show: function(view, animationType)
{
this.immediatelyFinishAnimation();
var drawerWasVisible = this.visible;
- if (this._view)
- this.element.removeChild(this._view.element);
+ if (this._view) {
+ this._drawerContentsElement.removeChildren();
+ this._view.hide();
+ }
this._view = view;
var statusBarItems = this._view.statusBarItems || [];
+ this._viewStatusBar.removeChildren();
for (var i = 0; i < statusBarItems.length; ++i)
this._viewStatusBar.appendChild(statusBarItems[i]);
+ document.body.addStyleClass("drawer-visible");
+ this._view.show(this._drawerContentsElement);
+
if (drawerWasVisible)
return;
-
- document.body.addStyleClass("drawer-visible");
-
- this._view.show(this.element);
-
+
var anchoredItems = document.getElementById("anchored-status-bar-items");
var height = this._constrainHeight(this._savedHeight || this.element.offsetHeight);
var animations = [
@@ -111,12 +125,12 @@
this._currentPanelCounters.removeAttribute("style");
}
- this._currentAnimation = WebInspector.animateStyle(animations, this._animationDuration(), animationFinished.bind(this));
- if (immediately)
+ this._currentAnimation = WebInspector.animateStyle(animations, this._animationDuration(animationType), animationFinished.bind(this));
+ if (animationType === WebInspector.Drawer.AnimationType.Immediately)
this._currentAnimation.forceComplete();
},
- hide: function(immediately)
+ hide: function(animationType)
{
this.immediatelyFinishAnimation();
if (!this.visible)
@@ -162,14 +176,14 @@
}
this._view.hide();
- this.element.removeChild(this._view.element);
+ this._drawerContentsElement.removeChildren();
delete this._view;
document.body.removeStyleClass("drawer-visible");
delete this._currentAnimation;
}
- this._currentAnimation = WebInspector.animateStyle(animations, this._animationDuration(), animationFinished.bind(this));
- if (immediately)
+ this._currentAnimation = WebInspector.animateStyle(animations, this._animationDuration(animationType), animationFinished.bind(this));
+ if (animationType === WebInspector.Drawer.AnimationType.Immediately)
this._currentAnimation.forceComplete();
},
@@ -207,24 +221,18 @@
this._counters.insertBefore(x, this._counters.firstChild);
},
- _animationDuration: function()
+ _animationDuration: function(animationType)
{
- return (window.event && window.event.shiftKey ? 2000 : 250);
+ switch (animationType) {
+ case WebInspector.Drawer.AnimationType.Slow:
+ return 2000;
+ case WebInspector.Drawer.AnimationType.Normal:
+ return 250;
+ default:
+ return 0;
+ }
},
- _safelyRemoveChildren: function()
- {
- var child = this.element.firstChild;
- while (child) {
- if (child.id !== "drawer-status-bar") {
- var moveTo = child.nextSibling;
- this.element.removeChild(child);
- child = moveTo;
- } else
- child = child.nextSibling;
- }
- },
-
_startStatusBarDragging: function(event)
{
if (!this.visible || event.target !== this._mainStatusBar)
Modified: trunk/Source/WebCore/inspector/front-end/inspector.css (97263 => 97264)
--- trunk/Source/WebCore/inspector/front-end/inspector.css 2011-10-12 15:27:09 UTC (rev 97263)
+++ trunk/Source/WebCore/inspector/front-end/inspector.css 2011-10-12 15:29:02 UTC (rev 97264)
@@ -592,6 +592,14 @@
background-position: bottom;
}
+body.drawer-visible #drawer-contents {
+ position: absolute;
+ top: 0;
+ bottom: 23px;
+ left: 0;
+ right: 0;
+}
+
body.drawer-visible #drawer {
display: block;
}
@@ -648,10 +656,6 @@
-webkit-text-size-adjust: auto;
}
-#drawer #console-messages {
- bottom: 23px;
-}
-
#console-prompt {
position: relative;
padding: 1px 22px 1px 0px;
Modified: trunk/Source/WebCore/inspector/front-end/inspector.js (97263 => 97264)
--- trunk/Source/WebCore/inspector/front-end/inspector.js 2011-10-12 15:27:09 UTC (rev 97263)
+++ trunk/Source/WebCore/inspector/front-end/inspector.js 2011-10-12 15:29:02 UTC (rev 97264)
@@ -218,15 +218,37 @@
this._toggleConsoleButton.toggled = !this._toggleConsoleButton.toggled;
+ var animationType = window.event && window.event.shiftKey ? WebInspector.Drawer.AnimationType.Slow : WebInspector.Drawer.AnimationType.Normal;
if (this._toggleConsoleButton.toggled) {
this._toggleConsoleButton.title = WebInspector.UIString("Hide console.");
- this.drawer.show(this.consoleView);
+ this.drawer.show(this.consoleView, animationType);
+ this._consoleWasShown = true;
} else {
this._toggleConsoleButton.title = WebInspector.UIString("Show console.");
- this.drawer.hide();
+ this.drawer.hide(animationType);
+ delete this._consoleWasShown;
}
},
+ _escPressed: function()
+ {
+ // If drawer was open with some view other than console then just close it.
+ if (!this._consoleWasShown && WebInspector.drawer.visible)
+ this.drawer.hide(WebInspector.Drawer.AnimationType.Immediately);
+ else
+ this._toggleConsoleButtonClicked();
+ },
+
+ /**
+ * @param {WebInspector.View} view
+ */
+ showViewInDrawer: function(view)
+ {
+ this._toggleConsoleButton.title = WebInspector.UIString("Hide console.");
+ this._toggleConsoleButton.toggled = false;
+ this.drawer.show(view, WebInspector.Drawer.AnimationType.Immediately);
+ },
+
_toggleSettings: function()
{
this._settingsButton.toggled = !this._settingsButton.toggled;
@@ -745,7 +767,7 @@
case "U+001B": // Escape key
event.preventDefault();
- this._toggleConsoleButtonClicked();
+ this._escPressed();
break;
// Windows and Mac have two different definitions of [, so accept both.
