Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(1256)

Side by Side Diff: chrome/browser/resources/options/chromeos_language_options.js

Issue 6265010: DOMUI settings: move/rename the language options panel so that it can be use... (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src/
Patch Set: '' Created 9 years, 11 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
(Empty)
1 // Copyright (c) 2010 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file.
4
5 // TODO(kochi): Generalize the notification as a component and put it
6 // in js/cr/ui/notification.js .
7
8 cr.define('options', function() {
9
10 const OptionsPage = options.OptionsPage;
11 const AddLanguageOverlay = options.language.AddLanguageOverlay;
12 const LanguageList = options.language.LanguageList;
13
14 // Some input methods like Chinese Pinyin have config pages.
15 // This is the map of the input method names to their config page names.
16 const INPUT_METHOD_ID_TO_CONFIG_PAGE_NAME = {
17 'chewing': 'languageChewing',
18 'hangul': 'languageHangul',
19 'mozc': 'languageMozc',
20 'mozc-dv': 'languageMozc',
21 'mozc-jp': 'languageMozc',
22 'pinyin': 'languagePinyin',
23 };
24
25 /////////////////////////////////////////////////////////////////////////////
26 // LanguageOptions class:
27
28 /**
29 * Encapsulated handling of ChromeOS language options page.
30 * @constructor
31 */
32 function LanguageOptions(model) {
33 OptionsPage.call(this, 'language', localStrings.getString('languagePage'),
34 'languagePage');
35 }
36
37 cr.addSingletonGetter(LanguageOptions);
38
39 // Inherit LanguageOptions from OptionsPage.
40 LanguageOptions.prototype = {
41 __proto__: OptionsPage.prototype,
42
43 /**
44 * Initializes LanguageOptions page.
45 * Calls base class implementation to starts preference initialization.
46 */
47 initializePage: function() {
48 OptionsPage.prototype.initializePage.call(this);
49
50 var languageOptionsList = $('language-options-list');
51 LanguageList.decorate(languageOptionsList);
52
53 languageOptionsList.addEventListener('change',
54 this.handleLanguageOptionsListChange_.bind(this));
55 languageOptionsList.addEventListener('save',
56 this.handleLanguageOptionsListSave_.bind(this));
57
58 this.addEventListener('visibleChange',
59 this.handleVisibleChange_.bind(this));
60
61 this.initializeInputMethodList_();
62 this.initializeLanguageCodeToInputMehotdIdsMap_();
63
64 // Set up add button.
65 $('language-options-add-button').onclick = function(e) {
66 // Add the language without showing the overlay if it's specified in
67 // the URL hash (ex. lang_add=ja). Used for automated testing.
68 var match = document.location.hash.match(/\blang_add=([\w-]+)/);
69 if (match) {
70 var addLanguageCode = match[1];
71 $('language-options-list').addLanguage(addLanguageCode);
72 } else {
73 OptionsPage.showOverlay('addLanguageOverlay');
74 }
75 };
76 // Set up remove button.
77 $('language-options-remove-button').addEventListener('click',
78 this.handleRemoveButtonClick_.bind(this));
79
80 // Setup add language overlay page.
81 OptionsPage.registerOverlay(AddLanguageOverlay.getInstance());
82
83 // Listen to user clicks on the add language list.
84 var addLanguageList = $('add-language-overlay-language-list');
85 addLanguageList.addEventListener('click',
86 this.handleAddLanguageListClick_.bind(this));
87 },
88
89 // The preference is a CSV string that describes preload engines
90 // (i.e. active input methods).
91 preloadEnginesPref: 'settings.language.preload_engines',
92 // The list of preload engines, like ['mozc', 'pinyin'].
93 preloadEngines_: [],
94 // The preference is a string that describes the spell check
95 // dictionary language, like "en-US".
96 spellCheckDictionaryPref: 'spellcheck.dictionary',
97 spellCheckDictionary_: "",
98 // The map of language code to input method IDs, like:
99 // {'ja': ['mozc', 'mozc-jp'], 'zh-CN': ['pinyin'], ...}
100 languageCodeToInputMethodIdsMap_: {},
101
102 /**
103 * Initializes the input method list.
104 */
105 initializeInputMethodList_: function() {
106 var inputMethodList = $('language-options-input-method-list');
107 var inputMethodListData = templateData.inputMethodList;
108
109 // Add all input methods, but make all of them invisible here. We'll
110 // change the visibility in handleLanguageOptionsListChange_() based
111 // on the selected language. Note that we only have less than 100
112 // input methods, so creating DOM nodes at once here should be ok.
113 for (var i = 0; i < inputMethodListData.length; i++) {
114 var inputMethod = inputMethodListData[i];
115 var input = document.createElement('input');
116 input.type = 'checkbox';
117 input.inputMethodId = inputMethod.id;
118 // Listen to user clicks.
119 input.addEventListener('click',
120 this.handleCheckboxClick_.bind(this));
121 var label = document.createElement('label');
122 label.appendChild(input);
123 label.appendChild(document.createTextNode(inputMethod.displayName));
124 label.style.display = 'none';
125 label.languageCodeSet = inputMethod.languageCodeSet;
126 // Add the configure button if the config page is present for this
127 // input method.
128 if (inputMethod.id in INPUT_METHOD_ID_TO_CONFIG_PAGE_NAME) {
129 var pageName = INPUT_METHOD_ID_TO_CONFIG_PAGE_NAME[inputMethod.id];
130 var button = this.createConfigureInputMethodButton_(inputMethod.id,
131 pageName);
132 label.appendChild(button);
133 }
134
135 inputMethodList.appendChild(label);
136 }
137 // Listen to pref change once the input method list is initialized.
138 Preferences.getInstance().addEventListener(this.preloadEnginesPref,
139 this.handlePreloadEnginesPrefChange_.bind(this));
140 Preferences.getInstance().addEventListener(this.spellCheckDictionaryPref,
141 this.handleSpellCheckDictionaryPrefChange_.bind(this));
142 },
143
144 /**
145 * Creates a configure button for the given input method ID.
146 * @param {string} inputMethodId Input method ID (ex. "pinyin").
147 * @param {string} pageName Name of the config page (ex. "languagePinyin").
148 * @private
149 */
150 createConfigureInputMethodButton_: function(inputMethodId, pageName) {
151 var button = document.createElement('button');
152 button.textContent = localStrings.getString('configure');
153 button.onclick = function(e) {
154 // Prevent the default action (i.e. changing the checked property
155 // of the checkbox). The button click here should not be handled
156 // as checkbox click.
157 e.preventDefault();
158 chrome.send('inputMethodOptionsOpen', [inputMethodId]);
159 OptionsPage.showPageByName(pageName);
160 }
161 return button;
162 },
163
164 /**
165 * Handles OptionsPage's visible property change event.
166 * @param {Event} e Property change event.
167 * @private
168 */
169 handleVisibleChange_: function(e) {
170 if (this.visible) {
171 $('language-options-list').redraw();
172 chrome.send('languageOptionsOpen');
173 }
174 },
175
176 /**
177 * Handles languageOptionsList's change event.
178 * @param {Event} e Change event.
179 * @private
180 */
181 handleLanguageOptionsListChange_: function(e) {
182 var languageOptionsList = $('language-options-list');
183 var languageCode = languageOptionsList.getSelectedLanguageCode();
184 // Select the language if it's specified in the URL hash (ex. lang=ja).
185 // Used for automated testing.
186 var match = document.location.hash.match(/\blang=([\w-]+)/);
187 if (match) {
188 var specifiedLanguageCode = match[1];
189 if (languageOptionsList.selectLanguageByCode(specifiedLanguageCode)) {
190 languageCode = specifiedLanguageCode;
191 }
192 }
193 this.updateSelectedLanguageName_(languageCode);
194 this.updateUiLanguageButton_(languageCode);
195 this.updateSpellCheckLanguageButton_(languageCode);
196 this.updateInputMethodList_(languageCode);
197 this.updateLanguageListInAddLanguageOverlay_();
198 },
199
200 /**
201 * Handles languageOptionsList's save event.
202 * @param {Event} e Save event.
203 * @private
204 */
205 handleLanguageOptionsListSave_: function(e) {
206 // Sort the preload engines per the saved languages before save.
207 this.preloadEngines_ = this.sortPreloadEngines_(this.preloadEngines_);
208 this.savePreloadEnginesPref_();
209 },
210
211 /**
212 * Sorts preloadEngines_ by languageOptionsList's order.
213 * @param {Array} preloadEngines List of preload engines.
214 * @return {Array} Returns sorted preloadEngines.
215 * @private
216 */
217 sortPreloadEngines_: function(preloadEngines) {
218 // For instance, suppose we have two languages and associated input
219 // methods:
220 //
221 // - Korean: hangul
222 // - Chinese: pinyin
223 //
224 // The preloadEngines preference should look like "hangul,pinyin".
225 // If the user reverse the order, the preference should be reorderd
226 // to "pinyin,hangul".
227 var languageOptionsList = $('language-options-list');
228 var languageCodes = languageOptionsList.getLanguageCodes();
229
230 // Convert the list into a dictonary for simpler lookup.
231 var preloadEngineSet = {};
232 for (var i = 0; i < preloadEngines.length; i++) {
233 preloadEngineSet[preloadEngines[i]] = true;
234 }
235
236 // Create the new preload engine list per the language codes.
237 var newPreloadEngines = [];
238 for (var i = 0; i < languageCodes.length; i++) {
239 var languageCode = languageCodes[i];
240 var inputMethodIds = this.languageCodeToInputMethodIdsMap_[
241 languageCode];
242 // Check if we have active input methods associated with the language.
243 for (var j = 0; j < inputMethodIds.length; j++) {
244 var inputMethodId = inputMethodIds[j];
245 if (inputMethodId in preloadEngineSet) {
246 // If we have, add it to the new engine list.
247 newPreloadEngines.push(inputMethodId);
248 // And delete it from the set. This is necessary as one input
249 // method can be associated with more than one language thus
250 // we should avoid having duplicates in the new list.
251 delete preloadEngineSet[inputMethodId];
252 }
253 }
254 }
255
256 return newPreloadEngines;
257 },
258
259 /**
260 * Initializes the map of language code to input method IDs.
261 * @private
262 */
263 initializeLanguageCodeToInputMehotdIdsMap_: function() {
264 var inputMethodList = templateData.inputMethodList;
265 for (var i = 0; i < inputMethodList.length; i++) {
266 var inputMethod = inputMethodList[i];
267 for (var languageCode in inputMethod.languageCodeSet) {
268 if (languageCode in this.languageCodeToInputMethodIdsMap_) {
269 this.languageCodeToInputMethodIdsMap_[languageCode].push(
270 inputMethod.id);
271 } else {
272 this.languageCodeToInputMethodIdsMap_[languageCode] =
273 [inputMethod.id];
274 }
275 }
276 }
277 },
278
279 /**
280 * Updates the currently selected language name.
281 * @param {string} languageCode Language code (ex. "fr").
282 * @private
283 */
284 updateSelectedLanguageName_: function(languageCode) {
285 var languageDisplayName = LanguageList.getDisplayNameFromLanguageCode(
286 languageCode);
287 var languageNativeDisplayName =
288 LanguageList.getNativeDisplayNameFromLanguageCode(languageCode);
289 // If the native name is different, add it.
290 if (languageDisplayName != languageNativeDisplayName) {
291 languageDisplayName += ' - ' + languageNativeDisplayName;
292 }
293 // Update the currently selected language name.
294 $('language-options-language-name').textContent = languageDisplayName;
295 },
296
297 /**
298 * Updates the UI language button.
299 * @param {string} languageCode Language code (ex. "fr").
300 * @private
301 */
302 updateUiLanguageButton_: function(languageCode) {
303 var uiLanguageButton = $('language-options-ui-language-button');
304 // Check if the language code matches the current UI language.
305 if (languageCode == templateData.currentUiLanguageCode) {
306 // If it matches, the button just says that the UI language is
307 // currently in use.
308 uiLanguageButton.textContent =
309 localStrings.getString('is_displayed_in_this_language');
310 // Make it look like a text label.
311 uiLanguageButton.className = 'text-button';
312 // Remove the event listner.
313 uiLanguageButton.onclick = undefined;
314 } else if (languageCode in templateData.uiLanguageCodeSet) {
315 // If the language is supported as UI language, users can click on
316 // the button to change the UI language.
317 uiLanguageButton.textContent =
318 localStrings.getString('display_in_this_language');
319 uiLanguageButton.className = '';
320 // Send the change request to Chrome.
321 uiLanguageButton.onclick = function(e) {
322 chrome.send('uiLanguageChange', [languageCode]);
323 }
324 $('language-options-ui-sign-out-button').onclick = function(e) {
325 chrome.send('uiLanguageSignOut');
326 }
327 } else {
328 // If the language is not supported as UI language, the button
329 // just says that Chromium OS cannot be displayed in this language.
330 uiLanguageButton.textContent =
331 localStrings.getString('cannot_be_displayed_in_this_language');
332 uiLanguageButton.className = 'text-button';
333 uiLanguageButton.onclick = undefined;
334 }
335 uiLanguageButton.style.display = 'block';
336 $('language-options-ui-notification-bar').style.display = 'none';
337 },
338
339 /**
340 * Updates the spell check language button.
341 * @param {string} languageCode Language code (ex. "fr").
342 * @private
343 */
344 updateSpellCheckLanguageButton_: function(languageCode) {
345 var spellCheckLanguageButton = $(
346 'language-options-spell-check-language-button');
347 // Check if the language code matches the current spell check language.
348 if (languageCode == this.spellCheckDictionary_) {
349 // If it matches, the button just says that the spell check language is
350 // currently in use.
351 spellCheckLanguageButton.textContent =
352 localStrings.getString('is_used_for_spell_checking');
353 // Make it look like a text label.
354 spellCheckLanguageButton.className = 'text-button';
355 // Remove the event listner.
356 spellCheckLanguageButton.onclick = undefined;
357 } else if (languageCode in templateData.spellCheckLanguageCodeSet) {
358 // If the language is supported as spell check language, users can
359 // click on the button to change the spell check language.
360 spellCheckLanguageButton.textContent =
361 localStrings.getString('use_this_for_spell_checking');
362 spellCheckLanguageButton.className = '';
363 spellCheckLanguageButton.languageCode = languageCode;
364 // Add an event listner to the click event.
365 spellCheckLanguageButton.addEventListener('click',
366 this.handleSpellCheckLanguageButtonClick_.bind(this));
367 } else {
368 // If the language is not supported as spell check language, the
369 // button just says that this language cannot be used for spell
370 // checking.
371 spellCheckLanguageButton.textContent =
372 localStrings.getString('cannot_be_used_for_spell_checking');
373 spellCheckLanguageButton.className = 'text-button';
374 spellCheckLanguageButton.onclick = undefined;
375 }
376 spellCheckLanguageButton.style.display = 'block';
377 $('language-options-ui-notification-bar').style.display = 'none';
378 },
379
380 /**
381 * Updates the input method list.
382 * @param {string} languageCode Language code (ex. "fr").
383 * @private
384 */
385 updateInputMethodList_: function(languageCode) {
386 // Give one of the checkboxes or buttons focus, if it's specified in the
387 // URL hash (ex. focus=mozc). Used for automated testing.
388 var focusInputMethodId = -1;
389 var match = document.location.hash.match(/\bfocus=([\w:-]+)\b/);
390 if (match) {
391 focusInputMethodId = match[1];
392 }
393 // Change the visibility of the input method list. Input methods that
394 // matches |languageCode| will become visible.
395 var inputMethodList = $('language-options-input-method-list');
396 var labels = inputMethodList.querySelectorAll('label');
397 for (var i = 0; i < labels.length; i++) {
398 var label = labels[i];
399 if (languageCode in label.languageCodeSet) {
400 label.style.display = 'block';
401 var input = label.childNodes[0];
402 // Give it focus if the ID matches.
403 if (input.inputMethodId == focusInputMethodId) {
404 input.focus();
405 }
406 } else {
407 label.style.display = 'none';
408 }
409 }
410 if (focusInputMethodId == 'remove') {
411 $('language-options-remove-button').focus();
412 } else if (focusInputMethodId == 'add') {
413 $('language-options-add-button').focus();
414 }
415 },
416
417 /**
418 * Updates the language list in the add language overlay.
419 * @param {string} languageCode Language code (ex. "fr").
420 * @private
421 */
422 updateLanguageListInAddLanguageOverlay_: function(languageCode) {
423 // Change the visibility of the language list in the add language
424 // overlay. Languages that are already active will become invisible,
425 // so that users don't add the same language twice.
426 var languageOptionsList = $('language-options-list');
427 var languageCodes = languageOptionsList.getLanguageCodes();
428 var languageCodeSet = {};
429 for (var i = 0; i < languageCodes.length; i++) {
430 languageCodeSet[languageCodes[i]] = true;
431 }
432 var addLanguageList = $('add-language-overlay-language-list');
433 var lis = addLanguageList.querySelectorAll('li');
434 for (var i = 0; i < lis.length; i++) {
435 // The first child button knows the language code.
436 var button = lis[i].childNodes[0];
437 if (button.languageCode in languageCodeSet) {
438 lis[i].style.display = 'none';
439 } else {
440 lis[i].style.display = 'block';
441 }
442 }
443 },
444
445 /**
446 * Handles preloadEnginesPref change.
447 * @param {Event} e Change event.
448 * @private
449 */
450 handlePreloadEnginesPrefChange_: function(e) {
451 var value = e.value.value;
452 this.preloadEngines_ = this.filterBadPreloadEngines_(value.split(','));
453 this.updateCheckboxesFromPreloadEngines_();
454 },
455
456 /**
457 * Handles input method checkbox's click event.
458 * @param {Event} e Click event.
459 * @private
460 */
461 handleCheckboxClick_ : function(e) {
462 var checkbox = e.target;
463 if (this.preloadEngines_.length == 1 && !checkbox.checked) {
464 // Don't allow disabling the last input method.
465 this.showNotification_(
466 localStrings.getString('please_add_another_input_method'),
467 localStrings.getString('ok_button'));
468 checkbox.checked = true;
469 return;
470 }
471 if (checkbox.checked) {
472 chrome.send('inputMethodEnable', [checkbox.inputMethodId]);
473 } else {
474 chrome.send('inputMethodDisable', [checkbox.inputMethodId]);
475 }
476 this.updatePreloadEnginesFromCheckboxes_();
477 this.preloadEngines_ = this.sortPreloadEngines_(this.preloadEngines_);
478 this.savePreloadEnginesPref_();
479 },
480
481 /**
482 * Handles add language list's click event.
483 * @param {Event} e Click event.
484 */
485 handleAddLanguageListClick_ : function(e) {
486 var languageOptionsList = $('language-options-list');
487 var languageCode = e.target.languageCode;
488 // languageCode can be undefined, if click was made on some random
489 // place in the overlay, rather than a button. Ignore it.
490 if (!languageCode) {
491 return;
492 }
493 languageOptionsList.addLanguage(languageCode);
494 var inputMethodIds = this.languageCodeToInputMethodIdsMap_[languageCode];
495 // Enable the first input method for the language added.
496 if (inputMethodIds && inputMethodIds[0] &&
497 // Don't add the input method it's already present. This can
498 // happen if the same input method is shared among multiple
499 // languages (ex. English US keyboard is used for English US and
500 // Filipino).
501 this.preloadEngines_.indexOf(inputMethodIds[0]) == -1) {
502 this.preloadEngines_.push(inputMethodIds[0]);
503 this.updateCheckboxesFromPreloadEngines_();
504 this.savePreloadEnginesPref_();
505 }
506 OptionsPage.clearOverlays();
507 },
508
509 /**
510 * Handles remove button's click event.
511 * @param {Event} e Click event.
512 */
513 handleRemoveButtonClick_: function(e) {
514 var languageOptionsList = $('language-options-list');
515 var languageCode = languageOptionsList.getSelectedLanguageCode();
516 // Don't allow removing the language if it's as UI language.
517 if (languageCode == templateData.currentUiLanguageCode) {
518 this.showNotification_(
519 localStrings.getString('this_language_is_currently_in_use'),
520 localStrings.getString('ok_button'));
521 return;
522 }
523 // Disable input methods associated with |languageCode|.
524 // Don't allow removing the language if cerntain conditions are met.
525 // See removePreloadEnginesByLanguageCode_() for details.
526 if (!this.removePreloadEnginesByLanguageCode_(languageCode)) {
527 this.showNotification_(
528 localStrings.getString('please_add_another_language'),
529 localStrings.getString('ok_button'));
530 return;
531 }
532 languageOptionsList.removeSelectedLanguage();
533 },
534
535 /**
536 * Handles spellCheckDictionaryPref change.
537 * @param {Event} e Change event.
538 * @private
539 */
540 handleSpellCheckDictionaryPrefChange_: function(e) {
541 var languageCode = e.value.value
542 this.spellCheckDictionary_ = languageCode;
543 var languageOptionsList = $('language-options-list');
544 var selectedLanguageCode = languageOptionsList.getSelectedLanguageCode();
545 this.updateSpellCheckLanguageButton_(selectedLanguageCode);
546 },
547
548 /**
549 * Handles spellCheckLanguageButton click.
550 * @param {Event} e Click event.
551 * @private
552 */
553 handleSpellCheckLanguageButtonClick_: function(e) {
554 var languageCode = e.target.languageCode;
555 // Save the preference.
556 Preferences.setStringPref(this.spellCheckDictionaryPref,
557 languageCode);
558 chrome.send('spellCheckLanguageChange', [languageCode]);
559 },
560
561 /**
562 * Removes preload engines associated with the given language code.
563 * However, this function does not remove engines (input methods) that
564 * are used for other active languages. For instance, if "xkb:us::eng"
565 * is used for English and Filipino, and the two languages are active,
566 * this function does not remove "xkb:us::eng" when either of these
567 * languages is removed. Instead, it'll remove "xkb:us::eng" when the
568 * both languages are gone.
569 *
570 * @param {string} languageCode Language code (ex. "fr").
571 * @return {boolean} Returns true on success.
572 * @private
573 */
574 removePreloadEnginesByLanguageCode_: function(languageCode) {
575 // First create the set of engines to be removed from input methods
576 // associated with the language code.
577 var enginesToBeRemovedSet = {};
578 var inputMethodIds = this.languageCodeToInputMethodIdsMap_[languageCode];
579 for (var i = 0; i < inputMethodIds.length; i++) {
580 enginesToBeRemovedSet[inputMethodIds[i]] = true;
581 }
582
583 // Then eliminate engines that are also used for other active languages.
584 var languageCodes = $('language-options-list').getLanguageCodes();
585 for (var i = 0; i < languageCodes.length; i++) {
586 // Skip the target language code.
587 if (languageCodes[i] == languageCode) {
588 continue;
589 }
590 // Check if input methods used in this language are included in
591 // enginesToBeRemovedSet. If so, eliminate these from the set, so
592 // we don't remove this time.
593 var inputMethodIdsForAnotherLanguage =
594 this.languageCodeToInputMethodIdsMap_[languageCodes[i]];
595 for (var j = 0; j < inputMethodIdsForAnotherLanguage.length; j++) {
596 var inputMethodId = inputMethodIdsForAnotherLanguage[j];
597 if (inputMethodId in enginesToBeRemovedSet) {
598 delete enginesToBeRemovedSet[inputMethodId];
599 }
600 }
601 }
602
603 // Update the preload engine list with the to-be-removed set.
604 var newPreloadEngines = [];
605 for (var i = 0; i < this.preloadEngines_.length; i++) {
606 if (!(this.preloadEngines_[i] in enginesToBeRemovedSet)) {
607 newPreloadEngines.push(this.preloadEngines_[i]);
608 }
609 }
610 // Don't allow this operation if it causes the number of preload
611 // engines to be zero.
612 if (newPreloadEngines.length == 0) {
613 return false;
614 }
615 this.preloadEngines_ = newPreloadEngines;
616 this.savePreloadEnginesPref_();
617 return true;
618 },
619
620 /**
621 * Saves the preload engines preference.
622 * @private
623 */
624 savePreloadEnginesPref_: function() {
625 Preferences.setStringPref(this.preloadEnginesPref,
626 this.preloadEngines_.join(','));
627 },
628
629 /**
630 * Updates the checkboxes in the input method list from the preload
631 * engines preference.
632 * @private
633 */
634 updateCheckboxesFromPreloadEngines_: function() {
635 // Convert the list into a dictonary for simpler lookup.
636 var dictionary = {};
637 for (var i = 0; i < this.preloadEngines_.length; i++) {
638 dictionary[this.preloadEngines_[i]] = true;
639 }
640
641 var inputMethodList = $('language-options-input-method-list');
642 var checkboxes = inputMethodList.querySelectorAll('input');
643 for (var i = 0; i < checkboxes.length; i++) {
644 checkboxes[i].checked = (checkboxes[i].inputMethodId in dictionary);
645 }
646 },
647
648 /**
649 * Updates the preload engines preference from the checkboxes in the
650 * input method list.
651 * @private
652 */
653 updatePreloadEnginesFromCheckboxes_: function() {
654 this.preloadEngines_ = [];
655 var inputMethodList = $('language-options-input-method-list');
656 var checkboxes = inputMethodList.querySelectorAll('input');
657 for (var i = 0; i < checkboxes.length; i++) {
658 if (checkboxes[i].checked) {
659 this.preloadEngines_.push(checkboxes[i].inputMethodId);
660 }
661 }
662 },
663
664 /**
665 * Filters bad preload engines in case bad preload engines are
666 * stored in the preference. Removes duplicates as well.
667 * @param {Array} preloadEngines List of preload engines.
668 * @private
669 */
670 filterBadPreloadEngines_: function(preloadEngines) {
671 // Convert the list into a dictonary for simpler lookup.
672 var dictionary = {};
673 for (var i = 0; i < templateData.inputMethodList.length; i++) {
674 dictionary[templateData.inputMethodList[i].id] = true;
675 }
676
677 var filteredPreloadEngines = [];
678 var seen = {};
679 for (var i = 0; i < preloadEngines.length; i++) {
680 // Check if the preload engine is present in the
681 // dictionary, and not duplicate. Otherwise, skip it.
682 if (preloadEngines[i] in dictionary && !(preloadEngines[i] in seen)) {
683 filteredPreloadEngines.push(preloadEngines[i]);
684 seen[preloadEngines[i]] = true;
685 }
686 }
687 return filteredPreloadEngines;
688 },
689
690 // TODO(kochi): This is an adapted copy from new_new_tab.js.
691 // If this will go as final UI, refactor this to share the component with
692 // new new tab page.
693 /**
694 * Shows notification
695 * @private
696 */
697 notificationTimeout_: null,
698 showNotification_ : function(text, actionText, opt_delay) {
699 var notificationElement = $('notification');
700 var actionLink = notificationElement.querySelector('.link-color');
701 var delay = opt_delay || 10000;
702
703 function show() {
704 window.clearTimeout(this.notificationTimeout_);
705 notificationElement.classList.add('show');
706 document.body.classList.add('notification-shown');
707 }
708
709 function hide() {
710 window.clearTimeout(this.notificationTimeout_);
711 notificationElement.classList.remove('show');
712 document.body.classList.remove('notification-shown');
713 // Prevent tabbing to the hidden link.
714 actionLink.tabIndex = -1;
715 // Setting tabIndex to -1 only prevents future tabbing to it. If,
716 // however, the user switches window or a tab and then moves back to
717 // this tab the element may gain focus. We therefore make sure that we
718 // blur the element so that the element focus is not restored when
719 // coming back to this window.
720 actionLink.blur();
721 }
722
723 function delayedHide() {
724 this.notificationTimeout_ = window.setTimeout(hide, delay);
725 }
726
727 notificationElement.firstElementChild.textContent = text;
728 actionLink.textContent = actionText;
729
730 actionLink.onclick = hide;
731 actionLink.onkeydown = function(e) {
732 if (e.keyIdentifier == 'Enter') {
733 hide();
734 }
735 };
736 notificationElement.onmouseover = show;
737 notificationElement.onmouseout = delayedHide;
738 actionLink.onfocus = show;
739 actionLink.onblur = delayedHide;
740 // Enable tabbing to the link now that it is shown.
741 actionLink.tabIndex = 0;
742
743 show();
744 delayedHide();
745 }
746 };
747
748 /**
749 * Chrome callback for when the UI language preference is saved.
750 */
751 LanguageOptions.uiLanguageSaved = function() {
752 $('language-options-ui-language-button').style.display = 'none';
753 $('language-options-ui-notification-bar').style.display = 'block';
754 };
755
756 // Export
757 return {
758 LanguageOptions: LanguageOptions
759 };
760
761 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698