| OLD | NEW |
| 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 <include src="wallpaper_loader.js"></include> |
| 6 |
| 5 /** | 7 /** |
| 6 * @fileoverview User pod row implementation. | 8 * @fileoverview User pod row implementation. |
| 7 */ | 9 */ |
| 8 | 10 |
| 9 cr.define('login', function() { | 11 cr.define('login', function() { |
| 10 /** | 12 /** |
| 11 * Number of displayed columns depending on user pod count. | 13 * Number of displayed columns depending on user pod count. |
| 12 * @type {Array.<number>} | 14 * @type {Array.<number>} |
| 13 * @const | 15 * @const |
| 14 */ | 16 */ |
| 15 var COLUMNS = [0, 1, 2, 3, 4, 5, 4, 4, 4, 5, 5, 6, 6, 5, 5, 6, 6, 6, 6]; | 17 var COLUMNS = [0, 1, 2, 3, 4, 5, 4, 4, 4, 5, 5, 6, 6, 5, 5, 6, 6, 6, 6]; |
| 16 | 18 |
| 17 /** | 19 /** |
| 18 * Whether to preselect the first pod automatically on login screen. | 20 * Whether to preselect the first pod automatically on login screen. |
| 19 * @type {boolean} | 21 * @type {boolean} |
| 20 * @const | 22 * @const |
| 21 */ | 23 */ |
| 22 var PRESELECT_FIRST_POD = true; | 24 var PRESELECT_FIRST_POD = true; |
| 23 | 25 |
| 24 /** | 26 /** |
| 25 * Wallpaper load delay in milliseconds. | |
| 26 * @type {number} | |
| 27 * @const | |
| 28 */ | |
| 29 var WALLPAPER_LOAD_DELAY_MS = 500; | |
| 30 | |
| 31 /** | |
| 32 * Wallpaper load delay in milliseconds. TODO(nkostylev): Tune this constant. | |
| 33 * @type {number} | |
| 34 * @const | |
| 35 */ | |
| 36 var WALLPAPER_BOOT_LOAD_DELAY_MS = 100; | |
| 37 | |
| 38 /** | |
| 39 * Maximum time for which the pod row remains hidden until all user images | 27 * Maximum time for which the pod row remains hidden until all user images |
| 40 * have been loaded. | 28 * have been loaded. |
| 41 * @type {number} | 29 * @type {number} |
| 42 * @const | 30 * @const |
| 43 */ | 31 */ |
| 44 var POD_ROW_IMAGES_LOAD_TIMEOUT_MS = 3000; | 32 var POD_ROW_IMAGES_LOAD_TIMEOUT_MS = 3000; |
| 45 | 33 |
| 46 /** | 34 /** |
| 47 * Public session help topic identifier. | 35 * Public session help topic identifier. |
| 48 * @type {number} | 36 * @type {number} |
| (...skipping 903 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 952 * @extends {HTMLDivElement} | 940 * @extends {HTMLDivElement} |
| 953 */ | 941 */ |
| 954 var PodRow = cr.ui.define('podrow'); | 942 var PodRow = cr.ui.define('podrow'); |
| 955 | 943 |
| 956 PodRow.prototype = { | 944 PodRow.prototype = { |
| 957 __proto__: HTMLDivElement.prototype, | 945 __proto__: HTMLDivElement.prototype, |
| 958 | 946 |
| 959 // Whether this user pod row is shown for the first time. | 947 // Whether this user pod row is shown for the first time. |
| 960 firstShown_: true, | 948 firstShown_: true, |
| 961 | 949 |
| 962 // Whether the initial wallpaper load after boot has been requested. Used | |
| 963 // only if |Oobe.getInstance().shouldLoadWallpaperOnBoot()| is true. | |
| 964 bootWallpaperLoaded_: false, | |
| 965 | |
| 966 // True if inside focusPod(). | 950 // True if inside focusPod(). |
| 967 insideFocusPod_: false, | 951 insideFocusPod_: false, |
| 968 | 952 |
| 969 // True if user pod has been activated with keyboard. | |
| 970 // In case of activation with keyboard we delay wallpaper change. | |
| 971 keyboardActivated_: false, | |
| 972 | |
| 973 // Focused pod. | 953 // Focused pod. |
| 974 focusedPod_: undefined, | 954 focusedPod_: undefined, |
| 975 | 955 |
| 976 // Activated pod, i.e. the pod of current login attempt. | 956 // Activated pod, i.e. the pod of current login attempt. |
| 977 activatedPod_: undefined, | 957 activatedPod_: undefined, |
| 978 | 958 |
| 979 // Pod that was most recently focused, if any. | 959 // Pod that was most recently focused, if any. |
| 980 lastFocusedPod_: undefined, | 960 lastFocusedPod_: undefined, |
| 981 | 961 |
| 982 // When moving through users quickly at login screen, set a timeout to | 962 // Note: created only in decorate() ! |
| 983 // prevent loading intermediate wallpapers. | 963 wallpaperLoader_: undefined, |
| 984 loadWallpaperTimeout_: null, | |
| 985 | 964 |
| 986 // Pods whose initial images haven't been loaded yet. | 965 // Pods whose initial images haven't been loaded yet. |
| 987 podsWithPendingImages_: [], | 966 podsWithPendingImages_: [], |
| 988 | 967 |
| 989 /** @override */ | 968 /** @override */ |
| 990 decorate: function() { | 969 decorate: function() { |
| 991 this.style.left = 0; | 970 this.style.left = 0; |
| 992 | 971 |
| 993 // Event listeners that are installed for the time period during which | 972 // Event listeners that are installed for the time period during which |
| 994 // the element is visible. | 973 // the element is visible. |
| 995 this.listeners_ = { | 974 this.listeners_ = { |
| 996 focus: [this.handleFocus_.bind(this), true /* useCapture */], | 975 focus: [this.handleFocus_.bind(this), true /* useCapture */], |
| 997 click: [this.handleClick_.bind(this), true], | 976 click: [this.handleClick_.bind(this), true], |
| 998 mousemove: [this.handleMouseMove_.bind(this), false], | 977 mousemove: [this.handleMouseMove_.bind(this), false], |
| 999 keydown: [this.handleKeyDown.bind(this), false] | 978 keydown: [this.handleKeyDown.bind(this), false] |
| 1000 }; | 979 }; |
| 980 this.wallpaperLoader_ = new login.WallpaperLoader(); |
| 1001 }, | 981 }, |
| 1002 | 982 |
| 1003 /** | 983 /** |
| 1004 * Returns all the pods in this pod row. | 984 * Returns all the pods in this pod row. |
| 1005 * @type {NodeList} | 985 * @type {NodeList} |
| 1006 */ | 986 */ |
| 1007 get pods() { | 987 get pods() { |
| 1008 return this.children; | 988 return this.children; |
| 1009 }, | 989 }, |
| 1010 | 990 |
| (...skipping 224 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 1235 return; | 1215 return; |
| 1236 } | 1216 } |
| 1237 | 1217 |
| 1238 // Make sure there's only one focusPod operation happening at a time. | 1218 // Make sure there's only one focusPod operation happening at a time. |
| 1239 if (this.insideFocusPod_) { | 1219 if (this.insideFocusPod_) { |
| 1240 this.keyboardActivated_ = false; | 1220 this.keyboardActivated_ = false; |
| 1241 return; | 1221 return; |
| 1242 } | 1222 } |
| 1243 this.insideFocusPod_ = true; | 1223 this.insideFocusPod_ = true; |
| 1244 | 1224 |
| 1245 clearTimeout(this.loadWallpaperTimeout_); | 1225 this.wallpaperLoader_.reset(); |
| 1246 for (var i = 0, pod; pod = this.pods[i]; ++i) { | 1226 for (var i = 0, pod; pod = this.pods[i]; ++i) { |
| 1247 if (!this.isSinglePod) { | 1227 if (!this.isSinglePod) { |
| 1248 pod.isActionBoxMenuActive = false; | 1228 pod.isActionBoxMenuActive = false; |
| 1249 } | 1229 } |
| 1250 if (pod != podToFocus) { | 1230 if (pod != podToFocus) { |
| 1251 pod.isActionBoxMenuHovered = false; | 1231 pod.isActionBoxMenuHovered = false; |
| 1252 pod.classList.remove('focused'); | 1232 pod.classList.remove('focused'); |
| 1253 pod.classList.remove('faded'); | 1233 pod.classList.remove('faded'); |
| 1254 pod.reset(false); | 1234 pod.reset(false); |
| 1255 } | 1235 } |
| 1256 } | 1236 } |
| 1257 | 1237 |
| 1258 // Clear any error messages for previous pod. | 1238 // Clear any error messages for previous pod. |
| 1259 if (!this.isFocused(podToFocus)) | 1239 if (!this.isFocused(podToFocus)) |
| 1260 Oobe.clearErrors(); | 1240 Oobe.clearErrors(); |
| 1261 | 1241 |
| 1262 var hadFocus = !!this.focusedPod_; | 1242 var hadFocus = !!this.focusedPod_; |
| 1263 this.focusedPod_ = podToFocus; | 1243 this.focusedPod_ = podToFocus; |
| 1264 if (podToFocus) { | 1244 if (podToFocus) { |
| 1265 podToFocus.classList.remove('faded'); | 1245 podToFocus.classList.remove('faded'); |
| 1266 podToFocus.classList.add('focused'); | 1246 podToFocus.classList.add('focused'); |
| 1267 podToFocus.reset(true); // Reset and give focus. | 1247 podToFocus.reset(true); // Reset and give focus. |
| 1268 chrome.send('focusPod', [podToFocus.user.emailAddress]); | 1248 chrome.send('focusPod', [podToFocus.user.emailAddress]); |
| 1269 if (hadFocus && this.keyboardActivated_) { | 1249 |
| 1270 // Delay wallpaper loading to let user tab through pods without lag. | 1250 this.wallpaperLoader_.scheduleLoad(podToFocus.user.emailAddress); |
| 1271 this.loadWallpaperTimeout_ = window.setTimeout( | |
| 1272 this.loadWallpaper_.bind(this), WALLPAPER_LOAD_DELAY_MS); | |
| 1273 } else if (!this.firstShown_) { | |
| 1274 // Load wallpaper immediately if there no pod was focused | |
| 1275 // previously, and it is not a boot into user pod list case. | |
| 1276 this.loadWallpaper_(); | |
| 1277 } | |
| 1278 this.firstShown_ = false; | 1251 this.firstShown_ = false; |
| 1279 this.lastFocusedPod_ = podToFocus; | 1252 this.lastFocusedPod_ = podToFocus; |
| 1280 } | 1253 } |
| 1281 this.insideFocusPod_ = false; | 1254 this.insideFocusPod_ = false; |
| 1282 this.keyboardActivated_ = false; | 1255 this.keyboardActivated_ = false; |
| 1283 }, | 1256 }, |
| 1284 | 1257 |
| 1285 /** | 1258 /** |
| 1286 * Loads wallpaper for the active user pod, if any. | |
| 1287 * @private | |
| 1288 */ | |
| 1289 loadWallpaper_: function() { | |
| 1290 if (this.focusedPod_) | |
| 1291 chrome.send('loadWallpaper', [this.focusedPod_.user.username]); | |
| 1292 }, | |
| 1293 | |
| 1294 /** | |
| 1295 * Resets wallpaper to the last active user's wallpaper, if any. | 1259 * Resets wallpaper to the last active user's wallpaper, if any. |
| 1296 */ | 1260 */ |
| 1297 loadLastWallpaper: function() { | 1261 loadLastWallpaper: function() { |
| 1298 if (this.lastFocusedPod_) | 1262 if (this.lastFocusedPod_) |
| 1299 chrome.send('loadWallpaper', [this.lastFocusedPod_.user.username]); | 1263 this.wallpaperLoader_.scheduleLoad(this.lastFocusedPod_.user.username); |
| 1300 }, | 1264 }, |
| 1301 | 1265 |
| 1302 /** | 1266 /** |
| 1267 * Handles 'onWallpaperLoaded' event. Recalculates statistics and |
| 1268 * [re]schedules next wallpaper load. |
| 1269 */ |
| 1270 onWallpaperLoaded: function(email) { |
| 1271 this.wallpaperLoader_.onWallpaperLoaded(email); |
| 1272 }, |
| 1273 |
| 1274 /** |
| 1303 * Returns the currently activated pod. | 1275 * Returns the currently activated pod. |
| 1304 * @type {UserPod} | 1276 * @type {UserPod} |
| 1305 */ | 1277 */ |
| 1306 get activatedPod() { | 1278 get activatedPod() { |
| 1307 return this.activatedPod_; | 1279 return this.activatedPod_; |
| 1308 }, | 1280 }, |
| 1309 set activatedPod(pod) { | 1281 set activatedPod(pod) { |
| 1310 if (pod && pod.activate()) | 1282 if (pod && pod.activate()) |
| 1311 this.activatedPod_ = pod; | 1283 this.activatedPod_ = pod; |
| 1312 }, | 1284 }, |
| (...skipping 240 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 1553 if (this.focusedPod_) { | 1525 if (this.focusedPod_) { |
| 1554 var focusedPod = this.focusedPod_; | 1526 var focusedPod = this.focusedPod_; |
| 1555 var screen = this.parentNode; | 1527 var screen = this.parentNode; |
| 1556 var self = this; | 1528 var self = this; |
| 1557 focusedPod.addEventListener('webkitTransitionEnd', function f(e) { | 1529 focusedPod.addEventListener('webkitTransitionEnd', function f(e) { |
| 1558 if (e.target == focusedPod) { | 1530 if (e.target == focusedPod) { |
| 1559 focusedPod.removeEventListener('webkitTransitionEnd', f); | 1531 focusedPod.removeEventListener('webkitTransitionEnd', f); |
| 1560 focusedPod.reset(true); | 1532 focusedPod.reset(true); |
| 1561 // Notify screen that it is ready. | 1533 // Notify screen that it is ready. |
| 1562 screen.onShow(); | 1534 screen.onShow(); |
| 1563 // Boot transition: load wallpaper. | 1535 self.wallpaperLoader_.scheduleLoad(focusedPod.user.username); |
| 1564 if (!self.bootWallpaperLoaded_ && | |
| 1565 Oobe.getInstance().shouldLoadWallpaperOnBoot()) { | |
| 1566 self.loadWallpaperTimeout_ = window.setTimeout( | |
| 1567 self.loadWallpaper_.bind(self), WALLPAPER_BOOT_LOAD_DELAY_MS); | |
| 1568 self.bootWallpaperLoaded_ = true; | |
| 1569 } | |
| 1570 } | 1536 } |
| 1571 }); | 1537 }); |
| 1572 } | 1538 } |
| 1573 }, | 1539 }, |
| 1574 | 1540 |
| 1575 /** | 1541 /** |
| 1576 * Called right before the pod row is shown. | 1542 * Called right before the pod row is shown. |
| 1577 */ | 1543 */ |
| 1578 handleBeforeShow: function() { | 1544 handleBeforeShow: function() { |
| 1579 for (var event in this.listeners_) { | 1545 for (var event in this.listeners_) { |
| (...skipping 27 matching lines...) Expand all Loading... |
| 1607 if (this.podsWithPendingImages_.length == 0) { | 1573 if (this.podsWithPendingImages_.length == 0) { |
| 1608 this.classList.remove('images-loading'); | 1574 this.classList.remove('images-loading'); |
| 1609 } | 1575 } |
| 1610 } | 1576 } |
| 1611 }; | 1577 }; |
| 1612 | 1578 |
| 1613 return { | 1579 return { |
| 1614 PodRow: PodRow | 1580 PodRow: PodRow |
| 1615 }; | 1581 }; |
| 1616 }); | 1582 }); |
| OLD | NEW |