Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-11-28 23:31:56 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 1711508 - remove PanelUI.protonAppMenuEnabled property, r=mconley

Browse Source 
Differential Revision: https://phabricator.services.mozilla.com/D117058
This commit is contained in:
Gijs Kruitbosch 2021-07-07 22:15:50 +00:00
parent 60b3217bb3
commit 6e1012d2e4
7 changed files with 64 additions and 139 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
browser/base/content/appmenu-viewcache.inc.xhtml
View File

@ -15,7 +15,6 @@
hidden="true"/>
<toolbaritem id="appMenu-fxa-status"
class="sync-ui-item"
defaultlabel="&fxa.menu.signin.label;"
flex="1">
<image id="appMenu-fxa-avatar"/>
<toolbarbutton id="appMenu-fxa-label"
@ -764,7 +763,6 @@
align="center"
class="subviewbutton"
oncommand="gSync.clickFxAMenuHeaderButton(this);">
<image role="presentation" id="fxa-menu-avatar"/>
<vbox flex="1">
<label id="fxa-menu-header-title"
crop="end"

153
browser/base/content/browser-sync.js
View File

@ -471,7 +471,7 @@ var gSync = {
// Label for the sync buttons.
const appMenuLabel = PanelMultiView.getViewNode(
document,
PanelUI.protonAppMenuEnabled ? "appMenu-fxa-label2" : "appMenu-fxa-label"
"appMenu-fxa-label2"
);
if (!appMenuLabel) {
// We are in a window without our elements - just abort now, without
@ -490,31 +490,29 @@ var gSync = {
"PanelUI-remotetabs-setupsync"
).hidden = false;
if (PanelUI.protonAppMenuEnabled) {
const appMenuHeaderTitle = PanelMultiView.getViewNode(
document,
"appMenu-header-title"
);
const appMenuHeaderDescription = PanelMultiView.getViewNode(
document,
"appMenu-header-description"
);
const appMenuHeaderText = PanelMultiView.getViewNode(
document,
"appMenu-fxa-text"
);
appMenuHeaderTitle.hidden = true;
// We must initialize the label attribute here instead of the markup
// due to a timing error. The fluent label attribute was being applied
// after we had updated appMenuLabel and thus displayed an incorrect
// label for signed in users.
appMenuHeaderDescription.value = this.fluentStrings.formatValueSync(
"appmenu-fxa-signed-in-label"
);
appMenuHeaderText.textContent = this.fluentStrings.formatValueSync(
"appmenu-fxa-sync-and-save-data2"
);
}
const appMenuHeaderTitle = PanelMultiView.getViewNode(
document,
"appMenu-header-title"
);
const appMenuHeaderDescription = PanelMultiView.getViewNode(
document,
"appMenu-header-description"
);
const appMenuHeaderText = PanelMultiView.getViewNode(
document,
"appMenu-fxa-text"
);
appMenuHeaderTitle.hidden = true;
// We must initialize the label attribute here instead of the markup
// due to a timing error. The fluent label attribute was being applied
// after we had updated appMenuLabel and thus displayed an incorrect
// label for signed in users.
appMenuHeaderDescription.value = this.fluentStrings.formatValueSync(
"appmenu-fxa-signed-in-label"
);
appMenuHeaderText.textContent = this.fluentStrings.formatValueSync(
"appmenu-fxa-sync-and-save-data2"
);
for (let topic of this._obs) {
Services.obs.addObserver(this, topic, true);
@ -802,7 +800,7 @@ var gSync = {
// have UIState know about it.
let fxaStatus = document.documentElement.getAttribute("fxastatus");
if (PanelUI.protonAppMenuEnabled && fxaStatus == "not_configured") {
if (fxaStatus == "not_configured") {
this.openFxAEmailFirstPageFromFxaMenu(
PanelMultiView.getViewNode(document, "PanelUI-fxa")
);
@ -813,16 +811,6 @@ var gSync = {
if (!gFxaToolbarAccessed) {
Services.prefs.setBoolPref("identity.fxaccounts.toolbar.accessed", true);
}
const fxaSignOutButtonEl = PanelMultiView.getViewNode(
document,
"PanelUI-fxa-menu-account-signout-button"
);
const fxaSignOutSeparator = PanelMultiView.getViewNode(
document,
"PanelUI-sign-out-separator"
);
fxaSignOutButtonEl.hidden = fxaSignOutSeparator.hidden =
UIState.get() === UIState.STATUS_NOT_CONFIGURED;
this.enableSendTabIfValidTab();
@ -849,10 +837,6 @@ var gSync = {
// state shows an avatar with an email icon, `login-failed` state shows an avatar
// with a danger icon and the `verified` state will show the users
// custom profile image or a filled avatar.
// In the proton app menu, the avatar is not shown.
if (PanelUI.protonAppMenuEnabled) {
PanelMultiView.getViewNode(document, "fxa-menu-avatar").hidden = true;
}
let stateValue = "not_configured";
const menuHeaderTitleEl = PanelMultiView.getViewNode(
@ -897,11 +881,9 @@ var gSync = {
if (state.status === UIState.STATUS_NOT_CONFIGURED) {
mainWindowEl.style.removeProperty("--avatar-image-url");
if (PanelUI.protonAppMenuEnabled) {
headerDescription = this.fluentStrings.formatValueSync(
"appmenu-fxa-signed-in-label"
);
}
headerDescription = this.fluentStrings.formatValueSync(
"appmenu-fxa-signed-in-label"
);
} else if (state.status === UIState.STATUS_LOGIN_FAILED) {
stateValue = "login-failed";
headerTitle = this.fluentStrings.formatValueSync("account-disconnected2");
@ -1007,13 +989,11 @@ var gSync = {
updatePanelPopup(state) {
const appMenuStatus = PanelMultiView.getViewNode(
document,
PanelUI.protonAppMenuEnabled
? "appMenu-fxa-status2"
: "appMenu-fxa-status"
"appMenu-fxa-status2"
);
const appMenuLabel = PanelMultiView.getViewNode(
document,
PanelUI.protonAppMenuEnabled ? "appMenu-fxa-label2" : "appMenu-fxa-label"
"appMenu-fxa-label2"
);
const appMenuAvatar = PanelMultiView.getViewNode(
document,
@ -1033,9 +1013,9 @@ var gSync = {
);
const fxaPanelView = PanelMultiView.getViewNode(document, "PanelUI-fxa");
let defaultLabel = PanelUI.protonAppMenuEnabled
? this.fluentStrings.formatValueSync("appmenu-fxa-signed-in-label")
: appMenuStatus.getAttribute("defaultlabel");
let defaultLabel = this.fluentStrings.formatValueSync(
"appmenu-fxa-signed-in-label"
);
const status = state.status;
// Reset the status bar to its original state.
appMenuLabel.setAttribute("label", defaultLabel);
@ -1044,21 +1024,17 @@ var gSync = {
appMenuAvatar.style.removeProperty("list-style-image");
if (status == UIState.STATUS_NOT_CONFIGURED) {
if (PanelUI.protonAppMenuEnabled) {
appMenuHeaderText.hidden = false;
appMenuStatus.classList.add("toolbaritem-combined-buttons");
appMenuLabel.classList.remove("subviewbutton-nav");
appMenuHeaderTitle.hidden = true;
appMenuHeaderDescription.value = defaultLabel;
}
appMenuHeaderText.hidden = false;
appMenuStatus.classList.add("toolbaritem-combined-buttons");
appMenuLabel.classList.remove("subviewbutton-nav");
appMenuHeaderTitle.hidden = true;
appMenuHeaderDescription.value = defaultLabel;
return;
}
appMenuLabel.classList.remove("subviewbutton-nav");
if (PanelUI.protonAppMenuEnabled) {
appMenuHeaderText.hidden = true;
appMenuStatus.classList.remove("toolbaritem-combined-buttons");
}
appMenuHeaderText.hidden = true;
appMenuStatus.classList.remove("toolbaritem-combined-buttons");
// At this point we consider sync to be configured (but still can be in an error state).
if (status == UIState.STATUS_LOGIN_FAILED) {
@ -1071,20 +1047,16 @@ var gSync = {
"account-disconnected2"
);
appMenuStatus.setAttribute("tooltiptext", tooltipDescription);
if (PanelUI.protonAppMenuEnabled) {
appMenuLabel.classList.add("subviewbutton-nav");
appMenuHeaderTitle.hidden = false;
appMenuHeaderTitle.value = errorLabel;
appMenuHeaderDescription.value = state.email;
appMenuLabel.classList.add("subviewbutton-nav");
appMenuHeaderTitle.hidden = false;
appMenuHeaderTitle.value = errorLabel;
appMenuHeaderDescription.value = state.email;
appMenuLabel.removeAttribute("label");
appMenuLabel.setAttribute(
"aria-labelledby",
`${appMenuHeaderTitle.id},${appMenuHeaderDescription.id}`
);
} else {
appMenuLabel.setAttribute("label", errorLabel);
}
appMenuLabel.removeAttribute("label");
appMenuLabel.setAttribute(
"aria-labelledby",
`${appMenuHeaderTitle.id},${appMenuHeaderDescription.id}`
);
return;
} else if (status == UIState.STATUS_NOT_VERIFIED) {
let tooltipDescription = this.fxaStrings.formatStringFromName(
@ -1096,20 +1068,16 @@ var gSync = {
"account-finish-account-setup"
);
appMenuStatus.setAttribute("tooltiptext", tooltipDescription);
if (PanelUI.protonAppMenuEnabled) {
appMenuLabel.classList.add("subviewbutton-nav");
appMenuHeaderTitle.hidden = false;
appMenuHeaderTitle.value = unverifiedLabel;
appMenuHeaderDescription.value = state.email;
appMenuLabel.classList.add("subviewbutton-nav");
appMenuHeaderTitle.hidden = false;
appMenuHeaderTitle.value = unverifiedLabel;
appMenuHeaderDescription.value = state.email;
appMenuLabel.removeAttribute("label");
appMenuLabel.setAttribute(
"aria-labelledby",
`${appMenuHeaderTitle.id},${appMenuHeaderDescription.id}`
);
} else {
appMenuLabel.setAttribute("label", unverifiedLabel);
}
appMenuLabel.removeAttribute("label");
appMenuLabel.setAttribute(
"aria-labelledby",
`${appMenuHeaderTitle.id},${appMenuHeaderDescription.id}`
);
return;
}
@ -1238,10 +1206,7 @@ var gSync = {
async openFxAEmailFirstPageFromFxaMenu(panel = undefined) {
this.emitFxaToolbarTelemetry("login", panel);
let entryPoint = "fxa_discoverability_native";
if (
this.isPanelInsideAppMenu(panel) ||
(PanelUI.protonAppMenuEnabled && panel)
) {
if (panel) {
entryPoint = "fxa_app_menu";
}
this.openFxAEmailFirstPage(entryPoint);

5
browser/base/content/test/sync/browser_sync.js
View File

@ -638,10 +638,7 @@ function checkFxAAvatar(fxaStatus) {
// Unhide the panel so computed styles can be read
document.querySelector("#appMenu-popup").hidden = false;
const avatarContainers = [
PanelMultiView.getViewNode(document, "fxa-menu-avatar"),
document.getElementById("fxa-avatar-image"),
];
const avatarContainers = [document.getElementById("fxa-avatar-image")];
for (const avatar of avatarContainers) {
const avatarURL = getComputedStyle(avatar).listStyleImage;
const expected = {

2
browser/components/customizableui/content/panelUI.inc.xhtml
View File

@ -231,7 +231,7 @@
flip="slide"
position="bottomcenter topright"
noautofocus="true">
<panelmultiview id="appMenu-multiView" mainViewId="appMenu-mainView"
<panelmultiview id="appMenu-multiView" mainViewId="appMenu-protonMainView"
viewCacheId="appMenu-viewCache">
</panelmultiview>
</panel>

28
browser/components/customizableui/content/panelUI.js
View File

@ -95,17 +95,6 @@ const PanelUI = {
window.addEventListener("MozDOMFullscreen:Exited", this);
}
XPCOMUtils.defineLazyPreferenceGetter(
this,
"protonAppMenuEnabled",
"browser.proton.enabled",
false
);
if (this.protonAppMenuEnabled) {
this.multiView.setAttribute("mainViewId", "appMenu-protonMainView");
}
window.addEventListener("activate", this);
CustomizableUI.addListener(this);
@ -696,14 +685,6 @@ const PanelUI = {
}
button.classList.add("subviewbutton");
// While we support this panel for both Proton and non-Proton versions
// of the AppMenu, we only want to show icons for the non-Proton
// version. When Proton ships and we remove the non-Proton variant,
// we can remove the subviewbutton-iconic classes.
if (!PanelUI.protonAppMenuEnabled) {
button.classList.add("subviewbutton-iconic");
}
fragment.appendChild(button);
}
@ -852,9 +833,7 @@ const PanelUI = {
if (!this._mainView) {
this._mainView = PanelMultiView.getViewNode(
document,
this.protonAppMenuEnabled
? "appMenu-protonMainView"
: "appMenu-mainView"
"appMenu-protonMainView"
);
}
return this._mainView;
@ -862,12 +841,9 @@ const PanelUI = {
get addonNotificationContainer() {
if (!this._addonNotificationContainer) {
let bannerID = this.protonAppMenuEnabled
? "appMenu-proton-addon-banners"
: "appMenu-addon-banners";
this._addonNotificationContainer = PanelMultiView.getViewNode(
document,
bannerID
"appMenu-proton-addon-banners"
);
}

4
browser/modules/ZoomUI.jsm
View File

@ -131,9 +131,7 @@ async function updateZoomUI(aBrowser, aAnimate = false) {
let appMenuZoomReset = PanelMultiView.getViewNode(
win.document,
win.PanelUI.protonAppMenuEnabled
? "appMenu-zoomReset-button2"
: "appMenu-zoomReset-button"
"appMenu-zoomReset-button2"
);
// Exit early if UI elements aren't present.

9
browser/themes/shared/customizableui/panelUI.inc.css
View File

@ -756,14 +756,12 @@ toolbarbutton[constrain-size="true"][cui-areatype="menu-panel"] > .toolbarbutton
display: none;
}
#fxa-menu-avatar,
#fxa-avatar-image,
#PanelUI-fxa-menu-account-settings-button {
list-style-image: var(--avatar-image-url);
}
/* Non-signedin statuses icons are not totally round. */
:root[fxastatus="signedin"] #fxa-menu-avatar,
:root[fxastatus="signedin"] #fxa-avatar-image {
border-radius: 50%;
}
@ -799,13 +797,6 @@ toolbarbutton[constrain-size="true"][cui-areatype="menu-panel"] > .toolbarbutton
color: var(--panel-description-color);
}
#fxa-menu-avatar {
height: 32px;
width: 32px;
-moz-context-properties: fill, fill-opacity;
fill: var(--arrowpanel-color);
}
#PanelUI-fxa-menu-send-button {
list-style-image: url(chrome://browser/skin/fxa/send.svg);
}