OLD | NEW |
---|---|
1 // Copyright 2014 The Chromium Authors. All rights reserved. | 1 // Copyright 2014 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 User pod row implementation. | 6 * @fileoverview User pod row implementation. |
7 */ | 7 */ |
8 | 8 |
9 cr.define('login', function() { | 9 cr.define('login', function() { |
10 /** | 10 /** |
(...skipping 182 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
193 {id: 'locked', class: 'custom-icon-locked'}, | 193 {id: 'locked', class: 'custom-icon-locked'}, |
194 {id: 'unlocked', class: 'custom-icon-unlocked'}, | 194 {id: 'unlocked', class: 'custom-icon-unlocked'}, |
195 {id: 'hardlocked', class: 'custom-icon-hardlocked'}, | 195 {id: 'hardlocked', class: 'custom-icon-hardlocked'}, |
196 {id: 'spinner', class: 'custom-icon-spinner'} | 196 {id: 'spinner', class: 'custom-icon-spinner'} |
197 ]; | 197 ]; |
198 | 198 |
199 UserPodCustomIcon.prototype = { | 199 UserPodCustomIcon.prototype = { |
200 __proto__: HTMLDivElement.prototype, | 200 __proto__: HTMLDivElement.prototype, |
201 | 201 |
202 /** | 202 /** |
203 * The id of the icon being shown. | |
204 * @type {string} | |
205 * @private | |
206 */ | |
207 iconId_: '', | |
208 | |
209 /** | |
203 * Tooltip to be shown when the user hovers over the icon. The icon | 210 * Tooltip to be shown when the user hovers over the icon. The icon |
204 * properties may be set so the tooltip is shown automatically when the icon | 211 * properties may be set so the tooltip is shown automatically when the icon |
205 * is updated. The tooltip is shown in a bubble attached to the icon | 212 * is updated. The tooltip is shown in a bubble attached to the icon |
206 * element. | 213 * element. |
207 * @type {string} | 214 * @type {string} |
208 * @private | 215 * @private |
209 */ | 216 */ |
210 tooltip_: '', | 217 tooltip_: '', |
211 | 218 |
212 /** | 219 /** |
(...skipping 66 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
279 return this.querySelector('.custom-icon'); | 286 return this.querySelector('.custom-icon'); |
280 }, | 287 }, |
281 | 288 |
282 /** | 289 /** |
283 * Updates the icon element class list to properly represent the provided | 290 * Updates the icon element class list to properly represent the provided |
284 * icon. | 291 * icon. |
285 * @param {!string} id The id of the icon that should be shown. Should be | 292 * @param {!string} id The id of the icon that should be shown. Should be |
286 * one of the ids listed in {@code UserPodCustomIcon.ICONS}. | 293 * one of the ids listed in {@code UserPodCustomIcon.ICONS}. |
287 */ | 294 */ |
288 setIcon: function(id) { | 295 setIcon: function(id) { |
296 this.iconId_ = id; | |
289 UserPodCustomIcon.ICONS.forEach(function(icon) { | 297 UserPodCustomIcon.ICONS.forEach(function(icon) { |
290 this.iconElement.classList.toggle(icon.class, id == icon.id); | 298 this.iconElement.classList.toggle(icon.class, id == icon.id); |
291 }, this); | 299 }, this); |
292 }, | 300 }, |
293 | 301 |
294 /** | 302 /** |
295 * Shows the icon. | 303 * Shows the icon. |
296 */ | 304 */ |
297 show: function() { | 305 show: function() { |
298 this.resetHideTransitionState_(); | 306 this.resetHideTransitionState_(); |
(...skipping 166 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
465 | 473 |
466 // If autoshown bubble got hidden, clear the autoshown flag. | 474 // If autoshown bubble got hidden, clear the autoshown flag. |
467 if ($('bubble').hidden && this.tooltipAutoshown_) | 475 if ($('bubble').hidden && this.tooltipAutoshown_) |
468 this.tooltipAutoshown_ = false; | 476 this.tooltipAutoshown_ = false; |
469 | 477 |
470 // Show the tooltip bubble. | 478 // Show the tooltip bubble. |
471 var bubbleContent = document.createElement('div'); | 479 var bubbleContent = document.createElement('div'); |
472 bubbleContent.textContent = this.tooltip_; | 480 bubbleContent.textContent = this.tooltip_; |
473 | 481 |
474 /** @const */ var BUBBLE_OFFSET = CUSTOM_ICON_CONTAINER_SIZE / 2; | 482 /** @const */ var BUBBLE_OFFSET = CUSTOM_ICON_CONTAINER_SIZE / 2; |
475 /** @const */ var BUBBLE_PADDING = 8; | 483 // TODO(tengs): Introduce a special reauth state for the account picker, |
Nikita (slow)
2014/10/27 15:15:10
nit: Makes sense to mention crbug issue # here.
Tim Song
2014/10/31 17:57:37
Done.
| |
484 // instead of showing the tooltip bubble here. | |
485 /** @const */ var BUBBLE_PADDING = 8 + (this.iconId_ ? 0 : 23); | |
476 $('bubble').showContentForElement(this, | 486 $('bubble').showContentForElement(this, |
477 cr.ui.Bubble.Attachment.RIGHT, | 487 cr.ui.Bubble.Attachment.RIGHT, |
478 bubbleContent, | 488 bubbleContent, |
479 BUBBLE_OFFSET, | 489 BUBBLE_OFFSET, |
480 BUBBLE_PADDING); | 490 BUBBLE_PADDING); |
481 this.ensureTooltipTimeoutCleared_(); | 491 this.ensureTooltipTimeoutCleared_(); |
482 this.tooltipActive_ = true; | 492 this.tooltipActive_ = true; |
483 }, | 493 }, |
484 | 494 |
485 /** | 495 /** |
(...skipping 1764 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
2250 * The icon parameters. | 2260 * The icon parameters. |
2251 */ | 2261 */ |
2252 showUserPodCustomIcon: function(username, icon) { | 2262 showUserPodCustomIcon: function(username, icon) { |
2253 var pod = this.getPodWithUsername_(username); | 2263 var pod = this.getPodWithUsername_(username); |
2254 if (pod == null) { | 2264 if (pod == null) { |
2255 console.error('Unable to show user pod button for ' + username + | 2265 console.error('Unable to show user pod button for ' + username + |
2256 ': user pod not found.'); | 2266 ': user pod not found.'); |
2257 return; | 2267 return; |
2258 } | 2268 } |
2259 | 2269 |
2260 if (!icon.id) | 2270 if (!icon.id && !icon.tooltip) |
2261 return; | 2271 return; |
2262 | 2272 |
2263 pod.customIconElement.setIcon(icon.id); | 2273 if (icon.id) |
2274 pod.customIconElement.setIcon(icon.id); | |
2264 | 2275 |
2265 if (icon.hardlockOnClick) { | 2276 if (icon.hardlockOnClick) { |
2266 pod.customIconElement.setInteractive( | 2277 pod.customIconElement.setInteractive( |
2267 this.hardlockUserPod_.bind(this, username)); | 2278 this.hardlockUserPod_.bind(this, username)); |
2268 } else { | 2279 } else { |
2269 pod.customIconElement.setInteractive(null); | 2280 pod.customIconElement.setInteractive(null); |
2270 } | 2281 } |
2271 | 2282 |
2272 pod.customIconElement.show(); | 2283 pod.customIconElement.show(); |
2273 | 2284 |
(...skipping 671 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
2945 if (pod && pod.multiProfilesPolicyApplied) { | 2956 if (pod && pod.multiProfilesPolicyApplied) { |
2946 pod.userTypeBubbleElement.classList.remove('bubble-shown'); | 2957 pod.userTypeBubbleElement.classList.remove('bubble-shown'); |
2947 } | 2958 } |
2948 } | 2959 } |
2949 }; | 2960 }; |
2950 | 2961 |
2951 return { | 2962 return { |
2952 PodRow: PodRow | 2963 PodRow: PodRow |
2953 }; | 2964 }; |
2954 }); | 2965 }); |
OLD | NEW |