Bug 1345515 - Add notifications advertising new RDM. r=ochameau

New RDM can be disabled because the user flipped a pref or because e10s is
disabled.  For each of these cases, add notifications to old RDM pushing users
to switch to the new version and provide feedback, since the old RDM will
eventually be removed.

MozReview-Commit-ID: EOQ0FkuRmY0

--HG--
extra : rebase_source : 44e50bfe471cc5f85b3143d7e10d98f078b072a4

devtools/client/locales/en-US/responsiveUI.properties

@@ -11,7 +11,6 @@
 # A good criteria is the language in which you'd find the best
 # documentation on web development on the web.
 
-
 # LOCALIZATION NOTE  (responsiveUI.rotate2): tooltip of the rotate button.
 responsiveUI.rotate2=Rotate
 
@@ -67,3 +66,13 @@ responsiveUI.notificationReload=Reload
 responsiveUI.notificationReload_accesskey=R
 responsiveUI.dontShowReloadNotification=Never show again
 responsiveUI.dontShowReloadNotification_accesskey=N
+
+# LOCALIZATION NOTE (responsiveUI.newVersionUserDisabled): notification that appears
+# when old RDM is displayed because the user has disabled new RDM.
+responsiveUI.newVersionUserDisabled=A new version of Responsive Design Mode is available, but it appears to be disabled.  Please enable it and provide feedback, as this version will be removed.
+# LOCALIZATION NOTE (responsiveUI.newVersionE10sDisabled): notification that appears
+# when old RDM is displayed because e10s is disabled.
+responsiveUI.newVersionE10sDisabled=A new version of Responsive Design Mode is available, but it requires multi-process mode, which is currently disabled.  Please enable it and provide feedback, as this version will be removed.
+# LOCALIZATION NOTE (responsiveUI.newVersionEnableAndRestart): button text in notification
+# to enable new RDM itself or e10s as a prerequisite for new RDM.
+responsiveUI.newVersionEnableAndRestart=Enable and Restart

devtools/client/responsivedesign/responsivedesign.jsm

@@ -14,6 +14,8 @@ const EventEmitter = require("devtools/shared/event-emitter");
 
 loader.lazyImporter(this, "SystemAppProxy",
                     "resource://gre/modules/SystemAppProxy.jsm");
+loader.lazyImporter(this, "BrowserUtils",
+                    "resource://gre/modules/BrowserUtils.jsm");
 loader.lazyRequireGetter(this, "Telemetry", "devtools/client/shared/telemetry");
 loader.lazyRequireGetter(this, "showDoorhanger",
                          "devtools/client/shared/doorhanger", true);
@@ -27,9 +29,12 @@ loader.lazyRequireGetter(this, "DebuggerClient",
                          "devtools/shared/client/main", true);
 loader.lazyRequireGetter(this, "DebuggerServer",
                          "devtools/server/main", true);
+loader.lazyRequireGetter(this, "system", "devtools/shared/system");
 
 this.EXPORTED_SYMBOLS = ["ResponsiveUIManager"];
 
+const NEW_RDM_ENABLED = "devtools.responsive.html.enabled";
+
 const MIN_WIDTH = 50;
 const MIN_HEIGHT = 50;
 
@@ -136,7 +141,7 @@ EventEmitter.decorate(Manager);
 // the new HTML RDM UI to function), delegate the ResponsiveUIManager API over to that
 // tool instead.  Performing this delegation here allows us to contain the pref check to a
 // single place.
-if (Services.prefs.getBoolPref("devtools.responsive.html.enabled") &&
+if (Services.prefs.getBoolPref(NEW_RDM_ENABLED) &&
     Services.appinfo.browserTabsRemoteAutostart) {
   let { ResponsiveUIManager } =
     require("devtools/client/responsive.html/manager");
@@ -266,6 +271,8 @@ ResponsiveUI.prototype = {
       anchor: this.chromeDoc.querySelector("#content")
     });
 
+    this.showNewUINotification();
+
     // Notify that responsive mode is on.
     this._telemetry.toolOpened("responsive");
     ResponsiveUIManager.emit("on", { tab: this.tab });
@@ -405,6 +412,8 @@ ResponsiveUI.prototype = {
       yield stopped;
     }
 
+    this.hideNewUINotification();
+
     this.inited = null;
     ResponsiveUIManager.emit("off", { tab: this.tab });
   }),
@@ -683,6 +692,66 @@ ResponsiveUI.prototype = {
     this.container.appendChild(bottomToolbar);
   },
 
+  showNewUINotification() {
+    let nbox = this.mainWindow.gBrowser.getNotificationBox(this.browser);
+
+    // One reason we might be using old RDM is that the user explcitly disabled new RDM.
+    // We should encourage them to use the new one, since the old one will be removed.
+    if (Services.prefs.prefHasUserValue(NEW_RDM_ENABLED) &&
+        !Services.prefs.getBoolPref(NEW_RDM_ENABLED)) {
+      let buttons = [{
+        label: this.strings.GetStringFromName("responsiveUI.newVersionEnableAndRestart"),
+        callback: () => {
+          Services.prefs.setBoolPref(NEW_RDM_ENABLED, true);
+          BrowserUtils.restartApplication();
+        },
+      }];
+      nbox.appendNotification(
+        this.strings.GetStringFromName("responsiveUI.newVersionUserDisabled"),
+        "responsive-ui-new-version-user-disabled",
+        null,
+        nbox.PRIORITY_INFO_LOW,
+        buttons
+      );
+      return;
+    }
+
+    // Only show a notification about the new RDM UI on channels where there is an e10s
+    // switch in the preferences UI (Dev. Ed, Nightly).  On other channels, it is less
+    // clear how a user would proceed here, so don't show a message.
+    if (!system.constants.E10S_TESTING_ONLY) {
+      return;
+    }
+
+    let buttons = [{
+      label: this.strings.GetStringFromName("responsiveUI.newVersionEnableAndRestart"),
+      callback: () => {
+        Services.prefs.setBoolPref("browser.tabs.remote.autostart", true);
+        Services.prefs.setBoolPref("browser.tabs.remote.autostart.2", true);
+        BrowserUtils.restartApplication();
+      },
+    }];
+    nbox.appendNotification(
+      this.strings.GetStringFromName("responsiveUI.newVersionE10sDisabled"),
+      "responsive-ui-new-version-e10s-disabled",
+      null,
+      nbox.PRIORITY_INFO_LOW,
+      buttons
+    );
+  },
+
+  hideNewUINotification() {
+    let nbox = this.mainWindow.gBrowser.getNotificationBox(this.browser);
+    let n = nbox.getNotificationWithValue("responsive-ui-new-version-user-disabled");
+    if (n) {
+      n.close();
+    }
+    n = nbox.getNotificationWithValue("responsive-ui-new-version-e10s-disabled");
+    if (n) {
+      n.close();
+    }
+  },
+
   /**
    * Validate and apply any user input on the editable menulist
    */