Bug 1354117 - remove panel-specific styling and associated code, include closemenu in styling in overflow panel, r?johannh draft
authorGijs Kruitbosch <gijskruitbosch@gmail.com>
Thu, 27 Jul 2017 16:27:05 +0100
changeset 621128 b24ebd40dd3676a662da02918bb8664d9be099ab
parent 620862 32083f24a1bb2c33050b4c972783f066432194eb
child 621129 5f0cc7b689cb40b47b6ba66c2b1fce1db375fad6
push id72277
push usergijskruitbosch@gmail.com
push dateFri, 04 Aug 2017 12:03:53 +0000
reviewersjohannh
bugs1354117
milestone57.0a1
Bug 1354117 - remove panel-specific styling and associated code, include closemenu in styling in overflow panel, r?johannh MozReview-Commit-ID: 4EgZP0Huo80
browser/components/customizableui/CustomizableWidgets.jsm
--- a/browser/components/customizableui/CustomizableWidgets.jsm
+++ b/browser/components/customizableui/CustomizableWidgets.jsm
@@ -77,30 +77,16 @@ function setAttributes(aNode, aAttrs) {
         }
         value = CustomizableUI.getLocalizedProperty({id: aAttrs.id}, stringId, additionalArgs);
       }
       aNode.setAttribute(name, value);
     }
   }
 }
 
-function updateCombinedWidgetStyle(aNode, aArea, aModifyCloseMenu) {
-  let inPanel = (aArea == CustomizableUI.AREA_PANEL);
-  let cls = inPanel ? "panel-combined-button" : "toolbarbutton-1 toolbarbutton-combined";
-  let attrs = {class: cls};
-  if (aModifyCloseMenu) {
-    attrs.closemenu = inPanel ? "none" : null;
-  }
-  for (let i = 0, l = aNode.childNodes.length; i < l; ++i) {
-    if (aNode.childNodes[i].localName == "separator")
-      continue;
-    setAttributes(aNode.childNodes[i], attrs);
-  }
-}
-
 function fillSubviewFromMenuItems(aMenuItems, aSubview) {
   let attrs = ["oncommand", "onclick", "label", "key", "disabled",
                "command", "observes", "hidden", "class", "origin",
                "image", "checked", "style"];
 
   let doc = aSubview.ownerDocument;
   let fragment = doc.createDocumentFragment();
   for (let menuChild of aMenuItems) {
@@ -763,29 +749,35 @@ const CustomizableWidgets = [
     type: "custom",
     tooltiptext: "zoom-controls.tooltiptext2",
     defaultArea: CustomizableUI.AREA_PANEL,
     onBuild(aDocument) {
       let buttons = [{
         id: "zoom-out-button",
         command: "cmd_fullZoomReduce",
         label: true,
+        closemenu: "none",
         tooltiptext: "tooltiptext2",
         shortcutId: "key_fullZoomReduce",
+        "class": "toolbarbutton-1 toolbarbutton-combined",
       }, {
         id: "zoom-reset-button",
         command: "cmd_fullZoomReset",
+        closemenu: "none",
         tooltiptext: "tooltiptext2",
         shortcutId: "key_fullZoomReset",
+        "class": "toolbarbutton-1 toolbarbutton-combined",
       }, {
         id: "zoom-in-button",
         command: "cmd_fullZoomEnlarge",
+        closemenu: "none",
         label: true,
         tooltiptext: "tooltiptext2",
         shortcutId: "key_fullZoomEnlarge",
+        "class": "toolbarbutton-1 toolbarbutton-combined",
       }];
 
       let node = aDocument.createElementNS(kNSXUL, "toolbaritem");
       node.setAttribute("id", "zoom-controls");
       node.setAttribute("label", CustomizableUI.getLocalizedProperty(this, "label"));
       node.setAttribute("title", CustomizableUI.getLocalizedProperty(this, "tooltiptext"));
       // Set this as an attribute in addition to the property to make sure we can style correctly.
       node.setAttribute("removable", "true");
@@ -795,108 +787,45 @@ const CustomizableWidgets = [
 
       buttons.forEach(function(aButton, aIndex) {
         if (aIndex != 0)
           node.appendChild(aDocument.createElementNS(kNSXUL, "separator"));
         let btnNode = aDocument.createElementNS(kNSXUL, "toolbarbutton");
         setAttributes(btnNode, aButton);
         node.appendChild(btnNode);
       });
-
-      updateCombinedWidgetStyle(node, this.currentArea, true);
-
-      let listener = {
-        onWidgetAdded: (aWidgetId, aArea, aPosition) => {
-          if (aWidgetId != this.id)
-            return;
-
-          updateCombinedWidgetStyle(node, aArea, true);
-        },
-
-        onWidgetRemoved: (aWidgetId, aPrevArea) => {
-          if (aWidgetId != this.id)
-            return;
-
-          // When a widget is demoted to the palette ('removed'), it's visual
-          // style should change.
-          updateCombinedWidgetStyle(node, null, true);
-        },
-
-        onWidgetReset: aWidgetNode => {
-          if (aWidgetNode != node)
-            return;
-          updateCombinedWidgetStyle(node, this.currentArea, true);
-        },
-
-        onWidgetUndoMove: aWidgetNode => {
-          if (aWidgetNode != node)
-            return;
-          updateCombinedWidgetStyle(node, this.currentArea, true);
-        },
-
-        onWidgetMoved: (aWidgetId, aArea) => {
-          if (aWidgetId != this.id)
-            return;
-          updateCombinedWidgetStyle(node, aArea, true);
-        },
-
-        onWidgetInstanceRemoved: (aWidgetId, aDoc) => {
-          if (aWidgetId != this.id || aDoc != aDocument)
-            return;
-
-          CustomizableUI.removeListener(listener);
-        },
-
-        onWidgetDrag: (aWidgetId, aArea) => {
-          if (aWidgetId != this.id)
-            return;
-          aArea = aArea || this.currentArea;
-          updateCombinedWidgetStyle(node, aArea, true);
-        },
-
-        // Hack. This can go away when the old menu panel goes away (post photon).
-        // We need it right now for the case where we re-register the old-style
-        // main menu panel if photon is disabled at runtime, and we automatically
-        // put the widgets in there, so they get the right style in the panel.
-        onAreaNodeRegistered: (aArea, aContainer) => {
-          if (aContainer.ownerDocument == node.ownerDocument &&
-              aArea == this.currentArea &&
-              aArea == CustomizableUI.AREA_PANEL) {
-            updateCombinedWidgetStyle(node, aArea, true);
-          }
-        },
-      };
-      CustomizableUI.addListener(listener);
-
       return node;
     }
   }, {
     id: "edit-controls",
     type: "custom",
     tooltiptext: "edit-controls.tooltiptext2",
     defaultArea: CustomizableUI.AREA_PANEL,
     onBuild(aDocument) {
       let buttons = [{
         id: "cut-button",
         command: "cmd_cut",
         label: true,
         tooltiptext: "tooltiptext2",
         shortcutId: "key_cut",
+        "class": "toolbarbutton-1 toolbarbutton-combined",
       }, {
         id: "copy-button",
         command: "cmd_copy",
         label: true,
         tooltiptext: "tooltiptext2",
         shortcutId: "key_copy",
+        "class": "toolbarbutton-1 toolbarbutton-combined",
       }, {
         id: "paste-button",
         command: "cmd_paste",
         label: true,
         tooltiptext: "tooltiptext2",
         shortcutId: "key_paste",
+        "class": "toolbarbutton-1 toolbarbutton-combined",
       }];
 
       let node = aDocument.createElementNS(kNSXUL, "toolbaritem");
       node.setAttribute("id", "edit-controls");
       node.setAttribute("label", CustomizableUI.getLocalizedProperty(this, "label"));
       node.setAttribute("title", CustomizableUI.getLocalizedProperty(this, "tooltiptext"));
       // Set this as an attribute in addition to the property to make sure we can style correctly.
       node.setAttribute("removable", "true");
@@ -907,76 +836,22 @@ const CustomizableWidgets = [
       buttons.forEach(function(aButton, aIndex) {
         if (aIndex != 0)
           node.appendChild(aDocument.createElementNS(kNSXUL, "separator"));
         let btnNode = aDocument.createElementNS(kNSXUL, "toolbarbutton");
         setAttributes(btnNode, aButton);
         node.appendChild(btnNode);
       });
 
-      updateCombinedWidgetStyle(node, this.currentArea);
-
       let listener = {
-        onWidgetAdded: (aWidgetId, aArea, aPosition) => {
-          if (aWidgetId != this.id)
-            return;
-          updateCombinedWidgetStyle(node, aArea);
-        },
-
-        onWidgetRemoved: (aWidgetId, aPrevArea) => {
-          if (aWidgetId != this.id)
-            return;
-          // When a widget is demoted to the palette ('removed'), it's visual
-          // style should change.
-          updateCombinedWidgetStyle(node);
-        },
-
-        onWidgetReset: aWidgetNode => {
-          if (aWidgetNode != node)
-            return;
-          updateCombinedWidgetStyle(node, this.currentArea);
-        },
-
-        onWidgetUndoMove: aWidgetNode => {
-          if (aWidgetNode != node)
-            return;
-          updateCombinedWidgetStyle(node, this.currentArea);
-        },
-
-        onWidgetMoved: (aWidgetId, aArea) => {
-          if (aWidgetId != this.id)
-            return;
-          updateCombinedWidgetStyle(node, aArea);
-        },
-
         onWidgetInstanceRemoved: (aWidgetId, aDoc) => {
           if (aWidgetId != this.id || aDoc != aDocument)
             return;
           CustomizableUI.removeListener(listener);
         },
-
-        onWidgetDrag: (aWidgetId, aArea) => {
-          if (aWidgetId != this.id)
-            return;
-          aArea = aArea || this.currentArea;
-          updateCombinedWidgetStyle(node, aArea);
-        },
-
-        // Hack. This can go away when the old menu panel goes away (post photon).
-        // We need it right now for the case where we re-register the old-style
-        // main menu panel if photon is disabled at runtime, and we automatically
-        // put the widgets in there, so they get the right style in the panel.
-        onAreaNodeRegistered: (aArea, aContainer) => {
-          if (aContainer.ownerDocument == node.ownerDocument &&
-              aArea == this.currentArea &&
-              aArea == CustomizableUI.AREA_PANEL) {
-            updateCombinedWidgetStyle(node, aArea);
-          }
-        },
-
         onWidgetOverflow(aWidgetNode) {
           if (aWidgetNode == node) {
             node.ownerGlobal.updateEditUIVisibility();
           }
         },
         onWidgetUnderflow(aWidgetNode) {
           if (aWidgetNode == node) {
             node.ownerGlobal.updateEditUIVisibility();