DevTools: added "overlayContents" mode, where DevTools content is placed around and underneath inse…

Source/devtools/front_end/Drawer.js

 /*
  * 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.
@@ skipping 14 matching lines @@
  * 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
  * @implements {WebInspector.ViewFactory}
  * @param {WebInspector.InspectorView} inspectorView
  */
 WebInspector.Drawer = function(inspectorView)

[pfeldman, 2013/11/18 15:07:42]

Drawer does not need to know this much about inspector view. All it needs it for
is for calling doResize. Converting Drawer container into SplitView would fix
his. Maybe a follow up (or preliminary) patch?

[dgozman, 2013/11/21 16:38:51]

I will look into this later (as a follow-up).

 {
     this._inspectorView = inspectorView;
 
-    this.element = this._inspectorView.element.createChild("div", "drawer");
+    this.element = this._inspectorView.container().createChild("div", "drawer");
     this.element.style.flexBasis = 0;
 
     this._savedHeight = 200; // Default.
 
     this._drawerContentsElement = this.element.createChild("div");
     this._drawerContentsElement.id = "drawer-contents";
 
     this._toggleDrawerButton = new WebInspector.StatusBarButton(WebInspector.UIString("Show drawer."), "console-status-bar-item");
     this._toggleDrawerButton.addEventListener("click", this.toggle, this);
 
@@ skipping 21 matching lines @@
     /**
      * @return {Element}
      */
     toggleButtonElement: function()
     {
         return this._toggleDrawerButton.element;
     },
 
     _constrainHeight: function(height)
     {
-        return Number.constrain(height, Preferences.minConsoleHeight, this._inspectorView.element.offsetHeight - Preferences.minConsoleHeight);
+        return Number.constrain(height, Preferences.minConsoleHeight, this._inspectorView.container().offsetHeight - Preferences.minConsoleHeight);
     },
 
     isHiding: function()
     {
         return this._isHiding;
     },
 
     /**
      * @param {string} tabId
      * @param {string} title
@@ skipping 214 matching lines @@
             return false;
 
         this._visibleView().storeScrollPositions();
         this._statusBarDragOffset = event.pageY - this.element.totalOffsetTop();
         return true;
     },
 
     _statusBarDragging: function(event)
     {
         var height = window.innerHeight - event.pageY + this._statusBarDragOffset;
-        height = Number.constrain(height, Preferences.minConsoleHeight, this._inspectorView.element.offsetHeight - Preferences.minConsoleHeight);
+        height = Number.constrain(height, Preferences.minConsoleHeight, this._inspectorView.container().offsetHeight - Preferences.minConsoleHeight);
 
         this.element.style.flexBasis = height + "px";
         if (this._inspectorView.currentPanel())
             this._inspectorView.currentPanel().doResize();
         this._tabbedPane.doResize();
 
         event.consume(true);
     },
 
     _endStatusBarDragging: function(event)
@@ skipping 34 matching lines @@
     },
 
     /**
      * @return {boolean}
      */
     visible: function()
     {
         return this._toggleDrawerButton.toggled;
     }
 }