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 46 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
57 var DESKTOP_ROW_PADDING = 15; | 57 var DESKTOP_ROW_PADDING = 15; |
58 | 58 |
59 /** | 59 /** |
60 * Minimal padding between user pod and virtual keyboard. | 60 * Minimal padding between user pod and virtual keyboard. |
61 * @type {number} | 61 * @type {number} |
62 * @const | 62 * @const |
63 */ | 63 */ |
64 var USER_POD_KEYBOARD_MIN_PADDING = 20; | 64 var USER_POD_KEYBOARD_MIN_PADDING = 20; |
65 | 65 |
66 /** | 66 /** |
67 * Whether to preselect the first pod automatically on login screen. | |
68 * @type {boolean} | |
69 * @const | |
70 */ | |
71 var PRESELECT_FIRST_POD = true; | |
72 | |
73 /** | |
74 * Maximum time for which the pod row remains hidden until all user images | 67 * Maximum time for which the pod row remains hidden until all user images |
75 * have been loaded. | 68 * have been loaded. |
76 * @type {number} | 69 * @type {number} |
77 * @const | 70 * @const |
78 */ | 71 */ |
79 var POD_ROW_IMAGES_LOAD_TIMEOUT_MS = 3000; | 72 var POD_ROW_IMAGES_LOAD_TIMEOUT_MS = 3000; |
80 | 73 |
81 /** | 74 /** |
82 * Public session help topic identifier. | 75 * Public session help topic identifier. |
83 * @type {number} | 76 * @type {number} |
(...skipping 1611 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1695 if (this.shouldShowApps_) { | 1688 if (this.shouldShowApps_) { |
1696 for (var i = 0; i < this.apps_.length; ++i) | 1689 for (var i = 0; i < this.apps_.length; ++i) |
1697 this.addUserPod(this.apps_[i]); | 1690 this.addUserPod(this.apps_[i]); |
1698 } | 1691 } |
1699 | 1692 |
1700 // Make sure we eventually show the pod row, even if some image is stuck. | 1693 // Make sure we eventually show the pod row, even if some image is stuck. |
1701 setTimeout(function() { | 1694 setTimeout(function() { |
1702 $('pod-row').classList.remove('images-loading'); | 1695 $('pod-row').classList.remove('images-loading'); |
1703 }, POD_ROW_IMAGES_LOAD_TIMEOUT_MS); | 1696 }, POD_ROW_IMAGES_LOAD_TIMEOUT_MS); |
1704 | 1697 |
1705 var isCrosAccountPicker = $('login-header-bar').signinUIState == | 1698 var isAccountPicker = $('login-header-bar').signinUIState == |
1706 SIGNIN_UI_STATE.ACCOUNT_PICKER; | 1699 SIGNIN_UI_STATE.ACCOUNT_PICKER; |
1707 var isDesktopUserManager = Oobe.getInstance().displayType == | |
1708 DISPLAY_TYPE.DESKTOP_USER_MANAGER; | |
1709 | 1700 |
1710 // Chrome OS: immediately recalculate pods layout only when current UI | 1701 // Immediately recalculate pods layout only when current UI is account |
1711 // is account picker. Otherwise postpone it. | 1702 // picker. Otherwise postpone it. |
1712 // Desktop: recalculate pods layout right away. | 1703 if (isAccountPicker) { |
1713 if (isDesktopUserManager || isCrosAccountPicker) { | |
1714 this.placePods_(); | 1704 this.placePods_(); |
| 1705 this.maybePreselectPod(); |
1715 | 1706 |
1716 // Without timeout changes in pods positions will be animated even | 1707 // Without timeout changes in pods positions will be animated even |
1717 // though it happened when 'flying-pods' class was disabled. | 1708 // though it happened when 'flying-pods' class was disabled. |
1718 setTimeout(function() { | 1709 setTimeout(function() { |
1719 Oobe.getInstance().toggleClass('flying-pods', true); | 1710 Oobe.getInstance().toggleClass('flying-pods', true); |
1720 }, 0); | 1711 }, 0); |
1721 | |
1722 // On desktop, don't pre-select a pod if it's the only one. | |
1723 if (isDesktopUserManager && this.pods.length == 1) | |
1724 this.focusPod(); | |
1725 else | |
1726 this.focusPod(this.preselectedPod); | |
1727 } else { | 1712 } else { |
1728 this.podPlacementPostponed_ = true; | 1713 this.podPlacementPostponed_ = true; |
1729 | 1714 |
1730 // Update [Cancel] button state. | 1715 // Update [Cancel] button state. |
1731 if ($('login-header-bar').signinUIState == | 1716 if ($('login-header-bar').signinUIState == |
1732 SIGNIN_UI_STATE.GAIA_SIGNIN && | 1717 SIGNIN_UI_STATE.GAIA_SIGNIN && |
1733 emptyPodRow && | 1718 emptyPodRow && |
1734 this.pods.length > 0) { | 1719 this.pods.length > 0) { |
1735 login.GaiaSigninScreen.updateCancelButtonState(); | 1720 login.GaiaSigninScreen.updateCancelButtonState(); |
1736 } | 1721 } |
(...skipping 194 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1931 var maxPodsNumber = columns * rows; | 1916 var maxPodsNumber = columns * rows; |
1932 var isDesktopUserManager = Oobe.getInstance().displayType == | 1917 var isDesktopUserManager = Oobe.getInstance().displayType == |
1933 DISPLAY_TYPE.DESKTOP_USER_MANAGER; | 1918 DISPLAY_TYPE.DESKTOP_USER_MANAGER; |
1934 var margin = isDesktopUserManager ? DESKTOP_MARGIN_BY_COLUMNS[columns] : | 1919 var margin = isDesktopUserManager ? DESKTOP_MARGIN_BY_COLUMNS[columns] : |
1935 MARGIN_BY_COLUMNS[columns]; | 1920 MARGIN_BY_COLUMNS[columns]; |
1936 this.parentNode.setPreferredSize( | 1921 this.parentNode.setPreferredSize( |
1937 this.columnsToWidth_(columns), this.rowsToHeight_(rows)); | 1922 this.columnsToWidth_(columns), this.rowsToHeight_(rows)); |
1938 var height = this.userPodHeight_; | 1923 var height = this.userPodHeight_; |
1939 var width = this.userPodWidth_; | 1924 var width = this.userPodWidth_; |
1940 this.pods.forEach(function(pod, index) { | 1925 this.pods.forEach(function(pod, index) { |
| 1926 if (index >= maxPodsNumber) { |
| 1927 pod.hidden = true; |
| 1928 return; |
| 1929 } |
| 1930 pod.hidden = false; |
1941 if (pod.offsetHeight != height) { | 1931 if (pod.offsetHeight != height) { |
1942 console.error('Pod offsetHeight (' + pod.offsetHeight + | 1932 console.error('Pod offsetHeight (' + pod.offsetHeight + |
1943 ') and POD_HEIGHT (' + height + ') are not equal.'); | 1933 ') and POD_HEIGHT (' + height + ') are not equal.'); |
1944 } | 1934 } |
1945 if (pod.offsetWidth != width) { | 1935 if (pod.offsetWidth != width) { |
1946 console.error('Pod offsetWidth (' + pod.offsetWidth + | 1936 console.error('Pod offsetWidth (' + pod.offsetWidth + |
1947 ') and POD_WIDTH (' + width + ') are not equal.'); | 1937 ') and POD_WIDTH (' + width + ') are not equal.'); |
1948 } | 1938 } |
1949 if (index >= maxPodsNumber) { | |
1950 pod.hidden = true; | |
1951 return; | |
1952 } | |
1953 pod.hidden = false; | |
1954 var column = index % columns; | 1939 var column = index % columns; |
1955 var row = Math.floor(index / columns); | 1940 var row = Math.floor(index / columns); |
1956 var rowPadding = isDesktopUserManager ? DESKTOP_ROW_PADDING : | 1941 var rowPadding = isDesktopUserManager ? DESKTOP_ROW_PADDING : |
1957 POD_ROW_PADDING; | 1942 POD_ROW_PADDING; |
1958 pod.left = rowPadding + column * (width + margin); | 1943 pod.left = rowPadding + column * (width + margin); |
1959 | 1944 |
1960 // On desktop, we want the rows to always be equally spaced. | 1945 // On desktop, we want the rows to always be equally spaced. |
1961 pod.top = isDesktopUserManager ? row * (height + rowPadding) : | 1946 pod.top = isDesktopUserManager ? row * (height + rowPadding) : |
1962 row * height + rowPadding; | 1947 row * height + rowPadding; |
1963 }); | 1948 }); |
(...skipping 148 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
2112 return pod; | 2097 return pod; |
2113 } | 2098 } |
2114 return null; | 2099 return null; |
2115 }, | 2100 }, |
2116 | 2101 |
2117 /** | 2102 /** |
2118 * The pod that is preselected on user pod row show. | 2103 * The pod that is preselected on user pod row show. |
2119 * @type {?UserPod} | 2104 * @type {?UserPod} |
2120 */ | 2105 */ |
2121 get preselectedPod() { | 2106 get preselectedPod() { |
| 2107 // On desktop, don't pre-select a pod if it's the only one. |
| 2108 var isDesktopUserManager = Oobe.getInstance().displayType == |
| 2109 DISPLAY_TYPE.DESKTOP_USER_MANAGER; |
| 2110 if (isDesktopUserManager && this.pods.length == 1) |
| 2111 return null; |
| 2112 |
2122 var lockedPod = this.lockedPod; | 2113 var lockedPod = this.lockedPod; |
2123 if (lockedPod || !PRESELECT_FIRST_POD) | 2114 if (lockedPod) |
2124 return lockedPod; | 2115 return lockedPod; |
2125 for (var i = 0, pod; pod = this.pods[i]; ++i) { | 2116 for (var i = 0, pod; pod = this.pods[i]; ++i) { |
2126 if (!pod.multiProfilesPolicyApplied) { | 2117 if (!pod.multiProfilesPolicyApplied) { |
2127 return pod; | 2118 return pod; |
2128 } | 2119 } |
2129 } | 2120 } |
2130 return this.pods[0]; | 2121 return this.pods[0]; |
2131 }, | 2122 }, |
2132 | 2123 |
2133 /** | 2124 /** |
(...skipping 236 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
2370 Oobe.getInstance().toggleClass('flying-pods', false); | 2361 Oobe.getInstance().toggleClass('flying-pods', false); |
2371 for (var event in this.listeners_) { | 2362 for (var event in this.listeners_) { |
2372 this.ownerDocument.addEventListener( | 2363 this.ownerDocument.addEventListener( |
2373 event, this.listeners_[event][0], this.listeners_[event][1]); | 2364 event, this.listeners_[event][0], this.listeners_[event][1]); |
2374 } | 2365 } |
2375 $('login-header-bar').buttonsTabIndex = UserPodTabOrder.HEADER_BAR; | 2366 $('login-header-bar').buttonsTabIndex = UserPodTabOrder.HEADER_BAR; |
2376 | 2367 |
2377 if (this.podPlacementPostponed_) { | 2368 if (this.podPlacementPostponed_) { |
2378 this.podPlacementPostponed_ = false; | 2369 this.podPlacementPostponed_ = false; |
2379 this.placePods_(); | 2370 this.placePods_(); |
2380 pod = this.preselectedPod; | 2371 this.maybePreselectPod(); |
2381 this.focusPod(pod); | |
2382 // Hide user-type-bubble in case all user pods are disabled and we focus | |
2383 // first pod. | |
2384 if (pod && pod.multiProfilesPolicyApplied) { | |
2385 pod.userTypeBubbleElement.classList.remove('bubble-shown'); | |
2386 } | |
2387 } | 2372 } |
2388 }, | 2373 }, |
2389 | 2374 |
2390 /** | 2375 /** |
2391 * Called when the element is hidden. | 2376 * Called when the element is hidden. |
2392 */ | 2377 */ |
2393 handleHide: function() { | 2378 handleHide: function() { |
2394 for (var event in this.listeners_) { | 2379 for (var event in this.listeners_) { |
2395 this.ownerDocument.removeEventListener( | 2380 this.ownerDocument.removeEventListener( |
2396 event, this.listeners_[event][0], this.listeners_[event][1]); | 2381 event, this.listeners_[event][0], this.listeners_[event][1]); |
2397 } | 2382 } |
2398 $('login-header-bar').buttonsTabIndex = 0; | 2383 $('login-header-bar').buttonsTabIndex = 0; |
2399 }, | 2384 }, |
2400 | 2385 |
2401 /** | 2386 /** |
2402 * Called when a pod's user image finishes loading. | 2387 * Called when a pod's user image finishes loading. |
2403 */ | 2388 */ |
2404 handlePodImageLoad: function(pod) { | 2389 handlePodImageLoad: function(pod) { |
2405 var index = this.podsWithPendingImages_.indexOf(pod); | 2390 var index = this.podsWithPendingImages_.indexOf(pod); |
2406 if (index == -1) { | 2391 if (index == -1) { |
2407 return; | 2392 return; |
2408 } | 2393 } |
2409 | 2394 |
2410 this.podsWithPendingImages_.splice(index, 1); | 2395 this.podsWithPendingImages_.splice(index, 1); |
2411 if (this.podsWithPendingImages_.length == 0) { | 2396 if (this.podsWithPendingImages_.length == 0) { |
2412 this.classList.remove('images-loading'); | 2397 this.classList.remove('images-loading'); |
2413 } | 2398 } |
2414 } | 2399 }, |
| 2400 |
| 2401 /** |
| 2402 * Preselects pod, if needed. |
| 2403 */ |
| 2404 maybePreselectPod: function() { |
| 2405 var pod = this.preselectedPod; |
| 2406 this.focusPod(pod); |
| 2407 |
| 2408 // Hide user-type-bubble in case all user pods are disabled and we focus |
| 2409 // first pod. |
| 2410 if (pod && pod.multiProfilesPolicyApplied) { |
| 2411 pod.userTypeBubbleElement.classList.remove('bubble-shown'); |
| 2412 } |
| 2413 } |
2415 }; | 2414 }; |
2416 | 2415 |
2417 return { | 2416 return { |
2418 PodRow: PodRow | 2417 PodRow: PodRow |
2419 }; | 2418 }; |
2420 }); | 2419 }); |
OLD | NEW |