Bug 1287368 - Fix inspector sidebar portrait mode. r=pbro
authorJan Odvarko <odvarko@gmail.com>
Tue, 19 Jul 2016 09:57:59 +0200
changeset 346176 762845e3c6841cb375f8bdd19e2158b73b73217a
parent 346175 4b83d342c9f79da4ec067392a1d5ed97e0edd683
child 346177 7378c226537699f13ef6a2d62bdc4f4e128b48a8
push id6389
push userraliiev@mozilla.com
push dateMon, 19 Sep 2016 13:38:22 +0000
treeherdermozilla-beta@01d67bfe6c81 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerspbro
bugs1287368
milestone50.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1287368 - Fix inspector sidebar portrait mode. r=pbro
devtools/client/inspector/inspector-panel.js
--- a/devtools/client/inspector/inspector-panel.js
+++ b/devtools/client/inspector/inspector-panel.js
@@ -446,53 +446,63 @@ InspectorPanel.prototype = {
         strings.GetStringFromName("inspector.sidebar.fontInspectorTitle"),
         defaultTab == "fontinspector");
 
       this.fontInspector = new FontInspector(this, this.panelWin);
       this.sidebar.toggleTab(true, "fontinspector");
     }
 
     this.setupSidebarToggle();
-    this.setupSidebarWidth();
+    this.setupSidebarSize();
 
     this.sidebar.show(defaultTab);
   },
 
   /**
-   * Sidebar width is currently driven by vbox.inspector-sidebar-container
-   * element, which is located at the left side of the side bar splitter.
-   * It's width is changed by the splitter and stored into preferences.
+   * Sidebar size is currently driven by vbox.inspector-sidebar-container
+   * element, which is located at the left/bottom side of the side bar splitter.
+   * Its size is changed by the splitter and stored into preferences.
    * As soon as bug 1260552 is fixed and new HTML based splitter in place
-   * the width can be driven by div.inspector-sidebar element. This element
-   * represents the ToolSidebar and so, the entire logic related to width
+   * the size can be driven by div.inspector-sidebar element. This element
+   * represents the ToolSidebar and so, the entire logic related to size
    * persistence can be done inside the ToolSidebar.
    */
-  setupSidebarWidth: function () {
+  setupSidebarSize: function () {
     let sidePaneContainer = this.panelDoc.querySelector(
       "#inspector-sidebar-container");
 
     this.sidebar.on("show", () => {
       try {
         sidePaneContainer.width = Services.prefs.getIntPref(
           "devtools.toolsidebar-width.inspector");
+        sidePaneContainer.height = Services.prefs.getIntPref(
+          "devtools.toolsidebar-height.inspector");
       } catch (e) {
         // The default width is the min-width set in CSS
         // for #inspector-sidebar-container
+        // Set width and height of the sidebar container. Only one
+        // value is really useful at a time depending on the current
+        // toolbox orientation and having both doesn't break anything.
         sidePaneContainer.width = 450;
+        sidePaneContainer.height = 450;
       }
     });
 
     this.sidebar.on("hide", () => {
       Services.prefs.setIntPref("devtools.toolsidebar-width.inspector",
         sidePaneContainer.width);
+      Services.prefs.setIntPref("devtools.toolsidebar-height.inspector",
+        sidePaneContainer.height);
     });
 
     this.sidebar.on("destroy", () => {
       Services.prefs.setIntPref("devtools.toolsidebar-width.inspector",
         sidePaneContainer.width);
+      Services.prefs.setIntPref("devtools.toolsidebar-height.inspector",
+        sidePaneContainer.height);
     });
   },
 
   /**
    * Add the expand/collapse behavior for the sidebar panel.
    */
   setupSidebarToggle: function () {
     let SidebarToggle = this.React.createFactory(this.browserRequire(