OLD | NEW |
1 // Copyright 2014 The Chromium Authors. All rights reserved. | 1 // Copyright 2014 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 Display manager for WebUI OOBE and login. | 6 * @fileoverview Display manager for WebUI OOBE and login. |
7 */ | 7 */ |
8 | 8 |
9 // TODO(xiyuan): Find a better to share those constants. | 9 // TODO(xiyuan): Find a better to share those constants. |
10 /** @const */ var SCREEN_OOBE_NETWORK = 'connect'; | 10 /** @const */ var SCREEN_OOBE_NETWORK = 'connect'; |
(...skipping 86 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
97 /** @const */ var USER_ACTION_ROLLBACK_TOGGLED = 'rollback-toggled'; | 97 /** @const */ var USER_ACTION_ROLLBACK_TOGGLED = 'rollback-toggled'; |
98 | 98 |
99 cr.define('cr.ui.login', function() { | 99 cr.define('cr.ui.login', function() { |
100 var Bubble = cr.ui.Bubble; | 100 var Bubble = cr.ui.Bubble; |
101 | 101 |
102 /** | 102 /** |
103 * Maximum time in milliseconds to wait for step transition to finish. | 103 * Maximum time in milliseconds to wait for step transition to finish. |
104 * The value is used as the duration for ensureTransitionEndEvent below. | 104 * The value is used as the duration for ensureTransitionEndEvent below. |
105 * It needs to be inline with the step screen transition duration time | 105 * It needs to be inline with the step screen transition duration time |
106 * defined in css file. The current value in css is 200ms. To avoid emulated | 106 * defined in css file. The current value in css is 200ms. To avoid emulated |
107 * webkitTransitionEnd fired before real one, 250ms is used. | 107 * transitionend fired before real one, 250ms is used. |
108 * @const | 108 * @const |
109 */ | 109 */ |
110 var MAX_SCREEN_TRANSITION_DURATION = 250; | 110 var MAX_SCREEN_TRANSITION_DURATION = 250; |
111 | 111 |
112 /** | 112 /** |
113 * Groups of screens (screen IDs) that should have the same dimensions. | 113 * Groups of screens (screen IDs) that should have the same dimensions. |
114 * @type Array<Array<string>> | 114 * @type Array<Array<string>> |
115 * @const | 115 * @const |
116 */ | 116 */ |
117 var SCREEN_GROUPS = [[SCREEN_OOBE_NETWORK, | 117 var SCREEN_GROUPS = [[SCREEN_OOBE_NETWORK, |
(...skipping 414 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
532 // Default control to be focused (if specified). | 532 // Default control to be focused (if specified). |
533 var defaultControl = newStep.defaultControl; | 533 var defaultControl = newStep.defaultControl; |
534 | 534 |
535 var outerContainer = $('outer-container'); | 535 var outerContainer = $('outer-container'); |
536 var innerContainer = $('inner-container'); | 536 var innerContainer = $('inner-container'); |
537 var isOOBE = this.isOobeUI(); | 537 var isOOBE = this.isOobeUI(); |
538 if (this.currentStep_ != nextStepIndex && | 538 if (this.currentStep_ != nextStepIndex && |
539 !oldStep.classList.contains('hidden')) { | 539 !oldStep.classList.contains('hidden')) { |
540 if (oldStep.classList.contains('animated')) { | 540 if (oldStep.classList.contains('animated')) { |
541 innerContainer.classList.add('animation'); | 541 innerContainer.classList.add('animation'); |
542 oldStep.addEventListener('webkitTransitionEnd', function f(e) { | 542 oldStep.addEventListener('transitionend', function f(e) { |
543 oldStep.removeEventListener('webkitTransitionEnd', f); | 543 oldStep.removeEventListener('transitionend', f); |
544 if (oldStep.classList.contains('faded') || | 544 if (oldStep.classList.contains('faded') || |
545 oldStep.classList.contains('left') || | 545 oldStep.classList.contains('left') || |
546 oldStep.classList.contains('right')) { | 546 oldStep.classList.contains('right')) { |
547 innerContainer.classList.remove('animation'); | 547 innerContainer.classList.remove('animation'); |
548 oldStep.classList.add('hidden'); | 548 oldStep.classList.add('hidden'); |
549 if (!isOOBE) | 549 if (!isOOBE) |
550 oldStep.hidden = true; | 550 oldStep.hidden = true; |
551 } | 551 } |
552 // Refresh defaultControl. It could have changed. | 552 // Refresh defaultControl. It could have changed. |
553 var defaultControl = newStep.defaultControl; | 553 var defaultControl = newStep.defaultControl; |
554 if (defaultControl) | 554 if (defaultControl) |
555 defaultControl.focus(); | 555 defaultControl.focus(); |
556 }); | 556 }); |
557 ensureTransitionEndEvent(oldStep, MAX_SCREEN_TRANSITION_DURATION); | 557 ensureTransitionEndEvent(oldStep, MAX_SCREEN_TRANSITION_DURATION); |
558 } else { | 558 } else { |
559 oldStep.classList.add('hidden'); | 559 oldStep.classList.add('hidden'); |
560 oldStep.hidden = true; | 560 oldStep.hidden = true; |
561 if (defaultControl) | 561 if (defaultControl) |
562 defaultControl.focus(); | 562 defaultControl.focus(); |
563 } | 563 } |
564 } else { | 564 } else { |
565 // First screen on OOBE launch. | 565 // First screen on OOBE launch. |
566 if (this.isOobeUI() && innerContainer.classList.contains('down')) { | 566 if (this.isOobeUI() && innerContainer.classList.contains('down')) { |
567 innerContainer.classList.remove('down'); | 567 innerContainer.classList.remove('down'); |
568 innerContainer.addEventListener( | 568 innerContainer.addEventListener( |
569 'webkitTransitionEnd', function f(e) { | 569 'transitionend', function f(e) { |
570 innerContainer.removeEventListener('webkitTransitionEnd', f); | 570 innerContainer.removeEventListener('transitionend', f); |
571 outerContainer.classList.remove('down'); | 571 outerContainer.classList.remove('down'); |
572 $('progress-dots').classList.remove('down'); | 572 $('progress-dots').classList.remove('down'); |
573 chrome.send('loginVisible', ['oobe']); | 573 chrome.send('loginVisible', ['oobe']); |
574 // Refresh defaultControl. It could have changed. | 574 // Refresh defaultControl. It could have changed. |
575 var defaultControl = newStep.defaultControl; | 575 var defaultControl = newStep.defaultControl; |
576 if (defaultControl) | 576 if (defaultControl) |
577 defaultControl.focus(); | 577 defaultControl.focus(); |
578 }); | 578 }); |
579 ensureTransitionEndEvent(innerContainer, | 579 ensureTransitionEndEvent(innerContainer, |
580 MAX_SCREEN_TRANSITION_DURATION); | 580 MAX_SCREEN_TRANSITION_DURATION); |
(...skipping 491 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1072 */ | 1072 */ |
1073 DisplayManager.refocusCurrentPod = function() { | 1073 DisplayManager.refocusCurrentPod = function() { |
1074 $('pod-row').refocusCurrentPod(); | 1074 $('pod-row').refocusCurrentPod(); |
1075 }; | 1075 }; |
1076 | 1076 |
1077 // Export | 1077 // Export |
1078 return { | 1078 return { |
1079 DisplayManager: DisplayManager | 1079 DisplayManager: DisplayManager |
1080 }; | 1080 }; |
1081 }); | 1081 }); |
OLD | NEW |