Backed out changeset 03a709825eff (bug 885541) for metro-chrome failures on a CLOSED TREE

browser/metro/base/content/ContextCommands.js

@@ -230,17 +230,6 @@ var ContextCommands = {
 
   // App bar
 
-  errorConsole: function cc_errorConsole() {
-    PanelUI.show("console-container");
-  },
-
-  jsShell: function cc_jsShell() {
-    // XXX for debugging, this only works when running on the desktop.
-    if (!MetroUtils.immersive)
-      window.openDialog("chrome://browser/content/shell.xul", "_blank",
-                        "all=no,scrollbars=yes,resizable=yes,dialog=no");
-  },
-
   findInPage: function cc_findInPage() {
     FindHelperUI.show();
   },

browser/metro/base/content/appbar.js

@@ -4,6 +4,8 @@
 "use strict";
 
 var Appbar = {
+  get consoleButton() { return document.getElementById('console-button'); },
+  get jsShellButton() { return document.getElementById('jsshell-button'); },
   get starButton()    { return document.getElementById('star-button'); },
   get pinButton()     { return document.getElementById('pin-button'); },
   get menuButton()    { return document.getElementById('menu-button'); },
@@ -23,6 +25,8 @@ var Appbar = {
     Elements.panelUI.addEventListener('ToolPanelShown', this, false);
     Elements.panelUI.addEventListener('ToolPanelHidden', this, false);
 
+    this._updateDebugButtons();
+
     // tilegroup selection events for all modules get bubbled up
     window.addEventListener("selectionchange", this, false);
   },
@@ -109,10 +113,6 @@ var Appbar = {
 
   onMenuButton: function(aEvent) {
       var typesArray = ["find-in-page"];
-
-      if (ConsolePanelView.enabled) typesArray.push("open-error-console");
-      if (!MetroUtils.immersive) typesArray.push("open-jsshell");
-
       try {
         // If we have a valid http or https URI then show the view on desktop
         // menu item.
@@ -152,6 +152,17 @@ var Appbar = {
     }
   },
 
+  onConsoleButton: function() {
+    PanelUI.show("console-container");
+  },
+
+  onJSShellButton: function() {
+    // XXX for debugging, this only works when running on the desktop.
+    if (!MetroUtils.immersive)
+      window.openDialog("chrome://browser/content/shell.xul", "_blank",
+                        "all=no,scrollbars=yes,resizable=yes,dialog=no");
+  },
+
   dispatchContextualAction: function(aActionName){
     let activeTileset = this.activeTileset;
     if (activeTileset) {
@@ -248,4 +259,9 @@ var Appbar = {
       this.starButton.checked = isStarred;
     }.bind(this));
   },
-};
+
+  _updateDebugButtons: function() {
+    this.consoleButton.disabled = !ConsolePanelView.enabled;
+    this.jsShellButton.disabled = MetroUtils.immersive;
+  },
+  };

browser/metro/base/content/browser.xul

@@ -346,6 +346,10 @@
           <toolbarbutton id="stop-button" command="cmd_stop"/>
         </hbox>
 
+        <!-- developer buttons -->
+        <toolbarbutton id="console-button" oncommand="Appbar.onConsoleButton()"/>
+        <toolbarbutton id="jsshell-button" oncommand="Appbar.onJSShellButton()"/>
+
         <toolbarbutton id="download-button" oncommand="Appbar.onDownloadButton()"/>
         <toolbarbutton id="star-button" class="appbar-primary" type="checkbox" oncommand="Appbar.onStarButton()"/>
         <toolbarbutton id="pin-button" class="appbar-primary" type="checkbox" oncommand="Appbar.onPinButton()"/>
@@ -689,20 +693,11 @@
           </richlistitem>
 
           <!-- App bar: 'more' button context menu -->
-          <!-- developer buttons - shown in metrodesktop mode only -->
-          <richlistitem id="context-error-console" type="open-error-console" onclick="ContextCommands.errorConsole();">
-            <label value="&appbarErrorConsole.label;"/>
-          </richlistitem>
-          <richlistitem id="context-jsshell" type="open-jsshell" onclick="ContextCommands.jsShell();">
-            <label value="&appbarJSShell.label;"/>
-          </richlistitem>
-
-          <!-- standard buttons -->
           <richlistitem id="context-findinpage" type="find-in-page" onclick="ContextCommands.findInPage();">
-            <label value="&appbarFindInPage2.label;"/>
+          <label value="&appbarFindInPage2.label;"/>
           </richlistitem>
           <richlistitem id="context-viewondesktop" type="view-on-desktop" onclick="ContextCommands.viewOnDesktop();">
-            <label value="&appbarViewOnDesktop2.label;"/>
+          <label value="&appbarViewOnDesktop2.label;"/>
           </richlistitem>
         </richlistbox>
       </vbox>

browser/metro/locales/en-US/chrome/browser.dtd

@@ -10,8 +10,6 @@
 <!ENTITY newtab.label          "New Tab">
 <!ENTITY closetab.label        "Close Tab">
 
-<!ENTITY appbarErrorConsole.label   "Open error console">
-<!ENTITY appbarJSShell.label        "Open JavaScript shell">
 <!ENTITY appbarFindInPage2.label    "Find in page">
 <!ENTITY appbarViewOnDesktop2.label "View on desktop">
 

browser/metro/theme/browser.css

@@ -284,7 +284,7 @@ documenttab[selected] .documenttab-selection {
     list-style-image: url(chrome://browser/skin/images/appbar-forward@1.4x.png);
   }
 }
-
++
 /* URL bar */
 #urlbar-container {
   border: @metro_border_thick@ solid @urlbar_border_color@;
@@ -394,6 +394,17 @@ appbar[visible] {
               bottom @appbar_keyboard_slideup_duration@ @metro_animation_easing@;
 }
 
+appbar > toolbar > toolbarbutton {
+  list-style-image: url(chrome://browser/skin/images/appbar-icons.png);
+  -moz-image-region: rect(0px, 200px, 40px, 160px); /* Gear icon is default. */
+}
+appbar > toolbar > toolbarbutton:hover {
+  -moz-image-region: rect(40px, 200px, 80px, 160px);
+}
+appbar > toolbar > toolbarbutton:active {
+  -moz-image-region: rect(80px, 200px, 120px, 160px);
+}
+
 #toolbar > .appbar-primary {
   -moz-image-region: rect(0 40px 40px 0);
 }
@@ -434,9 +445,7 @@ appbar[visible] {
 }
 
 /* Application-Specific */
-
 #download-button {
-  list-style-image: url(chrome://browser/skin/images/appbar-icons.png);
   -moz-image-region: rect(0px, 40px, 40px, 0px) !important;
 }
 #download-button:hover {
@@ -446,6 +455,16 @@ appbar[visible] {
   -moz-image-region: rect(80px, 40px, 120px, 0px) !important;
 }
 
+#plugin-button {
+  -moz-image-region: rect(0px, 80px, 40px, 40px) !important;
+}
+#plugin-button:hover {
+  -moz-image-region: rect(40px, 80px, 80px, 40px) !important;
+}
+#plugin-button:active {
+  -moz-image-region: rect(80px, 80px, 120px, 40px) !important;
+}
+
 /* Page-Specific */
 
 #pin-button {