chrome/browser/resources/user_manager/control_bar.js

   1 // Copyright 2013 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 /**
   6  * @fileoverview Desktop User Chooser UI control bar implementation.
   7  */
   8
   9 cr.define('login', function() {
  10   /**
  11    * Creates a header bar element.
  12    * @constructor
  13    * @extends {HTMLDivElement}
  14    */
  15   var HeaderBar = cr.ui.define('div');
  16
  17   HeaderBar.prototype = {
  18     __proto__: HTMLDivElement.prototype,
  19
  20     // Whether guest button should be shown when header bar is in normal mode.
  21     showGuest_: true,
  22
  23     // Current UI state of the sign-in screen.
  24     signinUIState_: SIGNIN_UI_STATE.ACCOUNT_PICKER,
  25
  26     // Whether to show kiosk apps menu.
  27     hasApps_: false,
  28
  29     /** @override */
  30     decorate: function() {
  31       $('add-user-button').addEventListener('click',
  32           this.handleAddUserClick_);
  33       $('cancel-add-user-button').addEventListener('click',
  34           this.handleCancelAddUserClick_);
  35       $('guest-user-header-bar-item').addEventListener('click',
  36           this.handleGuestClick_);
  37       $('guest-user-button').addEventListener('click',
  38           this.handleGuestClick_);
  39       this.updateUI_();
  40     },
  41
  42     /**
  43      * Tab index value for all button elements.
  44      * @type {number}
  45      */
  46     set buttonsTabIndex(tabIndex) {
  47       var buttons = this.getElementsByTagName('button');
  48       for (var i = 0, button; button = buttons[i]; ++i) {
  49         button.tabIndex = tabIndex;
  50       }
  51     },
  52
  53     /**
  54      * Disables the header bar and all of its elements.
  55      * @type {boolean}
  56      */
  57     set disabled(value) {
  58       var buttons = this.getElementsByTagName('button');
  59       for (var i = 0, button; button = buttons[i]; ++i)
  60         if (!button.classList.contains('button-restricted'))
  61           button.disabled = value;
  62     },
  63
  64     /**
  65      * Add user button click handler.
  66      * @private
  67      */
  68     handleAddUserClick_: function(e) {
  69       chrome.send('addUser');
  70       // Prevent further propagation of click event. Otherwise, the click event
  71       // handler of document object will set wallpaper to user's wallpaper when
  72       // there is only one existing user. See http://crbug.com/166477
  73       e.stopPropagation();
  74     },
  75
  76     /**
  77      * Cancel add user button click handler.
  78      * @private
  79      */
  80     handleCancelAddUserClick_: function(e) {
  81       // Let screen handle cancel itself if that is capable of doing so.
  82       if (Oobe.getInstance().currentScreen &&
  83           Oobe.getInstance().currentScreen.cancel) {
  84         Oobe.getInstance().currentScreen.cancel();
  85         return;
  86       }
  87
  88       Oobe.showScreen({id: SCREEN_ACCOUNT_PICKER});
  89       Oobe.resetSigninUI(true);
  90     },
  91
  92     /**
  93      * Guest button click handler.
  94      * @private
  95      */
  96     handleGuestClick_: function(e) {
  97       chrome.send('launchGuest');
  98       e.stopPropagation();
  99     },
 100
 101     /**
 102      * If true then "Browse as Guest" button is shown.
 103      * @type {boolean}
 104      */
 105     set showGuestButton(value) {
 106       this.showGuest_ = value;
 107       this.updateUI_();
 108     },
 109
 110     /**
 111      * Update current header bar UI.
 112      * @type {number} state Current state of the sign-in screen
 113      *                      (see SIGNIN_UI_STATE).
 114      */
 115     set signinUIState(state) {
 116       this.signinUIState_ = state;
 117       this.updateUI_();
 118     },
 119
 120     /**
 121      * Whether the Cancel button is enabled during Gaia sign-in.
 122      * @type {boolean}
 123      */
 124     set allowCancel(value) {
 125       this.allowCancel_ = value;
 126       this.updateUI_();
 127     },
 128
 129     /**
 130      * Updates visibility state of action buttons.
 131      * @private
 132      */
 133     updateUI_: function() {
 134       $('add-user-button').hidden = false;
 135       $('cancel-add-user-button').hidden = !this.allowCancel_;
 136       $('guest-user-header-bar-item').hidden = false;
 137       $('add-user-header-bar-item').hidden = false;
 138     },
 139
 140     /**
 141      * Animates Header bar to hide from the screen.
 142      * @param {function()} callback will be called once animation is finished.
 143      */
 144     animateOut: function(callback) {
 145       var launcher = this;
 146       launcher.addEventListener(
 147           'webkitTransitionEnd', function f(e) {
 148             launcher.removeEventListener('webkitTransitionEnd', f);
 149             callback();
 150           });
 151       this.classList.remove('login-header-bar-animate-slow');
 152       this.classList.add('login-header-bar-animate-fast');
 153       this.classList.add('login-header-bar-hidden');
 154     },
 155
 156     /**
 157      * Animates Header bar to slowly appear on the screen.
 158      */
 159     animateIn: function() {
 160       this.classList.remove('login-header-bar-animate-fast');
 161       this.classList.add('login-header-bar-animate-slow');
 162       this.classList.remove('login-header-bar-hidden');
 163     },
 164   };
 165
 166   /**
 167    * Convenience wrapper of animateOut.
 168    */
 169   HeaderBar.animateOut = function(callback) {
 170     $('login-header-bar').animateOut(callback);
 171   };
 172
 173   /**
 174    * Convenience wrapper of animateIn.
 175    */
 176   HeaderBar.animateIn = function() {
 177     $('login-header-bar').animateIn();
 178   }
 179
 180   return {
 181     HeaderBar: HeaderBar
 182   };
 183 });