Bug 796148 - Implement a 'gear menu', r=past
authorVictor Porof <vporof@mozilla.com>
Fri, 26 Oct 2012 23:28:54 +0300
changeset 111642 0eecbc50194c809f81f83804917c9a21581cecd3
parent 111641 ff163b446688c6cb79c8b087ee08188dd7962310
child 111643 3f97424506bda958ed64e704fbc03fe054a0fc45
push id93
push usernmatsakis@mozilla.com
push dateWed, 31 Oct 2012 21:26:57 +0000
reviewerspast
bugs796148
milestone19.0a1
Bug 796148 - Implement a 'gear menu', r=past
browser/devtools/debugger/debugger-panes.js
browser/devtools/debugger/debugger-toolbar.js
browser/devtools/debugger/debugger.xul
browser/devtools/debugger/test/browser_dbg_bug786070_hide_nonenums.js
browser/devtools/debugger/test/browser_dbg_pause-exceptions.js
browser/devtools/shared/LayoutHelpers.jsm
browser/locales/en-US/chrome/browser/devtools/debugger.dtd
browser/themes/gnomestripe/devtools/common.css
browser/themes/gnomestripe/devtools/option-icon.png
browser/themes/gnomestripe/jar.mn
browser/themes/pinstripe/devtools/common.css
browser/themes/pinstripe/devtools/option-icon.png
browser/themes/pinstripe/jar.mn
browser/themes/winstripe/devtools/common.css
browser/themes/winstripe/devtools/option-icon.png
browser/themes/winstripe/jar.mn
--- a/browser/devtools/debugger/debugger-panes.js
+++ b/browser/devtools/debugger/debugger-panes.js
@@ -157,17 +157,17 @@ function BreakpointsView() {
 
 create({ constructor: BreakpointsView, proto: MenuContainer.prototype }, {
   /**
    * Initialization function, called when the debugger is started.
    */
   initialize: function DVB_initialize() {
     dumpn("Initializing the BreakpointsView");
     this._container = new StackList(document.getElementById("breakpoints"));
-    this._popupset = document.getElementById("debugger-popups");
+    this._popupset = document.getElementById("debuggerPopupset");
 
     this._container.emptyText = L10N.getStr("emptyBreakpointsText");
     this._container.itemFactory = this._createItemView;
     this._container.uniquenessQualifier = 2;
     this._container.addEventListener("click", this._onClick, false);
 
     this._cache = new Map();
   },
--- a/browser/devtools/debugger/debugger-toolbar.js
+++ b/browser/devtools/debugger/debugger-toolbar.js
@@ -192,62 +192,74 @@ ToolbarView.prototype = {
   _stepOutTooltip: ""
 };
 
 /**
  * Functions handling the options UI.
  */
 function OptionsView() {
   dumpn("OptionsView was instantiated");
-  this._onPoeClick = this._onPoeClick.bind(this);
-  this._onShowNonenumClick = this._onShowNonenumClick.bind(this);
+  this._togglePOE = this._togglePOE.bind(this);
+  this._toggleShowNonEnum = this._toggleShowNonEnum.bind(this);
 }
 
 OptionsView.prototype = {
   /**
    * Initialization function, called when the debugger is started.
    */
   initialize: function DVO_initialize() {
     dumpn("Initializing the OptionsView");
-    this._poeCheckbox = document.getElementById("pause-on-exceptions");
-    this._showNonenumCheckbox = document.getElementById("show-nonenum");
+    this._button = document.getElementById("debugger-options");
+    this._poeItem = document.getElementById("pause-on-exceptions");
+    this._showNonEnumItem = document.getElementById("show-nonenum");
 
-    this._poeCheckbox.addEventListener("click", this._onPoeClick, false);
-    this._showNonenumCheckbox.addEventListener("click", this._onShowNonenumClick, false);
-
-    this._poeCheckbox.checked = false; // Never pause on exceptions by default.
-    this._showNonenumCheckbox.checked = Prefs.nonEnumVisible;
+    this._poeItem.setAttribute("checked", "false");
+    this._showNonEnumItem.setAttribute("checked", Prefs.nonEnumVisible);
   },
 
   /**
    * Destruction function, called when the debugger is closed.
    */
   destroy: function DVO_destroy() {
     dumpn("Destroying the OptionsView");
-    this._poeCheckbox.removeEventListener("click", this._onPoeClick, false);
-    this._showNonenumCheckbox.removeEventListener("click", this._onShowNonenumClick, false);
+  },
+
+  /**
+   * Listener handling the 'gear menu' popup showing event.
+   */
+  _onPopupShowing: function DVO__onPopupShowing() {
+    this._button.setAttribute("open", "true");
+  },
+
+  /**
+   * Listener handling the 'gear menu' popup hiding event.
+   */
+  _onPopupHiding: function DVO__onPopupHiding() {
+    this._button.removeAttribute("open");
   },
 
   /**
    * Listener handling the 'pause on exceptions' checkbox click event.
    */
-  _onPoeClick: function DVO__onPOEClick() {
-    DebuggerController.activeThread.pauseOnExceptions(this._poeCheckbox.checked);
+  _togglePOE: function DVO__togglePOE() {
+    DebuggerController.activeThread.pauseOnExceptions(
+      this._poeItem.getAttribute("checked") == "true");
   },
 
   /**
    * Listener handling the 'show non-enumerables' checkbox click event.
    */
-  _onShowNonenumClick: function DVO__onShowNonenumClick() {
-    DebuggerView.Variables.nonEnumVisible =
-      Prefs.nonEnumVisible = this._showNonenumCheckbox.checked;
+  _toggleShowNonEnum: function DVO__toggleShowNonEnum() {
+    DebuggerView.Variables.nonEnumVisible = Prefs.nonEnumVisible =
+      this._showNonEnumItem.getAttribute("checked") == "true";
   },
 
-  _poeCheckbox: null,
-  _showNonenumCheckbox: null
+  _button: null,
+  _poeItem: null,
+  _showNonEnumItem: null
 };
 
 /**
  * Functions handling the chrome globals UI.
  */
 function ChromeGlobalsView() {
   dumpn("ChromeGlobalsView was instantiated");
   MenuContainer.call(this);
--- a/browser/devtools/debugger/debugger.xul
+++ b/browser/devtools/debugger/debugger.xul
@@ -16,64 +16,112 @@
 <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
 
   <script type="text/javascript" src="chrome://global/content/globalOverlay.js"/>
   <script type="text/javascript" src="debugger-controller.js"/>
   <script type="text/javascript" src="debugger-view.js"/>
   <script type="text/javascript" src="debugger-toolbar.js"/>
   <script type="text/javascript" src="debugger-panes.js"/>
 
-  <popupset id="debugger-popups">
+  <commandset id="editMenuCommands"/>
+  <commandset id="sourceEditorCommands"/>
+
+  <commandset id="debuggerCommands">
+    <command id="resumeCommand"
+             oncommand="DebuggerView.Toolbar._onResumePressed()"/>
+    <command id="stepOverCommand"
+             oncommand="DebuggerView.Toolbar._onStepOverPressed()"/>
+    <command id="stepInCommand"
+             oncommand="DebuggerView.Toolbar._onStepInPressed()"/>
+    <command id="stepOutCommand"
+             oncommand="DebuggerView.Toolbar._onStepOutPressed()"/>
+    <command id="fileSearchCommand"
+             oncommand="DebuggerView.Filtering._doFileSearch()"/>
+    <command id="lineSearchCommand"
+             oncommand="DebuggerView.Filtering._doLineSearch()"/>
+    <command id="tokenSearchCommand"
+             oncommand="DebuggerView.Filtering._doTokenSearch()"/>
+    <command id="globalSearchCommand"
+             oncommand="DebuggerView.Filtering._doGlobalSearch()"/>
+    <command id="togglePauseOnExceptions"
+             oncommand="DebuggerView.Options._togglePOE()"/>
+    <command id="toggleShowNonEnum"
+             oncommand="DebuggerView.Options._toggleShowNonEnum()"/>
+  </commandset>
+
+  <popupset id="debuggerPopupset">
     <menupopup id="sourceEditorContextMenu"
                onpopupshowing="goUpdateSourceEditorMenuItems()">
       <menuitem id="se-cMenu-copy"/>
       <menuseparator/>
       <menuitem id="se-cMenu-selectAll"/>
       <menuseparator/>
       <menuitem id="se-cMenu-find"/>
       <menuitem id="se-cMenu-findAgain"/>
       <menuseparator/>
       <menuitem id="se-cMenu-gotoLine"/>
     </menupopup>
+    <menupopup id="debuggerPrefsContextMenu"
+               position="before_end"
+               onpopupshowing="DebuggerView.Options._onPopupShowing()"
+               onpopuphiding="DebuggerView.Options._onPopupHiding()">
+      <menuitem id="pause-on-exceptions"
+                type="checkbox"
+                label="&debuggerUI.pauseExceptions;"
+                accesskey="&debuggerUI.pauseExceptions.key;"
+                command="togglePauseOnExceptions"/>
+      <menuitem id="show-nonenum"
+                type="checkbox"
+                label="&debuggerUI.showNonEnums;"
+                accesskey="&debuggerUI.showNonEnums.key;"
+                command="toggleShowNonEnum"/>
+    </menupopup>
   </popupset>
 
-  <commandset id="editMenuCommands"/>
-  <commandset id="sourceEditorCommands"/>
   <keyset id="sourceEditorKeys"/>
-  <keyset id="scriptSearchKeys">
-    <key id="fileSearchKey" key="P" modifiers="access shift"
-         oncommand="DebuggerView.Filtering._doFileSearch()"/>
-    <key id="lineSearchKey" key="G" modifiers="access shift"
-         oncommand="DebuggerView.Filtering._doLineSearch()"/>
-    <key id="tokenSearchKey" key="T" modifiers="access shift"
-         oncommand="DebuggerView.Filtering._doTokenSearch()"/>
-    <key id="globalSearchKey" key="F" modifiers="access shift"
-         oncommand="DebuggerView.Filtering._doGlobalSearch()"/>
-  </keyset>
-  <keyset id="threadStateKeys">
-    <key id="resumeKey" keycode="VK_F6"
-         oncommand="DebuggerView.Toolbar._onResumePressed()"/>
-    <key id="stepOverKey" keycode="VK_F7"
-         oncommand="DebuggerView.Toolbar._onStepOverPressed()"/>
-    <key id="stepInKey" keycode="VK_F8"
-         oncommand="DebuggerView.Toolbar._onStepInPressed()"/>
-    <key id="stepOutKey" keycode="VK_F8" modifiers="shift"
-         oncommand="DebuggerView.Toolbar._onStepOutPressed()"/>
+
+  <keyset id="debuggerKeys">
+    <key id="resumeKey"
+         keycode="VK_F6"
+         command="resumeCommand"/>
+    <key id="stepOverKey"
+         keycode="VK_F7"
+         command="stepOverCommand"/>
+    <key id="stepInKey"
+         keycode="VK_F8"
+         command="stepInCommand"/>
+    <key id="stepOutKey"
+         keycode="VK_F8"
+         modifiers="shift"
+         command="stepOutCommand"/>
+    <key id="fileSearchKey"
+         key="P"
+         modifiers="control shift"
+         command="fileSearchCommand"/>
+    <key id="lineSearchKey"
+         key="G"
+         modifiers="control shift"
+         command="lineSearchCommand"/>
+    <key id="tokenSearchKey"
+         key="T"
+         modifiers="control shift"
+         command="tokenSearchCommand"/>
+    <key id="globalSearchKey"
+         key="F"
+         modifiers="control shift"
+         command="globalSearchCommand"/>
   </keyset>
 
   <vbox id="body" flex="1">
     <toolbar id="dbg-toolbar" class="devtools-toolbar">
 #ifdef XP_MACOSX
       <toolbarbutton id="close"
                      class="devtools-closebutton"
                      tooltiptext="&debuggerUI.closeButton.tooltip;"/>
 #endif
-      <toolbarbutton id="toggle-panes"
-                     class="devtools-toolbarbutton"
-                     tabindex="0"/>
       <hbox id="debugger-controls">
         <toolbarbutton id="resume"
                        class="devtools-toolbarbutton"
                        tabindex="0"/>
         <toolbarbutton id="step-over"
                        class="devtools-toolbarbutton"
                        tabindex="0"/>
         <toolbarbutton id="step-in"
@@ -84,48 +132,49 @@
                        tabindex="0"/>
       </hbox>
       <menulist id="chrome-globals"
                 class="devtools-menulist" hidden="true"/>
       <menulist id="sources"
                 class="devtools-menulist"/>
       <textbox id="searchbox"
                class="devtools-searchinput" type="search"/>
-      <checkbox id="pause-on-exceptions"
-                tabindex="0"
-                label="&debuggerUI.pauseExceptions;"/>
-      <checkbox id="show-nonenum"
-                tabindex="0"
-                label="&debuggerUI.showNonEnums;"/>
       <spacer flex="1"/>
+      <toolbarbutton id="toggle-panes"
+                     class="devtools-toolbarbutton"
+                     tabindex="0"/>
+      <toolbarbutton id="debugger-options"
+                     class="devtools-option-toolbarbutton"
+                     tooltiptext="&debuggerUI.optsButton.tooltip;"
+                     popup="debuggerPrefsContextMenu"/>
 #ifndef XP_MACOSX
       <toolbarbutton id="close"
                      class="devtools-closebutton"
                      tooltiptext="&debuggerUI.closeButton.tooltip;"/>
 #endif
     </toolbar>
     <panel id="searchbox-panel"
            type="arrow"
            noautofocus="true"
            position="before_start">
       <vbox>
         <label class="description" value="&debuggerUI.searchPanelTitle;"/>
         <hbox align="center">
           <button id="global-operator-button" class="operator"
-                  onclick="DebuggerView.Filtering._doGlobalSearch()"/>
+                  command="globalSearchCommand"/>
           <label id="global-operator-label" class="plain operator"/>
         </hbox>
         <hbox align="center">
           <button id="token-operator-button" class="operator"
-                  onclick="DebuggerView.Filtering._doTokenSearch()"/>
+                  command="tokenSearchCommand"/>
           <label id="token-operator-label" class="plain operator"/>
         </hbox>
         <hbox align="center">
           <button id="line-operator-button" class="operator"
-                  onclick="DebuggerView.Filtering._doLineSearch()"/>
+                  command="lineSearchCommand"/>
           <label id="line-operator-label" class="plain operator"/>
         </hbox>
       </vbox>
     </panel>
     <vbox id="dbg-content" flex="1">
       <vbox id="globalsearch" hidden="true"/>
       <splitter id="globalsearch-splitter"
                 class="devtools-horizontal-splitter" hidden="true"/>
--- a/browser/devtools/debugger/test/browser_dbg_bug786070_hide_nonenums.js
+++ b/browser/devtools/debugger/test/browser_dbg_bug786070_hide_nonenums.js
@@ -49,55 +49,57 @@ function testNonEnumProperties() {
         ".details container should be visible.");
 
       is(nonenum.childNodes.length, 1,
         "There should be just one property in the .nonenum container.");
 
       ok(nonenum.hasAttribute("open"),
         ".nonenum container should be visible.");
 
-      let option = gDebugger.document.getElementById("show-nonenum");
-
       // Uncheck 'show hidden properties'.
-      EventUtils.sendMouseEvent({ type: "click" }, option, gDebugger);
+      gDebugger.DebuggerView.Options._showNonEnumItem.setAttribute("checked", "false");
+      gDebugger.DebuggerView.Options._toggleShowNonEnum();
 
       ok(details.hasAttribute("open"),
         ".details container should stay visible.");
 
       ok(!nonenum.hasAttribute("open"),
         ".nonenum container should become hidden.");
 
       // Check 'show hidden properties'.
-      EventUtils.sendMouseEvent({ type: "click" }, option, gDebugger);
+      gDebugger.DebuggerView.Options._showNonEnumItem.setAttribute("checked", "true");
+      gDebugger.DebuggerView.Options._toggleShowNonEnum();
 
       ok(details.hasAttribute("open"),
         ".details container should stay visible.");
 
       ok(nonenum.hasAttribute("open"),
         ".nonenum container should become visible.");
 
       testVar.collapse();
 
       ok(!details.hasAttribute("open"),
         ".details container should be hidden.");
 
       ok(!nonenum.hasAttribute("open"),
         ".nonenum container should be hidden.");
 
       // Uncheck 'show hidden properties'.
-      EventUtils.sendMouseEvent({ type: "click" }, option, gDebugger);
+      gDebugger.DebuggerView.Options._showNonEnumItem.setAttribute("checked", "false");
+      gDebugger.DebuggerView.Options._toggleShowNonEnum();
 
       ok(!details.hasAttribute("open"),
         ".details container should stay hidden.");
 
       ok(!nonenum.hasAttribute("open"),
         ".nonenum container should stay hidden.");
 
       // Check 'show hidden properties'.
-      EventUtils.sendMouseEvent({ type: "click" }, option, gDebugger);
+      gDebugger.DebuggerView.Options._showNonEnumItem.setAttribute("checked", "true");
+      gDebugger.DebuggerView.Options._toggleShowNonEnum();
 
       gDebugger.DebuggerController.activeThread.resume(function() {
         closeDebuggerAndFinish();
       });
     }}, 0);
   });
 
   gDebuggee.simpleCall();
--- a/browser/devtools/debugger/test/browser_dbg_pause-exceptions.js
+++ b/browser/devtools/debugger/test/browser_dbg_pause-exceptions.js
@@ -35,19 +35,18 @@ function testWithFrame()
         return;
       }
       is(gCount, 2, "A. Second Debugger:FetchedVariables event received.");
       gDebugger.removeEventListener("Debugger:FetchedVariables", testA, false);
 
       is(gDebugger.DebuggerController.activeThread.state, "paused",
         "Should be paused now.");
 
-      EventUtils.sendMouseEvent({ type: "click" },
-        gDebugger.document.getElementById("pause-on-exceptions"),
-        gDebugger);
+      gDebugger.DebuggerView.Options._poeItem.setAttribute("checked", "true");
+      gDebugger.DebuggerView.Options._togglePOE();
 
       gCount = 0;
       gPane.contentWindow.gClient.addOneTimeListener("resumed", function() {
         gDebugger.addEventListener("Debugger:FetchedVariables", function testB() {
           // We expect 2 Debugger:FetchedVariables events, one from the global object
           // scope and the regular one.
           if (++gCount < 2) {
             is(gCount, 1, "B. First Debugger:FetchedVariables event received.");
--- a/browser/devtools/shared/LayoutHelpers.jsm
+++ b/browser/devtools/shared/LayoutHelpers.jsm
@@ -358,17 +358,17 @@ LayoutHelpers = {
     if (elemMod.match("shift")) {
       elemString += PlatformKeys.GetStringFromName("VK_SHIFT") +
                     PlatformKeys.GetStringFromName("MODIFIER_SEPARATOR");
     }
     if (elemMod.match("alt")) {
       elemString += PlatformKeys.GetStringFromName("VK_ALT") +
                     PlatformKeys.GetStringFromName("MODIFIER_SEPARATOR");
     }
-    if (elemMod.match("ctrl")) {
+    if (elemMod.match("ctrl") || elemMod.match("control")) {
       elemString += PlatformKeys.GetStringFromName("VK_CONTROL") +
                     PlatformKeys.GetStringFromName("MODIFIER_SEPARATOR");
     }
     if (elemMod.match("meta")) {
       elemString += PlatformKeys.GetStringFromName("VK_META") +
                     PlatformKeys.GetStringFromName("MODIFIER_SEPARATOR");
     }
 
--- a/browser/locales/en-US/chrome/browser/devtools/debugger.dtd
+++ b/browser/locales/en-US/chrome/browser/devtools/debugger.dtd
@@ -30,20 +30,26 @@
 <!-- LOCALIZATION NOTE (debuggerMenu.commandkey): This is the command key that
   -  launches the debugger UI. Do not translate this one! -->
 <!ENTITY debuggerMenu.commandkey        "S">
 
 <!-- LOCALIZATION NOTE (debuggerUI.closeButton.tooltip): This is the tooltip for
   -  the button that closes the debugger UI. -->
 <!ENTITY debuggerUI.closeButton.tooltip "Close">
 
+<!-- LOCALIZATION NOTE (debuggerUI.optsButton.tooltip): This is the tooltip for
+  -  the button that opens up an options context menu for the debugger UI. -->
+<!ENTITY debuggerUI.optsButton.tooltip  "Debugger Options">
+
 <!-- LOCALIZATION NOTE (debuggerUI.pauseExceptions): This is the label for the
   -  checkbox that toggles pausing on exceptions. -->
 <!ENTITY debuggerUI.pauseExceptions     "Pause on exceptions">
+<!ENTITY debuggerUI.pauseExceptions.key "E">
 
 <!-- LOCALIZATION NOTE (debuggerUI.showNonEnums): This is the label for the
   -  checkbox that toggles visibility of hidden (non-enumerable) variables and
   -  properties in stack views. -->
 <!ENTITY debuggerUI.showNonEnums        "Show hidden properties">
+<!ENTITY debuggerUI.showNonEnums.key    "P">
 
 <!-- LOCALIZATION NOTE (debuggerUI.searchPanelTitle): This is the text that
   -  appears in the filter panel popup as a description. -->
 <!ENTITY debuggerUI.searchPanelTitle    "Operators">
--- a/browser/themes/gnomestripe/devtools/common.css
+++ b/browser/themes/gnomestripe/devtools/common.css
@@ -63,16 +63,28 @@
 .devtools-toolbarbutton[checked=true]:hover {
   background-color: transparent !important;
 }
 
 .devtools-toolbarbutton[checked=true]:hover:active {
   background-color: hsla(210,8%,5%,.2) !important;
 }
 
+.devtools-option-toolbarbutton {
+  -moz-appearance: none;
+  list-style-image: url("chrome://browser/skin/devtools/option-icon.png");
+  -moz-image-region: rect(0px 16px 16px 0px);
+  background: none;
+  border: none;
+}
+
+.devtools-option-toolbarbutton[open=true] {
+  -moz-image-region: rect(0px 32px 16px 16px);
+}
+
 .devtools-menulist > .menulist-label-box {
   text-align: center;
 }
 
 .devtools-menulist > .menulist-dropmarker {
   -moz-appearance: none;
   display: -moz-box;
   list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
new file mode 100644
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..9fd78175dfd5449b43034602ed854907ea82d885
GIT binary patch
literal 1441
zc$@*D1z!4zP)<h;3K|Lk000e1NJLTq001BW000mO1^@s6cL04^000GONkl<Zc-noH
zc~Db#5XbX=FXZ3|2*e{0KoL~H3KUe(V!f^Bc!Cwt78Pj)1R)g|!c{@afN}~F0fkl@
z6f0o8kI|ymp<um5FkA*u4h_hd9`m}J@@6O<{Npq4xBK0FyZg)Um&egFmJEdg_<#vu
z1keBh^a0~RjT)N6Q8L5f0z!Zf5P$-B=tFII{O|_!<}F({Re9#zH~Z4EH-kM25CzNR
z%THEZkj-7X_9L))A83G{pzN`qbLFps8RxZMaSA&1Ik_zYm#TqP;5$5C**ghiKGc9P
zGH(CIj_y9i!)K~ouonXhZrrKOKwnyRK>*l>BQ-$DDtRvDUE60}{+sc-{AU{{ugwvf
zm^}NU_8$7&D>czn;w{1O1}K~yivuPGVw>fU8d?svcWZK9_4XGc?cII3P3o>p=_Hr+
z5Mv4m26HHOazKxYy>7sbx#aFxG0^M$vzD26<qsXM=d_Gd)qAZd>E?WB(s1ynpxFla
zUW->drDo=D5?fDMl%AuAS9fVLfP=$HNXdvb96f$6JU2|A^O*zY;>)a*Z|py=dKYYX
zw9DDGyz8h_<pASQ@n0N)X=ShS^c0;AE|vW|EKc;=>Keg`N|Zl^cJ}mTHLG7|b@cRM
z@l@pI-QQEL->ywzZPXfDJF+@^`m;`ypN)WAGo0GByt}}yLc@4ez3q2Cqhah$z11<{
z_$&2<<DG4+?E*2LRd3(8RcaX5)7>TTa~N{Cu<f7w?^=KEYIOn>*$*TmTLZ)5KwF3S
z1?-Mv{TNeS^WfW{2)Q2@8}L75V3AqpXH}wpVyo<C#{c*);sd`OAuD9_5pjA=0qe&Y
z>+d^SrFoC{P+#U4akwH053qul`Kn&N#_dnI`Rl!Su$R&zi5P+PlJnPY#i3T;q(*Hk
z<k$iNGIfa_`E=Vj%J1MJ%aV4jWoZW^DQ;~eKFJ=mwW}Ed>lu>5=0?;kj;RMAb_wKI
zl3Bid+yO3Zr5IQPFPB4+nA^1v<zRb(#zSB|`^KF*od!*!wi2fYXgE|f6?RHQg`f5q
zTiEh$Oi?Q%DO9}#p9AHa#zk-~IihMtZCp`{mI^JKfzyLV@C+F3jZ0orbN>lW9|`P*
z8xR#DlZS%lg6s;9-VHY)8a0f$aIIRtB_L!WXa;!CZHk)%CLdEZnHRiZOb@?cMk`c|
zm7*b)Q`9R(tQ5~v#()nsGr<1ni#p4q<`tZ5m2L;jGxLjgLQ&a+XR2^0paTwC%-y<2
zI&jVU>zmsnpqagerDcJ52yuGJp~ni-yyuK4`>95hThAcUBMppQabqKbYxL>JdG=nM
z|D2H?ep*UJT`<B1jBFg-JT`3E>Bl#f`bWr<WKbvsfkI&jYllT8Mwm$Kc5K-h`h|m=
z*C&uGBFkm^f`EK?Uewtb;=OMbf8Q@v!i+}@BFcKKgSA1cp#2W`@a311g~27W$@&BX
zJcL|e6d(a?MdNIJAJjJmLBU-^x&KrZ1P%H?%tSy6m|-p)QW_4TF_|)N4Dr|~r2`9>
z@zU<~^V07#Ljj+L_~$MlGrg^d(;^9RTxdev*K&1#r|=R2&^S?OWc(&57<jVsVi4Fn
zfWWKOHD9A|dr$;kOGAtW2>Vye=EI@VH&4AS=cd*&B<W5AOt_kOC#@#QciYit_FZ)_
zSsN>4^Z)lPfR_s=PV<-<la%hiV5K)Zt^FF`?VA%*v$okgdrpTK!ARc%Xn@BHE_LU`
zUOUd+Qx>F~)^n2$EjuIU#9cql5Bb3jV@CWKK{0x8YwZ9_fDZ@(8*BtH$C!~Cz^Pzc
vP2hf8!*eW|JeLPg0h#F|!A4MHCujKww^Ko-W{nMk00000NkvXXu0mjfmjtI_
--- a/browser/themes/gnomestripe/jar.mn
+++ b/browser/themes/gnomestripe/jar.mn
@@ -141,16 +141,17 @@ browser.jar:
   skin/classic/browser/devtools/breadcrumbs/rtl-start-pressed.png            (devtools/breadcrumbs/rtl-start-pressed.png)
   skin/classic/browser/devtools/breadcrumbs/rtl-start-selected-pressed.png   (devtools/breadcrumbs/rtl-start-selected-pressed.png)
   skin/classic/browser/devtools/breadcrumbs/rtl-start.png                    (devtools/breadcrumbs/rtl-start.png)
   skin/classic/browser/devtools/breadcrumbs/rtl-start-selected.png           (devtools/breadcrumbs/rtl-start-selected.png)
   skin/classic/browser/devtools/splitview.css         (devtools/splitview.css)
   skin/classic/browser/devtools/styleeditor.css       (devtools/styleeditor.css)
   skin/classic/browser/devtools/debugger.css          (devtools/debugger.css)
   skin/classic/browser/devtools/magnifying-glass.png  (devtools/magnifying-glass.png)
+  skin/classic/browser/devtools/option-icon.png       (devtools/option-icon.png)
   skin/classic/browser/devtools/itemToggle.png        (devtools/itemToggle.png)
   skin/classic/browser/devtools/itemArrow-rtl.png     (devtools/itemArrow-rtl.png)
   skin/classic/browser/devtools/itemArrow-ltr.png     (devtools/itemArrow-ltr.png)
   skin/classic/browser/devtools/inspect-button.png    (devtools/inspect-button.png)
   skin/classic/browser/devtools/dropmarker.png        (devtools/dropmarker.png)
   skin/classic/browser/devtools/treepanel-button.png  (devtools/treepanel-button.png)
   skin/classic/browser/devtools/layout-background.png (devtools/layout-background.png)
   skin/classic/browser/devtools/layout-background-grid.png (devtools/layout-background-grid.png)
--- a/browser/themes/pinstripe/devtools/common.css
+++ b/browser/themes/pinstripe/devtools/common.css
@@ -68,16 +68,28 @@
 .devtools-toolbarbutton[checked=true] {
   color: hsl(208,100%,60%) !important;
 }
 
 .devtools-toolbarbutton[checked=true]:hover:active {
   background-color: hsla(210,8%,5%,.2);
 }
 
+.devtools-option-toolbarbutton {
+  -moz-appearance: none;
+  list-style-image: url("chrome://browser/skin/devtools/option-icon.png");
+  -moz-image-region: rect(0px 16px 16px 0px);
+  background: none;
+  border: none;
+}
+
+.devtools-option-toolbarbutton[open=true] {
+  -moz-image-region: rect(0px 32px 16px 16px);
+}
+
 .devtools-menulist > .menulist-label-box {
   text-align: center;
 }
 
 .devtools-menulist > .menulist-dropmarker {
   -moz-appearance: none;
   background-color: transparent;
   display: -moz-box;
new file mode 100644
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..9fd78175dfd5449b43034602ed854907ea82d885
GIT binary patch
literal 1441
zc$@*D1z!4zP)<h;3K|Lk000e1NJLTq001BW000mO1^@s6cL04^000GONkl<Zc-noH
zc~Db#5XbX=FXZ3|2*e{0KoL~H3KUe(V!f^Bc!Cwt78Pj)1R)g|!c{@afN}~F0fkl@
z6f0o8kI|ymp<um5FkA*u4h_hd9`m}J@@6O<{Npq4xBK0FyZg)Um&egFmJEdg_<#vu
z1keBh^a0~RjT)N6Q8L5f0z!Zf5P$-B=tFII{O|_!<}F({Re9#zH~Z4EH-kM25CzNR
z%THEZkj-7X_9L))A83G{pzN`qbLFps8RxZMaSA&1Ik_zYm#TqP;5$5C**ghiKGc9P
zGH(CIj_y9i!)K~ouonXhZrrKOKwnyRK>*l>BQ-$DDtRvDUE60}{+sc-{AU{{ugwvf
zm^}NU_8$7&D>czn;w{1O1}K~yivuPGVw>fU8d?svcWZK9_4XGc?cII3P3o>p=_Hr+
z5Mv4m26HHOazKxYy>7sbx#aFxG0^M$vzD26<qsXM=d_Gd)qAZd>E?WB(s1ynpxFla
zUW->drDo=D5?fDMl%AuAS9fVLfP=$HNXdvb96f$6JU2|A^O*zY;>)a*Z|py=dKYYX
zw9DDGyz8h_<pASQ@n0N)X=ShS^c0;AE|vW|EKc;=>Keg`N|Zl^cJ}mTHLG7|b@cRM
z@l@pI-QQEL->ywzZPXfDJF+@^`m;`ypN)WAGo0GByt}}yLc@4ez3q2Cqhah$z11<{
z_$&2<<DG4+?E*2LRd3(8RcaX5)7>TTa~N{Cu<f7w?^=KEYIOn>*$*TmTLZ)5KwF3S
z1?-Mv{TNeS^WfW{2)Q2@8}L75V3AqpXH}wpVyo<C#{c*);sd`OAuD9_5pjA=0qe&Y
z>+d^SrFoC{P+#U4akwH053qul`Kn&N#_dnI`Rl!Su$R&zi5P+PlJnPY#i3T;q(*Hk
z<k$iNGIfa_`E=Vj%J1MJ%aV4jWoZW^DQ;~eKFJ=mwW}Ed>lu>5=0?;kj;RMAb_wKI
zl3Bid+yO3Zr5IQPFPB4+nA^1v<zRb(#zSB|`^KF*od!*!wi2fYXgE|f6?RHQg`f5q
zTiEh$Oi?Q%DO9}#p9AHa#zk-~IihMtZCp`{mI^JKfzyLV@C+F3jZ0orbN>lW9|`P*
z8xR#DlZS%lg6s;9-VHY)8a0f$aIIRtB_L!WXa;!CZHk)%CLdEZnHRiZOb@?cMk`c|
zm7*b)Q`9R(tQ5~v#()nsGr<1ni#p4q<`tZ5m2L;jGxLjgLQ&a+XR2^0paTwC%-y<2
zI&jVU>zmsnpqagerDcJ52yuGJp~ni-yyuK4`>95hThAcUBMppQabqKbYxL>JdG=nM
z|D2H?ep*UJT`<B1jBFg-JT`3E>Bl#f`bWr<WKbvsfkI&jYllT8Mwm$Kc5K-h`h|m=
z*C&uGBFkm^f`EK?Uewtb;=OMbf8Q@v!i+}@BFcKKgSA1cp#2W`@a311g~27W$@&BX
zJcL|e6d(a?MdNIJAJjJmLBU-^x&KrZ1P%H?%tSy6m|-p)QW_4TF_|)N4Dr|~r2`9>
z@zU<~^V07#Ljj+L_~$MlGrg^d(;^9RTxdev*K&1#r|=R2&^S?OWc(&57<jVsVi4Fn
zfWWKOHD9A|dr$;kOGAtW2>Vye=EI@VH&4AS=cd*&B<W5AOt_kOC#@#QciYit_FZ)_
zSsN>4^Z)lPfR_s=PV<-<la%hiV5K)Zt^FF`?VA%*v$okgdrpTK!ARc%Xn@BHE_LU`
zUOUd+Qx>F~)^n2$EjuIU#9cql5Bb3jV@CWKK{0x8YwZ9_fDZ@(8*BtH$C!~Cz^Pzc
vP2hf8!*eW|JeLPg0h#F|!A4MHCujKww^Ko-W{nMk00000NkvXXu0mjfmjtI_
--- a/browser/themes/pinstripe/jar.mn
+++ b/browser/themes/pinstripe/jar.mn
@@ -210,16 +210,17 @@ browser.jar:
   skin/classic/browser/devtools/breadcrumbs/rtl-start-pressed.png            (devtools/breadcrumbs/rtl-start-pressed.png)
   skin/classic/browser/devtools/breadcrumbs/rtl-start-selected-pressed.png   (devtools/breadcrumbs/rtl-start-selected-pressed.png)
   skin/classic/browser/devtools/breadcrumbs/rtl-start.png                    (devtools/breadcrumbs/rtl-start.png)
   skin/classic/browser/devtools/breadcrumbs/rtl-start-selected.png           (devtools/breadcrumbs/rtl-start-selected.png)
   skin/classic/browser/devtools/splitview.css               (devtools/splitview.css)
   skin/classic/browser/devtools/styleeditor.css             (devtools/styleeditor.css)
 * skin/classic/browser/devtools/debugger.css                (devtools/debugger.css)
   skin/classic/browser/devtools/magnifying-glass.png        (devtools/magnifying-glass.png)
+  skin/classic/browser/devtools/option-icon.png             (devtools/option-icon.png)
   skin/classic/browser/devtools/itemToggle.png              (devtools/itemToggle.png)
   skin/classic/browser/devtools/itemArrow-rtl.png           (devtools/itemArrow-rtl.png)
   skin/classic/browser/devtools/itemArrow-ltr.png           (devtools/itemArrow-ltr.png)
   skin/classic/browser/devtools/background-noise-toolbar.png (devtools/background-noise-toolbar.png)
   skin/classic/browser/devtools/inspect-button.png          (devtools/inspect-button.png)
   skin/classic/browser/devtools/dropmarker.png              (devtools/dropmarker.png)
   skin/classic/browser/devtools/treepanel-button.png        (devtools/treepanel-button.png)
   skin/classic/browser/devtools/layout-background.png       (devtools/layout-background.png)
--- a/browser/themes/winstripe/devtools/common.css
+++ b/browser/themes/winstripe/devtools/common.css
@@ -64,16 +64,28 @@
 .devtools-toolbarbutton[checked=true] {
   color: hsl(200,100%,60%) !important;
 }
 
 .devtools-toolbarbutton[checked=true]:hover:active {
   background-color: hsla(211,68%,6%,.2);
 }
 
+.devtools-option-toolbarbutton {
+  -moz-appearance: none;
+  list-style-image: url("chrome://browser/skin/devtools/option-icon.png");
+  -moz-image-region: rect(0px 16px 16px 0px);
+  background: none;
+  border: none;
+}
+
+.devtools-option-toolbarbutton[open=true] {
+  -moz-image-region: rect(0px 32px 16px 16px);
+}
+
 .devtools-menulist > .menulist-label-box {
   text-align: center;
 }
 
 .devtools-menulist > .menulist-dropmarker {
   -moz-appearance: none;
   list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
   border-width: 0;
new file mode 100644
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..9fd78175dfd5449b43034602ed854907ea82d885
GIT binary patch
literal 1441
zc$@*D1z!4zP)<h;3K|Lk000e1NJLTq001BW000mO1^@s6cL04^000GONkl<Zc-noH
zc~Db#5XbX=FXZ3|2*e{0KoL~H3KUe(V!f^Bc!Cwt78Pj)1R)g|!c{@afN}~F0fkl@
z6f0o8kI|ymp<um5FkA*u4h_hd9`m}J@@6O<{Npq4xBK0FyZg)Um&egFmJEdg_<#vu
z1keBh^a0~RjT)N6Q8L5f0z!Zf5P$-B=tFII{O|_!<}F({Re9#zH~Z4EH-kM25CzNR
z%THEZkj-7X_9L))A83G{pzN`qbLFps8RxZMaSA&1Ik_zYm#TqP;5$5C**ghiKGc9P
zGH(CIj_y9i!)K~ouonXhZrrKOKwnyRK>*l>BQ-$DDtRvDUE60}{+sc-{AU{{ugwvf
zm^}NU_8$7&D>czn;w{1O1}K~yivuPGVw>fU8d?svcWZK9_4XGc?cII3P3o>p=_Hr+
z5Mv4m26HHOazKxYy>7sbx#aFxG0^M$vzD26<qsXM=d_Gd)qAZd>E?WB(s1ynpxFla
zUW->drDo=D5?fDMl%AuAS9fVLfP=$HNXdvb96f$6JU2|A^O*zY;>)a*Z|py=dKYYX
zw9DDGyz8h_<pASQ@n0N)X=ShS^c0;AE|vW|EKc;=>Keg`N|Zl^cJ}mTHLG7|b@cRM
z@l@pI-QQEL->ywzZPXfDJF+@^`m;`ypN)WAGo0GByt}}yLc@4ez3q2Cqhah$z11<{
z_$&2<<DG4+?E*2LRd3(8RcaX5)7>TTa~N{Cu<f7w?^=KEYIOn>*$*TmTLZ)5KwF3S
z1?-Mv{TNeS^WfW{2)Q2@8}L75V3AqpXH}wpVyo<C#{c*);sd`OAuD9_5pjA=0qe&Y
z>+d^SrFoC{P+#U4akwH053qul`Kn&N#_dnI`Rl!Su$R&zi5P+PlJnPY#i3T;q(*Hk
z<k$iNGIfa_`E=Vj%J1MJ%aV4jWoZW^DQ;~eKFJ=mwW}Ed>lu>5=0?;kj;RMAb_wKI
zl3Bid+yO3Zr5IQPFPB4+nA^1v<zRb(#zSB|`^KF*od!*!wi2fYXgE|f6?RHQg`f5q
zTiEh$Oi?Q%DO9}#p9AHa#zk-~IihMtZCp`{mI^JKfzyLV@C+F3jZ0orbN>lW9|`P*
z8xR#DlZS%lg6s;9-VHY)8a0f$aIIRtB_L!WXa;!CZHk)%CLdEZnHRiZOb@?cMk`c|
zm7*b)Q`9R(tQ5~v#()nsGr<1ni#p4q<`tZ5m2L;jGxLjgLQ&a+XR2^0paTwC%-y<2
zI&jVU>zmsnpqagerDcJ52yuGJp~ni-yyuK4`>95hThAcUBMppQabqKbYxL>JdG=nM
z|D2H?ep*UJT`<B1jBFg-JT`3E>Bl#f`bWr<WKbvsfkI&jYllT8Mwm$Kc5K-h`h|m=
z*C&uGBFkm^f`EK?Uewtb;=OMbf8Q@v!i+}@BFcKKgSA1cp#2W`@a311g~27W$@&BX
zJcL|e6d(a?MdNIJAJjJmLBU-^x&KrZ1P%H?%tSy6m|-p)QW_4TF_|)N4Dr|~r2`9>
z@zU<~^V07#Ljj+L_~$MlGrg^d(;^9RTxdev*K&1#r|=R2&^S?OWc(&57<jVsVi4Fn
zfWWKOHD9A|dr$;kOGAtW2>Vye=EI@VH&4AS=cd*&B<W5AOt_kOC#@#QciYit_FZ)_
zSsN>4^Z)lPfR_s=PV<-<la%hiV5K)Zt^FF`?VA%*v$okgdrpTK!ARc%Xn@BHE_LU`
zUOUd+Qx>F~)^n2$EjuIU#9cql5Bb3jV@CWKK{0x8YwZ9_fDZ@(8*BtH$C!~Cz^Pzc
vP2hf8!*eW|JeLPg0h#F|!A4MHCujKww^Ko-W{nMk00000NkvXXu0mjfmjtI_
--- a/browser/themes/winstripe/jar.mn
+++ b/browser/themes/winstripe/jar.mn
@@ -168,16 +168,17 @@ browser.jar:
         skin/classic/browser/devtools/breadcrumbs/rtl-start-pressed.png            (devtools/breadcrumbs/rtl-start-pressed.png)
         skin/classic/browser/devtools/breadcrumbs/rtl-start-selected-pressed.png   (devtools/breadcrumbs/rtl-start-selected-pressed.png)
         skin/classic/browser/devtools/breadcrumbs/rtl-start.png                    (devtools/breadcrumbs/rtl-start.png)
         skin/classic/browser/devtools/breadcrumbs/rtl-start-selected.png           (devtools/breadcrumbs/rtl-start-selected.png)
         skin/classic/browser/devtools/splitview.css                 (devtools/splitview.css)
         skin/classic/browser/devtools/styleeditor.css               (devtools/styleeditor.css)
         skin/classic/browser/devtools/debugger.css                  (devtools/debugger.css)
         skin/classic/browser/devtools/magnifying-glass.png          (devtools/magnifying-glass.png)
+        skin/classic/browser/devtools/option-icon.png               (devtools/option-icon.png)
         skin/classic/browser/devtools/itemToggle.png                (devtools/itemToggle.png)
         skin/classic/browser/devtools/itemArrow-rtl.png             (devtools/itemArrow-rtl.png)
         skin/classic/browser/devtools/itemArrow-ltr.png             (devtools/itemArrow-ltr.png)
         skin/classic/browser/devtools/inspect-button.png            (devtools/inspect-button.png)
         skin/classic/browser/devtools/dropmarker.png                (devtools/dropmarker.png)
         skin/classic/browser/devtools/treepanel-button.png          (devtools/treepanel-button.png)
         skin/classic/browser/devtools/layout-background.png         (devtools/layout-background.png)
         skin/classic/browser/devtools/layout-background-grid.png    (devtools/layout-background-grid.png)
@@ -374,16 +375,17 @@ browser.jar:
         skin/classic/aero/browser/devtools/breadcrumbs/rtl-start-pressed.png            (devtools/breadcrumbs/rtl-start-pressed.png)
         skin/classic/aero/browser/devtools/breadcrumbs/rtl-start-selected-pressed.png   (devtools/breadcrumbs/rtl-start-selected-pressed.png)
         skin/classic/aero/browser/devtools/breadcrumbs/rtl-start.png                    (devtools/breadcrumbs/rtl-start.png)
         skin/classic/aero/browser/devtools/breadcrumbs/rtl-start-selected.png           (devtools/breadcrumbs/rtl-start-selected.png)
         skin/classic/aero/browser/devtools/splitview.css             (devtools/splitview.css)
         skin/classic/aero/browser/devtools/styleeditor.css           (devtools/styleeditor.css)
         skin/classic/aero/browser/devtools/debugger.css              (devtools/debugger.css)
         skin/classic/aero/browser/devtools/magnifying-glass.png      (devtools/magnifying-glass.png)
+        skin/classic/aero/browser/devtools/option-icon.png           (devtools/option-icon.png)
         skin/classic/aero/browser/devtools/itemToggle.png            (devtools/itemToggle.png)
         skin/classic/aero/browser/devtools/itemArrow-rtl.png         (devtools/itemArrow-rtl.png)
         skin/classic/aero/browser/devtools/itemArrow-ltr.png         (devtools/itemArrow-ltr.png)
         skin/classic/aero/browser/devtools/inspect-button.png        (devtools/inspect-button.png)
         skin/classic/aero/browser/devtools/dropmarker.png            (devtools/dropmarker.png)
         skin/classic/aero/browser/devtools/treepanel-button.png      (devtools/treepanel-button.png)
         skin/classic/aero/browser/devtools/layout-background.png     (devtools/layout-background.png)
         skin/classic/aero/browser/devtools/layout-background-grid.png (devtools/layout-background-grid.png)