Bug 796148 - Implement a 'gear menu', r=past

2012-10-26 23:28:54 +03:00 · 2012-10-26 23:28:54 +03:00 · ee18e44ead
--- a/browser/devtools/debugger/debugger-panes.js
+++ b/browser/devtools/debugger/debugger-panes.js
@ -162,7 +162,7 @@ create({ constructor: BreakpointsView, proto: MenuContainer.prototype }, {
  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;
--- a/browser/devtools/debugger/debugger-toolbar.js
+++ b/browser/devtools/debugger/debugger-toolbar.js
@ -197,8 +197,8 @@ ToolbarView.prototype = {
 */
 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 = {
@ -207,14 +207,12 @@ OptionsView.prototype = {
   */
  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);
  },

  /**
@ -222,27 +220,41 @@ OptionsView.prototype = {
   */
  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
 };

 /**
--- a/browser/devtools/debugger/debugger.xul
+++ b/browser/devtools/debugger/debugger.xul
@ -21,7 +21,33 @@
  <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"/>
@ -33,30 +59,55 @@
      <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">
@ -66,9 +117,6 @@
                     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"
@ -89,13 +137,14 @@
                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"
@ -110,17 +159,17 @@
        <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>
--- a/browser/devtools/debugger/test/browser_dbg_bug786070_hide_nonenums.js
+++ b/browser/devtools/debugger/test/browser_dbg_bug786070_hide_nonenums.js
@ -54,10 +54,9 @@ function testNonEnumProperties() {
      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.");
@ -66,7 +65,8 @@ function testNonEnumProperties() {
        ".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.");
@ -83,7 +83,8 @@ function testNonEnumProperties() {
        ".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.");
@ -92,7 +93,8 @@ function testNonEnumProperties() {
        ".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();
--- a/browser/devtools/debugger/test/browser_dbg_pause-exceptions.js
+++ b/browser/devtools/debugger/test/browser_dbg_pause-exceptions.js
@ -40,9 +40,8 @@ function testWithFrame()
      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() {
--- a/browser/devtools/shared/LayoutHelpers.jsm
+++ b/browser/devtools/shared/LayoutHelpers.jsm
@ -363,7 +363,7 @@ LayoutHelpers = {
      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");
    }
--- a/browser/locales/en-US/chrome/browser/devtools/debugger.dtd
+++ b/browser/locales/en-US/chrome/browser/devtools/debugger.dtd
@ -35,14 +35,20 @@
  -  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. -->
--- a/browser/themes/gnomestripe/devtools/common.css
+++ b/browser/themes/gnomestripe/devtools/common.css
@ -68,6 +68,18 @@
  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;
 }
--- a/browser/themes/gnomestripe/devtools/option-icon.png
+++ b/browser/themes/gnomestripe/devtools/option-icon.png
--- a/browser/themes/gnomestripe/jar.mn
+++ b/browser/themes/gnomestripe/jar.mn
@ -146,6 +146,7 @@ browser.jar:
  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)
--- a/browser/themes/pinstripe/devtools/common.css
+++ b/browser/themes/pinstripe/devtools/common.css
@ -73,6 +73,18 @@
  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;
 }
--- a/browser/themes/pinstripe/devtools/option-icon.png
+++ b/browser/themes/pinstripe/devtools/option-icon.png
--- a/browser/themes/pinstripe/jar.mn
+++ b/browser/themes/pinstripe/jar.mn
@ -215,6 +215,7 @@ browser.jar:
  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)
--- a/browser/themes/winstripe/devtools/common.css
+++ b/browser/themes/winstripe/devtools/common.css
@ -69,6 +69,18 @@
  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;
 }
--- a/browser/themes/winstripe/devtools/option-icon.png
+++ b/browser/themes/winstripe/devtools/option-icon.png
--- a/browser/themes/winstripe/jar.mn
+++ b/browser/themes/winstripe/jar.mn
@ -173,6 +173,7 @@ browser.jar:
        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)
@ -379,6 +380,7 @@ browser.jar:
        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)