| 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 Login UI header bar implementation. | 6 * @fileoverview Login UI header bar implementation. |
| 7 */ | 7 */ |
| 8 | 8 |
| 9 cr.define('login', function() { | 9 cr.define('login', function() { |
| 10 /** | 10 /** |
| (...skipping 31 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 42 // button issues a request to move lock screen apps to background, in the | 42 // button issues a request to move lock screen apps to background, in the |
| 43 // state where account picker is visible). | 43 // state where account picker is visible). |
| 44 lockScreenAppsState_: LOCK_SCREEN_APPS_STATE.NONE, | 44 lockScreenAppsState_: LOCK_SCREEN_APPS_STATE.NONE, |
| 45 | 45 |
| 46 // Whether to show kiosk apps menu. | 46 // Whether to show kiosk apps menu. |
| 47 hasApps_: false, | 47 hasApps_: false, |
| 48 | 48 |
| 49 /** @override */ | 49 /** @override */ |
| 50 decorate: function() { | 50 decorate: function() { |
| 51 document.addEventListener('click', this.handleClick_.bind(this)); | 51 document.addEventListener('click', this.handleClick_.bind(this)); |
| 52 $('shutdown-header-bar-item').addEventListener('click', | 52 $('shutdown-header-bar-item') |
| 53 this.handleShutdownClick_); | 53 .addEventListener('click', this.handleShutdownClick_); |
| 54 $('shutdown-button').addEventListener('click', | 54 $('shutdown-button').addEventListener('click', this.handleShutdownClick_); |
| 55 this.handleShutdownClick_); | 55 $('restart-header-bar-item') |
| 56 $('restart-header-bar-item').addEventListener('click', | 56 .addEventListener('click', this.handleShutdownClick_); |
| 57 this.handleShutdownClick_); | 57 $('restart-button').addEventListener('click', this.handleShutdownClick_); |
| 58 $('restart-button').addEventListener('click', | 58 $('add-user-button').addEventListener('click', this.handleAddUserClick_); |
| 59 this.handleShutdownClick_); | 59 $('more-settings-button') |
| 60 $('add-user-button').addEventListener('click', | 60 .addEventListener('click', this.handleMoreSettingsClick_.bind(this)); |
| 61 this.handleAddUserClick_); | 61 $('guest-user-header-bar-item') |
| 62 $('more-settings-button').addEventListener('click', | 62 .addEventListener('click', this.handleGuestClick_); |
| 63 this.handleMoreSettingsClick_.bind(this)); | 63 $('guest-user-button').addEventListener('click', this.handleGuestClick_); |
| 64 $('guest-user-header-bar-item').addEventListener('click', | 64 $('sign-out-user-button') |
| 65 this.handleGuestClick_); | 65 .addEventListener('click', this.handleSignoutClick_); |
| 66 $('guest-user-button').addEventListener('click', | 66 $('cancel-multiple-sign-in-button') |
| 67 this.handleGuestClick_); | 67 .addEventListener('click', this.handleCancelMultipleSignInClick_); |
| 68 $('sign-out-user-button').addEventListener('click', | 68 $('unlock-user-button') |
| 69 this.handleSignoutClick_); | 69 .addEventListener('click', this.handleUnlockUserClick_); |
| 70 $('cancel-multiple-sign-in-button').addEventListener('click', | 70 this.addSupervisedUserMenu.addEventListener( |
| 71 this.handleCancelMultipleSignInClick_); | 71 'click', this.handleAddSupervisedUserClick_.bind(this)); |
| 72 $('unlock-user-button').addEventListener('click', | 72 this.addSupervisedUserMenu.addEventListener( |
| 73 this.handleUnlockUserClick_); | 73 'keydown', this.handleAddSupervisedUserKeyDown_.bind(this)); |
| 74 this.addSupervisedUserMenu.addEventListener('click', | |
| 75 this.handleAddSupervisedUserClick_.bind(this)); | |
| 76 this.addSupervisedUserMenu.addEventListener('keydown', | |
| 77 this.handleAddSupervisedUserKeyDown_.bind(this)); | |
| 78 if (Oobe.getInstance().displayType == DISPLAY_TYPE.LOGIN || | 74 if (Oobe.getInstance().displayType == DISPLAY_TYPE.LOGIN || |
| 79 Oobe.getInstance().displayType == DISPLAY_TYPE.OOBE) { | 75 Oobe.getInstance().displayType == DISPLAY_TYPE.OOBE) { |
| 80 if (Oobe.getInstance().newKioskUI) | 76 if (Oobe.getInstance().newKioskUI) |
| 81 chrome.send('initializeKioskApps'); | 77 chrome.send('initializeKioskApps'); |
| 82 else | 78 else |
| 83 login.AppsMenuButton.decorate($('show-apps-button')); | 79 login.AppsMenuButton.decorate($('show-apps-button')); |
| 84 } | 80 } |
| 85 this.updateUI_(); | 81 this.updateUI_(); |
| 86 }, | 82 }, |
| 87 | 83 |
| (...skipping 146 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 234 } | 230 } |
| 235 }, | 231 }, |
| 236 | 232 |
| 237 /** | 233 /** |
| 238 * Unlock user button handler. Sends a request to Chrome to show user pods | 234 * Unlock user button handler. Sends a request to Chrome to show user pods |
| 239 * in foreground. | 235 * in foreground. |
| 240 * | 236 * |
| 241 * @private | 237 * @private |
| 242 */ | 238 */ |
| 243 handleUnlockUserClick_: function(e) { | 239 handleUnlockUserClick_: function(e) { |
| 244 chrome.send('setLockScreenAppsState', | 240 chrome.send( |
| 245 [LOCK_SCREEN_APPS_STATE.BACKGROUND]); | 241 'setLockScreenAppsState', [LOCK_SCREEN_APPS_STATE.BACKGROUND]); |
| 246 e.preventDefault(); | 242 e.preventDefault(); |
| 247 }, | 243 }, |
| 248 | 244 |
| 249 /** | 245 /** |
| 250 * If true then "Browse as Guest" button is shown. | 246 * If true then "Browse as Guest" button is shown. |
| 251 * | 247 * |
| 252 * @type {boolean} | 248 * @type {boolean} |
| 253 */ | 249 */ |
| 254 set showGuestButton(value) { | 250 set showGuestButton(value) { |
| 255 this.showGuest_ = value; | 251 this.showGuest_ = value; |
| (...skipping 65 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 321 * @private | 317 * @private |
| 322 */ | 318 */ |
| 323 updateUI_: function() { | 319 updateUI_: function() { |
| 324 var gaiaIsActive = (this.signinUIState_ == SIGNIN_UI_STATE.GAIA_SIGNIN); | 320 var gaiaIsActive = (this.signinUIState_ == SIGNIN_UI_STATE.GAIA_SIGNIN); |
| 325 var enrollmentIsActive = | 321 var enrollmentIsActive = |
| 326 (this.signinUIState_ == SIGNIN_UI_STATE.ENROLLMENT); | 322 (this.signinUIState_ == SIGNIN_UI_STATE.ENROLLMENT); |
| 327 var accountPickerIsActive = | 323 var accountPickerIsActive = |
| 328 (this.signinUIState_ == SIGNIN_UI_STATE.ACCOUNT_PICKER); | 324 (this.signinUIState_ == SIGNIN_UI_STATE.ACCOUNT_PICKER); |
| 329 var supervisedUserCreationDialogIsActive = | 325 var supervisedUserCreationDialogIsActive = |
| 330 (this.signinUIState_ == | 326 (this.signinUIState_ == |
| 331 SIGNIN_UI_STATE.SUPERVISED_USER_CREATION_FLOW); | 327 SIGNIN_UI_STATE.SUPERVISED_USER_CREATION_FLOW); |
| 332 var wrongHWIDWarningIsActive = | 328 var wrongHWIDWarningIsActive = |
| 333 (this.signinUIState_ == SIGNIN_UI_STATE.WRONG_HWID_WARNING); | 329 (this.signinUIState_ == SIGNIN_UI_STATE.WRONG_HWID_WARNING); |
| 334 var isSamlPasswordConfirm = | 330 var isSamlPasswordConfirm = |
| 335 (this.signinUIState_ == SIGNIN_UI_STATE.SAML_PASSWORD_CONFIRM); | 331 (this.signinUIState_ == SIGNIN_UI_STATE.SAML_PASSWORD_CONFIRM); |
| 336 var isPasswordChangedUI = | 332 var isPasswordChangedUI = |
| 337 (this.signinUIState_ == SIGNIN_UI_STATE.PASSWORD_CHANGED); | 333 (this.signinUIState_ == SIGNIN_UI_STATE.PASSWORD_CHANGED); |
| 338 var isMultiProfilesUI = | 334 var isMultiProfilesUI = |
| 339 (Oobe.getInstance().displayType == DISPLAY_TYPE.USER_ADDING); | 335 (Oobe.getInstance().displayType == DISPLAY_TYPE.USER_ADDING); |
| 340 var isLockScreen = | 336 var isLockScreen = (Oobe.getInstance().displayType == DISPLAY_TYPE.LOCK); |
| 341 (Oobe.getInstance().displayType == DISPLAY_TYPE.LOCK); | 337 var errorScreenIsActive = (this.signinUIState_ == SIGNIN_UI_STATE.ERROR); |
| 342 var errorScreenIsActive = | |
| 343 (this.signinUIState_ == SIGNIN_UI_STATE.ERROR); | |
| 344 | 338 |
| 345 $('add-user-button').hidden = | 339 $('add-user-button').hidden = !accountPickerIsActive || |
| 346 !accountPickerIsActive || | 340 isMultiProfilesUI || isLockScreen || errorScreenIsActive; |
| 347 isMultiProfilesUI || | 341 $('more-settings-header-bar-item').hidden = !this.showCreateSupervised_ || |
| 348 isLockScreen || | 342 gaiaIsActive || isLockScreen || errorScreenIsActive || |
| 349 errorScreenIsActive; | |
| 350 $('more-settings-header-bar-item').hidden = | |
| 351 !this.showCreateSupervised_ || | |
| 352 gaiaIsActive || | |
| 353 isLockScreen || | |
| 354 errorScreenIsActive || | |
| 355 supervisedUserCreationDialogIsActive; | 343 supervisedUserCreationDialogIsActive; |
| 356 $('guest-user-header-bar-item').hidden = | 344 $('guest-user-header-bar-item').hidden = !this.showGuest_ || |
| 357 !this.showGuest_ || | 345 isLockScreen || supervisedUserCreationDialogIsActive || |
| 358 isLockScreen || | 346 wrongHWIDWarningIsActive || isSamlPasswordConfirm || |
| 359 supervisedUserCreationDialogIsActive || | 347 isMultiProfilesUI || (gaiaIsActive && $('gaia-signin').closable) || |
| 360 wrongHWIDWarningIsActive || | |
| 361 isSamlPasswordConfirm || | |
| 362 isMultiProfilesUI || | |
| 363 (gaiaIsActive && $('gaia-signin').closable) || | |
| 364 (enrollmentIsActive && !$('oauth-enrollment').isAtTheBeginning()) || | 348 (enrollmentIsActive && !$('oauth-enrollment').isAtTheBeginning()) || |
| 365 (gaiaIsActive && !$('gaia-signin').isAtTheBeginning()); | 349 (gaiaIsActive && !$('gaia-signin').isAtTheBeginning()); |
| 366 $('restart-header-bar-item').hidden = | 350 $('restart-header-bar-item').hidden = !this.showReboot_ || |
| 367 !this.showReboot_ || | |
| 368 this.lockScreenAppsState_ == LOCK_SCREEN_APPS_STATE.FOREGROUND; | 351 this.lockScreenAppsState_ == LOCK_SCREEN_APPS_STATE.FOREGROUND; |
| 369 $('shutdown-header-bar-item').hidden = | 352 $('shutdown-header-bar-item').hidden = !this.showShutdown_ || |
| 370 !this.showShutdown_ || | |
| 371 this.lockScreenAppsState_ == LOCK_SCREEN_APPS_STATE.FOREGROUND; | 353 this.lockScreenAppsState_ == LOCK_SCREEN_APPS_STATE.FOREGROUND; |
| 372 $('sign-out-user-item').hidden = | 354 $('sign-out-user-item').hidden = !isLockScreen || |
| 373 !isLockScreen || | |
| 374 this.lockScreenAppsState_ == LOCK_SCREEN_APPS_STATE.FOREGROUND; | 355 this.lockScreenAppsState_ == LOCK_SCREEN_APPS_STATE.FOREGROUND; |
| 375 $('unlock-user-header-bar-item').hidden = | 356 $('unlock-user-header-bar-item').hidden = !isLockScreen || |
| 376 !isLockScreen || | |
| 377 this.lockScreenAppsState_ != LOCK_SCREEN_APPS_STATE.FOREGROUND; | 357 this.lockScreenAppsState_ != LOCK_SCREEN_APPS_STATE.FOREGROUND; |
| 378 | 358 |
| 379 $('add-user-header-bar-item').hidden = $('add-user-button').hidden; | 359 $('add-user-header-bar-item').hidden = $('add-user-button').hidden; |
| 380 $('apps-header-bar-item').hidden = !this.hasApps_ || | 360 $('apps-header-bar-item').hidden = |
| 381 (!gaiaIsActive && !accountPickerIsActive); | 361 !this.hasApps_ || (!gaiaIsActive && !accountPickerIsActive); |
| 382 $('cancel-multiple-sign-in-item').hidden = !isMultiProfilesUI; | 362 $('cancel-multiple-sign-in-item').hidden = !isMultiProfilesUI; |
| 383 | 363 |
| 384 if (!Oobe.getInstance().newKioskUI) { | 364 if (!Oobe.getInstance().newKioskUI) { |
| 385 if (!$('apps-header-bar-item').hidden) | 365 if (!$('apps-header-bar-item').hidden) |
| 386 $('show-apps-button').didShow(); | 366 $('show-apps-button').didShow(); |
| 387 } | 367 } |
| 388 | 368 |
| 389 // Lock screen apps are generally shown maximized - update the header | 369 // Lock screen apps are generally shown maximized - update the header |
| 390 // bar background opacity so the wallpaper is not visible behind it ( | 370 // bar background opacity so the wallpaper is not visible behind it ( |
| 391 // since it won't be visible in the rest of UI). | 371 // since it won't be visible in the rest of UI). |
| 392 this.classList.toggle( | 372 this.classList.toggle( |
| 393 'full-header-background', | 373 'full-header-background', |
| 394 this.lockScreenAppsState_ != LOCK_SCREEN_APPS_STATE.NONE); | 374 this.lockScreenAppsState_ != LOCK_SCREEN_APPS_STATE.NONE); |
| 395 }, | 375 }, |
| 396 | 376 |
| 397 /** | 377 /** |
| 398 * Animates Header bar to hide from the screen. | 378 * Animates Header bar to hide from the screen. |
| 399 * | 379 * |
| 400 * @param {function()} callback will be called once animation is finished. | 380 * @param {function()} callback will be called once animation is finished. |
| 401 */ | 381 */ |
| 402 animateOut: function(callback) { | 382 animateOut: function(callback) { |
| 403 var launcher = this; | 383 var launcher = this; |
| 404 launcher.addEventListener( | 384 launcher.addEventListener('transitionend', function f(e) { |
| 405 'transitionend', function f(e) { | 385 launcher.removeEventListener('transitionend', f); |
| 406 launcher.removeEventListener('transitionend', f); | 386 callback(); |
| 407 callback(); | 387 }); |
| 408 }); | |
| 409 // Guard timer for 2 seconds + 200 ms + epsilon. | 388 // Guard timer for 2 seconds + 200 ms + epsilon. |
| 410 ensureTransitionEndEvent(launcher, 2250); | 389 ensureTransitionEndEvent(launcher, 2250); |
| 411 | 390 |
| 412 this.classList.remove('login-header-bar-animate-slow'); | 391 this.classList.remove('login-header-bar-animate-slow'); |
| 413 this.classList.add('login-header-bar-animate-fast'); | 392 this.classList.add('login-header-bar-animate-fast'); |
| 414 this.classList.add('login-header-bar-hidden'); | 393 this.classList.add('login-header-bar-hidden'); |
| 415 }, | 394 }, |
| 416 | 395 |
| 417 /** | 396 /** |
| 418 * Animates Header bar to appear on the screen. | 397 * Animates Header bar to appear on the screen. |
| 419 * | 398 * |
| 420 * @param {boolean} fast Whether the animation should complete quickly or | 399 * @param {boolean} fast Whether the animation should complete quickly or |
| 421 * slowly. | 400 * slowly. |
| 422 * @param {function()} callback will be called once animation is finished. | 401 * @param {function()} callback will be called once animation is finished. |
| 423 */ | 402 */ |
| 424 animateIn: function(fast, callback) { | 403 animateIn: function(fast, callback) { |
| 425 if (callback) { | 404 if (callback) { |
| 426 var launcher = this; | 405 var launcher = this; |
| 427 launcher.addEventListener( | 406 launcher.addEventListener('transitionend', function f(e) { |
| 428 'transitionend', function f(e) { | 407 launcher.removeEventListener('transitionend', f); |
| 429 launcher.removeEventListener('transitionend', f); | 408 callback(); |
| 430 callback(); | 409 }); |
| 431 }); | |
| 432 // Guard timer for 2 seconds + 200 ms + epsilon. | 410 // Guard timer for 2 seconds + 200 ms + epsilon. |
| 433 ensureTransitionEndEvent(launcher, 2250); | 411 ensureTransitionEndEvent(launcher, 2250); |
| 434 } | 412 } |
| 435 | 413 |
| 436 if (fast) { | 414 if (fast) { |
| 437 this.classList.remove('login-header-bar-animate-slow'); | 415 this.classList.remove('login-header-bar-animate-slow'); |
| 438 this.classList.add('login-header-bar-animate-fast'); | 416 this.classList.add('login-header-bar-animate-fast'); |
| 439 } else { | 417 } else { |
| 440 this.classList.remove('login-header-bar-animate-fast'); | 418 this.classList.remove('login-header-bar-animate-fast'); |
| 441 this.classList.add('login-header-bar-animate-slow'); | 419 this.classList.add('login-header-bar-animate-slow'); |
| (...skipping 10 matching lines...) Expand all Loading... |
| 452 $('login-header-bar').animateOut(callback); | 430 $('login-header-bar').animateOut(callback); |
| 453 }; | 431 }; |
| 454 | 432 |
| 455 /** | 433 /** |
| 456 * Convenience wrapper of animateIn. | 434 * Convenience wrapper of animateIn. |
| 457 */ | 435 */ |
| 458 HeaderBar.animateIn = function(fast, callback) { | 436 HeaderBar.animateIn = function(fast, callback) { |
| 459 $('login-header-bar').animateIn(fast, callback); | 437 $('login-header-bar').animateIn(fast, callback); |
| 460 }; | 438 }; |
| 461 | 439 |
| 462 return { | 440 return {HeaderBar: HeaderBar}; |
| 463 HeaderBar: HeaderBar | |
| 464 }; | |
| 465 }); | 441 }); |
| OLD | NEW |