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

Side by Side Diff: chrome/browser/resources/user_chooser/control_bar.js

Issue 16104008: First try at a user management screen for the desktop (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: fix linux CrOS browser test Created 7 years, 5 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
OLDNEW
1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. 1 // Copyright (c) 2013 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 Desktop User Chooser UI control bar implementation.
7 */ 7 */
8 8
9 cr.define('login', function() { 9 cr.define('login', function() {
10 /** 10 /**
11 * Creates a header bar element. 11 * Creates a header bar element.
12 * @constructor 12 * @constructor
13 * @extends {HTMLDivElement} 13 * @extends {HTMLDivElement}
14 */ 14 */
15 var HeaderBar = cr.ui.define('div'); 15 var HeaderBar = cr.ui.define('div');
16 16
17 HeaderBar.prototype = { 17 HeaderBar.prototype = {
18 __proto__: HTMLDivElement.prototype, 18 __proto__: HTMLDivElement.prototype,
19 19
20 // 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.
21 showGuest_: false, 21 showGuest_: true,
22 22
23 // Current UI state of the sign-in screen. 23 // Current UI state of the sign-in screen.
24 signinUIState_: SIGNIN_UI_STATE.HIDDEN, 24 signinUIState_: SIGNIN_UI_STATE.ACCOUNT_PICKER,
25 25
26 // Whether to show kiosk apps menu. 26 // Whether to show kiosk apps menu.
27 hasApps_: false, 27 hasApps_: false,
28 28
29 /** @override */ 29 /** @override */
30 decorate: function() { 30 decorate: function() {
31 $('shutdown-header-bar-item').addEventListener('click',
32 this.handleShutdownClick_);
33 $('shutdown-button').addEventListener('click',
34 this.handleShutdownClick_);
35 $('add-user-button').addEventListener('click', 31 $('add-user-button').addEventListener('click',
36 this.handleAddUserClick_); 32 this.handleAddUserClick_);
37 $('cancel-add-user-button').addEventListener('click', 33 $('cancel-add-user-button').addEventListener('click',
38 this.handleCancelAddUserClick_); 34 this.handleCancelAddUserClick_);
39 $('guest-user-header-bar-item').addEventListener('click', 35 $('guest-user-header-bar-item').addEventListener('click',
40 this.handleGuestClick_); 36 this.handleGuestClick_);
41 $('guest-user-button').addEventListener('click', 37 $('guest-user-button').addEventListener('click',
42 this.handleGuestClick_); 38 this.handleGuestClick_);
43 $('sign-out-user-button').addEventListener('click', 39 this.updateUI_();
44 this.handleSignoutClick_);
45 $('cancel-multiple-sign-in-button').addEventListener('click',
46 this.handleCancelMultipleSignInClick_);
47
48 if (document.documentElement.getAttribute('screen') == 'login')
49 login.AppsMenuButton.decorate($('show-apps-button'));
50 }, 40 },
51 41
52 /** 42 /**
53 * Tab index value for all button elements. 43 * Tab index value for all button elements.
54 * @type {number} 44 * @type {number}
55 */ 45 */
56 set buttonsTabIndex(tabIndex) { 46 set buttonsTabIndex(tabIndex) {
57 var buttons = this.getElementsByTagName('button'); 47 var buttons = this.getElementsByTagName('button');
58 for (var i = 0, button; button = buttons[i]; ++i) { 48 for (var i = 0, button; button = buttons[i]; ++i) {
59 button.tabIndex = tabIndex; 49 button.tabIndex = tabIndex;
60 } 50 }
61 }, 51 },
62 52
63 /** 53 /**
64 * Disables the header bar and all of its elements. 54 * Disables the header bar and all of its elements.
65 * @type {boolean} 55 * @type {boolean}
66 */ 56 */
67 set disabled(value) { 57 set disabled(value) {
68 var buttons = this.getElementsByTagName('button'); 58 var buttons = this.getElementsByTagName('button');
69 for (var i = 0, button; button = buttons[i]; ++i) 59 for (var i = 0, button; button = buttons[i]; ++i)
70 if (!button.classList.contains('button-restricted')) 60 if (!button.classList.contains('button-restricted'))
71 button.disabled = value; 61 button.disabled = value;
72 }, 62 },
73 63
74 /** 64 /**
75 * Add user button click handler. 65 * Add user button click handler.
76 * @private 66 * @private
77 */ 67 */
78 handleAddUserClick_: function(e) { 68 handleAddUserClick_: function(e) {
79 Oobe.showSigninUI(); 69 chrome.send('addUser');
80 // Prevent further propagation of click event. Otherwise, the click event 70 // Prevent further propagation of click event. Otherwise, the click event
81 // handler of document object will set wallpaper to user's wallpaper when 71 // handler of document object will set wallpaper to user's wallpaper when
82 // there is only one existing user. See http://crbug.com/166477 72 // there is only one existing user. See http://crbug.com/166477
83 e.stopPropagation(); 73 e.stopPropagation();
84 }, 74 },
85 75
86 /** 76 /**
87 * Cancel add user button click handler. 77 * Cancel add user button click handler.
88 * @private 78 * @private
89 */ 79 */
90 handleCancelAddUserClick_: function(e) { 80 handleCancelAddUserClick_: function(e) {
91 // Let screen handle cancel itself if that is capable of doing so. 81 // Let screen handle cancel itself if that is capable of doing so.
92 if (Oobe.getInstance().currentScreen && 82 if (Oobe.getInstance().currentScreen &&
93 Oobe.getInstance().currentScreen.cancel) { 83 Oobe.getInstance().currentScreen.cancel) {
94 Oobe.getInstance().currentScreen.cancel(); 84 Oobe.getInstance().currentScreen.cancel();
95 return; 85 return;
96 } 86 }
97 87
98 $('pod-row').loadLastWallpaper();
99
100 Oobe.showScreen({id: SCREEN_ACCOUNT_PICKER}); 88 Oobe.showScreen({id: SCREEN_ACCOUNT_PICKER});
101 Oobe.resetSigninUI(true); 89 Oobe.resetSigninUI(true);
102 }, 90 },
103 91
104 /** 92 /**
105 * Guest button click handler. 93 * Guest button click handler.
106 * @private 94 * @private
107 */ 95 */
108 handleGuestClick_: function(e) { 96 handleGuestClick_: function(e) {
109 Oobe.disableSigninUI(); 97 chrome.send('launchGuest');
110 chrome.send('launchIncognito');
111 e.stopPropagation(); 98 e.stopPropagation();
112 }, 99 },
113 100
114 /**
115 * Sign out button click handler.
116 * @private
117 */
118 handleSignoutClick_: function(e) {
119 this.disabled = true;
120 chrome.send('signOutUser');
121 e.stopPropagation();
122 },
123
124 /**
125 * Shutdown button click handler.
126 * @private
127 */
128 handleShutdownClick_: function(e) {
129 chrome.send('shutdownSystem');
130 e.stopPropagation();
131 },
132
133 /**
134 * Cancel user adding button handler.
135 * @private
136 */
137 handleCancelMultipleSignInClick_: function(e) {
138 chrome.send('cancelUserAdding');
139 e.stopPropagation();
140 },
141
142 /** 101 /**
143 * If true then "Browse as Guest" button is shown. 102 * If true then "Browse as Guest" button is shown.
144 * @type {boolean} 103 * @type {boolean}
145 */ 104 */
146 set showGuestButton(value) { 105 set showGuestButton(value) {
147 this.showGuest_ = value; 106 this.showGuest_ = value;
148 this.updateUI_(); 107 this.updateUI_();
149 }, 108 },
150 109
151 /** 110 /**
152 * Update current header bar UI. 111 * Update current header bar UI.
153 * @type {number} state Current state of the sign-in screen 112 * @type {number} state Current state of the sign-in screen
154 * (see SIGNIN_UI_STATE). 113 * (see SIGNIN_UI_STATE).
155 */ 114 */
156 set signinUIState(state) { 115 set signinUIState(state) {
157 this.signinUIState_ = state; 116 this.signinUIState_ = state;
158 this.updateUI_(); 117 this.updateUI_();
159 }, 118 },
160 119
161 /** 120 /**
162 * Whether the Cancel button is enabled during Gaia sign-in. 121 * Whether the Cancel button is enabled during Gaia sign-in.
163 * @type {boolean} 122 * @type {boolean}
164 */ 123 */
165 set allowCancel(value) { 124 set allowCancel(value) {
166 this.allowCancel_ = value; 125 this.allowCancel_ = value;
167 this.updateUI_(); 126 this.updateUI_();
168 }, 127 },
169 128
170 /** 129 /**
171 * Update whether there are kiosk apps.
172 * @type {boolean}
173 */
174 set hasApps(value) {
175 this.hasApps_ = value;
176 this.updateUI_();
177 },
178
179 /**
180 * Updates visibility state of action buttons. 130 * Updates visibility state of action buttons.
181 * @private 131 * @private
182 */ 132 */
183 updateUI_: function() { 133 updateUI_: function() {
184 var gaiaIsActive = (this.signinUIState_ == SIGNIN_UI_STATE.GAIA_SIGNIN); 134 $('add-user-button').hidden = false;
185 var accountPickerIsActive = 135 $('cancel-add-user-button').hidden = !this.allowCancel_;
186 (this.signinUIState_ == SIGNIN_UI_STATE.ACCOUNT_PICKER); 136 $('guest-user-header-bar-item').hidden = false;
187 var managedUserCreationDialogIsActive = 137 $('add-user-header-bar-item').hidden = false;
188 (this.signinUIState_ == SIGNIN_UI_STATE.MANAGED_USER_CREATION_FLOW);
189 var wrongHWIDWarningIsActive =
190 (this.signinUIState_ == SIGNIN_UI_STATE.WRONG_HWID_WARNING);
191 var isMultiProfilesUI = Oobe.getInstance().isSignInToAddScreen();
192
193 $('add-user-button').hidden = !accountPickerIsActive || isMultiProfilesUI;
194 $('cancel-add-user-button').hidden = accountPickerIsActive ||
195 !this.allowCancel_ ||
196 wrongHWIDWarningIsActive ||
197 isMultiProfilesUI;
198 $('guest-user-header-bar-item').hidden = gaiaIsActive ||
199 managedUserCreationDialogIsActive ||
200 !this.showGuest_ ||
201 wrongHWIDWarningIsActive ||
202 isMultiProfilesUI;
203 $('add-user-header-bar-item').hidden =
204 $('add-user-button').hidden && $('cancel-add-user-button').hidden;
205 $('apps-header-bar-item').hidden = !this.hasApps_ ||
206 (!gaiaIsActive && !accountPickerIsActive);
207 $('cancel-multiple-sign-in-item').hidden = !isMultiProfilesUI;
208
209 if (!$('apps-header-bar-item').hidden)
210 $('show-apps-button').didShow();
211 }, 138 },
212 139
213 /** 140 /**
214 * Animates Header bar to hide from the screen. 141 * Animates Header bar to hide from the screen.
215 * @param {function()} callback will be called once animation is finished. 142 * @param {function()} callback will be called once animation is finished.
216 */ 143 */
217 animateOut: function(callback) { 144 animateOut: function(callback) {
218 var launcher = this; 145 var launcher = this;
219 launcher.addEventListener( 146 launcher.addEventListener(
220 'webkitTransitionEnd', function f(e) { 147 'webkitTransitionEnd', function f(e) {
(...skipping 26 matching lines...) Expand all
247 * Convenience wrapper of animateIn. 174 * Convenience wrapper of animateIn.
248 */ 175 */
249 HeaderBar.animateIn = function() { 176 HeaderBar.animateIn = function() {
250 $('login-header-bar').animateIn(); 177 $('login-header-bar').animateIn();
251 } 178 }
252 179
253 return { 180 return {
254 HeaderBar: HeaderBar 181 HeaderBar: HeaderBar
255 }; 182 };
256 }); 183 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698