| OLD | NEW |
| 1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2012 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 Out of the box experience flow (OOBE). | 6 * @fileoverview Out of the box experience flow (OOBE). |
| 7 * This is the main code for the OOBE WebUI implementation. | 7 * This is the main code for the OOBE WebUI implementation. |
| 8 */ | 8 */ |
| 9 | 9 |
| 10 <include src="../user_images_grid.js"></include> | 10 <include src="oobe_common.js"></include> |
| 11 <include src="apps_menu.js"></include> | |
| 12 <include src="bubble.js"></include> | |
| 13 <include src="display_manager.js"></include> | |
| 14 <include src="header_bar.js"></include> | |
| 15 <include src="screen_locally_managed_user_creation.js"></include> | |
| 16 <include src="network_dropdown.js"></include> | |
| 17 <include src="oobe_screen_eula.js"></include> | 11 <include src="oobe_screen_eula.js"></include> |
| 18 <include src="oobe_screen_network.js"></include> | 12 <include src="oobe_screen_network.js"></include> |
| 19 <include src="oobe_screen_reset.js"></include> | |
| 20 <include src="oobe_screen_update.js"></include> | 13 <include src="oobe_screen_update.js"></include> |
| 21 <include src="oobe_screen_user_image.js"></include> | 14 |
| 22 <include src="oobe_screen_oauth_enrollment.js"></include> | 15 cr.define('cr.ui.Oobe', function() { |
| 23 <include src="screen_account_picker.js"></include> | 16 return { |
| 24 <include src="screen_gaia_signin.js"></include> | 17 /** |
| 25 <include src="screen_error_message.js"></include> | 18 * Setups given "select" element using the list and adds callback. |
| 26 <include src="screen_tpm_error.js"></include> | 19 * @param {!Element} select Select object to be updated. |
| 27 <include src="screen_password_changed.js"></include> | 20 * @param {!Object} list List of the options to be added. |
| 28 <include src="oobe_screen_terms_of_service.js"></include> | 21 * @param {string} callback Callback name which should be send to Chrome or |
| 29 <include src="screen_wrong_hwid.js"></include> | 22 * an empty string if the event listener shouldn't be added. |
| 30 <include src="user_pod_row.js"></include> | 23 */ |
| 31 | 24 setupSelect: function(select, list, callback) { |
| 32 cr.define('cr.ui', function() { | 25 select.options.length = 0; |
| 33 var DisplayManager = cr.ui.login.DisplayManager; | 26 for (var i = 0; i < list.length; ++i) { |
| 34 | 27 var item = list[i]; |
| 35 /** | 28 var option = |
| 36 * Constructs an Out of box controller. It manages initialization of screens, | 29 new Option(item.title, item.value, item.selected, item.selected); |
| 37 * transitions, error messages display. | 30 select.appendChild(option); |
| 38 * @extends {DisplayManager} | 31 } |
| 39 * @constructor | 32 if (callback) { |
| 40 */ | 33 var sendCallback = function() { |
| 41 function Oobe() { | 34 chrome.send(callback, [select.options[select.selectedIndex].value]); |
| 42 } | 35 }; |
| 43 | 36 select.addEventListener('blur', sendCallback); |
| 44 cr.addSingletonGetter(Oobe); | 37 select.addEventListener('click', sendCallback); |
| 45 | 38 select.addEventListener('keyup', function(event) { |
| 46 Oobe.prototype = { | 39 var keycodeInterested = [ |
| 47 __proto__: DisplayManager.prototype, | 40 9, // Tab |
| 48 }; | 41 13, // Enter |
| 49 | 42 27, // Escape |
| 50 /** | 43 ]; |
| 51 * Setups given "select" element using the list and adds callback. | 44 if (keycodeInterested.indexOf(event.keyCode) >= 0) |
| 52 * @param {!Element} select Select object to be updated. | 45 sendCallback(); |
| 53 * @param {!Object} list List of the options to be added. | 46 }); |
| 54 * @param {string} callback Callback name which should be send to Chrome or | 47 } |
| 55 * an empty string if the event listener shouldn't be added. | 48 }, |
| 56 */ | 49 |
| 57 Oobe.setupSelect = function(select, list, callback) { | 50 /** |
| 58 select.options.length = 0; | 51 * Initializes the OOBE flow. This will cause all C++ handlers to |
| 59 for (var i = 0; i < list.length; ++i) { | 52 * be invoked to do final setup. |
| 60 var item = list[i]; | 53 */ |
| 61 var option = | 54 initialize: function() { |
| 62 new Option(item.title, item.value, item.selected, item.selected); | 55 cr.ui.login.DisplayManager.initialize(); |
| 63 select.appendChild(option); | 56 oobe.WrongHWIDScreen.register(); |
| 64 } | 57 oobe.NetworkScreen.register(); |
| 65 if (callback) { | 58 oobe.EulaScreen.register(); |
| 66 var sendCallback = function() { | 59 oobe.UpdateScreen.register(); |
| 67 chrome.send(callback, [select.options[select.selectedIndex].value]); | 60 oobe.OAuthEnrollmentScreen.register(); |
| 68 }; | 61 oobe.ResetScreen.register(); |
| 69 select.addEventListener('blur', sendCallback); | 62 login.AccountPickerScreen.register(); |
| 70 select.addEventListener('click', sendCallback); | 63 login.GaiaSigninScreen.register(); |
| 71 select.addEventListener('keyup', function(event) { | 64 oobe.UserImageScreen.register(/* lazyInit= */ false); |
| 72 var keycodeInterested = [ | 65 login.ErrorMessageScreen.register(); |
| 73 9, // Tab | 66 login.TPMErrorMessageScreen.register(); |
| 74 13, // Enter | 67 login.PasswordChangedScreen.register(); |
| 75 27, // Escape | 68 login.LocallyManagedUserCreationScreen.register(); |
| 76 ]; | 69 oobe.TermsOfServiceScreen.register(); |
| 77 if (keycodeInterested.indexOf(event.keyCode) >= 0) | 70 |
| 78 sendCallback(); | 71 cr.ui.Bubble.decorate($('bubble')); |
| 79 }); | 72 login.HeaderBar.decorate($('login-header-bar')); |
| 73 |
| 74 Oobe.initializeA11yMenu(); |
| 75 |
| 76 chrome.send('screenStateInitialize'); |
| 77 }, |
| 78 |
| 79 /** |
| 80 * Initializes OOBE accessibility menu. |
| 81 */ |
| 82 initializeA11yMenu: function() { |
| 83 cr.ui.Bubble.decorate($('accessibility-menu')); |
| 84 $('connect-accessibility-link').addEventListener( |
| 85 'click', Oobe.handleAccessbilityLinkClick); |
| 86 $('eula-accessibility-link').addEventListener( |
| 87 'click', Oobe.handleAccessbilityLinkClick); |
| 88 $('update-accessibility-link').addEventListener( |
| 89 'click', Oobe.handleAccessbilityLinkClick); |
| 90 |
| 91 $('high-contrast').addEventListener('click', |
| 92 Oobe.handleHighContrastClick); |
| 93 $('spoken-feedback').addEventListener('click', |
| 94 Oobe.handleSpokenFeedbackClick); |
| 95 $('screen-magnifier').addEventListener('click', |
| 96 Oobe.handleScreenMagnifierClick); |
| 97 |
| 98 // A11y menu should be accessible i.e. disable autohide on any |
| 99 // keydown or click inside menu. |
| 100 $('accessibility-menu').hideOnKeyPress = false; |
| 101 $('accessibility-menu').hideOnSelfClick = false; |
| 102 }, |
| 103 |
| 104 /** |
| 105 * Accessibility link handler. |
| 106 */ |
| 107 handleAccessbilityLinkClick: function(e) { |
| 108 /** @const */ var BUBBLE_OFFSET = 5; |
| 109 /** @const */ var BUBBLE_PADDING = 10; |
| 110 $('accessibility-menu').showForElement(e.target, |
| 111 cr.ui.Bubble.Attachment.BOTTOM, |
| 112 BUBBLE_OFFSET, BUBBLE_PADDING); |
| 113 if (Oobe.getInstance().currentScreen && |
| 114 Oobe.getInstance().currentScreen.defaultControl) { |
| 115 $('accessibility-menu').elementToFocusOnHide = |
| 116 Oobe.getInstance().currentScreen.defaultControl; |
| 117 } else { |
| 118 // Update screen falls into this category. Since it doesn't have any |
| 119 // controls other than a11y link we don't want that link to receive |
| 120 // focus when screen is shown i.e. defaultControl is not defined. |
| 121 // Focus a11y link instead. |
| 122 $('accessibility-menu').elementToFocusOnHide = e.target; |
| 123 } |
| 124 e.stopPropagation(); |
| 125 }, |
| 126 |
| 127 /** |
| 128 * Spoken feedback checkbox handler. |
| 129 */ |
| 130 handleSpokenFeedbackClick: function(e) { |
| 131 chrome.send('enableSpokenFeedback', [$('spoken-feedback').checked]); |
| 132 e.stopPropagation(); |
| 133 }, |
| 134 |
| 135 /** |
| 136 * High contrast mode checkbox handler. |
| 137 */ |
| 138 handleHighContrastClick: function(e) { |
| 139 chrome.send('enableHighContrast', [$('high-contrast').checked]); |
| 140 e.stopPropagation(); |
| 141 }, |
| 142 |
| 143 /** |
| 144 * Screen magnifier checkbox handler. |
| 145 */ |
| 146 handleScreenMagnifierClick: function(e) { |
| 147 chrome.send('enableScreenMagnifier', [$('screen-magnifier').checked]); |
| 148 e.stopPropagation(); |
| 149 }, |
| 150 |
| 151 /** |
| 152 * Enables/disables continue button. |
| 153 * @param {boolean} enable Should the button be enabled? |
| 154 */ |
| 155 enableContinueButton: function(enable) { |
| 156 $('continue-button').disabled = !enable; |
| 157 }, |
| 158 |
| 159 /** |
| 160 * Sets usage statistics checkbox. |
| 161 * @param {boolean} checked Is the checkbox checked? |
| 162 */ |
| 163 setUsageStats: function(checked) { |
| 164 $('usage-stats').checked = checked; |
| 165 }, |
| 166 |
| 167 /** |
| 168 * Set OEM EULA URL. |
| 169 * @param {text} oemEulaUrl OEM EULA URL. |
| 170 */ |
| 171 setOemEulaUrl: function(oemEulaUrl) { |
| 172 if (oemEulaUrl) { |
| 173 $('oem-eula-frame').src = oemEulaUrl; |
| 174 $('eulas').classList.remove('one-column'); |
| 175 } else { |
| 176 $('eulas').classList.add('one-column'); |
| 177 } |
| 178 }, |
| 179 |
| 180 /** |
| 181 * Sets update's progress bar value. |
| 182 * @param {number} progress Percentage of the progress bar. |
| 183 */ |
| 184 setUpdateProgress: function(progress) { |
| 185 $('update-progress-bar').value = progress; |
| 186 }, |
| 187 |
| 188 /** |
| 189 * Shows or hides downloading ETA message. |
| 190 * @param {boolean} visible Are ETA message visible? |
| 191 */ |
| 192 showEstimatedTimeLeft: function(visible) { |
| 193 $('progress-message').hidden = visible; |
| 194 $('estimated-time-left').hidden = !visible; |
| 195 }, |
| 196 |
| 197 /** |
| 198 * Sets estimated time left until download will complete. |
| 199 * @param {number} seconds Time left in seconds. |
| 200 */ |
| 201 setEstimatedTimeLeft: function(seconds) { |
| 202 var minutes = Math.ceil(seconds / 60); |
| 203 var message = ''; |
| 204 if (minutes > 60) { |
| 205 message = loadTimeData.getString('downloadingTimeLeftLong'); |
| 206 } else if (minutes > 55) { |
| 207 message = loadTimeData.getString('downloadingTimeLeftStatusOneHour'); |
| 208 } else if (minutes > 20) { |
| 209 message = loadTimeData.getStringF('downloadingTimeLeftStatusMinutes', |
| 210 Math.ceil(minutes / 5) * 5); |
| 211 } else if (minutes > 1) { |
| 212 message = loadTimeData.getStringF('downloadingTimeLeftStatusMinutes', |
| 213 minutes); |
| 214 } else { |
| 215 message = loadTimeData.getString('downloadingTimeLeftSmall'); |
| 216 } |
| 217 $('estimated-time-left').textContent = |
| 218 loadTimeData.getStringF('downloading', message); |
| 219 }, |
| 220 |
| 221 /** |
| 222 * Shows or hides info message below progress bar. |
| 223 * @param {boolean} visible Are message visible? |
| 224 */ |
| 225 showProgressMessage: function(visible) { |
| 226 $('estimated-time-left').hidden = visible; |
| 227 $('progress-message').hidden = !visible; |
| 228 }, |
| 229 |
| 230 /** |
| 231 * Sets message below progress bar. |
| 232 * @param {string} message Message that should be shown. |
| 233 */ |
| 234 setProgressMessage: function(message) { |
| 235 $('progress-message').innerText = message; |
| 236 }, |
| 237 |
| 238 /** |
| 239 * Sets update message, which is shown above the progress bar. |
| 240 * @param {text} message Message which is shown by the label. |
| 241 */ |
| 242 setUpdateMessage: function(message) { |
| 243 $('update-upper-label').textContent = message; |
| 244 }, |
| 245 |
| 246 /** |
| 247 * Shows or hides update curtain. |
| 248 * @param {boolean} visible Are curtains visible? |
| 249 */ |
| 250 showUpdateCurtain: function(visible) { |
| 251 $('update-screen-curtain').hidden = !visible; |
| 252 $('update-screen-main').hidden = visible; |
| 253 }, |
| 254 |
| 255 /** |
| 256 * Sets TPM password. |
| 257 * @param {text} password TPM password to be shown. |
| 258 */ |
| 259 setTpmPassword: function(password) { |
| 260 $('tpm-busy').hidden = true; |
| 261 |
| 262 if (password.length) { |
| 263 $('tpm-password').textContent = password; |
| 264 $('tpm-password').hidden = false; |
| 265 } else { |
| 266 $('tpm-desc').hidden = true; |
| 267 $('tpm-desc-powerwash').hidden = false; |
| 268 } |
| 269 }, |
| 270 |
| 271 /** |
| 272 * Refreshes a11y menu state. |
| 273 * @param {!Object} data New dictionary with a11y features state. |
| 274 */ |
| 275 refreshA11yInfo: function(data) { |
| 276 $('high-contrast').checked = data.highContrastEnabled; |
| 277 $('spoken-feedback').checked = data.spokenFeedbackEnabled; |
| 278 $('screen-magnifier').checked = data.screenMagnifierEnabled; |
| 279 }, |
| 280 |
| 281 /** |
| 282 * Reloads content of the page (localized strings, options of the select |
| 283 * controls). |
| 284 * @param {!Object} data New dictionary with i18n values. |
| 285 */ |
| 286 reloadContent: function(data) { |
| 287 // Reload global local strings, process DOM tree again. |
| 288 loadTimeData.overrideValues(data); |
| 289 i18nTemplate.process(document, loadTimeData); |
| 290 |
| 291 // Update language and input method menu lists. |
| 292 Oobe.setupSelect($('language-select'), data.languageList, ''); |
| 293 Oobe.setupSelect($('keyboard-select'), data.inputMethodsList, ''); |
| 294 |
| 295 // Update localized content of the screens. |
| 296 Oobe.updateLocalizedContent(); |
| 297 }, |
| 298 |
| 299 /** |
| 300 * Updates localized content of the screens. |
| 301 * Should be executed on language change. |
| 302 */ |
| 303 updateLocalizedContent: function() { |
| 304 // Buttons, headers and links. |
| 305 Oobe.getInstance().updateLocalizedContent_(); |
| 80 } | 306 } |
| 81 }; | 307 }; |
| 82 | |
| 83 /** | |
| 84 * Initializes the OOBE flow. This will cause all C++ handlers to | |
| 85 * be invoked to do final setup. | |
| 86 */ | |
| 87 Oobe.initialize = function() { | |
| 88 DisplayManager.initialize(); | |
| 89 oobe.WrongHWIDScreen.register(); | |
| 90 oobe.NetworkScreen.register(); | |
| 91 oobe.EulaScreen.register(); | |
| 92 oobe.UpdateScreen.register(); | |
| 93 oobe.OAuthEnrollmentScreen.register(); | |
| 94 oobe.ResetScreen.register(); | |
| 95 login.AccountPickerScreen.register(); | |
| 96 login.GaiaSigninScreen.register(); | |
| 97 oobe.UserImageScreen.register(/* lazyInit= */ false); | |
| 98 login.ErrorMessageScreen.register(); | |
| 99 login.TPMErrorMessageScreen.register(); | |
| 100 login.PasswordChangedScreen.register(); | |
| 101 login.LocallyManagedUserCreationScreen.register(); | |
| 102 oobe.TermsOfServiceScreen.register(); | |
| 103 | |
| 104 cr.ui.Bubble.decorate($('bubble')); | |
| 105 login.HeaderBar.decorate($('login-header-bar')); | |
| 106 | |
| 107 Oobe.initializeA11yMenu(); | |
| 108 | |
| 109 chrome.send('screenStateInitialize'); | |
| 110 }; | |
| 111 | |
| 112 /** | |
| 113 * Initializes OOBE accessibility menu. | |
| 114 */ | |
| 115 Oobe.initializeA11yMenu = function() { | |
| 116 cr.ui.Bubble.decorate($('accessibility-menu')); | |
| 117 $('connect-accessibility-link').addEventListener( | |
| 118 'click', Oobe.handleAccessbilityLinkClick); | |
| 119 $('eula-accessibility-link').addEventListener( | |
| 120 'click', Oobe.handleAccessbilityLinkClick); | |
| 121 $('update-accessibility-link').addEventListener( | |
| 122 'click', Oobe.handleAccessbilityLinkClick); | |
| 123 | |
| 124 $('high-contrast').addEventListener('click', Oobe.handleHighContrastClick); | |
| 125 $('spoken-feedback').addEventListener('click', | |
| 126 Oobe.handleSpokenFeedbackClick); | |
| 127 $('screen-magnifier').addEventListener('click', | |
| 128 Oobe.handleScreenMagnifierClick); | |
| 129 | |
| 130 // A11y menu should be accessible i.e. disable autohide on any | |
| 131 // keydown or click inside menu. | |
| 132 $('accessibility-menu').hideOnKeyPress = false; | |
| 133 $('accessibility-menu').hideOnSelfClick = false; | |
| 134 }; | |
| 135 | |
| 136 /** | |
| 137 * Handle accelerators. These are passed from native code instead of a JS | |
| 138 * event handler in order to make sure that embedded iframes cannot swallow | |
| 139 * them. | |
| 140 * @param {string} name Accelerator name. | |
| 141 */ | |
| 142 Oobe.handleAccelerator = function(name) { | |
| 143 Oobe.getInstance().handleAccelerator(name); | |
| 144 }; | |
| 145 | |
| 146 /** | |
| 147 * Accessibility link handler. | |
| 148 */ | |
| 149 Oobe.handleAccessbilityLinkClick = function(e) { | |
| 150 /** @const */ var BUBBLE_OFFSET = 5; | |
| 151 /** @const */ var BUBBLE_PADDING = 10; | |
| 152 $('accessibility-menu').showForElement(e.target, | |
| 153 cr.ui.Bubble.Attachment.BOTTOM, | |
| 154 BUBBLE_OFFSET, BUBBLE_PADDING); | |
| 155 if (Oobe.getInstance().currentScreen && | |
| 156 Oobe.getInstance().currentScreen.defaultControl) { | |
| 157 $('accessibility-menu').elementToFocusOnHide = | |
| 158 Oobe.getInstance().currentScreen.defaultControl; | |
| 159 } else { | |
| 160 // Update screen falls into this category. Since it doesn't have any | |
| 161 // controls other than a11y link we don't want that link to receive focus | |
| 162 // when screen is shown i.e. defaultControl is not defined. | |
| 163 // Focus a11y link instead. | |
| 164 $('accessibility-menu').elementToFocusOnHide = e.target; | |
| 165 } | |
| 166 e.stopPropagation(); | |
| 167 }; | |
| 168 | |
| 169 /** | |
| 170 * Spoken feedback checkbox handler. | |
| 171 */ | |
| 172 Oobe.handleSpokenFeedbackClick = function(e) { | |
| 173 chrome.send('enableSpokenFeedback', [$('spoken-feedback').checked]); | |
| 174 e.stopPropagation(); | |
| 175 }; | |
| 176 | |
| 177 /** | |
| 178 * High contrast mode checkbox handler. | |
| 179 */ | |
| 180 Oobe.handleHighContrastClick = function(e) { | |
| 181 chrome.send('enableHighContrast', [$('high-contrast').checked]); | |
| 182 e.stopPropagation(); | |
| 183 }; | |
| 184 | |
| 185 /** | |
| 186 * Screen magnifier checkbox handler. | |
| 187 */ | |
| 188 Oobe.handleScreenMagnifierClick = function(e) { | |
| 189 chrome.send('enableScreenMagnifier', [$('screen-magnifier').checked]); | |
| 190 e.stopPropagation(); | |
| 191 }; | |
| 192 | |
| 193 /** | |
| 194 * Shows the given screen. | |
| 195 * @param {Object} screen Screen params dict, e.g. {id: screenId, data: data} | |
| 196 */ | |
| 197 Oobe.showScreen = function(screen) { | |
| 198 Oobe.getInstance().showScreen(screen); | |
| 199 }; | |
| 200 | |
| 201 /** | |
| 202 * Shows the previous screen of workflow. | |
| 203 */ | |
| 204 Oobe.goBack = function() { | |
| 205 Oobe.getInstance().goBack(); | |
| 206 }; | |
| 207 | |
| 208 /** | |
| 209 * Enables/disables continue button. | |
| 210 * @param {boolean} enable Should the button be enabled? | |
| 211 */ | |
| 212 Oobe.enableContinueButton = function(enable) { | |
| 213 $('continue-button').disabled = !enable; | |
| 214 }; | |
| 215 | |
| 216 /** | |
| 217 * Sets usage statistics checkbox. | |
| 218 * @param {boolean} checked Is the checkbox checked? | |
| 219 */ | |
| 220 Oobe.setUsageStats = function(checked) { | |
| 221 $('usage-stats').checked = checked; | |
| 222 }; | |
| 223 | |
| 224 /** | |
| 225 * Set OEM EULA URL. | |
| 226 * @param {text} oemEulaUrl OEM EULA URL. | |
| 227 */ | |
| 228 Oobe.setOemEulaUrl = function(oemEulaUrl) { | |
| 229 if (oemEulaUrl) { | |
| 230 $('oem-eula-frame').src = oemEulaUrl; | |
| 231 $('eulas').classList.remove('one-column'); | |
| 232 } else { | |
| 233 $('eulas').classList.add('one-column'); | |
| 234 } | |
| 235 }; | |
| 236 | |
| 237 /** | |
| 238 * Sets update's progress bar value. | |
| 239 * @param {number} progress Percentage of the progress bar. | |
| 240 */ | |
| 241 Oobe.setUpdateProgress = function(progress) { | |
| 242 $('update-progress-bar').value = progress; | |
| 243 }; | |
| 244 | |
| 245 /** | |
| 246 * Shows or hides downloading ETA message. | |
| 247 * @param {boolean} visible Are ETA message visible? | |
| 248 */ | |
| 249 Oobe.showEstimatedTimeLeft = function(visible) { | |
| 250 $('progress-message').hidden = visible; | |
| 251 $('estimated-time-left').hidden = !visible; | |
| 252 }; | |
| 253 | |
| 254 /** | |
| 255 * Sets estimated time left until download will complete. | |
| 256 * @param {number} seconds Time left in seconds. | |
| 257 */ | |
| 258 Oobe.setEstimatedTimeLeft = function(seconds) { | |
| 259 var minutes = Math.ceil(seconds / 60); | |
| 260 var message = ''; | |
| 261 if (minutes > 60) { | |
| 262 message = loadTimeData.getString('downloadingTimeLeftLong'); | |
| 263 } else if (minutes > 55) { | |
| 264 message = loadTimeData.getString('downloadingTimeLeftStatusOneHour'); | |
| 265 } else if (minutes > 20) { | |
| 266 message = loadTimeData.getStringF('downloadingTimeLeftStatusMinutes', | |
| 267 Math.ceil(minutes / 5) * 5); | |
| 268 } else if (minutes > 1) { | |
| 269 message = loadTimeData.getStringF('downloadingTimeLeftStatusMinutes', | |
| 270 minutes); | |
| 271 } else { | |
| 272 message = loadTimeData.getString('downloadingTimeLeftSmall'); | |
| 273 } | |
| 274 $('estimated-time-left').textContent = | |
| 275 loadTimeData.getStringF('downloading', message); | |
| 276 }; | |
| 277 | |
| 278 /** | |
| 279 * Shows or hides info message below progress bar. | |
| 280 * @param {boolean} visible Are message visible? | |
| 281 */ | |
| 282 Oobe.showProgressMessage = function(visible) { | |
| 283 $('estimated-time-left').hidden = visible; | |
| 284 $('progress-message').hidden = !visible; | |
| 285 }; | |
| 286 | |
| 287 /** | |
| 288 * Sets message below progress bar. | |
| 289 * @param {string} message Message that should be shown. | |
| 290 */ | |
| 291 Oobe.setProgressMessage = function(message) { | |
| 292 $('progress-message').innerText = message; | |
| 293 }; | |
| 294 | |
| 295 /** | |
| 296 * Sets update message, which is shown above the progress bar. | |
| 297 * @param {text} message Message which is shown by the label. | |
| 298 */ | |
| 299 Oobe.setUpdateMessage = function(message) { | |
| 300 $('update-upper-label').textContent = message; | |
| 301 }; | |
| 302 | |
| 303 /** | |
| 304 * Shows or hides update curtain. | |
| 305 * @param {boolean} visible Are curtains visible? | |
| 306 */ | |
| 307 Oobe.showUpdateCurtain = function(visible) { | |
| 308 $('update-screen-curtain').hidden = !visible; | |
| 309 $('update-screen-main').hidden = visible; | |
| 310 }; | |
| 311 | |
| 312 /** | |
| 313 * Sets TPM password. | |
| 314 * @param {text} password TPM password to be shown. | |
| 315 */ | |
| 316 Oobe.setTpmPassword = function(password) { | |
| 317 $('tpm-busy').hidden = true; | |
| 318 | |
| 319 if (password.length) { | |
| 320 $('tpm-password').textContent = password; | |
| 321 $('tpm-password').hidden = false; | |
| 322 } else { | |
| 323 $('tpm-desc').hidden = true; | |
| 324 $('tpm-desc-powerwash').hidden = false; | |
| 325 } | |
| 326 } | |
| 327 | |
| 328 /** | |
| 329 * Refreshes a11y menu state. | |
| 330 * @param {!Object} data New dictionary with a11y features state. | |
| 331 */ | |
| 332 Oobe.refreshA11yInfo = function(data) { | |
| 333 $('high-contrast').checked = data.highContrastEnabled; | |
| 334 $('spoken-feedback').checked = data.spokenFeedbackEnabled; | |
| 335 $('screen-magnifier').checked = data.screenMagnifierEnabled; | |
| 336 }; | |
| 337 | |
| 338 /** | |
| 339 * Reloads content of the page (localized strings, options of the select | |
| 340 * controls). | |
| 341 * @param {!Object} data New dictionary with i18n values. | |
| 342 */ | |
| 343 Oobe.reloadContent = function(data) { | |
| 344 // Reload global local strings, process DOM tree again. | |
| 345 loadTimeData.overrideValues(data); | |
| 346 i18nTemplate.process(document, loadTimeData); | |
| 347 | |
| 348 // Update language and input method menu lists. | |
| 349 Oobe.setupSelect($('language-select'), data.languageList, ''); | |
| 350 Oobe.setupSelect($('keyboard-select'), data.inputMethodsList, ''); | |
| 351 | |
| 352 // Update localized content of the screens. | |
| 353 Oobe.updateLocalizedContent(); | |
| 354 }; | |
| 355 | |
| 356 /** | |
| 357 * Updates version label visibilty. | |
| 358 * @param {boolean} show True if version label should be visible. | |
| 359 */ | |
| 360 Oobe.showVersion = function(show) { | |
| 361 Oobe.getInstance().showVersion(show); | |
| 362 }; | |
| 363 | |
| 364 /** | |
| 365 * Updates localized content of the screens. | |
| 366 * Should be executed on language change. | |
| 367 */ | |
| 368 Oobe.updateLocalizedContent = function() { | |
| 369 // Buttons, headers and links. | |
| 370 Oobe.getInstance().updateLocalizedContent_(); | |
| 371 }; | |
| 372 | |
| 373 /** | |
| 374 * Update body class to switch between OOBE UI and Login UI. | |
| 375 */ | |
| 376 Oobe.showOobeUI = function(showOobe) { | |
| 377 if (showOobe) { | |
| 378 document.body.classList.remove('login-display'); | |
| 379 } else { | |
| 380 document.body.classList.add('login-display'); | |
| 381 Oobe.getInstance().prepareForLoginDisplay_(); | |
| 382 } | |
| 383 | |
| 384 // Don't show header bar for OOBE. | |
| 385 Oobe.getInstance().headerHidden = showOobe; | |
| 386 }; | |
| 387 | |
| 388 /** | |
| 389 * Disables signin UI. | |
| 390 */ | |
| 391 Oobe.disableSigninUI = function() { | |
| 392 DisplayManager.disableSigninUI(); | |
| 393 }; | |
| 394 | |
| 395 /** | |
| 396 * Shows signin UI. | |
| 397 * @param {string} opt_email An optional email for signin UI. | |
| 398 */ | |
| 399 Oobe.showSigninUI = function(opt_email) { | |
| 400 DisplayManager.showSigninUI(opt_email); | |
| 401 }; | |
| 402 | |
| 403 /** | |
| 404 * Resets sign-in input fields. | |
| 405 * @param {boolean} forceOnline Whether online sign-in should be forced. | |
| 406 * If |forceOnline| is false previously used sign-in type will be used. | |
| 407 */ | |
| 408 Oobe.resetSigninUI = function(forceOnline) { | |
| 409 DisplayManager.resetSigninUI(forceOnline); | |
| 410 }; | |
| 411 | |
| 412 /** | |
| 413 * Shows sign-in error bubble. | |
| 414 * @param {number} loginAttempts Number of login attemps tried. | |
| 415 * @param {string} message Error message to show. | |
| 416 * @param {string} link Text to use for help link. | |
| 417 * @param {number} helpId Help topic Id associated with help link. | |
| 418 */ | |
| 419 Oobe.showSignInError = function(loginAttempts, message, link, helpId) { | |
| 420 DisplayManager.showSignInError(loginAttempts, message, link, helpId); | |
| 421 }; | |
| 422 | |
| 423 /** | |
| 424 * Shows password changed screen that offers migration. | |
| 425 * @param {boolean} showError Whether to show the incorrect password error. | |
| 426 */ | |
| 427 Oobe.showPasswordChangedScreen = function(showError) { | |
| 428 DisplayManager.showPasswordChangedScreen(showError); | |
| 429 }; | |
| 430 | |
| 431 /** | |
| 432 * Shows dialog to create managed user. | |
| 433 */ | |
| 434 Oobe.showManagedUserCreationScreen = function() { | |
| 435 DisplayManager.showManagedUserCreationScreen(); | |
| 436 }; | |
| 437 | |
| 438 /** | |
| 439 * Shows TPM error screen. | |
| 440 */ | |
| 441 Oobe.showTpmError = function() { | |
| 442 DisplayManager.showTpmError(); | |
| 443 }; | |
| 444 | |
| 445 /** | |
| 446 * Clears error bubble as well as optional menus that could be open. | |
| 447 */ | |
| 448 Oobe.clearErrors = function() { | |
| 449 $('accessibility-menu').hide(); | |
| 450 DisplayManager.clearErrors(); | |
| 451 }; | |
| 452 | |
| 453 /** | |
| 454 * Displays animations on successful authentication, that have to happen | |
| 455 * before login UI is dismissed. | |
| 456 */ | |
| 457 Oobe.animateAuthenticationSuccess = function() { | |
| 458 login.HeaderBar.animateOut(function() { | |
| 459 chrome.send('unlockOnLoginSuccess'); | |
| 460 }); | |
| 461 }; | |
| 462 | |
| 463 /** | |
| 464 * Displays animations that have to happen once login UI is fully displayed. | |
| 465 */ | |
| 466 Oobe.animateOnceFullyDisplayed = function() { | |
| 467 login.HeaderBar.animateIn(); | |
| 468 }; | |
| 469 | |
| 470 /** | |
| 471 * Handles login success notification. | |
| 472 */ | |
| 473 Oobe.onLoginSuccess = function(username) { | |
| 474 if (Oobe.getInstance().currentScreen.id == SCREEN_ACCOUNT_PICKER) { | |
| 475 // TODO(nkostylev): Enable animation back when session start jank | |
| 476 // is reduced. See http://crosbug.com/11116 http://crosbug.com/18307 | |
| 477 // $('pod-row').startAuthenticatedAnimation(); | |
| 478 } | |
| 479 }; | |
| 480 | |
| 481 /** | |
| 482 * Sets text content for a div with |labelId|. | |
| 483 * @param {string} labelId Id of the label div. | |
| 484 * @param {string} labelText Text for the label. | |
| 485 */ | |
| 486 Oobe.setLabelText = function(labelId, labelText) { | |
| 487 DisplayManager.setLabelText(labelId, labelText); | |
| 488 }; | |
| 489 | |
| 490 /** | |
| 491 * Sets the text content of the enterprise info message. | |
| 492 * If the text is empty, the entire notification will be hidden. | |
| 493 * @param {string} messageText The message text. | |
| 494 */ | |
| 495 Oobe.setEnterpriseInfo = function(messageText) { | |
| 496 DisplayManager.setEnterpriseInfo(messageText); | |
| 497 }; | |
| 498 | |
| 499 /** | |
| 500 * Enforces focus on user pod of locked user. | |
| 501 */ | |
| 502 Oobe.forceLockedUserPodFocus = function() { | |
| 503 login.AccountPickerScreen.forceLockedUserPodFocus(); | |
| 504 }; | |
| 505 | |
| 506 /** | |
| 507 * Sets the domain name whose Terms of Service are being shown on the Terms of | |
| 508 * Service screen. | |
| 509 * @param {string} domain The domain name. | |
| 510 */ | |
| 511 Oobe.setTermsOfServiceDomain = function(domain) { | |
| 512 oobe.TermsOfServiceScreen.setDomain(domain); | |
| 513 }; | |
| 514 | |
| 515 /** | |
| 516 * Displays an error message on the Terms of Service screen. Called when the | |
| 517 * download of the Terms of Service has failed. | |
| 518 */ | |
| 519 Oobe.setTermsOfServiceLoadError = function() { | |
| 520 $('terms-of-service').classList.remove('tos-loading'); | |
| 521 $('terms-of-service').classList.add('error'); | |
| 522 }; | |
| 523 | |
| 524 /** | |
| 525 * Displays the given |termsOfService| on the Terms of Service screen. | |
| 526 * @param {string} termsOfService The terms of service, as plain text. | |
| 527 */ | |
| 528 Oobe.setTermsOfService = function(termsOfService) { | |
| 529 oobe.TermsOfServiceScreen.setTermsOfService(termsOfService); | |
| 530 }; | |
| 531 | |
| 532 /** | |
| 533 * Clears password field in user-pod. | |
| 534 */ | |
| 535 Oobe.clearUserPodPassword = function() { | |
| 536 DisplayManager.clearUserPodPassword(); | |
| 537 }; | |
| 538 | |
| 539 // Export | |
| 540 return { | |
| 541 Oobe: Oobe | |
| 542 }; | |
| 543 }); | 308 }); |
| 544 | 309 |
| 545 var Oobe = cr.ui.Oobe; | |
| 546 | |
| 547 // Allow selection events on components with editable text (password field) | |
| 548 // bug (http://code.google.com/p/chromium/issues/detail?id=125863) | |
| 549 disableTextSelectAndDrag(function(e) { | |
| 550 var src = e.target; | |
| 551 return src instanceof HTMLTextAreaElement || | |
| 552 src instanceof HTMLInputElement && | |
| 553 /text|password|search/.test(src.type); | |
| 554 }); | |
| 555 | |
| 556 document.addEventListener('DOMContentLoaded', cr.ui.Oobe.initialize); | 310 document.addEventListener('DOMContentLoaded', cr.ui.Oobe.initialize); |
| OLD | NEW |