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 1694678: update fxa and remote tabs sync now buttons r=fluent-reviewers,mconley

Browse Source 
This patch:
-Maintains consistency between the fxa and remote tabs' panels "sync now" buttons
-Removes a fluent string no longer in use
-Restores tooltip functionality

Differential Revision: https://phabricator.services.mozilla.com/D106651
This commit is contained in:
Emma Malysz 2021-03-02 16:02:35 +00:00
parent 526c00ee99
commit 4d02027b4d
8 changed files with 97 additions and 99 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -353,7 +353,7 @@ var gSync = {
get fluentStrings() {
delete this.fluentStrings;
return (this.fluentStrings = new Localization(
["branding/brand.ftl", "browser/appmenu.ftl"],
["branding/brand.ftl", "browser/appmenu.ftl", "browser/sync.ftl"],
true
));
},
@ -844,15 +844,6 @@ var gSync = {
"defaultLabel"
);
const syncNowLabel = PanelMultiView.getViewNode(
document,
"PanelUI-fxa-menu-syncnow-label"
);
const lastSyncedLabel = PanelMultiView.getViewNode(
document,
"PanelUI-appMenu-fxa-label-last-synced"
);
if (PanelUI.protonAppMenuEnabled) {
// TODO: sign out button icon is still showing despite removing class
let toolbarbuttons = fxaMenuPanel.querySelectorAll("toolbarbutton");
@ -913,20 +904,6 @@ var gSync = {
if (state.syncEnabled) {
syncNowButtonEl.removeAttribute("hidden");
syncSetupButtonEl.hidden = true;
document.l10n.setAttributes(
syncNowLabel,
"appmenuitem-fxa-toolbar-sync-now"
);
let lastSyncDate = this.formatLastSyncDate(state.lastSync);
if (lastSyncDate) {
document.l10n.setAttributes(
lastSyncedLabel,
"appmenu-fxa-last-sync",
{
time: lastSyncDate,
}
);
}
}
headerTitle = this.fluentStrings.formatValueSync(
@ -1626,10 +1603,16 @@ var gSync = {
clearTimeout(this._syncAnimationTimer);
this._syncStartTime = Date.now();
let syncingLabel = this.fluentStrings.formatValueSync(
"fxa-toolbar-sync-syncing2"
);
document.querySelectorAll(".syncnow-label").forEach(el => {
el.value = syncingLabel;
});
document.querySelectorAll(".syncNowBtn").forEach(el => {
el.setAttribute("syncstatus", "active");
el.setAttribute("disabled", "true");
document.l10n.setAttributes(el, el.getAttribute("syncinglabel"));
});
document
@ -1637,8 +1620,6 @@ var gSync = {
.content.querySelectorAll(".syncNowBtn")
.forEach(el => {
el.setAttribute("syncstatus", "active");
el.setAttribute("disabled", "true");
document.l10n.setAttributes(el, el.getAttribute("syncinglabel"));
});
},
@ -1647,10 +1628,16 @@ var gSync = {
return;
}
let syncingLabel = this.fluentStrings.formatValueSync(
"appmenuitem-fxa-toolbar-sync-now2"
);
document.querySelectorAll(".syncnow-label").forEach(el => {
el.value = syncingLabel;
});
document.querySelectorAll(".syncNowBtn").forEach(el => {
el.removeAttribute("syncstatus");
el.removeAttribute("disabled");
document.l10n.setAttributes(el, "appmenuitem-fxa-toolbar-sync-now");
});
document
@ -1658,8 +1645,6 @@ var gSync = {
.content.querySelectorAll(".syncNowBtn")
.forEach(el => {
el.removeAttribute("syncstatus");
el.removeAttribute("disabled");
document.l10n.setAttributes(el, "appmenuitem-fxa-toolbar-sync-now");
});
Services.obs.notifyObservers(null, "test:browser-sync:activity-stop");
@ -1881,24 +1866,18 @@ var gSync = {
}
}
document.querySelectorAll(".syncNowBtn").forEach(el => {
let syncNowBtns = [
"PanelUI-remotetabs-syncnow",
"PanelUI-fxa-menu-syncnow-button",
];
syncNowBtns.forEach(id => {
let el = PanelMultiView.getViewNode(document, id);
if (tooltiptext) {
el.setAttribute("tooltiptext", tooltiptext);
} else {
el.removeAttribute("tooltiptext");
}
});
document
.getElementById("appMenu-viewCache")
.content.querySelectorAll(".syncNowBtn")
.forEach(el => {
if (tooltiptext) {
el.setAttribute("tooltiptext", tooltiptext);
} else {
el.removeAttribute("tooltiptext");
}
});
},
get relativeTimeFormat() {
@ -1910,24 +1889,17 @@ var gSync = {
},
formatLastSyncDate(date) {
const lastSyncedImage = PanelMultiView.getViewNode(
document,
"PanelUI-appMenu-fxa-image-last-synced"
);
if (!date) {
lastSyncedImage.hidden = true;
// Date can be null before the first sync!
return null;
}
try {
lastSyncedImage.hidden = false;
let adjustedDate = new Date(Date.now() - 1000);
let relativeDateStr = this.relativeTimeFormat.formatBestUnit(
date < adjustedDate ? date : adjustedDate
);
return relativeDateStr;
} catch (ex) {
lastSyncedImage.hidden = true;
// shouldn't happen, but one client having an invalid date shouldn't
// break the entire feature.
this.log.warn("failed to format lastSync time", date, ex);

31
browser/base/content/browser.xhtml
View File

@ -1381,12 +1381,18 @@
<observes element="sidebar-box" attribute="positionend"/>
</toolbarbutton>
<toolbarbutton id="PanelUI-remotetabs-syncnow"
data-l10n-id="appmenuitem-fxa-toolbar-sync-now"
syncinglabel="fxa-toolbar-sync-syncing-tabs"
class="syncNowBtn subviewbutton subviewbutton-iconic"
align="center"
class="subviewbutton subviewbutton-iconic"
oncommand="gSync.doSync();"
onmouseover="gSync.refreshSyncButtonsTooltip();"
closemenu="none"/>
closemenu="none">
<hbox flex="1">
<image class="syncNowBtn"/>
<label class="syncnow-label"
data-l10n-id="appmenuitem-fxa-toolbar-sync-now2"
crop="end"/>
</hbox>
</toolbarbutton>
<toolbarseparator id="PanelUI-remotetabs-separator"/>
</vbox>
<deck id="PanelUI-remotetabs-deck">
@ -1514,18 +1520,15 @@
align="center"
class="subviewbutton subviewbutton-iconic"
oncommand="gSync.doSyncFromFxaMenu(this);"
onmouseover="gSync.refreshSyncButtonsTooltip();"
closemenu="none">
<vbox flex="1">
<label id="PanelUI-fxa-menu-syncnow-label"
<hbox flex="1">
<image id="PanelUI-appMenu-fxa-image-last-synced"
class="syncNowBtn"/>
<label class="syncnow-label"
data-l10n-id="appmenuitem-fxa-toolbar-sync-now2"
crop="end"/>
<hbox>
<label id="PanelUI-appMenu-fxa-label-last-synced"
crop="end"/>
<image id="PanelUI-appMenu-fxa-image-last-synced"
class="syncNowBtn"
syncinglabel="fxa-toolbar-sync-syncing-tabs"/>
</hbox>
</vbox>
</hbox>
</toolbarbutton>
<toolbarbutton id="PanelUI-fxa-menu-setup-sync-button"
class="subviewbutton subviewbutton-iconic"

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

@ -426,22 +426,23 @@ function checkSyncNowButtons(syncing, tooltip = null) {
"button tooltiptext is set to the right value"
);
}
}
is(
syncButton.hasAttribute("disabled"),
syncing,
"disabled has the right value"
);
const syncLabels = document.querySelectorAll(".syncnow-label");
for (const syncLabel of syncLabels) {
if (syncing) {
is(
document.l10n.getAttributes(syncButton).id,
syncButton.getAttribute("syncinglabel"),
syncLabel.value,
gSync.fluentStrings.formatValueSync("fxa-toolbar-sync-syncing2"),
"label is set to the right value"
);
} else {
is(
document.l10n.getAttributes(syncButton).id,
"appmenuitem-fxa-toolbar-sync-now",
syncLabel.value,
gSync.fluentStrings.formatValueSync(
"appmenuitem-fxa-toolbar-sync-now2"
),
"label is set to the right value"
);
}

4
browser/locales/en-US/browser/appmenu.ftl
View File

@ -44,9 +44,7 @@ appmenuitem-fullscreen =
## Firefox Account toolbar button and Sync panel in App menu.
appmenuitem-fxa-toolbar-sync-now =
.label = Sync Now
.value = Sync Now
appmenuitem-fxa-toolbar-sync-now2 = Sync Now
appmenuitem-fxa-manage-account = Manage Account
appmenu-fxa-header =
.title = { -fxaccount-brand-name }

5
browser/locales/en-US/browser/sync.ftl
View File

@ -2,10 +2,7 @@
# 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/.
fxa-toolbar-sync-syncing =
.label = Syncing…
fxa-toolbar-sync-syncing-tabs =
.label = Syncing Tabs…
fxa-toolbar-sync-syncing2 = Syncing…
sync-disconnect-dialog-title = Disconnect { -sync-brand-short-name }?
sync-disconnect-dialog-body = { -brand-product-name } will stop syncing your account but won’t delete any of your browsing data on this device.

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

@ -685,18 +685,19 @@ toolbarbutton[constrain-size="true"][cui-areatype="menu-panel"] > .toolbarbutton
@media (prefers-reduced-motion: no-preference) {
#PanelUI-fxa-menu-syncnow-button[syncstatus="active"] > .toolbarbutton-icon,
#PanelUI-remotetabs-syncnow[syncstatus="active"] > .toolbarbutton-icon,
#PanelUI-appMenu-fxa-image-last-synced[syncstatus="active"] {
.syncNowBtn[syncstatus="active"] {
animation: syncRotate 0.8s linear infinite;
-moz-context-properties: fill;
fill: var(--toolbarbutton-icon-fill-attention);
}
visibility: visible;
}
#PanelUI-appMenu-fxa-image-last-synced {
.syncNowBtn {
-moz-context-properties: fill;
fill: var(--panel-description-color);
height: 8px;
width: 8px;
fill: currentColor;
height: 16px;
width: 16px;
list-style-image: url("chrome://browser/skin/sync.svg");
}
#appMenu-fxa-status {
@ -794,14 +795,13 @@ toolbarbutton[constrain-size="true"][cui-areatype="menu-panel"] > .toolbarbutton
}
#fxa-manage-account-button > vbox > label,
#PanelUI-fxa-menu-syncnow-button > vbox > label,
#PanelUI-fxa-menu-syncnow-button > vbox > hbox > label {
#PanelUI-fxa-menu-syncnow-button > hbox > label {
margin-inline-start: 0;
}
#PanelUI-appMenu-fxa-image-last-synced {
height: 8px;
width: 8px;
.syncNowBtn {
visibility: collapse;
-moz-box-ordinal-group: 2;
}
.PanelUI-remotetabs-clientcontainer > label[itemtype="client"] {

8
browser/themes/shared/menupanel.inc.css
View File

@ -110,9 +110,7 @@
list-style-image: url("chrome://browser/skin/tab.svg");
}
#PanelUI-fxa-menu-syncnow-button,
#PanelUI-fxa-menu-setup-sync-button,
#PanelUI-remotetabs-syncnow {
#PanelUI-fxa-menu-setup-sync-button {
list-style-image: url("chrome://browser/skin/sync.svg");
}
@ -200,8 +198,4 @@ toolbarpaletteitem[place="palette"] > #bookmarks-menu-button,
#appMenu-fullscreen-button2[checked] {
list-style-image: url(chrome://browser/skin/fullscreen-exit.svg);
}
#PanelUI-appMenu-fxa-image-last-synced {
list-style-image: url("chrome://browser/skin/sync.svg");
}
} /** END Proton **/

33
python/l10n/fluent_migrations/bug_1694678_syncNowBtn.py Normal file
View File

@ -0,0 +1,33 @@
# coding=utf8
# Any copyright is dedicated to the Public Domain.
# http://creativecommons.org/publicdomain/zero/1.0/
from __future__ import absolute_import
from fluent.migrate.helpers import transforms_from
from fluent.migrate import COPY_PATTERN
def migrate(ctx):
"""Bug 1694678: update fxa and remote tabs sync now buttons, part {index}."""
ctx.add_transforms(
"browser/browser/sync.ftl",
"browser/browser/sync.ftl",
transforms_from(
"""
fxa-toolbar-sync-syncing2 = { COPY_PATTERN(from_path, "fxa-toolbar-sync-syncing.label") }
""",
from_path="browser/browser/sync.ftl",
),
)
ctx.add_transforms(
"browser/browser/appmenu.ftl",
"browser/browser/appmenu.ftl",
transforms_from(
"""
appmenuitem-fxa-toolbar-sync-now2 = { COPY_PATTERN(from_path, "appmenuitem-fxa-toolbar-sync-now.label") }
""",
from_path="browser/browser/appmenu.ftl",
),
)