Bug 566425 - [TB] Customize toolbar sheet moves when selecting the show dropdown menu

r=Standard8

mail/base/content/mailCore.js

@@ -175,8 +175,10 @@ function CustomizeMailToolbar(toolboxId, customizePopupId)
 
   if (gCustomizeSheet) {
     var sheetFrame = document.getElementById("customizeToolbarSheetIFrame");
+    var panel = document.getElementById("customizeToolbarSheetPopup");
     sheetFrame.hidden = false;
     sheetFrame.toolbox = toolbox;
+    sheetFrame.panel = panel;
 
     // The document might not have been loaded yet, if this is the first time.
     // If it is already loaded, reload it so that the onload intialization code
@@ -186,8 +188,14 @@ function CustomizeMailToolbar(toolboxId, customizePopupId)
     else
       sheetFrame.setAttribute("src", customizeURL);
 
-    document.getElementById("customizeToolbarSheetPopup")
-            .openPopup(toolbox, "after_start", 0, 0);
+    // Open the panel, but make it invisible until the iframe has loaded so
+    // that the user doesn't see a white flash.
+    panel.style.visibility = "hidden";
+    toolbox.addEventListener("beforecustomization", function () {
+      toolbox.removeEventListener("beforecustomization", arguments.callee, false);
+      panel.style.removeProperty("visibility");
+    }, false);
+    panel.openPopup(toolbox, "after_start", 0, 0);
   }
   else {
     var wintype = document.documentElement.getAttribute("windowtype");

mail/base/content/messageWindow.xul

@@ -183,9 +183,7 @@
     <hbox id="attachmentView"/>
     <findbar id="FindToolbar" browserid="messagepane"/>
   </vbox>
-  <panel id="customizeToolbarSheetPopup"
-         noautohide="true"
-         onpopupshown="this.moveTo(this.boxObject.screenX + (window.innerWidth - this.boxObject.width) / 2, this.boxObject.screenY);">
+  <panel id="customizeToolbarSheetPopup" noautohide="true">
     <iframe id="customizeToolbarSheetIFrame"
             style="&dialog.style;"
             hidden="true"/>

mail/base/content/messenger.xul

@@ -463,9 +463,7 @@
     <vbox id="contentTab"/>
     <vbox id="chromeTab"/>
   </hbox>
-  <panel id="customizeToolbarSheetPopup"
-         noautohide="true"
-         onpopupshown="this.moveTo(this.boxObject.screenX + (window.innerWidth - this.boxObject.width) / 2, this.boxObject.screenY);">
+  <panel id="customizeToolbarSheetPopup" noautohide="true">
     <iframe id="customizeToolbarSheetIFrame"
             style="&dialog.style;"
             hidden="true"/>

mail/components/addrbook/content/addressbook.xul

@@ -852,9 +852,7 @@
       </hbox>
     </vbox>
   </hbox>
-  <panel id="customizeToolbarSheetPopup"
-         noautohide="true"
-         onpopupshown="this.moveTo(this.boxObject.screenX + (window.innerWidth - this.boxObject.width) / 2, this.boxObject.screenY);">
+  <panel id="customizeToolbarSheetPopup" noautohide="true">
     <iframe id="customizeToolbarSheetIFrame"
             style="&dialog.style;"
             hidden="true"/>

mail/components/compose/content/messengercompose.xul

@@ -800,9 +800,7 @@
 
   </vbox>
   </hbox>
-  <panel id="customizeToolbarSheetPopup"
-         noautohide="true"
-         onpopupshown="this.moveTo(this.boxObject.screenX + (window.innerWidth - this.boxObject.width) / 2, this.boxObject.screenY);">
+  <panel id="customizeToolbarSheetPopup" noautohide="true">
     <iframe id="customizeToolbarSheetIFrame"
             style="&dialog.style;"
             hidden="true"/>