Bug 868094 - Warn the user before disconnecting a sync account. Also, don't display default signup UI until the startOver process completes. r=ally
authorJim Mathies <jmathies@mozilla.com>
Tue, 07 May 2013 15:55:51 -0500
changeset 142132 616f2609c29454ee9f34c7d35a098ec06f9c6c98
parent 142131 14e581ecbf0c6dbf468d2e808cdc5815cd5788bb
child 142133 8939cbc62b399c46216f055bbcf64dffeda41aaf
push id2579
push userakeybl@mozilla.com
push dateMon, 24 Jun 2013 18:52:47 +0000
treeherdermozilla-beta@b69b7de8a05a [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersally
bugs868094
milestone23.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 868094 - Warn the user before disconnecting a sync account. Also, don't display default signup UI until the startOver process completes. r=ally
browser/metro/base/content/browser.xul
browser/metro/base/content/sync.js
browser/metro/locales/en-US/chrome/sync.dtd
browser/metro/locales/en-US/chrome/sync.properties
browser/metro/theme/browser.css
--- a/browser/metro/base/content/browser.xul
+++ b/browser/metro/base/content/browser.xul
@@ -3,16 +3,17 @@
 <!-- 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/. -->
 
 <?xml-stylesheet href="chrome://browser/skin/platform.css" type="text/css"?>
 <?xml-stylesheet href="chrome://browser/skin/browser.css" type="text/css"?>
 <?xml-stylesheet href="chrome://browser/skin/forms.css" type="text/css"?>
 <?xml-stylesheet href="chrome://browser/content/browser.css" type="text/css"?>
+<?xml-stylesheet href="chrome://browser/skin/cssthrobber.css" type="text/css"?>
 
 <!DOCTYPE window [
 <!ENTITY % globalDTD SYSTEM "chrome://global/locale/global.dtd">
 %globalDTD;
 <!ENTITY % browserDTD SYSTEM "chrome://browser/locale/browser.dtd">
 %browserDTD;
 <!ENTITY % brandDTD SYSTEM "chrome://branding/locale/brand.dtd">
 %brandDTD;
@@ -408,18 +409,35 @@
       <setting id="sync-connect" type="control" collapsed="true">
         <button label="&sync.setupbutton.label;" oncommand="Sync.tryConnect();" />
       </setting>
       <setting id="sync-connected" class="setting-group" type="control" collapsed="true">
         <button id="sync-pairdevice" label="&sync.pair.button;" oncommand="SyncPairDevice.open();" />
       </setting>
       <setting id="sync-device" class="setting-subgroup" type="string" title="&sync.deviceName;" onchange="Sync.changeName(this);" collapsed="true"/>
       <setting id="sync-disconnect" class="setting-subgroup" type="control" collapsed="true">
-        <button label="&sync.removebutton.label;" oncommand="Sync.disconnect();" />
+        <button label="&sync.removebutton.label;" oncommand="Sync.onDisconnect();" />
       </setting>
+      <vbox id="sync-disconnectwarnpanel" collapsed="true">
+        <description id="sync-disconnectwarntitle"></description>
+        <description id="sync-disconnectwarnmsg">&sync.removewarn.note;</description>
+        <hbox>
+          <spacer flex="1" />
+          <button label="&sync.setup.cancel;" oncommand="Sync.onCancelDisconnect();" />
+          <button label="&sync.setup.remove;" oncommand="Sync.disconnect();" />
+        </hbox>
+      </vbox>
+      <vbox id="sync-disconnectthrobber" collapsed="true">
+        <hbox>
+          <spacer flex="1" />
+          <cssthrobber id="syncdisconnectthrobber" />
+          <label>&sync.removethrobber.label;</label>
+          <spacer flex="1" />
+        </hbox>
+      </vbox>
     </flyoutpanel>
 
     <flyoutpanel id="prefs-flyoutpanel" headertext="&optionsHeader.title;">
       <settings id="prefs-startup" label="&optionsHeader.startup.title;"> <!-- note, this element has a custom margin-top -->
         <setting id="prefs-homepage" title="&optionsHeader.homepage.title;" type="menulist" pref="browser.startup.sessionRestore" class="setting-expanded">
           <menulist id="prefs-homepage-options">
             <menupopup id="prefs-homepage-popup" position="after_end">
               <menuitem id="prefs-homepage-default" label="&optionsHeader.homepage.startPage.button;" value="false"/>
--- a/browser/metro/base/content/sync.js
+++ b/browser/metro/base/content/sync.js
@@ -7,16 +7,17 @@ let Sync = {
   _boundOnEngineSync: null,     // Needed to unhook the observers in close().
   _boundOnServiceSync: null,
   jpake: null,
   _bundle: null,
   _loginError: false,
   _progressBar: null,
   _progressValue: 0,
   _progressMax: null,
+  _disconnecting: false,
 
   get _isSetup() {
     if (Weave.Status.checkSetup() == Weave.CLIENT_NOT_CONFIGURED) {
       return false;
     }
     // check for issues related to failed logins that do not have anything to
     // do with network, server, and other non-client issues. See the login
     // failure status codes in sync service.
@@ -376,31 +377,55 @@ let Sync = {
     Weave.Service.identity.account = this.setupData.account;
     Weave.Service.identity.basicPassword = this.setupData.password;
     Weave.Service.identity.syncKey = this.setupData.synckey;
     Weave.Service.persistLogin();
     Weave.Svc.Obs.notify("weave:service:setup-complete");
     this.sync();
   },
 
+  // called when the user taps the disconnect button
+  onDisconnect: function onDisconnect() {
+    Weave.Service.logout();
+    let bundle = Services.strings.createBundle("chrome://branding/locale/brand.properties");
+    let brandName = bundle.GetStringFromName("brandShortName");
+    let warnStr = this._bundle.formatStringFromName("sync.disconnectPrompt", [brandName], 1);
+    this._elements.disconnectwarntitle.textContent = warnStr;
+    this._elements.disconnectwarnpanel.collapsed = false;
+  },
+
+  // called when the user taps the cancel button on
+  // the disconnect warning panel.
+  onCancelDisconnect: function onCancelDisconnect() {
+    this._elements.disconnectwarnpanel.collapsed = true;
+    this._updateUI();
+    Weave.Service.login();
+  },
+
+  // called when the user taps the remove button on
+  // the disconnect warning panel.
   disconnect: function disconnect() {
+    this._elements.disconnectwarnpanel.collapsed = true;
     this.setupData = null;
+    this._disconnecting = true;
+    this._updateUI();
     Weave.Service.startOver();
   },
 
   sync: function sync() {
     Weave.Service.scheduler.scheduleNextSync(0);
   },
 
   _addListeners: function _addListeners() {
     let topics = ["weave:service:setup-complete",
       "weave:service:sync:start", "weave:service:sync:finish",
       "weave:service:sync:error", "weave:service:login:start",
       "weave:service:login:finish", "weave:service:login:error",
       "weave:ui:login:error",
+      "weave:service:start-over", "weave:service:start-over:finish",
       "weave:service:logout:finish"];
 
     // For each topic, add Sync the observer
     topics.forEach(function(topic) {
       Services.obs.addObserver(Sync, topic, false);
     });
 
     // Remove them on unload
@@ -415,17 +440,18 @@ let Sync = {
     // Get all the setting nodes from the add-ons display
     let elements = {};
     let setupids = ["account", "password", "synckey", "usecustomserver", "customserver"];
     setupids.forEach(function(id) {
       elements[id] = document.getElementById("syncsetup-" + id);
     });
 
     let settingids = ["device", "connect", "connected", "disconnect", "lastsync", "pairdevice",
-                      "errordescription", "accountinfo"];
+                      "errordescription", "accountinfo", "disconnectwarnpanel", "disconnectthrobber",
+                      "disconnectwarntitle"];
     settingids.forEach(function(id) {
       elements[id] = document.getElementById("sync-" + id);
     });
 
     // Replace the getter with the collection of settings
     delete this._elements;
     return this._elements = elements;
   },
@@ -436,28 +462,42 @@ let Sync = {
 
     let connect = this._elements.connect;
     let connected = this._elements.connected;
     let device = this._elements.device;
     let disconnect = this._elements.disconnect;
     let lastsync = this._elements.lastsync;
     let pairdevice = this._elements.pairdevice;
     let accountinfo = this._elements.accountinfo;
+    let disconnectthrobber = this._elements.disconnectthrobber;
 
     // This gets updated when an error occurs
     this._elements.errordescription.collapsed = true;
 
     let isConfigured = (!this._loginError && this._isSetup);
 
+    // If we're in the process of disconnecting we are no longer configured.
+    if (this._disconnecting) {
+      isConfigured = false;
+      // display the throbber with the appropriate message
+      disconnectthrobber.collapsed = false;
+    } else {
+      disconnectthrobber.collapsed = true;
+    }
+
     connect.collapsed = isConfigured;
     connected.collapsed = !isConfigured;
     lastsync.collapsed = !isConfigured;
     device.collapsed = !isConfigured;
     disconnect.collapsed = !isConfigured;
 
+    if (this._disconnecting) {
+      connect.collapsed = true;
+    }
+
     // Set the device name text edit to configured name or the auto generated
     // name if we aren't set up.
     try {
       device.value = Services.prefs.getCharPref("services.sync.client.name");
     } catch(ex) {
       device.value = Weave.Service.clientsEngine.localName || "";
     }
 
@@ -502,16 +542,22 @@ let Sync = {
       Services.obs.removeObserver(this, aTopic);
       this._init();
       return;
     }
 
     // Make sure we're online when connecting/syncing
     Util.forceOnline();
 
+    if (aTopic == "weave:service:start-over") {
+      this._disconnecting = true;
+    } else if (aTopic == "weave:service:start-over:finish") {
+      this._disconnecting = false;
+    }
+
     // Can't do anything before settings are loaded
     if (this._elements == null)
       return;
 
     // Update the state of the ui
     this._updateUI();
 
     let errormsg = this._elements.errordescription;
--- a/browser/metro/locales/en-US/chrome/sync.dtd
+++ b/browser/metro/locales/en-US/chrome/sync.dtd
@@ -9,28 +9,31 @@
 <!ENTITY sync.setup.description     "Access your bookmarks, passwords, and open tabs across your devices">
 <!ENTITY sync.setupbutton.label     "Set up Sync">
 <!-- sync now button -->
 <!ENTITY sync.syncNow2              "Sync now">
 <!-- device name text edit -->
 <!ENTITY sync.deviceName            "This device">
 <!-- remove this device button -->
 <!ENTITY sync.removebutton.label    "Remove this device">
+<!ENTITY sync.removewarn.note       "Your browser data on this device will remain intact, but you will no longer be able to sync with this account.">
+<!ENTITY sync.removethrobber.label  "Removing device">
 
 <!ENTITY sync.setup2.title          "Set up Sync">
 <!ENTITY sync.setup.pair2           "To activate, select &#x0022;Pair a device&#x0022; on your other device.">
 <!ENTITY sync.fallback              "Enter or edit account information…">
 <!ENTITY sync.setup.manual          "Enter your Sync account information">
 <!ENTITY sync.account               "Account Name">
 <!ENTITY sync.password              "Password">
 <!ENTITY sync.recoveryKey           "Recovery Key">
 <!ENTITY sync.customServer          "Use custom server">
 <!ENTITY sync.serverURL             "Server URL">
 <!ENTITY sync.setup.connect2        "Add device">
 <!ENTITY sync.setup.cancel          "Cancel">
+<!ENTITY sync.setup.remove          "Remove">
 <!ENTITY sync.setup.tutorial        "Show me how">
 <!ENTITY sync.setup.waiting2        "Waiting for other device…">
 
 <!ENTITY sync.pair.title            "Pair a Device">
 <!ENTITY sync.pair.button           "Pair a device">
 <!ENTITY sync.pair.description      "To activate your new device, select &#x0022;Set up Sync&#x0022; on the device.">
 <!ENTITY sync.setup.close           "Close">
 <!ENTITY sync.setup.waitingdownload "Your data is now being downloaded in the background. You can close this window at any time.">
--- a/browser/metro/locales/en-US/chrome/sync.properties
+++ b/browser/metro/locales/en-US/chrome/sync.properties
@@ -2,16 +2,18 @@
 # 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/.
 
 # LOCALIZATION NOTE: Used in the default os description when a new account
 # is being set up. Should be unique to Metro, so that it does not conflict
 # with Desktop. See /services/sync/modules/engines/clients.js locaName.
 sync.defaultAccountApplication=Metro %S
 
+sync.disconnectPrompt=Remove Windows 8 style %S from your Sync Account?
+
 # %S is the date and time at which the last sync successfully completed
 lastSync2.label=Last sync: %S
 
 # %S is the username logged in
 account.label=Account: %S
 connecting.label=Connecting…
 
 notificationDisconnect.label=Your Firefox Sync account has been removed
--- a/browser/metro/theme/browser.css
+++ b/browser/metro/theme/browser.css
@@ -715,16 +715,41 @@ flyoutpanel > settings:first-child {
 }
 
 /* Sync flyout pane */
 
 #sync-flyoutpanel {
   width: 400px;
 }
 
+#sync-disconnectwarntitle {
+  font-weight: bold;
+}
+
+#sync-disconnectthrobber {
+  margin-top: 25px;
+}
+
+#disconnectthrobber {
+  width: 25px;
+  height: 25px;
+}
+
+#syncdisconnectthrobber .progressContainer {
+  width: 25px;
+  height: 25px;
+  margin-right: 10px;
+}
+
+#syncdisconnectthrobber .progressBall {
+  margin: 2px;
+  width: 22px;
+  height: 22px;
+}
+
 /* About flyout pane */
 
 #about-flyoutpanel {
   width: 350px;
   background-image:url('chrome://browser/skin/images/about-footer.png');
   background-repeat: no-repeat;
   background-attachment: fixed;
   background-position: right bottom;