Bug 1138818 - Part 3 - Change to localizable strings. r=adw
☠☠ backed out by 9c709ae78ec4 ☠ ☠
authorMarina Samuel <msamuel@mozilla.com>
Fri, 08 May 2015 12:39:02 -0700
changeset 274521 70121f99d5f1b26715daf4c635c8ed317e0973ea
parent 274520 cb5842311d437dfda46ab9f20bc0e046d2f5a14b
child 274522 288e97b82c78be3335719e52b0e60f9ffc761d5e
push id863
push userraliiev@mozilla.com
push dateMon, 03 Aug 2015 13:22:43 +0000
treeherdermozilla-release@f6321b14228d [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersadw
bugs1138818
milestone40.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 1138818 - Part 3 - Change to localizable strings. r=adw
browser/base/content/newtab/intro.js
browser/base/content/test/newtab/browser_newtab_intro.js
browser/locales/en-US/chrome/browser/newTab.properties
--- a/browser/base/content/newtab/intro.js
+++ b/browser/base/content/newtab/intro.js
@@ -13,42 +13,17 @@ const UPDATE = "update";
 
 // The maximum paragraph ID listed for 'newtab.intro.paragraph'
 // strings in newTab.properties
 const MAX_PARAGRAPH_ID = 9;
 
 const NUM_INTRO_PAGES = 3;
 
 let gIntro = {
-  _enUSStrings: {
-    "newtab.intro.paragraph2": "In order to provide this service, Mozilla collects and uses certain analytics information relating to your use of the tiles in accordance with our %1$S.",
-    "newtab.intro.paragraph4": "You can turn off this feature by clicking the gear (%1$S) button and selecting 'Show blank page' in the %2$S menu.",
-    "newtab.intro.paragraph5": "New Tab will show the sites you visit most frequently, along with sites we think might be of interest to you. To get started, you'll see several sites from Mozilla.",
-    "newtab.intro.paragraph6": "You can %1$S or %2$S any site by using the controls available on rollover.",
-    "newtab.intro.paragraph7": "Some of the sites you will see may be suggested by Mozilla and may be sponsored by a Mozilla partner. We'll always indicate which sites are sponsored.",
-    "newtab.intro.paragraph8": "Firefox will only show sites that most closely match your interests on the Web. %1$S",
-    "newtab.intro.paragraph9": "Now when you open New Tab, you'll also see sites we think might be interesting to you.",
-    "newtab.intro.controls": "New Tab Controls",
-    "newtab.learn.link2": "More about New Tab",
-    "newtab.privacy.link2": "About your privacy",
-    "newtab.intro.remove": "remove",
-    "newtab.intro.pin": "pin",
-    "newtab.intro.header.welcome": "Welcome to New Tab on %1$S",
-    "newtab.intro.header.update": "New Tab got an update!",
-    "newtab.intro.skip": "Skip this",
-    "newtab.intro.continue": "Continue tour",
-    "newtab.intro.back": "Back",
-    "newtab.intro.next": "Next",
-    "newtab.intro.gotit": "Got it!",
-    "newtab.intro.firefox": "Firefox!"
-  },
-
   _nodeIDSuffixes: [
-    "panel",
-    "what",
     "mask",
     "modal",
     "numerical-progress",
     "text",
     "buttons",
     "image",
     "header",
     "footer"
@@ -84,23 +59,16 @@ let gIntro = {
   _nodes: {},
 
   _images: {},
 
   init: function() {
     for (let idSuffix of this._nodeIDSuffixes) {
       this._nodes[idSuffix] = document.getElementById("newtab-intro-" + idSuffix);
     }
-
-    if (DirectoryLinksProvider.locale != "en-US") {
-      this._nodes.what.style.display = "block";
-      this._nodes.panel.addEventListener("popupshowing", e => this._setUpPanel());
-      this._nodes.panel.addEventListener("popuphidden", e => this._hidePanel());
-      this._nodes.what.addEventListener("click", e => this.showPanel());
-    }
   },
 
   _setImage: function(imageType) {
     // Remove previously existing images, if any.
     let currImageHolder = this._nodes.image;
     while (currImageHolder.firstChild) {
       currImageHolder.removeChild(currImageHolder.firstChild);
     }
@@ -124,17 +92,17 @@ let gIntro = {
     paragraphIDs.forEach((arg, index) => {
       paragraphNodes[index].innerHTML = this._paragraphs[arg];
     });
 
     // Set the buttons
     let buttonNodes = this._nodes.buttons.getElementsByTagName("input");
     let buttonIDs = this._introPages.buttons[pageNum];
     buttonIDs.forEach((arg, index) => {
-      buttonNodes[index].setAttribute("value", this._newTabString("intro." + arg));
+      buttonNodes[index].setAttribute("value", newTabString("intro." + arg));
     });
   },
 
   _bold: function(str) {
     return `<strong>${str}</strong>`
   },
 
   _link: function(url, text) {
@@ -171,17 +139,17 @@ let gIntro = {
   },
 
   _generateImages: function() {
     Object.keys(this._imageTypes).forEach(type => {
       let image = "";
       let imageClass = "";
       switch (this._imageTypes[type]) {
         case this._imageTypes.COG:
-          image = document.getElementById("newtab-customize-panel2").cloneNode(true);
+          image = document.getElementById("newtab-customize-panel").cloneNode(true);
           image.removeAttribute("hidden");
           image.removeAttribute("type");
           image.classList.add("newtab-intro-image-customize");
           break;
         case this._imageTypes.PIN_REMOVE:
           imageClass = "-hover";
           // fall-through
         case this._imageTypes.SUGGESTED:
@@ -193,115 +161,75 @@ let gIntro = {
             '<div class="newtab-intro-cell' + imageClass + '">' +
             '  <div class="newtab-site newtab-intro-image-tile" type="sponsored">' +
             '    <a class="newtab-link">' +
             '      <span class="newtab-thumbnail"/>' +
             '      <span class="newtab-title">Example Title</span>' +
             '    </a>' +
             '    <input type="button" class="newtab-control newtab-control-pin"/>' +
             '    <input type="button" class="newtab-control newtab-control-block"/>' + (imageClass ? "" :
-            '    <span class="newtab-sponsored">SUGGESTED</span>') +
+            '    <span class="newtab-sponsored">' + newTabString("suggested.tag") + '</span>') +
             '  </div>' +
             '</div>';
             break;
       }
       this._images[this._imageTypes[type]] = image;
     });
   },
 
   _generateParagraphs: function() {
     let customizeIcon = '<input type="button" class="newtab-control newtab-customize"/>';
 
     let substringMappings = {
       "2": [this._link(TILES_PRIVACY_LINK, newTabString("privacy.link"))],
-      "4": [customizeIcon, this._bold(this._newTabString("intro.controls"))],
-      "6": [this._bold(this._newTabString("intro.remove")), this._bold(this._newTabString("intro.pin"))],
+      "4": [customizeIcon, this._bold(newTabString("intro.controls"))],
+      "6": [this._bold(newTabString("intro.remove")), this._bold(newTabString("intro.pin"))],
       "7": [this._link(TILES_INTRO_LINK, newTabString("learn.link"))],
       "8": [this._link(TILES_INTRO_LINK, newTabString("learn.link"))]
     }
 
     for (let i = 1; i <= MAX_PARAGRAPH_ID; i++) {
       try {
-        this._paragraphs.push(this._newTabString("intro.paragraph" + i, substringMappings[i]))
+        this._paragraphs.push(newTabString("intro.paragraph" + i, substringMappings[i]));
       } catch (ex) {
         // Paragraph with this ID doesn't exist so continue
       }
     }
   },
 
-  _newTabString: function(str, substrArr) {
-    let regExp = /%[0-9]\$S/g;
-    let paragraph = this._enUSStrings["newtab." + str];
-
-    if (!paragraph) {
-      throw new Error("Paragraph doesn't exist");
-    }
-
-    let matches;
-    while ((matches = regExp.exec(paragraph)) !== null) {
-      let match = matches[0];
-      let index = match.charAt(1); // Get the digit in the regExp.
-      paragraph = paragraph.replace(match, substrArr[index - 1]);
-    }
-    return paragraph;
-  },
-
   showIfNecessary: function() {
     if (!Services.prefs.getBoolPref(PREF_INTRO_SHOWN)) {
       this._onboardingType = WELCOME;
       this.showPanel();
-    } else if (!Services.prefs.getBoolPref(PREF_UPDATE_INTRO_SHOWN) && DirectoryLinksProvider.locale == "en-US") {
+    } else if (!Services.prefs.getBoolPref(PREF_UPDATE_INTRO_SHOWN)) {
       this._onboardingType = UPDATE;
       this.showPanel();
     }
     Services.prefs.setBoolPref(PREF_INTRO_SHOWN, true);
     Services.prefs.setBoolPref(PREF_UPDATE_INTRO_SHOWN, true);
   },
 
   showPanel: function() {
-    if (DirectoryLinksProvider.locale != "en-US") {
-      // Point the panel at the 'what' link
-      this._nodes.panel.hidden = false;
-      this._nodes.panel.openPopup(this._nodes.what);
-      return;
-    }
-
     this._nodes.mask.style.display = "block";
     this._nodes.mask.style.opacity = 1;
 
     if (!this._paragraphs.length) {
       // It's our first time showing the panel. Do some initial setup
       this._generateParagraphs();
       this._generateImages();
     }
     this._goToPage(0);
 
     // Header text
-    let boldSubstr = this._onboardingType == WELCOME ? this._span(this._newTabString("intro.firefox"), "bold") : "";
-    this._nodes.header.innerHTML = this._newTabString("intro.header." + this._onboardingType, [boldSubstr]);
+    let brand = Services.strings.createBundle("chrome://branding/locale/brand.properties");
+    let brandShortName = brand.GetStringFromName("brandShortName");
+    let boldSubstr = this._onboardingType == WELCOME ? this._span(brandShortName, "bold") : "";
+    this._nodes.header.innerHTML = newTabString("intro.header." + this._onboardingType, [boldSubstr]);
 
     // Footer links
     let footerLinkNodes = this._nodes.footer.getElementsByTagName("li");
-    [this._link(TILES_INTRO_LINK, this._newTabString("learn.link2")),
-     this._link(TILES_PRIVACY_LINK, this._newTabString("privacy.link2")),
+    [this._link(TILES_INTRO_LINK, newTabString("learn.link2")),
+     this._link(TILES_PRIVACY_LINK, newTabString("privacy.link2")),
     ].forEach((arg, index) => {
       footerLinkNodes[index].innerHTML = arg;
     });
   },
-
-  _setUpPanel: function() {
-    // Build the panel if necessary
-    if (this._nodes.panel.childNodes.length == 1) {
-      ['<a href="' + TILES_INTRO_LINK + '">' + newTabString("learn.link") + "</a>",
-       '<a href="' + TILES_PRIVACY_LINK + '">' + newTabString("privacy.link") + "</a>",
-       '<input type="button" class="newtab-customize"/>',
-      ].forEach((arg, index) => {
-        let paragraph = document.createElementNS(HTML_NAMESPACE, "p");
-        this._nodes.panel.appendChild(paragraph);
-        paragraph.innerHTML = newTabString("intro.paragraph" + (index + 1), [arg]);
-      });
-    }
-  },
-
-  _hidePanel: function() {
-    this._nodes.panel.hidden = true;
-  }
 };
--- a/browser/base/content/test/newtab/browser_newtab_intro.js
+++ b/browser/base/content/test/newtab/browser_newtab_intro.js
@@ -16,37 +16,40 @@ function runTests() {
   });
 
   // Test with preload false
   Services.prefs.setBoolPref(INTRO_PREF, false);
   Services.prefs.setBoolPref(UPDATE_INTRO_PREF, false);
   Services.prefs.setBoolPref(PRELOAD_PREF, false);
 
   let intro;
+  let brand = Services.strings.createBundle("chrome://branding/locale/brand.properties");
+  let brandShortName = brand.GetStringFromName("brandShortName");
+
   yield addNewTabPageTab();
   intro = getContentDocument().getElementById("newtab-intro-mask");
   is(intro.style.opacity, 1, "intro automatically shown on first opening");
   is(getContentDocument().getElementById("newtab-intro-header").innerHTML,
-     'Welcome to New Tab on <span xmlns="http://www.w3.org/1999/xhtml" class="bold">Firefox!</span>', "we show the first-run intro.");
+     'Welcome to New Tab on <span xmlns="http://www.w3.org/1999/xhtml" class="bold">' + brandShortName + '</span>!', "we show the first-run intro.");
   is(Services.prefs.getBoolPref(INTRO_PREF), true, "newtab remembers that the intro was shown");
   is(Services.prefs.getBoolPref(UPDATE_INTRO_PREF), true, "newtab avoids showing update if intro was shown");
 
   yield addNewTabPageTab();
   intro = getContentDocument().getElementById("newtab-intro-mask");
   is(intro.style.opacity, 0, "intro not shown on second opening");
 
   // Test with preload true
   Services.prefs.setBoolPref(INTRO_PREF, false);
   Services.prefs.setBoolPref(PRELOAD_PREF, true);
 
   yield addNewTabPageTab();
   intro = getContentDocument().getElementById("newtab-intro-mask");
   is(intro.style.opacity, 1, "intro automatically shown on preloaded opening");
   is(getContentDocument().getElementById("newtab-intro-header").innerHTML,
-     'Welcome to New Tab on <span xmlns="http://www.w3.org/1999/xhtml" class="bold">Firefox!</span>', "we show the first-run intro.");
+     'Welcome to New Tab on <span xmlns="http://www.w3.org/1999/xhtml" class="bold">' + brandShortName + '</span>!', "we show the first-run intro.");
   is(Services.prefs.getBoolPref(INTRO_PREF), true, "newtab remembers that the intro was shown");
   is(Services.prefs.getBoolPref(UPDATE_INTRO_PREF), true, "newtab avoids showing update if intro was shown");
 
   // Test with first run true but update false
   Services.prefs.setBoolPref(UPDATE_INTRO_PREF, false);
 
   yield addNewTabPageTab();
   intro = getContentDocument().getElementById("newtab-intro-mask");
--- a/browser/locales/en-US/chrome/browser/newTab.properties
+++ b/browser/locales/en-US/chrome/browser/newTab.properties
@@ -4,16 +4,20 @@
 
 newtab.pin=Pin this site at its current position
 newtab.unpin=Unpin this site
 newtab.block=Remove this site
 # LOCALIZATION NOTE(newtab.sponsored.button): This text appears for sponsored
 # and enhanced tiles on the same line as the tile's title, so prefer short
 # strings to avoid overlap. This string should be uppercase.
 newtab.sponsored.button=SPONSORED
+# LOCALIZATION NOTE(newtab.suggested.button): This text appears for sponsored
+# and suggested tiles on the same line as the tile's title, so prefer short
+# strings to avoid overlap. This string should be uppercase.
+newtab.suggested.tag=SUGGESTED
 # LOCALIZATION NOTE(newtab.suggested.button): %1$S will be replaced inline by
 # one of the user's top 100 sites that triggered this suggested tile.
 # This text appears for suggested tiles under the tile's title, so prefer short
 # strings to avoid truncating important text.
 newtab.suggested.button=Suggested for %1$S visitors
 # LOCALIZATION NOTE(newtab.sponsored.explain): %1$S will be replaced inline by
 # the (X) block icon. %2$S will be replaced by an active link using string
 # newtab.learn.link as text.
@@ -21,19 +25,43 @@ newtab.sponsored.explain=This tile is be
 # LOCALIZATION NOTE(newtab.suggested.explain): %1$S will be replaced inline by
 # the (X) block icon. %2$S will be replaced by an active link using string
 # newtab.learn.link as text.
 newtab.suggested.explain=This site is suggested to you by Mozilla. You can remove it at any time by clicking the %1$S button. %2$S
 # LOCALIZATION NOTE(newtab.enhanced.explain): %1$S will be replaced inline by
 # the gear icon used to customize the new tab window. %2$S will be replaced by
 # an active link using string newtab.learn.link as text.
 newtab.enhanced.explain=A Mozilla partner has visually enhanced this tile, replacing the screenshot. You can turn off enhanced tiles by clicking the %1$S button for your preferences. %2$S
-# LOCALIZATION NOTE(newtab.intro.paragraph1): %1$S will be replaced inline by
-# active link using string newtab.learn.link as text.
-newtab.intro.paragraph1=When you open a new tab, you’ll see tiles from the sites you frequently visit, along with tiles that we think might be of interest to you. Some of these tiles may be sponsored by Mozilla partners. We’ll always indicate to you which tiles are sponsored. %1$S
 # LOCALIZATION NOTE(newtab.intro.paragraph2): %1$S will be replaced inline by
 # active link using string newtab.privacy.link as text.
 newtab.intro.paragraph2=In order to provide this service, Mozilla collects and uses certain analytics information relating to your use of the tiles in accordance with our %1$S.
-# LOCALIZATION NOTE(newtab.intro.paragraph3): %1$S will be replaced inline by
-# the gear icon used to customize the new tab window.
-newtab.intro.paragraph3=You can turn off the tiles feature by clicking the %1$S button for your preferences.
+# LOCALIZATION NOTE(newtab.intro.paragraph4): %1$S will be replaced inline by
+# the gear icon used to customize the new tab window. %2$S will be replaced by
+# newtab.intro.controls as text
+newtab.intro.paragraph4=You can turn off this feature by clicking the gear (%1$S) button and selecting "Show blank page" in the %2$S menu.
+newtab.intro.paragraph5=New Tab will show the sites you visit most frequently, along with sites we think might be of interest to you. To get started, you'll see several sites from Mozilla.
+# LOCALIZATION NOTE(newtab.intro.paragraph6): %1$S will be replaced by
+# newtab.intro.remove as bold text. %2$S will be replaced by
+# newtab.intro.pin as bold text
+newtab.intro.paragraph6=You can %1$S or %2$S any site by using the controls available on rollover.
+newtab.intro.paragraph7=Some of the sites you will see may be suggested by Mozilla and may be sponsored by a Mozilla partner. We'll always indicate which sites are sponsored.
+# LOCALIZATION NOTE(newtab.intro.paragraph8): %1$S will be replaced inline by
+# an active link using string newtab.learn.link as text.
+newtab.intro.paragraph8=Firefox will only show sites that most closely match your interests on the Web. %1$S
+newtab.intro.paragraph9=Now when you open New Tab, you'll also see sites we think might be interesting to you.
+# LOCALIZATION NOTE(newtab.intro.controls): the controls in the gear icon
+# menu for customizing the new tab window. Used in newtab.intro.paragraph4
+newtab.intro.controls=New Tab Controls
 newtab.learn.link=Learn more…
 newtab.privacy.link=Privacy Notice
+newtab.learn.link2=More about New Tab
+newtab.privacy.link2=About your privacy
+newtab.intro.remove=remove
+newtab.intro.pin=pin
+# LOCALIZATION NOTE(newtab.intro.header.welcome): %1$S will be replaced by
+# newtab.intro.firefox as bold text.
+newtab.intro.header.welcome=Welcome to New Tab on %1$S!
+newtab.intro.header.update=New Tab got an update!
+newtab.intro.skip=Skip this
+newtab.intro.continue=Continue tour
+newtab.intro.back=Back
+newtab.intro.next=Next
+newtab.intro.gotit=Got it!