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.HIDDEN,
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      $('guest-user-header-bar-item').addEventListener('click',
34          this.handleGuestClick_);
35      $('guest-user-button').addEventListener('click',
36          this.handleGuestClick_);
37      this.updateUI_();
38    },
39
40    /**
41     * Tab index value for all button elements.
42     * @type {number}
43     */
44    set buttonsTabIndex(tabIndex) {
45      var buttons = this.getElementsByTagName('button');
46      for (var i = 0, button; button = buttons[i]; ++i) {
47        button.tabIndex = tabIndex;
48      }
49    },
50
51    /**
52     * Disables the header bar and all of its elements.
53     * @type {boolean}
54     */
55    set disabled(value) {
56      var buttons = this.getElementsByTagName('button');
57      for (var i = 0, button; button = buttons[i]; ++i)
58        if (!button.classList.contains('button-restricted'))
59          button.disabled = value;
60    },
61
62    /**
63     * Add user button click handler.
64     * @private
65     */
66    handleAddUserClick_: function(e) {
67      chrome.send('addUser');
68      // Prevent further propagation of click event. Otherwise, the click event
69      // handler of document object will set wallpaper to user's wallpaper when
70      // there is only one existing user. See http://crbug.com/166477
71      e.stopPropagation();
72    },
73
74    /**
75     * Cancel add user button click handler.
76     * @private
77     */
78    handleCancelAddUserClick_: function(e) {
79      // Let screen handle cancel itself if that is capable of doing so.
80      if (Oobe.getInstance().currentScreen &&
81          Oobe.getInstance().currentScreen.cancel) {
82        Oobe.getInstance().currentScreen.cancel();
83        return;
84      }
85
86      Oobe.showScreen({id: SCREEN_ACCOUNT_PICKER});
87      Oobe.resetSigninUI(true);
88    },
89
90    /**
91     * Guest button click handler.
92     * @private
93     */
94    handleGuestClick_: function(e) {
95      chrome.send('launchGuest');
96      e.stopPropagation();
97    },
98
99    /**
100     * If true then "Browse as Guest" button is shown.
101     * @type {boolean}
102     */
103    set showGuestButton(value) {
104      this.showGuest_ = value;
105      this.updateUI_();
106    },
107
108    /**
109     * Update current header bar UI.
110     * @type {number} state Current state of the sign-in screen
111     *                      (see SIGNIN_UI_STATE).
112     */
113    set signinUIState(state) {
114      this.signinUIState_ = state;
115      this.updateUI_();
116    },
117
118    get signinUIState() {
119      return this.signinUIState_;
120    },
121
122    /**
123     * Whether the Cancel button is enabled during Gaia sign-in.
124     * @type {boolean}
125     */
126    set allowCancel(value) {
127      this.allowCancel_ = value;
128      this.updateUI_();
129    },
130
131    /**
132     * Updates visibility state of action buttons.
133     * @private
134     */
135    updateUI_: function() {
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