• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
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
9cr.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});
184