Bug 1553768 - [de-xbl] remove the menu-vertical, appmenu-vertical bindings - convert to <toolbarbutton is="toolbarbutton-appmenu">. rs=bustage-fix,jorgk
authorMagnus Melin <mkmelin+mozilla@iki.fi>
Thu, 23 May 2019 13:07:49 +0300
changeset 35667 42690276c3c0db3b7998943338800dd82933cdc6
parent 35666 b7c1cd832766baf8ffcddc02ec5645d09396d0d4
child 35668 8b1dd67d46b10cdca793bec4617f75435de3964e
push id392
push userclokep@gmail.com
push dateMon, 02 Sep 2019 20:17:19 +0000
reviewersbustage-fix, jorgk
bugs1553768
Bug 1553768 - [de-xbl] remove the menu-vertical, appmenu-vertical bindings - convert to <toolbarbutton is="toolbarbutton-appmenu">. rs=bustage-fix,jorgk
calendar/lightning/content/lightning-item-panel.xul
calendar/lightning/content/lightning-toolbar.xul
common/bindings/generalBindings.xml
mail/base/content/customElements.js
mail/base/content/mailWidgets.xml
mail/base/content/mainMailToolbox.inc.xul
mail/base/content/messenger.css
mail/base/content/toolbarbutton-appmenu.js
mail/base/jar.mn
mail/components/im/content/chat-messenger.inc.xul
mail/themes/osx/mail/messenger.css
mail/themes/shared/mail/messenger.css
--- a/calendar/lightning/content/lightning-item-panel.xul
+++ b/calendar/lightning/content/lightning-item-panel.xul
@@ -123,17 +123,17 @@
                  mode="full"
                  defaultmode="full"
                  iconsize="small"
                  defaulticonsize="small"
                  labelalign="end"
                  defaultlabelalign="end">
           <!-- more toolbarpalette items are added with an overlay -->
           <toolbarpalette id="event-toolbarpalette">
-            <toolbarbutton id="calendar-item-appmenu-button"
+            <toolbarbutton is="toolbarbutton-appmenu" id="calendar-item-appmenu-button"
                            type="menu"
                            class="toolbarbutton-1 button-appmenu"
                            label="&lightning.toolbar.appmenuButton.label;"
                            tooltiptext="&lightning.toolbar.appmenuButton1.tooltip;"/>
           </toolbarpalette>
           <!-- toolboxid is set here since we move the toolbar around for tabs -->
           <toolbar id="event-tab-toolbar"
                    toolbarname="&event.menu.view.toolbars.event.label;"
--- a/calendar/lightning/content/lightning-toolbar.xul
+++ b/calendar/lightning/content/lightning-toolbar.xul
@@ -112,17 +112,17 @@
                      label="&lightning.toolbar.print.label;"
                      tooltiptext="&lightning.toolbar.print.tooltip;"
                      observes="cmd_print"/>
       <toolbarbutton id="calendar-unifinder-button"
                      class="toolbarbutton-1 calbar-toolbarbutton-1"
                      label="&showUnifinderCmd.label;"
                      tooltiptext="&showUnifinderCmd.tooltip;"
                      observes="calendar_show_unifinder_command"/>
-      <toolbarbutton id="calendar-appmenu-button"
+      <toolbarbutton is="toolbarbutton-appmenu" id="calendar-appmenu-button"
                      type="menu"
                      class="toolbarbutton-1 button-appmenu"
                      label="&lightning.toolbar.appmenuButton.label;"
                      tooltiptext="&lightning.toolbar.appmenuButton1.tooltip;"/>
     </toolbarpalette>
 
     <toolbar id="calendar-toolbar2" class="inline-toolbar chromeclass-toolbar"
              toolbarname="&lightning.toolbar.calendar.name;"
@@ -169,17 +169,17 @@
                      label="&lightning.toolbar.delete.label;"
                      tooltiptext="&lightning.toolbar.delete.tooltip;"
                      observes="calendar_delete_focused_item_command"/>
       <toolbarbutton id="task-print-button"
                      class="toolbarbutton-1 calbar-toolbarbutton-1"
                      label="&lightning.toolbar.print.label;"
                      tooltiptext="&lightning.toolbar.print.tooltip;"
                      observes="cmd_print"/>
-      <toolbarbutton id="task-appmenu-button"
+      <toolbarbutton is="toolbarbutton-appmenu" id="task-appmenu-button"
                      type="menu"
                      class="toolbarbutton-1 button-appmenu"
                      label="&lightning.toolbar.appmenuButton.label;"
                      tooltiptext="&lightning.toolbar.appmenuButton1.tooltip;"/>
     </toolbarpalette>
 
     <toolbar id="task-toolbar2" class="inline-toolbar chromeclass-toolbar"
              toolbarname="&lightning.toolbar.task.name;"
deleted file mode 100644
--- a/common/bindings/generalBindings.xml
+++ /dev/null
@@ -1,31 +0,0 @@
-<?xml version="1.0"?>
-
-<!-- This Source Code Form is subject to the terms of the Mozilla Public
-   - License, v. 2.0. If a copy of the MPL was not distributed with this
-   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
-
-<bindings id="generalBindings"
-   xmlns="http://www.mozilla.org/xbl"
-   xmlns:html="http://www.w3.org/1999/xhtml"
-   xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
-   xmlns:xbl="http://www.mozilla.org/xbl">
-
-  <binding id="menu-vertical"
-           extends="chrome://global/content/bindings/toolbarbutton.xml#toolbarbutton">
-    <content>
-      <children includes="observes|template|menupopup|panel|tooltip"/>
-      <xul:hbox flex="1" align="center">
-        <xul:vbox flex="1" align="center">
-          <xul:image class="toolbarbutton-icon" xbl:inherits="validate,src=image,label,consumeanchor"/>
-          <xul:label class="toolbarbutton-text" crop="right" flex="1"
-                     xbl:inherits="value=label,accesskey,crop,dragover-top,wrap"/>
-          <xul:label class="toolbarbutton-multiline-text" flex="1"
-                     xbl:inherits="xbl:text=label,accesskey,wrap"/>
-        </xul:vbox>
-        <xul:dropmarker anonid="dropmarker" type="menu"
-                        class="toolbarbutton-menu-dropmarker" xbl:inherits="disabled,label"/>
-      </xul:hbox>
-    </content>
-  </binding>
-
-</bindings>
--- a/mail/base/content/customElements.js
+++ b/mail/base/content/customElements.js
@@ -14,13 +14,14 @@ if (!isDummyDocument) {
   for (let script of [
     "chrome://chat/content/conversation-browser.js",
     "chrome://messenger/content/mailWidgets.js",
     "chrome://messenger/content/generalBindings.js",
     "chrome://messenger/content/statuspanel.js",
     "chrome://messenger/content/foldersummary.js",
     "chrome://messenger/content/addressbook/menulist-addrbooks.js",
     "chrome://messenger/content/toolbarbutton-menu-button.js",
+    "chrome://messenger/content/toolbarbutton-appmenu.js",
   ]) {
     Services.scriptloader.loadSubScript(script, window);
   }
 }
 })();
--- a/mail/base/content/mailWidgets.xml
+++ b/mail/base/content/mailWidgets.xml
@@ -197,38 +197,9 @@
             return;
           node = node.parentNode;
         }
 
         this._parentMenupopup.hidePopup();
       ]]></handler>
     </handlers>
   </binding>
-
-  <binding id="appmenu-vertical" extends="chrome://messenger/content/generalBindings.xml#menu-vertical">
-    <implementation>
-      <method name="_setupAppmenu">
-        <parameter name="event"/>
-        <body><![CDATA[
-          if (event.target == this) {
-              let appmenuPopup = document.getElementById("appmenu-popup");
-              if (this.lastChild != appmenuPopup) {
-                this.appendChild(appmenuPopup);
-              }
-          }
-        ]]></body>
-      </method>
-    </implementation>
-    <handlers>
-      <!-- While it would seem we could do this by handling oncommand, we can't
-           because any external oncommand handlers might get called before ours,
-           and then they would see the incorrect value of checked. Additionally
-           a command attribute would redirect the command events anyway.
-           Also, the appmenu-popup needs to be appended to the target 'Hamburger
-           button' dynamically at every button click (as opposed to appended
-           once in the binding's constructor) otherwise only one of the four
-           Hamburger buttons (on the Mail, Calendar, Tasks and Chat tabs) will
-           get the popup menu (namely, Mail). See Bug 890332. -->
-      <handler event="mousedown" button="0" action="this._setupAppmenu(event);"/>
-      <handler event="keypress" key=" " action="this._setupAppmenu(event);"/>
-    </handlers>
-  </binding>
 </bindings>
--- a/mail/base/content/mainMailToolbox.inc.xul
+++ b/mail/base/content/mainMailToolbox.inc.xul
@@ -309,17 +309,17 @@
                  mousethrough="always">
        <image/>
     </toolbaritem>
     <toolbarbutton id="button-stop"
                    class="toolbarbutton-1"
                    label="&stopButton.label;"
                    tooltiptext="&stopButton.tooltip;"
                    command="cmd_stop"/>
-    <toolbarbutton id="button-appmenu"
+    <toolbarbutton is="toolbarbutton-appmenu" id="button-appmenu"
                    type="menu"
                    class="toolbarbutton-1 button-appmenu"
                    label="&appmenuButton.label;"
                    tooltiptext="&appmenuButton1.tooltip;"/>
 #ifdef MAIN_WINDOW
     <!-- gloda search widget; provides global (message) searching.  -->
     <toolbaritem id="gloda-search" insertafter="button-stop"
                  title="&glodaSearch.title;"
--- a/mail/base/content/messenger.css
+++ b/mail/base/content/messenger.css
@@ -165,20 +165,16 @@ splitmenu {
 #messengerWindow:not([chromemargin]) > #titlebar {
   display: none;
 }
 
 #titlebar-spacer {
   pointer-events: none;
 }
 
-.button-appmenu {
-  -moz-binding: url("chrome://messenger/content/mailWidgets.xml#appmenu-vertical") !important;
-}
-
 %ifndef XP_MACOSX
 toolbar[type="menubar"][autohide="true"] {
   overflow: hidden;
 }
 
 toolbar[type="menubar"][autohide="true"][inactive="true"]:not([customizing="true"]) {
   min-height: 0 !important;
   height: 0 !important;
@@ -290,9 +286,9 @@ statuspanel[label=""],
 statuspanel:not([label]) {
   opacity: 0;
   pointer-events: none;
 }
 
 .statuspanel-inner {
   height: 3em;
   -moz-box-align: end;
-}
\ No newline at end of file
+}
new file mode 100644
--- /dev/null
+++ b/mail/base/content/toolbarbutton-appmenu.js
@@ -0,0 +1,53 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+  * License, v. 2.0. If a copy of the MPL was not distributed with this
+  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+/* global MozXULElement */
+
+// Wrap in a block to prevent leaking to window scope.
+{
+  /**
+   * The MozToolbarButtonAppmenu is a toolbarbutton to display an appmenu
+   * (a.k.a. hamburger menu) button.
+   *
+   * @extends MozToolbarbutton
+   */
+  class MozToolbarButtonAppmenu extends customElements.get("toolbarbutton") {
+    constructor() {
+      super();
+      // While it would seem we could do this by handling oncommand, we can't
+      // because any external oncommand handlers might get called before ours,
+      // and then they would see the incorrect value of checked. Additionally
+      // a command attribute would redirect the command events anyway.
+      // Also, the appmenu-popup needs to be appended to the target 'Hamburger
+      // button' dynamically at every button click (as opposed to appended
+      // once in the binding's constructor) otherwise only one of the four
+      // Hamburger buttons (on the Mail, Calendar, Tasks and Chat tabs) will
+      // get the popup menu (namely, Mail). See Bug 890332.
+      this.addEventListener("mousedown", (event) => {
+        if (event.button != 0) {
+          return;
+        }
+        this._setupAppmenu(event);
+      });
+
+      this.addEventListener("keypress", (event) => {
+        this._setupAppmenu(event); }
+      );
+    }
+
+    _setupAppmenu(event) {
+      if (event.target == this) {
+        let appmenuPopup = document.getElementById("appmenu-popup");
+        if (this.lastChild != appmenuPopup) {
+          this.appendChild(appmenuPopup);
+        }
+      }
+    }
+  }
+  customElements.define("toolbarbutton-appmenu",
+    MozToolbarButtonAppmenu, { extends: "toolbarbutton" }
+  );
+}
--- a/mail/base/jar.mn
+++ b/mail/base/jar.mn
@@ -25,24 +25,24 @@ messenger.jar:
 *   content/messenger/hiddenWindow.xul              (content/hiddenWindow.xul)
     content/messenger/hiddenWindow.js               (content/hiddenWindow.js)
     content/messenger/msgHdrView.js                 (content/msgHdrView.js)
     content/messenger/msgViewNavigation.js          (content/msgViewNavigation.js)
     content/messenger/mailWidgets.xml               (content/mailWidgets.xml)
     content/messenger/mailWidgets.js                (content/mailWidgets.js)
     content/messenger/button-menu-button.js         (content/button-menu-button.js)
     content/messenger/toolbarbutton-menu-button.js  (content/toolbarbutton-menu-button.js)
+    content/messenger/toolbarbutton-appmenu.js      (content/toolbarbutton-appmenu.js)
     content/messenger/customElements.js             (content/customElements.js)
     content/messenger/customizeToolbar.css          (../../common/src/customizeToolbar.css)
     content/messenger/customizeToolbar.js           (../../common/src/customizeToolbar.js)
 *   content/messenger/customizeToolbar.xul          (../../common/src/customizeToolbar.xul)
     content/messenger/viewSource.js                 (../../common/src/viewSource.js)
 *   content/messenger/viewSource.xul                (../../common/src/viewSource.xul)
     content/messenger/viewZoomOverlay.js            (../../common/src/viewZoomOverlay.js)
-    content/messenger/generalBindings.xml           (../../common/bindings/generalBindings.xml)
     content/messenger/generalBindings.js            (../../common/bindings/generalBindings.js)
     content/messenger/richlistbox.xml               (../../common/bindings/richlistbox.xml)
 *   content/messenger/toolbar.xml                   (../../common/bindings/toolbar.xml)
     content/messenger/attachmentList.css            (content/attachmentList.css)
     content/messenger/menulist.css                  (content/menulist.css)
 *   content/messenger/bindings.css                  (content/bindings.css)
     content/messenger/nsDragAndDrop.js              (content/nsDragAndDrop.js)
     content/messenger/editContactPanel.js           (content/editContactPanel.js)
--- a/mail/components/im/content/chat-messenger.inc.xul
+++ b/mail/components/im/content/chat-messenger.inc.xul
@@ -79,17 +79,17 @@
                        tabs is closing the tab.  Our binding does process escape to
                        clear the box, if people want to clear it that way...
                     -->
                   <hbox>
                     <image class="gloda-search-icon"/>
                   </hbox>
                 </textbox>
               </toolbaritem>
-              <toolbarbutton id="button-chat-appmenu"
+              <toolbarbutton is="toolbarbutton-appmenu" id="button-chat-appmenu"
                              type="menu"
                              class="toolbarbutton-1 button-appmenu"
                              label="&appmenuButton.label;"
                              tooltiptext="&appmenuButton1.tooltip;"/>
             </toolbarpalette>
             <toolbarset id="customChatToolbars" context="chat-toolbar-context-menu"/>
           </toolbox>
 
--- a/mail/themes/osx/mail/messenger.css
+++ b/mail/themes/osx/mail/messenger.css
@@ -301,20 +301,16 @@ toolbarbutton[type="menu-button"][disabl
 }
 
 .toolbarbutton-1 > .toolbarbutton-menubutton-button:-moz-locale-dir(rtl),
 .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker:-moz-locale-dir(ltr) {
   border-top-left-radius: 0;
   border-bottom-left-radius: 0;
 }
 
-toolbox[labelalign="end"] toolbarpaletteitem .toolbarbutton-1[type="menu"] {
-  -moz-binding: url("chrome://global/content/bindings/toolbarbutton.xml#toolbarbutton");
-}
-
 .toolbarbutton-1[type="menu-button"] {
   padding: 0;
 }
 
 .toolbarbutton-1 > .toolbarbutton-menubutton-button,
 .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
   margin: 0;
 }
--- a/mail/themes/shared/mail/messenger.css
+++ b/mail/themes/shared/mail/messenger.css
@@ -35,24 +35,16 @@
 toolbox[labelalign="end"] > toolbar[mode="full"] .toolbarbutton-1 .toolbarbutton-text {
   padding-inline-start: 2px;
 }
 
 toolbox[labelalign="end"] > toolbar[mode="full"] deck .toolbarbutton-text {
   text-align: start;
 }
 
-.toolbarbutton-1[type="menu"] {
-  -moz-binding: url("chrome://messenger/content/generalBindings.xml#menu-vertical");
-}
-
-toolbox[labelalign="end"] > toolbar[mode="full"] .toolbarbutton-1[type="menu"] {
-  -moz-binding: url("chrome://global/content/bindings/toolbarbutton.xml#toolbarbutton");
-}
-
 description.error {
   color: #f00;
 }
 
 #notification-popup-box > image.notification-anchor-icon {
   width: 16px;
   height: 16px;
   -moz-context-properties: fill, fill-opacity;