Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(326)

Side by Side Diff: chrome/browser/resources/chromeos/login/header_bar.js

Issue 11672007: Fixed header bar UI behaviour. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: Style fix. Created 7 years, 12 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
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 // Network state constants.
11 /** @const */ var NET_STATE = {
12 OFFLINE: 0,
13 ONLINE: 1,
14 PORTAL: 2
15 };
16
17 /** 10 /**
18 * Creates a header bar element. 11 * Creates a header bar element.
19 * @constructor 12 * @constructor
20 * @extends {HTMLDivElement} 13 * @extends {HTMLDivElement}
21 */ 14 */
22 var HeaderBar = cr.ui.define('div'); 15 var HeaderBar = cr.ui.define('div');
23 16
24 HeaderBar.prototype = { 17 HeaderBar.prototype = {
25 __proto__: HTMLDivElement.prototype, 18 __proto__: HTMLDivElement.prototype,
26 19
27 // Whether guest button should be shown when header bar is in normal mode. 20 // Whether guest button should be shown when header bar is in normal mode.
28 showGuest_: false, 21 showGuest_: false,
29 22
23 // Current UI state of the sign-in screen.
24 signinUIState_: SIGNIN_UI_STATE.HIDDEN,
25
30 /** @override */ 26 /** @override */
31 decorate: function() { 27 decorate: function() {
32 $('shutdown-header-bar-item').addEventListener('click', 28 $('shutdown-header-bar-item').addEventListener('click',
33 this.handleShutdownClick_); 29 this.handleShutdownClick_);
34 $('shutdown-button').addEventListener('click', 30 $('shutdown-button').addEventListener('click',
35 this.handleShutdownClick_); 31 this.handleShutdownClick_);
36 $('add-user-button').addEventListener('click', 32 $('add-user-button').addEventListener('click',
37 this.handleAddUserClick_); 33 this.handleAddUserClick_);
38 $('cancel-add-user-button').addEventListener('click', 34 $('cancel-add-user-button').addEventListener('click',
39 this.handleCancelAddUserClick_); 35 this.handleCancelAddUserClick_);
(...skipping 89 matching lines...) Expand 10 before | Expand all | Expand 10 after
129 /** 125 /**
130 * If true then "Browse as Guest" button is shown. 126 * If true then "Browse as Guest" button is shown.
131 * @type {boolean} 127 * @type {boolean}
132 */ 128 */
133 set showGuestButton(value) { 129 set showGuestButton(value) {
134 this.showGuest_ = value; 130 this.showGuest_ = value;
135 this.updateUI_(); 131 this.updateUI_();
136 }, 132 },
137 133
138 /** 134 /**
139 * If true then sign in UI is active and header controls 135 * Update current header bar UI.
140 * should change accordingly. 136 * @param {number} state Current state of the sign-in screen (see
dpolukhin 2012/12/28 12:00:09 Please use @type {number}.
ygorshenin1 2012/12/28 12:04:54 Done.
141 * @type {boolean} 137 * SIGNIN_UI_STATE).
142 */ 138 */
143 set signinUIActive(value) { 139 set signinUIState(state) {
144 this.signinUIActive_ = value; 140 console.error('set signinUIState(' + state + ')');
141 this.signinUIState_ = state;
145 this.updateUI_(); 142 this.updateUI_();
146 }, 143 },
147 144
148 /** 145 /**
149 * Whether the Cancel button is enabled during Gaia sign-in. 146 * Whether the Cancel button is enabled during Gaia sign-in.
150 * @type {boolean} 147 * @type {boolean}
151 */ 148 */
152 set allowCancel(value) { 149 set allowCancel(value) {
153 this.allowCancel_ = value; 150 this.allowCancel_ = value;
154 this.updateUI_(); 151 this.updateUI_();
155 }, 152 },
156 153
157 /** 154 /**
158 * Updates visibility state of action buttons. 155 * Updates visibility state of action buttons.
159 * @private 156 * @private
160 */ 157 */
161 updateUI_: function() { 158 updateUI_: function() {
162 $('add-user-button').hidden = this.signinUIActive_; 159 console.error('updateUI_: signinUIState_=' + this.signinUIState_);
163 $('cancel-add-user-button').hidden = 160 var gaiaIsActive = (this.signinUIState_ == SIGNIN_UI_STATE.GAIA_SIGNIN);
164 !this.signinUIActive_ || !this.allowCancel_; 161 var accountPickerIsActive =
165 $('guest-user-header-bar-item').hidden = 162 (this.signinUIState_ == SIGNIN_UI_STATE.ACCOUNT_PICKER);
166 this.signinUIActive_ || !this.showGuest_; 163
164 $('add-user-button').hidden = !accountPickerIsActive;
165 $('cancel-add-user-button').hidden = accountPickerIsActive ||
166 !this.allowCancel_;
167 $('guest-user-header-bar-item').hidden = gaiaIsActive || !this.showGuest_;
167 $('add-user-header-bar-item').hidden = 168 $('add-user-header-bar-item').hidden =
168 $('add-user-button').hidden && $('cancel-add-user-button').hidden; 169 $('add-user-button').hidden && $('cancel-add-user-button').hidden;
169 }, 170 },
170 171
171 /** 172 /**
172 * Animates Header bar to hide from the screen. 173 * Animates Header bar to hide from the screen.
173 * @param {function()} callback will be called once animation is finished. 174 * @param {function()} callback will be called once animation is finished.
174 */ 175 */
175 animateOut: function(callback) { 176 animateOut: function(callback) {
176 var launcher = this; 177 var launcher = this;
(...skipping 14 matching lines...) Expand all
191 this.classList.remove('login-header-bar-animate-fast'); 192 this.classList.remove('login-header-bar-animate-fast');
192 this.classList.add('login-header-bar-animate-slow'); 193 this.classList.add('login-header-bar-animate-slow');
193 this.classList.remove('login-header-bar-hidden'); 194 this.classList.remove('login-header-bar-hidden');
194 }, 195 },
195 }; 196 };
196 197
197 return { 198 return {
198 HeaderBar: HeaderBar 199 HeaderBar: HeaderBar
199 }; 200 };
200 }); 201 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698