OLD | NEW |
| (Empty) |
1 // Copyright (c) 2011 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 cr.define('options', function() { | |
6 const OptionsPage = options.OptionsPage; | |
7 | |
8 // Variable to track if a captcha challenge was issued. If this gets set to | |
9 // true, it stays that way until we are told about successful login from | |
10 // the browser. This means subsequent errors (like invalid password) are | |
11 // rendered in the captcha state, which is basically identical except we | |
12 // don't show the top error blurb "Error Signing in" or the "Create | |
13 // account" link. | |
14 var captchaChallengeActive_ = false; | |
15 | |
16 // True if the synced account uses a custom passphrase. | |
17 var usePassphrase_ = false; | |
18 | |
19 /** | |
20 * SyncSetupOverlay class | |
21 * Encapsulated handling of the 'Sync Setup' overlay page. | |
22 * @class | |
23 */ | |
24 function SyncSetupOverlay() { | |
25 OptionsPage.call(this, 'syncSetup', | |
26 templateData.syncSetupOverlayTitle, | |
27 'sync-setup-overlay'); | |
28 } | |
29 | |
30 cr.addSingletonGetter(SyncSetupOverlay); | |
31 | |
32 SyncSetupOverlay.prototype = { | |
33 __proto__: OptionsPage.prototype, | |
34 | |
35 /** | |
36 * Initializes the page. | |
37 */ | |
38 initializePage: function() { | |
39 OptionsPage.prototype.initializePage.call(this); | |
40 | |
41 var acct_text = $('gaia-account-text'); | |
42 var translated_text = acct_text.textContent; | |
43 var posGoogle = translated_text.indexOf('Google'); | |
44 if (posGoogle != -1) { | |
45 var ltr = templateData['textdirection'] == 'ltr'; | |
46 var googleIsAtEndOfSentence = posGoogle != 0; | |
47 if (googleIsAtEndOfSentence == ltr) { | |
48 // We're in ltr and in the translation the word 'Google' is AFTER the | |
49 // word 'Account' OR we're in rtl and 'Google' is BEFORE 'Account'. | |
50 var logo_td = $('gaia-logo'); | |
51 logo_td.parentNode.appendChild(logo_td); | |
52 } | |
53 acct_text.textContent = translated_text.replace('Google',''); | |
54 } | |
55 | |
56 var self = this; | |
57 $('gaia-login-form').onsubmit = function() { | |
58 self.sendCredentialsAndClose_(); | |
59 return false; | |
60 }; | |
61 $('google-option').onchange = $('explicit-option').onchange = function() { | |
62 self.onPassphraseRadioChanged_(); | |
63 }; | |
64 $('choose-datatypes-cancel').onclick = | |
65 $('sync-setup-cancel').onclick = | |
66 $('confirm-everything-cancel').onclick = | |
67 $('stop-syncing-cancel').onclick = function() { | |
68 self.closeOverlay_(); | |
69 }; | |
70 $('confirm-everything-ok').onclick = function() { | |
71 self.sendConfiguration_(); | |
72 }; | |
73 $('stop-syncing-ok').onclick = function() { | |
74 chrome.send('stopSyncing'); | |
75 self.closeOverlay_(); | |
76 }; | |
77 }, | |
78 | |
79 showOverlay_: function() { | |
80 OptionsPage.navigateToPage('syncSetup'); | |
81 }, | |
82 | |
83 closeOverlay_: function() { | |
84 OptionsPage.closeOverlay(); | |
85 }, | |
86 | |
87 /** @inheritDoc */ | |
88 didShowPage: function() { | |
89 chrome.send('SyncSetupAttachHandler'); | |
90 }, | |
91 | |
92 /** @inheritDoc */ | |
93 didClosePage: function() { | |
94 chrome.send('SyncSetupDidClosePage'); | |
95 }, | |
96 | |
97 sendPassphraseAndClose_: function() { | |
98 var f = $('choose-data-types-form'); | |
99 var result = JSON.stringify({"passphrase": f.passphrase.value}); | |
100 chrome.send('SyncSetupPassphrase', [result]); | |
101 return false; | |
102 }, | |
103 | |
104 getEncryptionRadioCheckedValue_: function() { | |
105 var f = $('choose-data-types-form'); | |
106 for (var i = 0; i < f.encrypt.length; ++i) { | |
107 if (f.encrypt[i].checked) { | |
108 return f.encrypt[i].value; | |
109 } | |
110 } | |
111 | |
112 return undefined; | |
113 }, | |
114 | |
115 getPassphraseRadioCheckedValue_: function() { | |
116 var f = $('choose-data-types-form'); | |
117 for (var i = 0; i < f.option.length; ++i) { | |
118 if (f.option[i].checked) { | |
119 return f.option[i].value; | |
120 } | |
121 } | |
122 | |
123 return undefined; | |
124 }, | |
125 | |
126 disableEncryptionRadioGroup_: function() { | |
127 var f = $('choose-data-types-form'); | |
128 for (var i = 0; i < f.encrypt.length; ++i) | |
129 f.encrypt[i].disabled = true; | |
130 }, | |
131 | |
132 onPassphraseRadioChanged_: function() { | |
133 var visible = this.getPassphraseRadioCheckedValue_() == "explicit"; | |
134 $('sync-custom-passphrase').hidden = !visible; | |
135 }, | |
136 | |
137 checkAllDataTypeCheckboxes_: function() { | |
138 var checkboxes = document.getElementsByName("dataTypeCheckbox"); | |
139 for (var i = 0; i < checkboxes.length; i++) { | |
140 // Only check the visible ones (since there's no way to uncheck | |
141 // the invisible ones). | |
142 if (checkboxes[i].parentElement.className == "sync-item-show") { | |
143 checkboxes[i].checked = true; | |
144 } | |
145 } | |
146 }, | |
147 | |
148 setDataTypeCheckboxesEnabled_: function(enabled) { | |
149 var checkboxes = document.getElementsByName("dataTypeCheckbox"); | |
150 var labels = document.getElementsByName("dataTypeLabel"); | |
151 for (var i = 0; i < checkboxes.length; i++) { | |
152 checkboxes[i].disabled = !enabled; | |
153 if (checkboxes[i].disabled) { | |
154 labels[i].className = "sync-label-inactive"; | |
155 } else { | |
156 labels[i].className = "sync-label-active"; | |
157 } | |
158 } | |
159 }, | |
160 | |
161 setCheckboxesToKeepEverythingSynced_: function(value) { | |
162 this.setDataTypeCheckboxesEnabled_(!value); | |
163 if (value) | |
164 this.checkAllDataTypeCheckboxes_(); | |
165 }, | |
166 | |
167 // Returns true if at least one data type is enabled and no data types are | |
168 // checked. (If all data type checkboxes are disabled, it's because "keep | |
169 // everything synced" is checked.) | |
170 noDataTypesChecked_: function() { | |
171 var checkboxes = document.getElementsByName("dataTypeCheckbox"); | |
172 var atLeastOneChecked = false; | |
173 var atLeastOneEnabled = false; | |
174 for (var i = 0; i < checkboxes.length; i++) { | |
175 if (!checkboxes[i].disabled && | |
176 checkboxes[i].parentElement.className == "sync-item-show") { | |
177 atLeastOneEnabled = true; | |
178 if (checkboxes[i].checked) { | |
179 atLeastOneChecked = true; | |
180 } | |
181 } | |
182 } | |
183 | |
184 return atLeastOneEnabled && !atLeastOneChecked; | |
185 }, | |
186 | |
187 checkPassphraseMatch_: function() { | |
188 var emptyError = $('empty-error'); | |
189 var mismatchError = $('mismatch-error'); | |
190 emptyError.hidden = true; | |
191 mismatchError.hidden = true; | |
192 | |
193 var f = $('choose-data-types-form'); | |
194 if (this.getPassphraseRadioCheckedValue_() != "explicit" || | |
195 f.option[0].disabled) | |
196 return true; | |
197 | |
198 var customPassphrase = $('custom-passphrase'); | |
199 if (customPassphrase.value.length == 0) { | |
200 emptyError.hidden = false; | |
201 return false; | |
202 } | |
203 | |
204 var confirmPassphrase = $('confirm-passphrase'); | |
205 if (confirmPassphrase.value != customPassphrase.value) { | |
206 mismatchError.hidden = false; | |
207 return false; | |
208 } | |
209 | |
210 return true; | |
211 }, | |
212 | |
213 sendConfiguration_: function() { | |
214 // Trying to submit, so hide previous errors. | |
215 $('aborted-text').hidden = true; | |
216 $('error-text').hidden = true; | |
217 | |
218 if (this.noDataTypesChecked_()) { | |
219 $('error-text').hidden = false; | |
220 return; | |
221 } | |
222 | |
223 var f = $('choose-data-types-form'); | |
224 if (!this.checkPassphraseMatch_()) | |
225 return; | |
226 | |
227 // Don't allow the user to tweak the settings once we send the | |
228 // configuration to the backend. | |
229 this.setInputElementsDisabledState_(true); | |
230 | |
231 var syncAll = | |
232 document.getElementById('sync-select-datatypes').selectedIndex == 0; | |
233 var usePassphrase = this.getPassphraseRadioCheckedValue_() == 'explicit'; | |
234 var encryptAllData = this.getEncryptionRadioCheckedValue_() == 'all'; | |
235 | |
236 // These values need to be kept in sync with where they are read in | |
237 // SyncSetupFlow::GetDataTypeChoiceData(). | |
238 var result = JSON.stringify({ | |
239 "keepEverythingSynced": syncAll, | |
240 "syncBookmarks": syncAll || $('bookmarks-checkbox').checked, | |
241 "syncPreferences": syncAll || $('preferences-checkbox').checked, | |
242 "syncThemes": syncAll || $('themes-checkbox').checked, | |
243 "syncPasswords": syncAll || $('passwords-checkbox').checked, | |
244 "syncAutofill": syncAll || $('autofill-checkbox').checked, | |
245 "syncExtensions": syncAll || $('extensions-checkbox').checked, | |
246 "syncTypedUrls": syncAll || $('typed-urls-checkbox').checked, | |
247 "syncApps": syncAll || $('apps-checkbox').checked, | |
248 "syncSessions": syncAll || $('sessions-checkbox').checked, | |
249 "encryptAllData": encryptAllData, | |
250 "usePassphrase": usePassphrase, | |
251 "passphrase": $('custom-passphrase').value | |
252 }); | |
253 chrome.send('SyncSetupConfigure', [result]); | |
254 }, | |
255 | |
256 /** | |
257 * Sets the disabled property of all input elements within the 'Customize | |
258 * Sync Preferences' screen. This is used to prohibit the user from changing | |
259 * the inputs after confirming the customized sync preferences, or resetting | |
260 * the state when re-showing the dialog. | |
261 * @param disabled True if controls should be set to disabled. | |
262 * @private | |
263 */ | |
264 setInputElementsDisabledState_: function(disabled) { | |
265 var configureElements = | |
266 $('customize-sync-preferences').querySelectorAll('input'); | |
267 for (var i = 0; i < configureElements.length; i++) | |
268 configureElements[i].disabled = disabled; | |
269 $('sync-select-datatypes').disabled = disabled; | |
270 | |
271 var self = this; | |
272 this.animateDisableLink_($('customize-link'), disabled, function() { | |
273 self.showCustomizePage_(null, true); | |
274 }); | |
275 | |
276 this.animateDisableLink_($('use-default-link'), disabled, function() { | |
277 self.showSyncEverythingPage_(); | |
278 }); | |
279 }, | |
280 | |
281 /** | |
282 * Animate a link being enabled/disabled. The link is hidden by animating | |
283 * its opacity, but to ensure the user doesn't click it during that time, | |
284 * its onclick handler is changed to null as well. | |
285 * @param elt The anchor element to enable/disable. | |
286 * @param disabled True if the link should be disabled. | |
287 * @param enabledFunction The onclick handler when the link is enabled. | |
288 * @private | |
289 */ | |
290 animateDisableLink_: function(elt, disabled, enabledFunction) { | |
291 if (disabled) { | |
292 elt.classList.add('transparent'); | |
293 elt.onclick = null; | |
294 elt.addEventListener('webkitTransitionEnd', function f(e) { | |
295 if (e.propertyName != 'opacity') | |
296 return; | |
297 elt.removeEventListener('webkitTransitionEnd', f); | |
298 elt.classList.remove('transparent'); | |
299 elt.hidden = true; | |
300 }); | |
301 } else { | |
302 elt.hidden = false; | |
303 elt.onclick = enabledFunction; | |
304 } | |
305 }, | |
306 | |
307 setChooseDataTypesCheckboxes_: function(args) { | |
308 var datatypeSelect = document.getElementById('sync-select-datatypes'); | |
309 datatypeSelect.selectedIndex = args.keepEverythingSynced ? 0 : 1; | |
310 | |
311 $('bookmarks-checkbox').checked = args.syncBookmarks; | |
312 $('preferences-checkbox').checked = args.syncPreferences; | |
313 $('themes-checkbox').checked = args.syncThemes; | |
314 | |
315 if (args.passwordsRegistered) { | |
316 $('passwords-checkbox').checked = args.syncPasswords; | |
317 $('passwords-item').className = "sync-item-show"; | |
318 } else { | |
319 $('passwords-item').className = "sync-item-hide"; | |
320 } | |
321 if (args.autofillRegistered) { | |
322 $('autofill-checkbox').checked = args.syncAutofill; | |
323 $('autofill-item').className = "sync-item-show"; | |
324 } else { | |
325 $('autofill-item').className = "sync-item-hide"; | |
326 } | |
327 if (args.extensionsRegistered) { | |
328 $('extensions-checkbox').checked = args.syncExtensions; | |
329 $('extensions-item').className = "sync-item-show"; | |
330 } else { | |
331 $('extensions-item').className = "sync-item-hide"; | |
332 } | |
333 if (args.typedUrlsRegistered) { | |
334 $('typed-urls-checkbox').checked = args.syncTypedUrls; | |
335 $('omnibox-item').className = "sync-item-show"; | |
336 } else { | |
337 $('omnibox-item').className = "sync-item-hide"; | |
338 } | |
339 if (args.appsRegistered) { | |
340 $('apps-checkbox').checked = args.syncApps; | |
341 $('apps-item').className = "sync-item-show"; | |
342 } else { | |
343 $('apps-item').className = "sync-item-hide"; | |
344 } | |
345 | |
346 this.setCheckboxesToKeepEverythingSynced_(args.keepEverythingSynced); | |
347 if (args.sessionsRegistered) { | |
348 $('sessions-checkbox').checked = args.syncSessions; | |
349 $('sessions-item').className = "sync-item-show"; | |
350 } else { | |
351 $('sessions-item').className = "sync-item-hide"; | |
352 } | |
353 }, | |
354 | |
355 setEncryptionRadios_: function(args) { | |
356 if (args['encryptAllData']) { | |
357 $('encrypt-all-option').checked = true; | |
358 this.disableEncryptionRadioGroup_(); | |
359 } else { | |
360 $('encrypt-sensitive-option').checked = true; | |
361 } | |
362 }, | |
363 | |
364 setPassphraseRadios_: function(args) { | |
365 if (args['usePassphrase']) { | |
366 $('explicit-option').checked = true; | |
367 | |
368 // The passphrase, once set, cannot be unset, but we show a reset link. | |
369 $('explicit-option').disabled = true; | |
370 $('google-option').disabled = true; | |
371 $('sync-custom-passphrase').hidden = true; | |
372 } else { | |
373 $('google-option').checked = true; | |
374 } | |
375 }, | |
376 | |
377 setErrorState_: function(args) { | |
378 if (!args.was_aborted) | |
379 return; | |
380 | |
381 $('aborted-text').hidden = false; | |
382 $('choose-datatypes-ok').disabled = true; | |
383 }, | |
384 | |
385 setCheckboxesAndErrors_: function(args) { | |
386 this.setChooseDataTypesCheckboxes_(args); | |
387 this.setEncryptionRadios_(args); | |
388 this.setPassphraseRadios_(args); | |
389 this.setErrorState_(args); | |
390 }, | |
391 | |
392 showConfigure_: function(args) { | |
393 var datatypeSelect = document.getElementById('sync-select-datatypes'); | |
394 var self = this; | |
395 datatypeSelect.onchange = function() { | |
396 var syncAll = this.selectedIndex == 0; | |
397 self.setCheckboxesToKeepEverythingSynced_(syncAll); | |
398 }; | |
399 | |
400 this.resetPage_('sync-setup-configure'); | |
401 $('sync-setup-configure').hidden = false; | |
402 | |
403 // onsubmit is changed when submitting a passphrase. Reset it to its | |
404 // default. | |
405 $('choose-data-types-form').onsubmit = function() { | |
406 self.sendConfiguration_(); | |
407 return false; | |
408 }; | |
409 | |
410 if (args) { | |
411 if (!args['encryptionEnabled']) | |
412 $('customize-sync-encryption').hidden = true; | |
413 this.setCheckboxesAndErrors_(args); | |
414 | |
415 // Whether to display the 'Sync everything' confirmation page or the | |
416 // customize data types page. | |
417 var keepEverythingSynced = args['keepEverythingSynced']; | |
418 this.usePassphrase_ = args['usePassphrase']; | |
419 if (args['showSyncEverythingPage'] == false || this.usePassphrase_ || | |
420 keepEverythingSynced == false || args['show_passphrase']) { | |
421 this.showCustomizePage_(args, keepEverythingSynced); | |
422 } else { | |
423 this.showSyncEverythingPage_(); | |
424 } | |
425 } | |
426 }, | |
427 | |
428 showSyncEverythingPage_: function() { | |
429 $('confirm-sync-preferences').hidden = false; | |
430 $('customize-sync-preferences').hidden = true; | |
431 | |
432 // Reset the selection to 'Sync everything'. | |
433 $('sync-select-datatypes').selectedIndex = 0; | |
434 | |
435 // The default state is to sync everything. | |
436 this.setCheckboxesToKeepEverythingSynced_(true); | |
437 | |
438 // If the account is not synced with a custom passphrase, reset the | |
439 // passphrase radio when switching to the 'Sync everything' page. | |
440 if (!this.usePassphrase_) { | |
441 $('google-option').checked = true; | |
442 $('sync-custom-passphrase').hidden = true; | |
443 } | |
444 | |
445 $('confirm-everything-ok').focus(); | |
446 }, | |
447 | |
448 /** | |
449 * Reveals the UI for entering a custom passphrase after initial setup. This | |
450 * may happen if the user forgot to enter the correct (or any) custom | |
451 * passphrase during initial setup. | |
452 * @param {Array} args The args that contain the passphrase UI | |
453 * configuration. | |
454 * @private | |
455 */ | |
456 showPassphraseContainer_: function(args) { | |
457 $('choose-data-types-form').onsubmit = | |
458 this.sendPassphraseAndClose_.bind(this); | |
459 $('sync-custom-passphrase-container').hidden = true; | |
460 $('sync-existing-passphrase-container').hidden = false; | |
461 | |
462 if (args["passphrase_creation_rejected"]) | |
463 $('passphrase-rejected-body').hidden = false; | |
464 else | |
465 $('normal-body').hidden = false; | |
466 | |
467 if (args["passphrase_setting_rejected"]) | |
468 $('incorrect-passphrase').hidden = false; | |
469 | |
470 $('sync-passphrase-warning').hidden = false; | |
471 | |
472 $('passphrase').focus(); | |
473 }, | |
474 | |
475 showCustomizePage_: function(args, syncEverything) { | |
476 $('confirm-sync-preferences').hidden = true; | |
477 $('customize-sync-preferences').hidden = false; | |
478 | |
479 $('sync-custom-passphrase-container').hidden = false; | |
480 $('sync-existing-passphrase-container').hidden = true; | |
481 | |
482 // If the user has selected the 'Customize' page on initial set up, it's | |
483 // likely he intends to change the data types. Select the | |
484 // 'Choose data types' option in this case. | |
485 var index = syncEverything ? 0 : 1; | |
486 document.getElementById('sync-select-datatypes').selectedIndex = index; | |
487 this.setDataTypeCheckboxesEnabled_(!syncEverything); | |
488 | |
489 // The passphrase input may need to take over focus from the OK button, so | |
490 // set focus before that logic. | |
491 $('choose-datatypes-ok').focus(); | |
492 | |
493 if (args && args['show_passphrase']) | |
494 this.showPassphraseContainer_(args); | |
495 }, | |
496 | |
497 attach_: function() { | |
498 chrome.send('SyncSetupAttachHandler'); | |
499 }, | |
500 | |
501 showSyncSetupPage_: function(page, args) { | |
502 if (page == 'settingUp') { | |
503 this.setThrobbersVisible_(true); | |
504 return; | |
505 } else { | |
506 this.setThrobbersVisible_(false); | |
507 } | |
508 | |
509 // Hide an existing visible overlay. | |
510 var overlay = $('sync-setup-overlay'); | |
511 for (var i = 0; i < overlay.children.length; i++) | |
512 overlay.children[i].hidden = true; | |
513 | |
514 this.setInputElementsDisabledState_(false); | |
515 | |
516 if (page == 'login') | |
517 this.showGaiaLogin_(args); | |
518 else if (page == 'configure' || page == 'passphrase') | |
519 this.showConfigure_(args); | |
520 | |
521 if (page == 'done') | |
522 this.closeOverlay_(); | |
523 else | |
524 this.showOverlay_(); | |
525 }, | |
526 | |
527 setThrobbersVisible_: function(visible) { | |
528 var throbbers = document.getElementsByClassName("throbber"); | |
529 for (var i = 0; i < throbbers.length; i++) | |
530 throbbers[i].style.visibility = visible ? "visible" : "hidden"; | |
531 }, | |
532 | |
533 loginSetFocus_: function() { | |
534 var email = $('gaia-email'); | |
535 var passwd = $('gaia-passwd'); | |
536 if (email && (email.value == null || email.value == "")) { | |
537 email.focus(); | |
538 } else if (passwd) { | |
539 passwd.focus(); | |
540 } | |
541 }, | |
542 | |
543 showAccessCodeRequired_: function() { | |
544 $('password-row').hidden = true; | |
545 $('email-row').hidden = true; | |
546 $('create-account-cell').style.visibility = "hidden"; | |
547 | |
548 $('access-code-label-row').hidden = false; | |
549 $('access-code-input-row').hidden = false; | |
550 $('access-code-help-row').hidden = false; | |
551 $('access-code').disabled = false; | |
552 }, | |
553 | |
554 showCaptcha_: function(args) { | |
555 this.captchaChallengeActive_ = true; | |
556 | |
557 // The captcha takes up lots of space, so make room. | |
558 $('top-blurb-error').hidden = true; | |
559 $('create-account-div').hidden = true; | |
560 $('create-account-cell').hidden = true; | |
561 | |
562 // It's showtime for the captcha now. | |
563 $('captcha-div').hidden = false; | |
564 $('gaia-email').disabled = true; | |
565 $('gaia-passwd').disabled = false; | |
566 $('captcha-value').disabled = false; | |
567 $('captcha-wrapper').style.backgroundImage = url(args.captchaUrl); | |
568 }, | |
569 | |
570 /** | |
571 * Reset the state of all descendant elements of a root element to their | |
572 * initial state. | |
573 * The initial state is specified by adding a class to the descendant | |
574 * element in sync_setup_overlay.html. | |
575 * @param pageElementId The root page element id. | |
576 * @private | |
577 */ | |
578 resetPage_: function(pageElementId) { | |
579 var page = $(pageElementId); | |
580 var forEach = function(arr, fn) { | |
581 var length = arr.length; | |
582 for (var i = 0; i < length; i++) { | |
583 fn(arr[i]); | |
584 } | |
585 }; | |
586 | |
587 forEach(page.getElementsByClassName('reset-hidden'), | |
588 function(elt) { elt.hidden = true; }); | |
589 forEach(page.getElementsByClassName('reset-shown'), | |
590 function(elt) { elt.hidden = false; }); | |
591 forEach(page.getElementsByClassName('reset-disabled'), | |
592 function(elt) { elt.disabled = true; }); | |
593 forEach(page.getElementsByClassName('reset-enabled'), | |
594 function(elt) { elt.disabled = false; }); | |
595 forEach(page.getElementsByClassName('reset-visibility-hidden'), | |
596 function(elt) { elt.style.visibility = 'hidden'; }); | |
597 forEach(page.getElementsByClassName('reset-value'), | |
598 function(elt) { elt.value = ''; }); | |
599 forEach(page.getElementsByClassName('reset-opaque'), | |
600 function(elt) { elt.classList.remove('transparent'); }); | |
601 }, | |
602 | |
603 showGaiaLogin_: function(args) { | |
604 this.resetPage_('sync-setup-login'); | |
605 $('sync-setup-login').hidden = false; | |
606 | |
607 var f = $('gaia-login-form'); | |
608 var email = $('gaia-email'); | |
609 var passwd = $('gaia-passwd'); | |
610 if (f) { | |
611 if (args.user != undefined) { | |
612 if (email.value != args.user) | |
613 passwd.value = ""; // Reset the password field | |
614 email.value = args.user; | |
615 } | |
616 | |
617 if (!args.editable_user) { | |
618 email.hidden = true; | |
619 var span = $('email-readonly'); | |
620 span.textContent = email.value; | |
621 span.hidden = false; | |
622 $('create-account-div').hidden = true; | |
623 } | |
624 | |
625 f.accessCode.disabled = true; | |
626 } | |
627 | |
628 if (1 == args.error) { | |
629 var access_code = document.getElementById('access-code'); | |
630 if (access_code.value && access_code.value != "") { | |
631 $('errormsg-0-access-code').hidden = false; | |
632 this.showAccessCodeRequired_(); | |
633 } else { | |
634 $('errormsg-1-password').hidden = false; | |
635 } | |
636 this.setBlurbError_(args.error_message); | |
637 } else if (3 == args.error) { | |
638 $('errormsg-0-connection').hidden = false; | |
639 this.setBlurbError_(args.error_message); | |
640 } else if (4 == args.error) { | |
641 this.showCaptcha_(args); | |
642 } else if (8 == args.error) { | |
643 this.showAccessCodeRequired_(); | |
644 } else if (args.error_message) { | |
645 this.setBlurbError_(args.error_message); | |
646 } | |
647 | |
648 $('sign-in').disabled = false; | |
649 $('sign-in').value = templateData['signin']; | |
650 this.loginSetFocus_(); | |
651 }, | |
652 | |
653 resetErrorVisibility_: function() { | |
654 $("errormsg-0-email").hidden = true; | |
655 $("errormsg-0-password").hidden = true; | |
656 $("errormsg-1-password").hidden = true; | |
657 $("errormsg-0-connection").hidden = true; | |
658 $("errormsg-0-access-code").hidden = true; | |
659 }, | |
660 | |
661 setBlurbError_: function(error_message) { | |
662 if (this.captchaChallengeActive_) | |
663 return; // No blurb in captcha challenge mode. | |
664 | |
665 if (error_message) { | |
666 $('error-signing-in').hidden = true; | |
667 $('error-custom').hidden = false; | |
668 $('error-custom').textContent = error_message; | |
669 } else { | |
670 $('error-signing-in').hidden = false; | |
671 $('error-custom').hidden = true; | |
672 } | |
673 | |
674 $('top-blurb-error').style.visibility = "visible"; | |
675 $('gaia-email').disabled = false; | |
676 $('gaia-passwd').disabled = false; | |
677 }, | |
678 | |
679 setErrorVisibility_: function() { | |
680 this.resetErrorVisibility_(); | |
681 var f = $('gaia-login-form'); | |
682 var email = $('gaia-email'); | |
683 var passwd = $('gaia-passwd'); | |
684 if (null == email.value || "" == email.value) { | |
685 $('errormsg-0-email').hidden = false; | |
686 this.setBlurbError_(); | |
687 return false; | |
688 } | |
689 // Don't enforce password being non-blank when checking access code (it | |
690 // will have been cleared when the page was displayed). | |
691 if (f.accessCode.disabled && (null == passwd.value || | |
692 "" == passwd.value)) { | |
693 $('errormsg-0-password').hidden = false; | |
694 this.setBlurbError_(); | |
695 return false; | |
696 } | |
697 if (!f.accessCode.disabled && (null == f.accessCode.value || | |
698 "" == f.accessCode.value)) { | |
699 $('errormsg-0-password').hidden = false; | |
700 return false; | |
701 } | |
702 return true; | |
703 }, | |
704 | |
705 sendCredentialsAndClose_: function() { | |
706 if (!this.setErrorVisibility_()) { | |
707 return false; | |
708 } | |
709 | |
710 $('gaia-email').disabled = true; | |
711 $('gaia-passwd').disabled = true; | |
712 $('captcha-value').disabled = true; | |
713 $('access-code').disabled = true; | |
714 | |
715 $('logging-in-throbber').style.visibility = "visible"; | |
716 | |
717 var f = $('gaia-login-form'); | |
718 var email = $('gaia-email'); | |
719 var passwd = $('gaia-passwd'); | |
720 var result = JSON.stringify({"user" : email.value, | |
721 "pass" : passwd.value, | |
722 "captcha" : f.captchaValue.value, | |
723 "access_code" : f.accessCode.value}); | |
724 $('sign-in').disabled = true; | |
725 chrome.send('SyncSetupSubmitAuth', [result]); | |
726 }, | |
727 | |
728 showSuccessAndClose_: function() { | |
729 $('sign-in').value = localStrings.getString('loginSuccess'); | |
730 setTimeout(this.closeOverlay_, 1600); | |
731 }, | |
732 | |
733 showSuccessAndSettingUp_: function() { | |
734 $('sign-in').value = localStrings.getString('settingUp'); | |
735 }, | |
736 | |
737 /** | |
738 * Displays the stop syncing dialog. | |
739 * @private | |
740 */ | |
741 showStopSyncingUI_: function() { | |
742 // Hide any visible children of the overlay. | |
743 var overlay = $('sync-setup-overlay'); | |
744 for (var i = 0; i < overlay.children.length; i++) | |
745 overlay.children[i].hidden = true; | |
746 | |
747 // Bypass OptionsPage.navigateToPage because it will call didShowPage | |
748 // which will set its own visible page, based on the flow state. | |
749 this.visible = true; | |
750 | |
751 $('sync-setup-stop-syncing').hidden = false; | |
752 $('stop-syncing-cancel').focus(); | |
753 }, | |
754 | |
755 /** | |
756 * Steps into the appropriate Sync Setup error UI. | |
757 * @private | |
758 */ | |
759 showErrorUI_: function() { | |
760 chrome.send('SyncSetupShowErrorUI'); | |
761 }, | |
762 | |
763 /** | |
764 * Determines the appropriate page to show in the Sync Setup UI based on | |
765 * the state of the Sync backend. | |
766 * @private | |
767 */ | |
768 showSetupUI_: function() { | |
769 chrome.send('SyncSetupShowSetupUI'); | |
770 }, | |
771 }; | |
772 | |
773 SyncSetupOverlay.showErrorUI = function() { | |
774 SyncSetupOverlay.getInstance().showErrorUI_(); | |
775 }; | |
776 | |
777 SyncSetupOverlay.showSetupUI = function() { | |
778 SyncSetupOverlay.getInstance().showSetupUI_(); | |
779 }; | |
780 | |
781 SyncSetupOverlay.showSyncSetupPage = function(page, args) { | |
782 SyncSetupOverlay.getInstance().showSyncSetupPage_(page, args); | |
783 }; | |
784 | |
785 SyncSetupOverlay.showSuccessAndClose = function() { | |
786 SyncSetupOverlay.getInstance().showSuccessAndClose_(); | |
787 }; | |
788 | |
789 SyncSetupOverlay.showSuccessAndSettingUp = function() { | |
790 SyncSetupOverlay.getInstance().showSuccessAndSettingUp_(); | |
791 }; | |
792 | |
793 SyncSetupOverlay.showStopSyncingUI = function() { | |
794 SyncSetupOverlay.getInstance().showStopSyncingUI_(); | |
795 }; | |
796 | |
797 // Export | |
798 return { | |
799 SyncSetupOverlay: SyncSetupOverlay | |
800 }; | |
801 }); | |
OLD | NEW |