| /* |
| * Copyright (C) 2007, 2008 Apple Inc. All rights reserved. |
| * Copyright (C) 2009 Joseph Pecoraro |
| * |
| * Redistribution and use in source and binary forms, with or without |
| * modification, are permitted provided that the following conditions |
| * are met: |
| * |
| * 1. Redistributions of source code must retain the above copyright |
| * notice, this list of conditions and the following disclaimer. |
| * 2. 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. |
| * 3. Neither the name of Apple Computer, Inc. ("Apple") 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 APPLE AND ITS 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 APPLE OR ITS 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. |
| */ |
| |
| WebInspector.Drawer = function() |
| { |
| WebInspector.View.call(this, document.getElementById("drawer")); |
| |
| this._savedHeight = 200; // Default. |
| this.state = WebInspector.Drawer.State.Hidden; |
| this.fullPanel = false; |
| |
| this._mainElement = document.getElementById("main"); |
| this._toolbarElement = document.getElementById("toolbar"); |
| this._mainStatusBar = document.getElementById("main-status-bar"); |
| this._mainStatusBar.addEventListener("mousedown", this._startStatusBarDragging.bind(this), true); |
| this._viewStatusBar = document.getElementById("other-drawer-status-bar-items"); |
| this._counters = document.getElementById("counters"); |
| this._drawerStatusBar = document.getElementById("drawer-status-bar"); |
| } |
| |
| WebInspector.Drawer.prototype = { |
| get visibleView() |
| { |
| return this._visibleView; |
| }, |
| |
| set visibleView(x) |
| { |
| if (this._visibleView === x) { |
| if (this.visible && this.fullPanel) |
| return; |
| this.visible = !this.visible; |
| return; |
| } |
| |
| var firstTime = !this._visibleView; |
| if (this._visibleView) |
| this._visibleView.hide(); |
| |
| this._visibleView = x; |
| |
| if (x && !firstTime) { |
| this._safelyRemoveChildren(); |
| this._viewStatusBar.removeChildren(); // optimize this? call old.detach() |
| x.attach(this.element, this._viewStatusBar); |
| x.show(); |
| this.visible = true; |
| } |
| }, |
| |
| get savedHeight() |
| { |
| var height = this._savedHeight || this.element.offsetHeight; |
| return Number.constrain(height, Preferences.minConsoleHeight, window.innerHeight - this._mainElement.totalOffsetTop - Preferences.minConsoleHeight); |
| }, |
| |
| showView: function(view) |
| { |
| if (!this.visible || this.visibleView !== view) |
| this.visibleView = view; |
| }, |
| |
| show: function() |
| { |
| if (this._animating || this.visible) |
| return; |
| |
| if (this.visibleView) |
| this.visibleView.show(); |
| |
| WebInspector.View.prototype.show.call(this); |
| |
| this._animating = true; |
| |
| document.body.addStyleClass("drawer-visible"); |
| |
| var anchoredItems = document.getElementById("anchored-status-bar-items"); |
| var height = (this.fullPanel ? window.innerHeight - this._toolbarElement.offsetHeight : this.savedHeight); |
| var animations = [ |
| {element: this.element, end: {height: height}}, |
| {element: this._mainElement, end: {bottom: height}}, |
| {element: this._mainStatusBar, start: {"padding-left": anchoredItems.offsetWidth - 1}, end: {"padding-left": 0}}, |
| {element: this._viewStatusBar, start: {opacity: 0}, end: {opacity: 1}} |
| ]; |
| |
| this._drawerStatusBar.insertBefore(anchoredItems, this._drawerStatusBar.firstChild); |
| |
| if (this._currentPanelCounters) { |
| var oldRight = this._drawerStatusBar.clientWidth - (this._counters.offsetLeft + this._currentPanelCounters.offsetWidth); |
| var newRight = WebInspector.Panel.counterRightMargin; |
| var rightPadding = (oldRight - newRight); |
| animations.push({element: this._currentPanelCounters, start: {"padding-right": rightPadding}, end: {"padding-right": 0}}); |
| this._currentPanelCounters.parentNode.removeChild(this._currentPanelCounters); |
| this._mainStatusBar.appendChild(this._currentPanelCounters); |
| } |
| |
| function animationFinished() |
| { |
| if ("updateStatusBarItems" in WebInspector.currentPanel) |
| WebInspector.currentPanel.updateStatusBarItems(); |
| if (this.visibleView.afterShow) |
| this.visibleView.afterShow(); |
| delete this._animating; |
| delete this._currentAnimation; |
| this.state = (this.fullPanel ? WebInspector.Drawer.State.Full : WebInspector.Drawer.State.Variable); |
| if (this._currentPanelCounters) |
| this._currentPanelCounters.removeAttribute("style"); |
| } |
| |
| this._currentAnimation = WebInspector.animateStyle(animations, this._animationDuration(), animationFinished.bind(this)); |
| }, |
| |
| hide: function() |
| { |
| if (this._animating || !this.visible) |
| return; |
| |
| WebInspector.View.prototype.hide.call(this); |
| |
| if (this.visibleView) |
| this.visibleView.hide(); |
| |
| this._animating = true; |
| |
| if (!this.fullPanel) |
| this._savedHeight = this.element.offsetHeight; |
| |
| if (this.element === WebInspector.currentFocusElement || this.element.isAncestor(WebInspector.currentFocusElement)) |
| WebInspector.currentFocusElement = WebInspector.previousFocusElement; |
| |
| var anchoredItems = document.getElementById("anchored-status-bar-items"); |
| |
| // Temporarily set properties and classes to mimic the post-animation values so panels |
| // like Elements in their updateStatusBarItems call will size things to fit the final location. |
| this._mainStatusBar.style.setProperty("padding-left", (anchoredItems.offsetWidth - 1) + "px"); |
| document.body.removeStyleClass("drawer-visible"); |
| if ("updateStatusBarItems" in WebInspector.currentPanel) |
| WebInspector.currentPanel.updateStatusBarItems(); |
| document.body.addStyleClass("drawer-visible"); |
| |
| var animations = [ |
| {element: this._mainElement, end: {bottom: 0}}, |
| {element: this._mainStatusBar, start: {"padding-left": 0}, end: {"padding-left": anchoredItems.offsetWidth - 1}}, |
| {element: this._viewStatusBar, start: {opacity: 1}, end: {opacity: 0}} |
| ]; |
| |
| if (this._currentPanelCounters) { |
| var newRight = this._drawerStatusBar.clientWidth - this._counters.offsetLeft; |
| var oldRight = this._mainStatusBar.clientWidth - (this._currentPanelCounters.offsetLeft + this._currentPanelCounters.offsetWidth); |
| var rightPadding = (newRight - oldRight); |
| animations.push({element: this._currentPanelCounters, start: {"padding-right": 0}, end: {"padding-right": rightPadding}}); |
| } |
| |
| function animationFinished() |
| { |
| WebInspector.currentPanel.resize(); |
| this._mainStatusBar.insertBefore(anchoredItems, this._mainStatusBar.firstChild); |
| this._mainStatusBar.style.removeProperty("padding-left"); |
| |
| if (this._currentPanelCounters) { |
| this._currentPanelCounters.setAttribute("style", null); |
| this._currentPanelCounters.parentNode.removeChild(this._currentPanelCounters); |
| this._counters.insertBefore(this._currentPanelCounters, this._counters.firstChild); |
| } |
| |
| document.body.removeStyleClass("drawer-visible"); |
| delete this._animating; |
| delete this._currentAnimation; |
| this.state = WebInspector.Drawer.State.Hidden; |
| } |
| |
| this._currentAnimation = WebInspector.animateStyle(animations, this._animationDuration(), animationFinished.bind(this)); |
| }, |
| |
| resize: function() |
| { |
| if (this.state === WebInspector.Drawer.State.Hidden) |
| return; |
| |
| var height; |
| if (this.state === WebInspector.Drawer.State.Variable) { |
| height = parseInt(this.element.style.height); |
| height = Number.constrain(height, Preferences.minConsoleHeight, window.innerHeight - this._mainElement.totalOffsetTop - Preferences.minConsoleHeight); |
| } else |
| height = window.innerHeight - this._toolbarElement.offsetHeight; |
| |
| this._mainElement.style.bottom = height + "px"; |
| this.element.style.height = height + "px"; |
| }, |
| |
| enterPanelMode: function() |
| { |
| this._cancelAnimationIfNeeded(); |
| this.fullPanel = true; |
| |
| if (this.visible) { |
| this._savedHeight = this.element.offsetHeight; |
| var height = window.innerHeight - this._toolbarElement.offsetHeight; |
| this._animateDrawerHeight(height, WebInspector.Drawer.State.Full); |
| } |
| }, |
| |
| exitPanelMode: function() |
| { |
| this._cancelAnimationIfNeeded(); |
| this.fullPanel = false; |
| |
| if (this.visible) { |
| // If this animation gets cancelled, we want the state of the drawer to be Variable, |
| // so that the new animation can't do an immediate transition between Hidden/Full states. |
| this.state = WebInspector.Drawer.State.Variable; |
| var height = this.savedHeight; |
| this._animateDrawerHeight(height, WebInspector.Drawer.State.Variable); |
| } |
| }, |
| |
| immediatelyExitPanelMode: function() |
| { |
| this.visible = false; |
| this.fullPanel = false; |
| }, |
| |
| immediatelyFinishAnimation: function() |
| { |
| if (this._currentAnimation) |
| this._currentAnimation.forceComplete(); |
| }, |
| |
| set currentPanelCounters(x) |
| { |
| if (!x) { |
| if (this._currentPanelCounters) |
| this._currentPanelCounters.parentElement.removeChild(this._currentPanelCounters); |
| delete this._currentPanelCounters; |
| return; |
| } |
| |
| this._currentPanelCounters = x; |
| if (this.visible) |
| this._mainStatusBar.appendChild(x); |
| else |
| this._counters.insertBefore(x, this._counters.firstChild); |
| }, |
| |
| _cancelAnimationIfNeeded: function() |
| { |
| if (this._animating) { |
| if (this._currentAnimation) |
| this._currentAnimation.cancel(); |
| delete this._animating; |
| delete this._currentAnimation; |
| } |
| }, |
| |
| _animateDrawerHeight: function(height, finalState) |
| { |
| this._animating = true; |
| var animations = [ |
| {element: this.element, end: {height: height}}, |
| {element: this._mainElement, end: {bottom: height}} |
| ]; |
| |
| function animationFinished() |
| { |
| delete this._animating; |
| delete this._currentAnimation; |
| this.state = finalState; |
| } |
| |
| this._currentAnimation = WebInspector.animateStyle(animations, this._animationDuration(), animationFinished.bind(this)); |
| }, |
| |
| _animationDuration: function() |
| { |
| // Immediate if going between Hidden and Full in full panel mode |
| if (this.fullPanel && (this.state === WebInspector.Drawer.State.Hidden || this.state === WebInspector.Drawer.State.Full)) |
| return 0; |
| |
| return (window.event && window.event.shiftKey ? 2000 : 250); |
| }, |
| |
| _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) |
| return; |
| |
| WebInspector.elementDragStart(this._mainStatusBar, this._statusBarDragging.bind(this), this._endStatusBarDragging.bind(this), event, "row-resize"); |
| |
| this._statusBarDragOffset = event.pageY - this.element.totalOffsetTop; |
| |
| event.stopPropagation(); |
| }, |
| |
| _statusBarDragging: function(event) |
| { |
| var height = window.innerHeight - event.pageY + this._statusBarDragOffset; |
| height = Number.constrain(height, Preferences.minConsoleHeight, window.innerHeight - this._mainElement.totalOffsetTop - Preferences.minConsoleHeight); |
| |
| this._mainElement.style.bottom = height + "px"; |
| this.element.style.height = height + "px"; |
| |
| event.preventDefault(); |
| event.stopPropagation(); |
| }, |
| |
| _endStatusBarDragging: function(event) |
| { |
| WebInspector.elementDragEnd(event); |
| |
| this._savedHeight = this.element.offsetHeight; |
| delete this._statusBarDragOffset; |
| |
| event.stopPropagation(); |
| } |
| } |
| |
| WebInspector.Drawer.prototype.__proto__ = WebInspector.View.prototype; |
| |
| WebInspector.Drawer.State = { |
| Hidden: 0, |
| Variable: 1, |
| Full: 2 |
| }; |