Bug 870471 - context menu for customization panel, r=bmcbride,dao

browser/components/customizableui/content/panelUI.inc.xul

@@ -9,7 +9,7 @@
        consumeoutsideclicks="true"
        noautofocus="true">
   <panelmultiview id="PanelUI-multiView" mainViewId="PanelUI-mainView">
-    <panelview id="PanelUI-mainView" flex="1">
+    <panelview id="PanelUI-mainView" flex="1" contextmenu="customizationPanelContextMenu">
       <vbox id="PanelUI-contents" type="grid"/>
 
       <vbox id="PanelUI-mainView-spring" flex="1"/>
@@ -45,6 +45,26 @@
       <vbox id="PanelUI-helpItems"/>
     </panelview>
   </panelmultiview>
+  <popupset id="customizationContextMenus">
+    <menupopup id="customizationContextMenu">
+      <menuitem oncommand="gCustomizeMode.addToToolbar(document.popupNode)"
+                accesskey="&customizeMenu.addToToolbar.accesskey;"
+                label="&customizeMenu.addToToolbar.label;"/>
+      <menuitem oncommand="gCustomizeMode.removeFromPanel(document.popupNode)"
+                accesskey="&customizeMenu.removeFromMenu.accesskey;"
+                label="&customizeMenu.removeFromMenu.label;"/>
+      <menuseparator/>
+      <menuitem command="cmd_CustomizeToolbars"
+                accesskey="&viewCustomizeToolbar.accesskey;"
+                label="&viewCustomizeToolbar.label;"/>
+    </menupopup>
+
+    <menupopup id="customizationPanelContextMenu">
+      <menuitem command="cmd_CustomizeToolbars"
+                accesskey="&customizeMenu.addMoreItems.accesskey;"
+                label="&customizeMenu.addMoreItems.label;"/>
+    </menupopup>
+  </popupset>
 </panel>
 
 <panel id="widget-overflow"

browser/components/customizableui/src/CustomizableUI.jsm

@@ -24,6 +24,10 @@ const kNSXUL = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
 
 const kSpecialWidgetPfx = "customizableui-special-";
 
+const kCustomizationContextMenu = "customizationContextMenu";
+const kContextMenuBackup        = "customization-old-context";
+
+
 const kPrefCustomizationState        = "browser.uiCustomization.state";
 const kPrefCustomizationAutoAdd      = "browser.uiCustomization.autoAdd";
 const kPrefCustomizationDebug        = "browser.uiCustomization.debug";
@@ -316,6 +320,8 @@ let CustomizableUIInternal = {
           aArea == CustomizableUI.AREA_PANEL) {
         this.ensureButtonClosesPanel(node);
       }
+      this.ensureButtonContextMenu(node, aArea == CustomizableUI.AREA_PANEL);
+
       this.insertWidgetBefore(node, currentNode, container, aArea);
       this._addParentFlex(node);
       if (gResetting)
@@ -370,6 +376,25 @@ let CustomizableUIInternal = {
     aNode.addEventListener("keypress", this.maybeAutoHidePanel, false);
   },
 
+  ensureButtonContextMenu: function(aNode, ourContextMenu) {
+    if (ourContextMenu) {
+      let currentCtxt = aNode.getAttribute("context");
+      // Need to save widget's own context menu if we're replacing it:
+      if (currentCtxt && currentCtxt != kCustomizationContextMenu) {
+        aNode.setAttribute(kContextMenuBackup, currentCtxt);
+      }
+      aNode.setAttribute("context", kCustomizationContextMenu);
+    } else if (aNode.getAttribute("context") == kCustomizationContextMenu) {
+      let oldCtxt = aNode.getAttribute(kContextMenuBackup);
+      if (oldCtxt) {
+        aNode.setAttribute("context", oldCtxt);
+        aNode.removeAttribute(kContextMenuBackup);
+      } else {
+        aNode.removeAttribute("context");
+      }
+    }
+  },
+
   getWidgetProvider: function(aWidgetId) {
     if (this.isSpecialWidget(aWidgetId)) {
       return CustomizableUI.PROVIDER_SPECIAL;
@@ -430,6 +455,7 @@ let CustomizableUIInternal = {
       if (!btn.hasAttribute("noautoclose")) {
         this.ensureButtonClosesPanel(btn);
       }
+      this.ensureButtonContextMenu(btn, true);
     }
 
     aPanel.toolbox = document.getElementById("navigator-toolbox");
@@ -467,6 +493,8 @@ let CustomizableUIInternal = {
         this.ensureButtonClosesPanel(widgetNode);
       }
 
+      this.ensureButtonContextMenu(widgetNode, aArea == CustomizableUI.AREA_PANEL);
+
       let nextNode = nextNodeId ? container.querySelector(idToSelector(nextNodeId))
                                 : null;
       this.insertWidgetBefore(widgetNode, nextNode, container, aArea);

browser/components/customizableui/src/CustomizeMode.jsm

@@ -129,6 +129,7 @@ CustomizeMode.prototype = {
     this._wrapToolbarItems();
     this.populatePalette();
 
+    window.PanelUI.mainView.addEventListener("contextmenu", this, true);
     this.visiblePalette.addEventListener("dragstart", this, true);
     this.visiblePalette.addEventListener("dragover", this, true);
     this.visiblePalette.addEventListener("dragexit", this, true);
@@ -161,6 +162,7 @@ CustomizeMode.prototype = {
     this._removePanelCustomizationPlaceholders();
     this.depopulatePalette();
 
+    this.window.PanelUI.mainView.removeEventListener("contextmenu", this, true);
     this.visiblePalette.removeEventListener("dragstart", this, true);
     this.visiblePalette.removeEventListener("dragover", this, true);
     this.visiblePalette.removeEventListener("dragexit", this, true);
@@ -249,6 +251,14 @@ CustomizeMode.prototype = {
     let result = this.window.gNavToolbox.dispatchEvent(evt);
   },
 
+  addToToolbar: function(aNode) {
+    CustomizableUI.addWidgetToArea(aNode.id, CustomizableUI.AREA_NAVBAR);
+  },
+
+  removeFromPanel: function(aNode) {
+    CustomizableUI.removeWidgetFromArea(aNode.id);
+  },
+
   populatePalette: function() {
     let toolboxPalette = this.window.gNavToolbox.palette;
 
@@ -503,6 +513,10 @@ CustomizeMode.prototype = {
 
   handleEvent: function(aEvent) {
     switch(aEvent.type) {
+      case "contextmenu":
+        aEvent.preventDefault();
+        aEvent.stopPropagation();
+        break;
       case "dragstart":
         this._onDragStart(aEvent);
         break;

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

@@ -323,6 +323,13 @@ These should match what Safari and other Apple applications use on OS X Lion. --
 <!ENTITY appMenuHistory.clearRecent.label "Clear Recent History…">
 <!ENTITY appMenuHistory.restoreSession.label "Restore Previous Session">
 
+<!ENTITY customizeMenu.addToToolbar.label "Add to Toolbar">
+<!ENTITY customizeMenu.addToToolbar.accesskey "A">
+<!ENTITY customizeMenu.removeFromMenu.label "Remove from Menu">
+<!ENTITY customizeMenu.removeFromMenu.accesskey "R">
+<!ENTITY customizeMenu.addMoreItems.label "Add More Items…">
+<!ENTITY customizeMenu.addMoreItems.accesskey "A">
+
 <!ENTITY openCmd.commandkey           "l">
 <!ENTITY urlbar.placeholder2          "Search or enter address">
 <!ENTITY urlbar.accesskey             "d">