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 /** | 5 /** |
6 * @fileoverview Oobe user image screen implementation. | 6 * @fileoverview Oobe user image screen implementation. |
7 */ | 7 */ |
8 | 8 |
9 cr.define('login', function() { | 9 cr.define('login', function() { |
10 var UserImagesGrid = options.UserImagesGrid; | 10 var UserImagesGrid = options.UserImagesGrid; |
(...skipping 43 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
54 __proto__: login.Screen.prototype, | 54 __proto__: login.Screen.prototype, |
55 | 55 |
56 /** | 56 /** |
57 * Currently selected user image index (take photo button is with zero | 57 * Currently selected user image index (take photo button is with zero |
58 * index). | 58 * index). |
59 * @type {number} | 59 * @type {number} |
60 */ | 60 */ |
61 selectedUserImage_: -1, | 61 selectedUserImage_: -1, |
62 | 62 |
63 /** | 63 /** |
64 * Indicates if profile picture should be displayed on current screen. | |
65 */ | |
66 profilePictureEnabled_: false, | |
67 | |
68 /** | |
69 * URL for profile picture. | 64 * URL for profile picture. |
70 */ | 65 */ |
71 profileImageUrl_: null, | 66 profileImageUrl_: null, |
72 | 67 |
73 /** @override */ | 68 /** @override */ |
74 decorate: function(element) { | 69 decorate: function(element) { |
75 var imageGrid = $('user-image-grid'); | 70 var imageGrid = $('user-image-grid'); |
76 UserImagesGrid.decorate(imageGrid); | 71 UserImagesGrid.decorate(imageGrid); |
77 | 72 |
78 // Preview image will track the selected item's URL. | 73 // Preview image will track the selected item's URL. |
(...skipping 11 matching lines...) Expand all Loading... |
90 imageGrid.addEventListener('phototaken', | 85 imageGrid.addEventListener('phototaken', |
91 this.handlePhotoTaken_.bind(this)); | 86 this.handlePhotoTaken_.bind(this)); |
92 imageGrid.addEventListener('photoupdated', | 87 imageGrid.addEventListener('photoupdated', |
93 this.handlePhotoUpdated_.bind(this)); | 88 this.handlePhotoUpdated_.bind(this)); |
94 | 89 |
95 // Set the title for camera item in the grid. | 90 // Set the title for camera item in the grid. |
96 imageGrid.setCameraTitles( | 91 imageGrid.setCameraTitles( |
97 loadTimeData.getString('takePhoto'), | 92 loadTimeData.getString('takePhoto'), |
98 loadTimeData.getString('photoFromCamera')); | 93 loadTimeData.getString('photoFromCamera')); |
99 | 94 |
100 this.setProfilePictureEnabled_(true); | 95 this.profileImageLoading = true; |
101 | 96 |
102 this.profileImageLoading = true; | 97 // Profile image data (if present). |
| 98 this.profileImage_ = imageGrid.addItem( |
| 99 ButtonImages.PROFILE_PICTURE, // Image URL. |
| 100 loadTimeData.getString('profilePhoto'), // Title. |
| 101 undefined, // Click handler. |
| 102 0, // Position. |
| 103 function(el) { |
| 104 // Custom decorator for Profile image element. |
| 105 var spinner = el.ownerDocument.createElement('div'); |
| 106 spinner.className = 'spinner'; |
| 107 var spinnerBg = el.ownerDocument.createElement('div'); |
| 108 spinnerBg.className = 'spinner-bg'; |
| 109 spinnerBg.appendChild(spinner); |
| 110 el.appendChild(spinnerBg); |
| 111 el.id = 'profile-image'; |
| 112 }); |
| 113 this.profileImage_.type = 'profile'; |
103 | 114 |
104 $('take-photo').addEventListener( | 115 $('take-photo').addEventListener( |
105 'click', this.handleTakePhoto_.bind(this)); | 116 'click', this.handleTakePhoto_.bind(this)); |
106 $('discard-photo').addEventListener( | 117 $('discard-photo').addEventListener( |
107 'click', this.handleDiscardPhoto_.bind(this)); | 118 'click', this.handleDiscardPhoto_.bind(this)); |
108 | 119 |
109 // Toggle 'animation' class for the duration of WebKit transition. | 120 // Toggle 'animation' class for the duration of WebKit transition. |
110 $('flip-photo').addEventListener( | 121 $('flip-photo').addEventListener( |
111 'click', this.handleFlipPhoto_.bind(this)); | 122 'click', this.handleFlipPhoto_.bind(this)); |
112 $('user-image-stream-crop').addEventListener( | 123 $('user-image-stream-crop').addEventListener( |
(...skipping 229 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
342 setCameraPresent_: function(present) { | 353 setCameraPresent_: function(present) { |
343 $('user-image-grid').cameraPresent = present; | 354 $('user-image-grid').cameraPresent = present; |
344 }, | 355 }, |
345 | 356 |
346 /** | 357 /** |
347 * Controls the profile image as one of image options. | 358 * Controls the profile image as one of image options. |
348 * @param {enabled} Whether profile image option should be displayed. | 359 * @param {enabled} Whether profile image option should be displayed. |
349 * @private | 360 * @private |
350 */ | 361 */ |
351 setProfilePictureEnabled_: function(enabled) { | 362 setProfilePictureEnabled_: function(enabled) { |
352 if (this.profilePictureEnabled_ == enabled) | |
353 return; | |
354 this.profilePictureEnabled_ = enabled; | |
355 var imageGrid = $('user-image-grid'); | 363 var imageGrid = $('user-image-grid'); |
356 if (enabled) { | 364 if (enabled) { |
357 var url = ButtonImages.PROFILE_PICTURE; | |
358 if (!this.profileImageLoading && this.profileImageUrl_ !== null) { | |
359 url = this.profileImageUrl_; | |
360 } | |
361 // Profile image data (if present). | |
362 this.profileImage_ = imageGrid.addItem( | |
363 url, // Image URL. | |
364 loadTimeData.getString('profilePhoto'), // Title. | |
365 undefined, // Click handler. | |
366 0, // Position. | |
367 this.profileImageLoading ? function(el) { | |
368 // Custom decorator for Profile image element. | |
369 var spinner = el.ownerDocument.createElement('div'); | |
370 spinner.className = 'spinner'; | |
371 var spinnerBg = el.ownerDocument.createElement('div'); | |
372 spinnerBg.className = 'spinner-bg'; | |
373 spinnerBg.appendChild(spinner); | |
374 el.appendChild(spinnerBg); | |
375 el.id = 'profile-image'; | |
376 } : undefined); | |
377 this.profileImage_.type = 'profile'; | |
378 } else { | 365 } else { |
379 imageGrid.removeItem(this.profileImage_); | 366 imageGrid.removeItem(this.profileImage_); |
380 } | 367 } |
381 }, | 368 }, |
382 | 369 |
383 /** | 370 /** |
384 * Appends default images to the image grid. Should only be called once. | 371 * Appends default images to the image grid. Should only be called once. |
385 * @param {Array.<{url: string, author: string, website: string}>} images | 372 * @param {Array.<{url: string, author: string, website: string}>} images |
386 * An array of default images data, including URL, author and website. | 373 * An array of default images data, including URL, author and website. |
387 * @private | 374 * @private |
(...skipping 80 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
468 UserImageScreen[name] = function(value) { | 455 UserImageScreen[name] = function(value) { |
469 $('user-image')[name + '_'](value); | 456 $('user-image')[name + '_'](value); |
470 }; | 457 }; |
471 }); | 458 }); |
472 | 459 |
473 return { | 460 return { |
474 UserImageScreen: UserImageScreen | 461 UserImageScreen: UserImageScreen |
475 }; | 462 }; |
476 }); | 463 }); |
477 | 464 |
OLD | NEW |