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

Side by Side Diff: chrome/browser/resources/settings/languages_page/languages_page.js

Issue 1902893003: MD Settings: simplify language model and data binding (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 4 years, 8 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
OLDNEW
1 // Copyright 2015 The Chromium Authors. All rights reserved. 1 // Copyright 2015 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be 2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file. 3 // found in the LICENSE file.
4 4
5 /** 5 /**
6 * @fileoverview 'settings-languages-page' is the settings page 6 * @fileoverview 'settings-languages-page' is the settings page
7 * for language and input method settings. 7 * for language and input method settings.
8 */ 8 */
9 (function() { 9 (function() {
10 'use strict'; 10 'use strict';
(...skipping 18 matching lines...) Expand all
29 * Preferences state. 29 * Preferences state.
30 */ 30 */
31 prefs: { 31 prefs: {
32 type: Object, 32 type: Object,
33 notify: true, 33 notify: true,
34 }, 34 },
35 35
36 /** 36 /**
37 * Read-only reference to the languages model provided by the 37 * Read-only reference to the languages model provided by the
38 * 'settings-languages' instance. 38 * 'settings-languages' instance.
39 * @type {LanguagesModel|undefined} 39 * @type {!LanguagesModel|undefined}
40 */ 40 */
41 languages: { 41 languages: {
42 type: Object, 42 type: Object,
43 notify: true, 43 notify: true,
44 }, 44 },
45 45
46 /** @private */ 46 /** @private */
47 inputMethodsSecondary_: { 47 inputMethodsSecondary_: {
48 type: String, 48 type: String,
49 value: 'Placeholder, e.g. US keyboard', 49 value: 'Placeholder, e.g. US keyboard',
50 }, 50 },
51 51
52 /** @private */ 52 /** @private */
53 spellCheckSecondary_: { 53 spellCheckSecondary_: {
54 type: String, 54 type: String,
55 value: 'Placeholder, e.g. English (United States)', 55 value: 'Placeholder, e.g. English (United States)',
56 }, 56 },
57 57
58 /** 58 /**
59 * The language to display the details for. 59 * The language to display the details for.
60 * @type {!LanguageInfo|undefined} 60 * @type {!LanguageState|undefined}
61 * @private 61 * @private
62 */ 62 */
63 detailLanguage_: Object, 63 detailLanguage_: Object,
64 64
65 /** @private {!LanguageHelper} */ 65 /** @private {!LanguageHelper} */
66 languageHelper_: Object, 66 languageHelper_: Object,
67 }, 67 },
68 68
69 /** @override */ 69 /** @override */
70 created: function() { 70 created: function() {
71 this.languageHelper_ = LanguageHelperImpl.getInstance(); 71 this.languageHelper_ = LanguageHelperImpl.getInstance();
72 }, 72 },
73 73
74 /** 74 /**
75 * Handler for clicking a language on the main page, which selects the 75 * Handler for clicking a language on the main page, which selects the
76 * language as the prospective UI language on Chrome OS and Windows. 76 * language as the prospective UI language on Chrome OS and Windows.
77 * @param {!{model: !{item: !LanguageInfo}}} e 77 * @param {!{model: !{item: !LanguageState}}} e
78 */ 78 */
79 onLanguageTap_: function(e) { 79 onLanguageTap_: function(e) {
80 // Only change the UI language on platforms that allow it. 80 // Only change the UI language on platforms that allow it.
81 if (!cr.isChromeOS && !cr.isWindows) 81 if (!cr.isChromeOS && !cr.isWindows)
82 return; 82 return;
83 83
84 // Taps on the paper-icon-button are handled in onShowLanguageDetailTap_. 84 // Taps on the paper-icon-button are handled in onShowLanguageDetailTap_.
85 if (e.target.tagName == 'PAPER-ICON-BUTTON') 85 if (e.target.tagName == 'PAPER-ICON-BUTTON')
86 return; 86 return;
87 87
88 // Set the prospective UI language. This won't take effect until a restart. 88 // Set the prospective UI language. This won't take effect until a restart.
89 if (e.model.item.language.supportsUI) 89 if (e.model.item.language.supportsUI)
90 this.languageHelper_.setUILanguage(e.model.item.language.code); 90 this.languageHelper_.setUILanguage(e.model.item.language.code);
91 }, 91 },
92 92
93 /** 93 /**
94 * Handler for enabling or disabling spell check. 94 * Handler for enabling or disabling spell check.
95 * @param {!{target: Element, model: !{item: !LanguageInfo}}} e 95 * @param {!{target: Element, model: !{item: !LanguageState}}} e
96 */ 96 */
97 onSpellCheckChange_: function(e) { 97 onSpellCheckChange_: function(e) {
98 this.languageHelper_.toggleSpellCheck(e.model.item.language.code, 98 this.languageHelper_.toggleSpellCheck(e.model.item.language.code,
99 e.target.checked); 99 e.target.checked);
100 }, 100 },
101 101
102 /** @private */ 102 /** @private */
103 onBackTap_: function() { 103 onBackTap_: function() {
104 this.$.pages.back(); 104 this.$.pages.back();
105 }, 105 },
106 106
107 /** 107 /**
108 * Opens the Manage Languages page. 108 * Opens the Manage Languages page.
109 * @private 109 * @private
110 */ 110 */
111 onManageLanguagesTap_: function() { 111 onManageLanguagesTap_: function() {
112 this.$.pages.setSubpageChain(['manage-languages']); 112 this.$.pages.setSubpageChain(['manage-languages']);
113 this.forceRenderList_('settings-manage-languages-page'); 113 this.forceRenderList_('settings-manage-languages-page');
114 }, 114 },
115 115
116 /** 116 /**
117 * Opens the Language Detail page for the language. 117 * Opens the Language Detail page for the language.
118 * @param {!{model: !{item: !LanguageInfo}}} e 118 * @param {!{model: !{item: !LanguageState}}} e
119 * @private 119 * @private
120 */ 120 */
121 onShowLanguageDetailTap_: function(e) { 121 onShowLanguageDetailTap_: function(e) {
122 this.detailLanguage_ = e.model.item; 122 this.detailLanguage_ = e.model.item;
123 this.$.pages.setSubpageChain(['language-detail']); 123 this.$.pages.setSubpageChain(['language-detail']);
124 }, 124 },
125 125
126 <if expr="not is_macosx">
127 /** 126 /**
128 * Returns the enabled languages which support spell check. 127 * Returns the enabled languages which support spell check.
128 * @return {!Array<!LanguageState>}
129 * @private 129 * @private
130 */ 130 */
131 spellCheckLanguages_: function() { 131 spellCheckLanguages_: function() {
132 return this.languages.enabledLanguages.filter(function(languageInfo) { 132 assert(!cr.isMac);
133 return languageInfo.language.supportsSpellcheck; 133 return this.languages.enabled.filter(function(languageState) {
134 return languageState.language.supportsSpellcheck;
134 }); 135 });
135 }, 136 },
136 137
137 /** 138 /**
138 * Opens the Custom Dictionary page. 139 * Opens the Custom Dictionary page.
139 * @private 140 * @private
140 */ 141 */
141 onEditDictionaryTap_: function() { 142 onEditDictionaryTap_: function() {
143 assert(!cr.isMac);
142 this.$.pages.setSubpageChain(['edit-dictionary']); 144 this.$.pages.setSubpageChain(['edit-dictionary']);
143 this.forceRenderList_('settings-edit-dictionary-page'); 145 this.forceRenderList_('settings-edit-dictionary-page');
144 }, 146 },
145 </if>
146 147
147 <if expr="chromeos or is_win">
148 /** 148 /**
149 * Checks whether the prospective UI language (the pref that indicates what 149 * Checks whether the prospective UI language (the pref that indicates what
150 * language to use in Chrome) matches the current language. This pref is only 150 * language to use in Chrome) matches the current language. This pref is only
151 * on Chrome OS and Windows; we don't control the UI language elsewhere. 151 * on Chrome OS and Windows; we don't control the UI language elsewhere.
152 * @param {string} languageCode The language code identifying a language. 152 * @param {string} languageCode The language code identifying a language.
153 * @param {string} prospectiveUILanguage The prospective UI language. 153 * @param {string} prospectiveUILanguage The prospective UI language.
154 * @return {boolean} True if the given language matches the prospective UI 154 * @return {boolean} True if the given language matches the prospective UI
155 * pref (which may be different from the actual UI language). 155 * pref (which may be different from the actual UI language).
156 * @private 156 * @private
157 */ 157 */
158 isProspectiveUILanguage_: function(languageCode, prospectiveUILanguage) { 158 isProspectiveUILanguage_: function(languageCode, prospectiveUILanguage) {
159 assert(cr.isChromeOS || cr.isWindows);
159 return languageCode == this.languageHelper_.getProspectiveUILanguage(); 160 return languageCode == this.languageHelper_.getProspectiveUILanguage();
160 }, 161 },
161 </if>
162 162
163 /** 163 /**
164 * @return {string} 164 * @return {string}
165 * @private 165 * @private
166 */ 166 */
167 getProspectiveUILanguageName_: function() { 167 getProspectiveUILanguageName_: function() {
168 return this.languageHelper_.getLanguage( 168 return this.languageHelper_.getLanguage(
169 this.languageHelper_.getProspectiveUILanguage()).displayName; 169 this.languageHelper_.getProspectiveUILanguage()).displayName;
170 }, 170 },
171 171
172 /** 172 /**
173 * Returns either the "selected" class, if the language matches the 173 * Returns either the "selected" class, if the language matches the
174 * prospective UI language, or an empty string. Languages can only be 174 * prospective UI language, or an empty string. Languages can only be
175 * selected on Chrome OS and Windows. 175 * selected on Chrome OS and Windows.
176 * @param {string} languageCode The language code identifying a language. 176 * @param {string} languageCode The language code identifying a language.
177 * @param {string} prospectiveUILanguage The prospective UI language. 177 * @param {string} prospectiveUILanguage The prospective UI language.
178 * @return {string} The class name for the language item. 178 * @return {string} The class name for the language item.
179 * @private 179 * @private
180 */ 180 */
181 getLanguageItemClass_: function(languageCode, prospectiveUILanguage) { 181 getLanguageItemClass_: function(languageCode, prospectiveUILanguage) {
182 <if expr="chromeos or is_win"> 182 if ((cr.isChromeOS || cr.isWindows) &&
183 if (this.isProspectiveUILanguage_(languageCode, prospectiveUILanguage)) 183 this.isProspectiveUILanguage_(languageCode, prospectiveUILanguage)) {
184 return 'selected'; 184 return 'selected';
185 </if> 185 }
186 return ''; 186 return '';
187 }, 187 },
188 188
189 <if expr="chromeos">
190 /** 189 /**
191 * @param {string} id The input method ID. 190 * @param {string} id The input method ID.
192 * @param {string} currentId The ID of the currently enabled input method. 191 * @param {string} currentId The ID of the currently enabled input method.
193 * @return {boolean} True if the IDs match. 192 * @return {boolean} True if the IDs match.
194 * @private 193 * @private
195 */ 194 */
196 isCurrentInputMethod_: function(id, currentId) { 195 isCurrentInputMethod_: function(id, currentId) {
197 assert(cr.isChromeOS); 196 assert(cr.isChromeOS);
198 return id == currentId; 197 return id == currentId;
199 }, 198 },
200 199
201 /** 200 /**
202 * @param {string} id The input method ID. 201 * @param {string} id The input method ID.
203 * @param {string} currentId The ID of the currently enabled input method. 202 * @param {string} currentId The ID of the currently enabled input method.
204 * @return {string} The class for the input method item. 203 * @return {string} The class for the input method item.
205 * @private 204 * @private
206 */ 205 */
207 getInputMethodItemClass_: function(id, currentId) { 206 getInputMethodItemClass_: function(id, currentId) {
207 assert(cr.isChromeOS);
208 return this.isCurrentInputMethod_(id, currentId) ? 'selected' : ''; 208 return this.isCurrentInputMethod_(id, currentId) ? 'selected' : '';
209 }, 209 },
210 </if>
211 210
212 /** 211 /**
213 * HACK(michaelpg): This is necessary to show the list when navigating to 212 * HACK(michaelpg): This is necessary to show the list when navigating to
214 * the sub-page. Remove this function when PolymerElements/neon-animation#60 213 * the sub-page. Remove this function when PolymerElements/neon-animation#60
215 * is fixed. 214 * is fixed.
216 * @param {string} tagName Name of the element containing the <iron-list>. 215 * @param {string} tagName Name of the element containing the <iron-list>.
217 */ 216 */
218 forceRenderList_: function(tagName) { 217 forceRenderList_: function(tagName) {
219 this.$$(tagName).$$('iron-list').fire('iron-resize'); 218 this.$$(tagName).$$('iron-list').fire('iron-resize');
220 }, 219 },
221 }); 220 });
222 })(); 221 })();
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698