| 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 |