Enables the user to select multiple languages for spellchecking (UI)

chrome/browser/resources/options/language_options.js

Index: chrome/browser/resources/options/language_options.js
diff --git a/chrome/browser/resources/options/language_options.js b/chrome/browser/resources/options/language_options.js
index f40284495dfc5564871f5f03283bb6c3127fe4fb..0a7c672466dc6c739b70822d6a77ccbe6b3fc84f 100644
--- a/chrome/browser/resources/options/language_options.js
+++ b/chrome/browser/resources/options/language_options.js
@@ -60,6 +60,14 @@ cr.define('options', function() {
   var SPELL_CHECK_DICTIONARY_PREF = 'spellcheck.dictionary';
 
   /**
+   * The preference key that describes the spell check dictionary languages
+   * currently selected (as a comma separated string, like "en-US,sl-SI").
+   * @type {string}
+   * @const
+   */
+  var SPELL_CHECK_DICTIONARIES_PREF = 'spellcheck.dictionaries';
+
+  /**
    * The preference that indicates if the Translate feature is enabled.
    * @type {string}
    * @const
@@ -144,6 +152,14 @@ cr.define('options', function() {
     spellCheckDictionary_: '',
 
     /**
+     * The list of currently selected spell check dictionary languages, like
+     * "en-US, sl-SI".
+     * @type {array}
+     * @private
+     */
+    spellCheckDictionaries_: {},
+
+    /**
      * The map of language code to input method IDs, like:
      * {'ja': ['mozc', 'mozc-jp'], 'zh-CN': ['pinyin'], ...}
      * @type {Object}
@@ -187,8 +203,16 @@ cr.define('options', function() {
       Preferences.getInstance().addEventListener(
           TRANSLATE_BLOCKED_LANGUAGES_PREF,
           this.handleTranslateBlockedLanguagesPrefChange_.bind(this));
-      Preferences.getInstance().addEventListener(SPELL_CHECK_DICTIONARY_PREF,
+
+      if (loadTimeData.getBoolean('enableMultilingualSpellChecker')) {
+        Preferences.getInstance().addEventListener(
+            SPELL_CHECK_DICTIONARIES_PREF,
+            this.handleSpellCheckDictionariesPrefChange_.bind(this));
+      } else {
+        Preferences.getInstance().addEventListener(SPELL_CHECK_DICTIONARY_PREF,
           this.handleSpellCheckDictionaryPrefChange_.bind(this));
+      }
+
       Preferences.getInstance().addEventListener(ENABLE_TRANSLATE,
           this.handleEnableTranslatePrefChange_.bind(this));
       this.translateSupportedLanguages_ =
@@ -240,11 +264,19 @@ cr.define('options', function() {
 
       // Handle clicks on "Use this language for spell checking" button.
       if (!cr.isMac) {
-        var spellCheckLanguageButton = getRequiredElement(
-            'language-options-spell-check-language-button');
-        spellCheckLanguageButton.addEventListener(
-            'click',
-            this.handleSpellCheckLanguageButtonClick_.bind(this));
+        if (loadTimeData.getBoolean('enableMultilingualSpellChecker')) {
+          var spellCheckLanguageCheckbox = getRequiredElement(
+              'language-options-spell-check-language-checkbox');
+          spellCheckLanguageCheckbox.addEventListener(
+              'click',
+              this.handleSpellCheckLanguageCheckboxClick_.bind(this));
+        } else {
+          var spellCheckLanguageButton = getRequiredElement(
+              'language-options-spell-check-language-button');
+          spellCheckLanguageButton.addEventListener(
+              'click',
+              this.handleSpellCheckLanguageButtonClick_.bind(this));
+        }
       }
 
       if (cr.isChromeOS) {
@@ -427,7 +459,7 @@ cr.define('options', function() {
       this.updateSelectedLanguageName_(languageCode);
 
       if (!cr.isMac)
-        this.updateSpellCheckLanguageButton_(languageCode);
+        this.updateSpellCheckLanguageControls_(languageCode);
 
       if (cr.isChromeOS)
         this.updateInputMethodList_(languageCode);
@@ -604,10 +636,14 @@ cr.define('options', function() {
      * @param {string} languageCode Language code (ex. "fr").
      * @private
      */
-    updateSpellCheckLanguageButton_: function(languageCode) {
+    updateSpellCheckLanguageControls_: function(languageCode) {
       var spellCheckLanguageSection = $('language-options-spellcheck');
       var spellCheckLanguageButton =
           $('language-options-spell-check-language-button');
+      var spellCheckLanguageCheckboxDiv =
+          $('language-options-spell-check-language-checkbox-div');
+      var spellCheckLanguageCheckbox =
+          $('language-options-spell-check-language-checkbox');
       var spellCheckLanguageMessage =
           $('language-options-spell-check-language-message');
       var dictionaryDownloadInProgress =
@@ -616,44 +652,78 @@ cr.define('options', function() {
           $('language-options-dictionary-download-failed-message');
       var dictionaryDownloadFailHelp =
           $('language-options-dictionary-download-fail-help-message');
+

[please use gerrit instead, 2015/02/23 18:51:47]

No need to introduce extra newline.

[Klemen Forstnerič, 2015/02/24 21:57:45]

Done.

       spellCheckLanguageSection.hidden = false;
       spellCheckLanguageMessage.hidden = true;
       spellCheckLanguageButton.hidden = true;
+      spellCheckLanguageCheckboxDiv.hidden = true;
       dictionaryDownloadInProgress.hidden = true;
       dictionaryDownloadFailed.hidden = true;
       dictionaryDownloadFailHelp.hidden = true;
 
-      if (languageCode == this.spellCheckDictionary_) {
-        if (!(languageCode in this.spellcheckDictionaryDownloadStatus_)) {
+      spellCheckLanguageCheckbox.checked = false;
+
+      if (loadTimeData.getBoolean('enableMultilingualSpellChecker')) {
+        if (languageCode in
+            loadTimeData.getValue('spellCheckLanguageCodeSet')) {
+          spellCheckLanguageCheckbox.languageCode = languageCode;
+          if (languageCode in this.spellCheckDictionaries_)
+            spellCheckLanguageCheckbox.checked = true;
+          if (!(languageCode in this.spellcheckDictionaryDownloadStatus_)) {
+            spellCheckLanguageMessage.hidden = true;
+            spellCheckLanguageCheckboxDiv.hidden = false;
+          } else if (this.spellcheckDictionaryDownloadStatus_[languageCode] ==
+                         DOWNLOAD_STATUS_IN_PROGRESS) {

[please use gerrit instead, 2015/02/23 18:51:47]

Please unify the dictionary download progress code. No need to repeat it here
and below.

[Klemen Forstnerič, 2015/02/24 21:57:45]

Done.

+              dictionaryDownloadInProgress.hidden = false;
+          } else if (this.spellcheckDictionaryDownloadStatus_[languageCode] ==
+                         DOWNLOAD_STATUS.FAILED) {
+            spellCheckLanguageSection.hidden = true;
+            dictionaryDownloadFailed.hidden = false;
+            if (this.spellcheckDictionaryDownloadFailures_ > 1)
+              dictionaryDownloadFailHelp.hidden = false;
+          }
+        } else if (!languageCode) {
+          spellCheckLanguageCheckboxDiv.hidden = true;
+          spellCheckLanguageMessage.hidden = true;
+        } else {
+          spellCheckLanguageMessage.textContent =
+              loadTimeData.getString('cannotBeUsedForSpellChecking');
+          spellCheckLanguageMessage.hidden = false;
+          spellCheckLanguageCheckboxDiv.hidden = true;
+        }
+      } else {
+        if (languageCode == this.spellCheckDictionary_) {
+          if (!(languageCode in this.spellcheckDictionaryDownloadStatus_)) {
+            spellCheckLanguageMessage.textContent =
+                loadTimeData.getString('isUsedForSpellChecking');
+            showMutuallyExclusiveNodes(
+                [spellCheckLanguageButton, spellCheckLanguageMessage], 1);
+          } else if (this.spellcheckDictionaryDownloadStatus_[languageCode] ==
+                         DOWNLOAD_STATUS.IN_PROGRESS) {
+            dictionaryDownloadInProgress.hidden = false;
+          } else if (this.spellcheckDictionaryDownloadStatus_[languageCode] ==
+                         DOWNLOAD_STATUS.FAILED) {
+            spellCheckLanguageSection.hidden = true;
+            dictionaryDownloadFailed.hidden = false;
+            if (this.spellcheckDictionaryDownloadFailures_ > 1)
+              dictionaryDownloadFailHelp.hidden = false;
+          }
+        } else if (languageCode in
+            loadTimeData.getValue('spellCheckLanguageCodeSet')) {
+          spellCheckLanguageButton.textContent =
+              loadTimeData.getString('useThisForSpellChecking');
+          showMutuallyExclusiveNodes(
+              [spellCheckLanguageButton, spellCheckLanguageMessage], 0);
+          spellCheckLanguageButton.languageCode = languageCode;
+        } else if (!languageCode) {
+          spellCheckLanguageButton.hidden = true;
+          spellCheckLanguageMessage.hidden = true;
+        } else {
           spellCheckLanguageMessage.textContent =
-              loadTimeData.getString('isUsedForSpellChecking');
+              loadTimeData.getString('cannotBeUsedForSpellChecking');
           showMutuallyExclusiveNodes(
               [spellCheckLanguageButton, spellCheckLanguageMessage], 1);
-        } else if (this.spellcheckDictionaryDownloadStatus_[languageCode] ==
-                       DOWNLOAD_STATUS.IN_PROGRESS) {
-          dictionaryDownloadInProgress.hidden = false;
-        } else if (this.spellcheckDictionaryDownloadStatus_[languageCode] ==
-                       DOWNLOAD_STATUS.FAILED) {
-          spellCheckLanguageSection.hidden = true;
-          dictionaryDownloadFailed.hidden = false;
-          if (this.spellcheckDictionaryDownloadFailures_ > 1)
-            dictionaryDownloadFailHelp.hidden = false;
         }
-      } else if (languageCode in
-          loadTimeData.getValue('spellCheckLanguageCodeSet')) {
-        spellCheckLanguageButton.textContent =
-            loadTimeData.getString('useThisForSpellChecking');
-        showMutuallyExclusiveNodes(
-            [spellCheckLanguageButton, spellCheckLanguageMessage], 0);
-        spellCheckLanguageButton.languageCode = languageCode;
-      } else if (!languageCode) {
-        spellCheckLanguageButton.hidden = true;
-        spellCheckLanguageMessage.hidden = true;
-      } else {
-        spellCheckLanguageMessage.textContent =
-            loadTimeData.getString('cannotBeUsedForSpellChecking');
-        showMutuallyExclusiveNodes(
-            [spellCheckLanguageButton, spellCheckLanguageMessage], 1);
       }
     },
 
@@ -945,11 +1015,26 @@ cr.define('options', function() {
       var languageCode = e.value.value;
       this.spellCheckDictionary_ = languageCode;
       if (!cr.isMac) {
-        this.updateSpellCheckLanguageButton_(
+        this.updateSpellCheckLanguageControls_(
             $('language-options-list').getSelectedLanguageCode());
       }
     },
 
+    handleSpellCheckDictionariesPrefChange_: function(e) {
+      if (cr.isMac)
+        return;
+
+      var commaSeparatedLanguageCodes = e.value.value;
+      var languageCodesSplit = commaSeparatedLanguageCodes.split(',');
+
+      this.spellCheckDictionaries_ = {};
+      for (var i = 0; i < languageCodesSplit.length; i++)
+        this.spellCheckDictionaries_[languageCodesSplit[i]] = true;
+
+      this.updateSpellCheckLanguageControls_(
+          $('language-options-list').getSelectedLanguageCode());
+    },
+
     /**
      * Handles translate.enabled change.
      * @param {Event} e Change event.
@@ -978,6 +1063,30 @@ cr.define('options', function() {
     },
 
     /**
+     * Handles spellCheckLanguageCheckbox click.
+     * @param {Event} e Click event.
+     * @private
+     */
+    handleSpellCheckLanguageCheckboxClick_: function(e) {
+      var languageCode = e.target.languageCode;
+      var isChecked = e.target.checked;
+
+      if (isChecked)

[please use gerrit instead, 2015/02/23 18:51:47]

Inline "e.target.checked"

[Klemen Forstnerič, 2015/02/24 21:57:45]

Done.

+        this.spellCheckDictionaries_[languageCode] = true;
+      else
+        delete this.spellCheckDictionaries_[languageCode];
+
+      var languageCodes = [];
+      for (var languageCode in this.spellCheckDictionaries_) {

[please use gerrit instead, 2015/02/23 18:51:47]

Don't redefine "languageCode" variable inside of the for loop. Use a different
name. (See "var languageCode = e.target.languageCode" above.)

[Klemen Forstnerič, 2015/02/24 21:57:45]

Whoops, I missed this one. Done.

+        if (this.spellCheckDictionaries_.hasOwnProperty(languageCode))
+          languageCodes.push(languageCode);
+      }
+
+      Preferences.setStringPref(SPELL_CHECK_DICTIONARIES_PREF,
+                                languageCodes.join(','), true);
+    },
+
+    /**
      * Checks whether it's possible to remove the language specified by
      * languageCode and returns true if possible. This function returns false
      * if the removal causes the number of preload engines to be zero.
@@ -1276,7 +1385,7 @@ cr.define('options', function() {
       if (!cr.isMac &&
           languageCode ==
               $('language-options-list').getSelectedLanguageCode()) {
-        this.updateSpellCheckLanguageButton_(languageCode);
+        this.updateSpellCheckLanguageControls_(languageCode);
       }
     },
 
@@ -1292,7 +1401,7 @@ cr.define('options', function() {
       if (!cr.isMac &&
           languageCode ==
               $('language-options-list').getSelectedLanguageCode()) {
-        this.updateSpellCheckLanguageButton_(languageCode);
+        this.updateSpellCheckLanguageControls_(languageCode);
       }
     },
 
@@ -1309,7 +1418,7 @@ cr.define('options', function() {
       if (!cr.isMac &&
           languageCode ==
               $('language-options-list').getSelectedLanguageCode()) {
-        this.updateSpellCheckLanguageButton_(languageCode);
+        this.updateSpellCheckLanguageControls_(languageCode);
       }
     },