Bug 1546336 - [de-xbl] remove the toolbar-menubar-autohide binding. r=mkmelin
authorKhushil Mistry <khushil324@gmail.com>
Thu, 20 Jun 2019 05:30:00 +0200
changeset 35904 e0efa65d39017d0d89c9a6a3e7a74c2a37f0d547
parent 35903 3648eae49455f36ca2da8c70f9c016316dc6c2e0
child 35905 3252789dc29605fca55494a949c380dc24b95948
push id392
push userclokep@gmail.com
push dateMon, 02 Sep 2019 20:17:19 +0000
reviewersmkmelin
bugs1546336
Bug 1546336 - [de-xbl] remove the toolbar-menubar-autohide binding. r=mkmelin
common/bindings/toolbar.xml
mail/base/content/bindings.css
mail/base/content/messenger-customization.js
mail/base/content/messenger.xul
mail/base/content/msgMail3PaneWindow.js
mail/base/jar.mn
--- a/common/bindings/toolbar.xml
+++ b/common/bindings/toolbar.xml
@@ -385,116 +385,16 @@
                                           .split(",")
                                           .concat(["separator", "spacer", "spring"]);
           return aCurrentSet.split(",").some(item => !defaultOrNoninteractive.includes(item));
         ]]></body>
       </method>
     </implementation>
   </binding>
 
-  <binding id="toolbar-menubar-autohide"
-#ifdef MOZ_SUITE
-           extends="chrome://communicator/content/bindings/toolbar.xml#toolbar">
-#else
-           extends="chrome://messenger/content/toolbar.xml#toolbar">
-#endif
-    <implementation>
-      <constructor>
-        this._setInactive();
-      </constructor>
-      <destructor>
-        this._setActive();
-      </destructor>
-
-      <field name="_inactiveTimeout">null</field>
-
-      <field name="_contextMenuListener"><![CDATA[({
-        toolbar: this,
-        contextMenu: null,
-
-        get active() {
-          return !!this.contextMenu;
-        },
-
-        init(event) {
-          var node = event.target;
-          while (node != this.toolbar) {
-            if (node.localName == "menupopup")
-              return;
-            node = node.parentNode;
-          }
-
-          var contextMenuId = this.toolbar.getAttribute("context");
-          if (!contextMenuId)
-            return;
-
-          this.contextMenu = document.getElementById(contextMenuId);
-          if (!this.contextMenu)
-            return;
-
-          this.contextMenu.addEventListener("popupshown", this);
-          this.contextMenu.addEventListener("popuphiding", this);
-          this.toolbar.addEventListener("mousemove", this);
-        },
-        handleEvent(event) {
-          switch (event.type) {
-            case "popupshown":
-              this.toolbar.removeEventListener("mousemove", this);
-              break;
-            case "popuphiding":
-            case "mousemove":
-              this.toolbar._setInactiveAsync();
-              this.toolbar.removeEventListener("mousemove", this);
-              this.contextMenu.removeEventListener("popuphiding", this);
-              this.contextMenu.removeEventListener("popupshown", this);
-              this.contextMenu = null;
-              break;
-          }
-        },
-      })]]></field>
-
-      <method name="_setInactive">
-        <body><![CDATA[
-          this.setAttribute("inactive", "true");
-        ]]></body>
-      </method>
-
-      <method name="_setInactiveAsync">
-        <body><![CDATA[
-          this._inactiveTimeout = setTimeout(function(self) {
-            if (self.getAttribute("autohide") == "true") {
-              self._inactiveTimeout = null;
-              self._setInactive();
-            }
-          }, 0, this);
-        ]]></body>
-      </method>
-
-      <method name="_setActive">
-        <body><![CDATA[
-          if (this._inactiveTimeout) {
-            clearTimeout(this._inactiveTimeout);
-            this._inactiveTimeout = null;
-          }
-          this.removeAttribute("inactive");
-        ]]></body>
-      </method>
-    </implementation>
-
-    <handlers>
-      <handler event="DOMMenuBarActive"     action="this._setActive();"/>
-      <handler event="popupshowing"         action="this._setActive();"/>
-      <handler event="mousedown" button="2" action="this._contextMenuListener.init(event);"/>
-      <handler event="DOMMenuBarInactive"><![CDATA[
-        if (!this._contextMenuListener.active)
-          this._setInactiveAsync();
-      ]]></handler>
-    </handlers>
-  </binding>
-
   <binding id="toolbarpaletteitem">
     <content>
       <xul:hbox class="toolbarpaletteitem-box" flex="1" xbl:inherits="type,place">
         <children/>
       </xul:hbox>
     </content>
   </binding>
 
--- a/mail/base/content/bindings.css
+++ b/mail/base/content/bindings.css
@@ -9,22 +9,16 @@
 toolbox {
   -moz-binding: url("chrome://messenger/content/toolbar.xml#toolbox");
 }
 
 toolbar {
   -moz-binding: url("chrome://messenger/content/toolbar.xml#toolbar");
 }
 
-%ifndef XP_MACOSX
-toolbar[type="menubar"][autohide="true"] {
-  -moz-binding: url("chrome://messenger/content/toolbar.xml#toolbar-menubar-autohide");
-}
-%endif
-
 toolbarpaletteitem {
   -moz-binding: url("chrome://messenger/content/toolbar.xml#toolbarpaletteitem");
 }
 
 toolbarpaletteitem[place="palette"] {
   -moz-box-orient: vertical;
   -moz-binding: url("chrome://messenger/content/toolbar.xml#toolbarpaletteitem-palette");
 }
new file mode 100644
--- /dev/null
+++ b/mail/base/content/messenger-customization.js
@@ -0,0 +1,115 @@
+/**
+ * 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/. */
+
+var AutoHideMenubar = {
+  get _node() {
+    delete this._node;
+    return this._node = document.getElementById("mail-toolbar-menubar2");
+  },
+
+  _contextMenuListener: {
+    contextMenu: null,
+
+    get active() {
+      return !!this.contextMenu;
+    },
+
+    init(event) {
+      // Ignore mousedowns in <menupopup>s.
+      if (event.target.closest("menupopup")) {
+        return;
+      }
+
+      let contextMenuId = AutoHideMenubar._node.getAttribute("context");
+      this.contextMenu = document.getElementById(contextMenuId);
+      this.contextMenu.addEventListener("popupshown", this);
+      this.contextMenu.addEventListener("popuphiding", this);
+      AutoHideMenubar._node.addEventListener("mousemove", this);
+    },
+
+    handleEvent(event) {
+      switch (event.type) {
+        case "popupshown":
+          AutoHideMenubar._node.removeEventListener("mousemove", this);
+          break;
+        case "popuphiding":
+        case "mousemove":
+          AutoHideMenubar._setInactiveAsync();
+          AutoHideMenubar._node.removeEventListener("mousemove", this);
+          this.contextMenu.removeEventListener("popuphiding", this);
+          this.contextMenu.removeEventListener("popupshown", this);
+          this.contextMenu = null;
+          break;
+      }
+    },
+  },
+
+  init() {
+    this._node.addEventListener("toolbarvisibilitychange", this);
+    this._enable();
+  },
+
+  _updateState() {
+    if (this._node.getAttribute("autohide") == "true") {
+      this._enable();
+    } else {
+      this._disable();
+    }
+  },
+
+  _events: ["DOMMenuBarInactive", "DOMMenuBarActive", "popupshowing", "mousedown"],
+  _enable() {
+    this._node.setAttribute("inactive", "true");
+    for (let event of this._events) {
+      this._node.addEventListener(event, this);
+    }
+  },
+
+  _disable() {
+    this._setActive();
+    for (let event of this._events) {
+      this._node.removeEventListener(event, this);
+    }
+  },
+
+  handleEvent(event) {
+    switch (event.type) {
+      case "toolbarvisibilitychange":
+        this._updateState();
+        break;
+      case "popupshowing":
+      // fall through
+      case "DOMMenuBarActive":
+        this._setActive();
+        break;
+      case "mousedown":
+        if (event.button == 2) {
+          this._contextMenuListener.init(event);
+        }
+        break;
+      case "DOMMenuBarInactive":
+        if (!this._contextMenuListener.active)
+          this._setInactiveAsync();
+        break;
+    }
+  },
+
+  _setInactiveAsync() {
+    this._inactiveTimeout = setTimeout(() => {
+      if (this._node.getAttribute("autohide") == "true") {
+        this._inactiveTimeout = null;
+        this._node.setAttribute("inactive", "true");
+      }
+    }, 0);
+  },
+
+  _setActive() {
+    if (this._inactiveTimeout) {
+      clearTimeout(this._inactiveTimeout);
+      this._inactiveTimeout = null;
+    }
+    this._node.removeAttribute("inactive");
+  },
+};
--- a/mail/base/content/messenger.xul
+++ b/mail/base/content/messenger.xul
@@ -152,16 +152,17 @@
 <script src="chrome://messenger/content/newmailaccount/uriListener.js"/>
 <script src="chrome://messenger/content/chat/chat-conversation-info.js"/>
 <script src="chrome://gloda/content/autocomplete-richlistitem.js"/>
 <script src="chrome://messenger/content/chat/chat-contact.js"/>
 <script src="chrome://messenger/content/chat/chat-group.js"/>
 <script src="chrome://messenger/content/chat/chat-imconv.js"/>
 <script src="chrome://messenger/content/tabbrowser-tab.js"/>
 <script src="chrome://messenger/content/chat/toolbarbutton-badge-button.js"/>
+<script src="chrome://messenger/content/messenger-customization.js"/>
 <!-- panelUI.js is for the appmenus. -->
 <script src="chrome://messenger/content/customizableui/panelUI.js"/>
 #ifdef XP_MACOSX
 <script src="chrome://messenger/content/macMessengerMenu.js"/>
 <script src="chrome://global/content/macWindowMenu.js"/>
 #endif
 
 <!-- move needed functions into a single js file -->
--- a/mail/base/content/msgMail3PaneWindow.js
+++ b/mail/base/content/msgMail3PaneWindow.js
@@ -3,16 +3,17 @@
  * 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/. */
 
 /* import-globals-from ../../../../toolkit/modules/PageMenu.jsm */
 /* import-globals-from ../../../mailnews/base/prefs/content/accountUtils.js */
 /* import-globals-from ../../../mailnews/base/util/mailnewsMigrator.js */
 /* import-globals-from ../../components/newmailaccount/content/accountProvisionerTab.js */
 /* import-globals-from ../../components/preferences/preferencesTab.js */
+/* import-globals-from messenger-customization.js */
 /* import-globals-from commandglue.js */
 /* import-globals-from folderDisplay.js */
 /* import-globals-from folderPane.js */
 /* import-globals-from glodaFacetTab.js */
 /* import-globals-from mailTabs.js */
 /* import-globals-from mailWindow.js */
 /* import-globals-from quickFilterBar.js */
 /* import-globals-from searchBar.js */
@@ -425,18 +426,25 @@ function AutoConfigWizard(okCallback) {
 
 /**
  * Called on startup to initialize various parts of the main window
  */
 function OnLoadMessenger() {
   TagUtils.loadTagsIntoCSS(document);
 
   migrateMailnews();
+
+  // Run menubar initialization first, to avoid TabsInTitlebar code picking
+  // up mutations from it and causing a reflow.
+  if (AppConstants.platform != "macosx") {
+    AutoHideMenubar.init();
+  }
   // Rig up our TabsInTitlebar early so that we can catch any resize events.
   TabsInTitlebar.init();
+
   // update the pane config before we exit onload otherwise the user may see a flicker if we poke the document
   // in delayedOnLoadMessenger...
   UpdateMailPaneConfig(false);
 
   if (AppConstants.platform == "win") {
     // On Win8 set an attribute when the window frame color is too dark for black text.
     if (window.matchMedia("(-moz-os-version: windows-win8)").matches &&
         window.matchMedia("(-moz-windows-default-theme)").matches) {
--- a/mail/base/jar.mn
+++ b/mail/base/jar.mn
@@ -35,17 +35,17 @@ messenger.jar:
 *   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.js            (../../common/bindings/generalBindings.js)
 *   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/bindings.css                  (content/bindings.css)
     content/messenger/nsDragAndDrop.js              (content/nsDragAndDrop.js)
     content/messenger/editContactPanel.js           (content/editContactPanel.js)
     content/messenger/msgMail3PaneWindow.js         (content/msgMail3PaneWindow.js)
     content/messenger/mail3PaneWindowCommands.js    (content/mail3PaneWindowCommands.js)
     content/messenger/mailCommands.js               (content/mailCommands.js)
     content/messenger/mailCore.js                   (content/mailCore.js)
     content/messenger/mailTabs.js                   (content/mailTabs.js)
     content/messenger/commandglue.js                (content/commandglue.js)
@@ -59,16 +59,17 @@ messenger.jar:
     content/messenger/aboutAddonsExtra.js           (content/aboutAddonsExtra.js)
     content/messenger/aboutDialog-appUpdater.js     (content/aboutDialog-appUpdater.js)
 *   content/messenger/aboutDialog.xul               (content/aboutDialog.xul)
     content/messenger/aboutDialog.js                (content/aboutDialog.js)
 *   content/messenger/aboutRights.xhtml             (content/aboutRights.xhtml)
 *   content/messenger/systemIntegrationDialog.xul   (content/systemIntegrationDialog.xul)
     content/messenger/systemIntegrationDialog.js    (content/systemIntegrationDialog.js)
     content/messenger/folderPane.js                 (content/folderPane.js)
+    content/messenger/messenger-customization.js    (content/messenger-customization.js)
     content/messenger/searchBar.js                  (content/searchBar.js)
     content/messenger/phishingDetector.js           (content/phishingDetector.js)
     content/messenger/mail-offline.js               (content/mail-offline.js)
     content/messenger/aboutDialog.css               (content/aboutDialog.css)
     content/messenger/converterDialog.css           (content/converterDialog.css)
     content/messenger/notification.css              (content/notification.css)
 *   content/messenger/messenger.css                 (content/messenger.css)
     content/messenger/search.xml                    (content/search.xml)