Bug 1074520 - use CSS instead of hacks to make the forget button panel lay out correctly, r=jaws
--- a/browser/components/customizableui/CustomizableWidgets.jsm
+++ b/browser/components/customizableui/CustomizableWidgets.jsm
@@ -1024,75 +1024,25 @@ if (Services.prefs.getBoolPref("privacy.
}
});
},
handleEvent: function(aEvent) {
switch (aEvent.type) {
case "command":
this.forgetButtonCalled(aEvent);
break;
- case "popupshowing":
- let popup = aEvent.target;
- if (popup.id == "customizationui-widget-panel" &&
- popup.querySelector("#PanelUI-panicView")) {
- popup.ownerDocument.removeEventListener("popupshowing", this);
- this._updateHeights(popup, true);
- }
- break;
- }
- },
- // Workaround bug 451997 by hardcoding heights for (potentially) wrapped items:
- _updateHeights: function(aContainer, aSetHeights) {
- // Make sure we don't get stuck not finding anything because of the XBL binding between
- // the popup and the radio/label/description elements:
- let view = aContainer.ownerDocument.getElementById("PanelUI-panicView");
- let variableHeightItems = view.querySelectorAll("radio, label, description");
- let win = aContainer.ownerDocument.defaultView;
- for (let item of variableHeightItems) {
- if (aSetHeights) {
- let cs = win.getComputedStyle(item, null);
- let height = cs.getPropertyValue("height");
- let width = cs.getPropertyValue("width");
- item.style.height = height;
- item.style.width = width;
- // In the main menu panel, need to set the height of the container of this
- // description because otherwise the text will overflow:
- if (item.id == "PanelUI-panic-mainDesc" &&
- view.getAttribute("current") == "true" &&
- // Ensure we don't make this less than the size of the icon:
- parseInt(height) > 32) {
- item.parentNode.style.minHeight = height;
- }
- } else {
- item.style.removeProperty("height");
- item.style.removeProperty("width");
- if (item.id == "PanelUI-panic-mainDesc") {
- item.parentNode.style.removeProperty("min-height");
- }
- }
}
},
onViewShowing: function(aEvent) {
- let view = aEvent.target;
- let forgetButton = view.querySelector("#PanelUI-panic-view-button");
+ let forgetButton = aEvent.target.querySelector("#PanelUI-panic-view-button");
forgetButton.addEventListener("command", this);
- if (view.getAttribute("current") == "true") {
- // In the main menupanel, fix heights immediately:
- this._updateHeights(view, true);
- } else {
- // In a standalone panel, so fix the label and radio heights
- // when the popup starts showing.
- view.ownerDocument.addEventListener("popupshowing", this);
- }
},
onViewHiding: function(aEvent) {
- let view = aEvent.target;
- let forgetButton = view.querySelector("#PanelUI-panic-view-button");
+ let forgetButton = aEvent.target.querySelector("#PanelUI-panic-view-button");
forgetButton.removeEventListener("command", this);
- this._updateHeights(view, false);
},
});
}
#ifdef E10S_TESTING_ONLY
/**
* The e10s button's purpose is to lower the barrier of entry
* for our Nightly testers to use e10s windows. We'll be removing it
--- a/browser/components/customizableui/content/panelUI.js
+++ b/browser/components/customizableui/content/panelUI.js
@@ -334,16 +334,17 @@ const PanelUI = {
}
tempPanel.setAttribute("context", "");
document.getElementById(CustomizableUI.AREA_NAVBAR).appendChild(tempPanel);
// If the view has a footer, set a convenience class on the panel.
tempPanel.classList.toggle("cui-widget-panelWithFooter",
viewNode.querySelector(".panel-subview-footer"));
let multiView = document.createElement("panelmultiview");
+ multiView.setAttribute("id", "customizationui-widget-multiview");
multiView.setAttribute("nosubviews", "true");
tempPanel.appendChild(multiView);
multiView.setAttribute("mainViewIsSubView", "true");
multiView.setMainView(viewNode);
viewNode.classList.add("cui-widget-panelview");
CustomizableUI.addPanelCloseListeners(tempPanel);
let panelRemover = function() {
--- a/browser/components/customizableui/content/panelUI.xml
+++ b/browser/components/customizableui/content/panelUI.xml
@@ -404,17 +404,17 @@
let footer = aSubview.querySelector(".panel-subview-footer");
height += (header ? getFullHeight(header) : 0) +
(footer ? getFullHeight(footer) : 0);
}
if (aContainerToCheck) {
let containerCS = win.getComputedStyle(aContainerToCheck);
height += parseFloat(containerCS.paddingTop) + parseFloat(containerCS.paddingBottom);
}
- return Math.round(height);
+ return Math.ceil(height);
]]></body>
</method>
</implementation>
</binding>
<binding id="panelview">
<implementation>
--- a/browser/themes/shared/customizableui/panelUIOverlay.inc.css
+++ b/browser/themes/shared/customizableui/panelUIOverlay.inc.css
@@ -1100,16 +1100,24 @@ toolbaritem[overflowedItem=true],
-moz-appearance: none;
-moz-margin-end: 3px;
}
menuitem[checked="true"].subviewbutton > .menu-iconic-left {
visibility: hidden;
}
+.panel-mainview[panelid=customizationui-widget-panel],
+#customizationui-widget-multiview > .panel-viewcontainer,
+#customizationui-widget-multiview > .panel-viewcontainer > .panel-viewstack,
+#PanelUI-panicView > .panel-subview-body,
+#PanelUI-panicView {
+ overflow: visible;
+}
+
#PanelUI-panicView.cui-widget-panelview {
min-width: 280px;
}
#PanelUI-panic-timeframe {
padding: 15px;
border-bottom: 1px solid rgba(0,0,0,0.1);
}