Chromium Code Reviews| 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 90 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 101 | 101 |
| 102 this.profileImageLoading = true; | 102 this.profileImageLoading = true; |
| 103 | 103 |
| 104 $('take-photo').addEventListener( | 104 $('take-photo').addEventListener( |
| 105 'click', this.handleTakePhoto_.bind(this)); | 105 'click', this.handleTakePhoto_.bind(this)); |
| 106 $('discard-photo').addEventListener( | 106 $('discard-photo').addEventListener( |
| 107 'click', this.handleDiscardPhoto_.bind(this)); | 107 'click', this.handleDiscardPhoto_.bind(this)); |
| 108 | 108 |
| 109 // Toggle 'animation' class for the duration of WebKit transition. | 109 // Toggle 'animation' class for the duration of WebKit transition. |
| 110 $('flip-photo').addEventListener( | 110 $('flip-photo').addEventListener( |
| 111 'click', function(e) { | 111 'click', this.handleFlipPhoto_.bind(this)); |
| 112 previewElement.classList.add('animation'); | |
| 113 imageGrid.flipPhoto = !imageGrid.flipPhoto; | |
| 114 }); | |
| 115 $('user-image-stream-crop').addEventListener( | 112 $('user-image-stream-crop').addEventListener( |
| 116 'webkitTransitionEnd', function(e) { | 113 'webkitTransitionEnd', function(e) { |
| 117 previewElement.classList.remove('animation'); | 114 previewElement.classList.remove('animation'); |
| 118 }); | 115 }); |
| 119 $('user-image-preview-img').addEventListener( | 116 $('user-image-preview-img').addEventListener( |
| 120 'webkitTransitionEnd', function(e) { | 117 'webkitTransitionEnd', function(e) { |
| 121 previewElement.classList.remove('animation'); | 118 previewElement.classList.remove('animation'); |
| 122 }); | 119 }); |
| 123 | 120 |
| 124 this.updateLocalizedContent(); | 121 this.updateLocalizedContent(); |
| (...skipping 66 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 191 * Handles selection change. | 188 * Handles selection change. |
| 192 * @param {Event} e Selection change event. | 189 * @param {Event} e Selection change event. |
| 193 * @private | 190 * @private |
| 194 */ | 191 */ |
| 195 handleSelect_: function(e) { | 192 handleSelect_: function(e) { |
| 196 var imageGrid = $('user-image-grid'); | 193 var imageGrid = $('user-image-grid'); |
| 197 $('ok-button').disabled = false; | 194 $('ok-button').disabled = false; |
| 198 | 195 |
| 199 // Camera selection | 196 // Camera selection |
| 200 if (imageGrid.selectionType == 'camera') { | 197 if (imageGrid.selectionType == 'camera') { |
| 201 $('flip-photo').tabIndex = 0; | 198 $('flip-photo').tabIndex = 1; |
| 202 // No current image selected. | 199 // No current image selected. |
| 203 if (imageGrid.cameraLive) { | 200 if (imageGrid.cameraLive) { |
| 204 imageGrid.previewElement.classList.remove('phototaken'); | 201 imageGrid.previewElement.classList.remove('phototaken'); |
| 205 $('ok-button').disabled = true; | 202 $('ok-button').disabled = true; |
| 206 } else { | 203 } else { |
| 207 imageGrid.previewElement.classList.add('phototaken'); | 204 imageGrid.previewElement.classList.add('phototaken'); |
| 208 this.notifyImageSelected_(); | 205 this.notifyImageSelected_(); |
| 209 } | 206 } |
| 210 } else { | 207 } else { |
| 211 imageGrid.previewElement.classList.remove('phototaken'); | 208 imageGrid.previewElement.classList.remove('phototaken'); |
| (...skipping 23 matching lines...) Expand all Loading... | |
| 235 // Update image attribution text. | 232 // Update image attribution text. |
| 236 var image = imageGrid.selectedItem; | 233 var image = imageGrid.selectedItem; |
| 237 $('user-image-author-name').textContent = image.author; | 234 $('user-image-author-name').textContent = image.author; |
| 238 $('user-image-author-website').textContent = image.website; | 235 $('user-image-author-website').textContent = image.website; |
| 239 $('user-image-author-website').href = image.website; | 236 $('user-image-author-website').href = image.website; |
| 240 $('user-image-attribution').style.visibility = | 237 $('user-image-attribution').style.visibility = |
| 241 (image.author || image.website) ? 'visible' : 'hidden'; | 238 (image.author || image.website) ? 'visible' : 'hidden'; |
| 242 }, | 239 }, |
| 243 | 240 |
| 244 /** | 241 /** |
| 242 * Handle camera-photo flip. | |
| 243 */ | |
| 244 handleFlipPhoto_: function() { | |
| 245 var imageGrid = $('user-image-grid'); | |
| 246 imageGrid.previewElement.classList.add('animation'); | |
| 247 imageGrid.flipPhoto = !imageGrid.flipPhoto; | |
| 248 var flipMessageId = imageGrid.flipPhoto ? | |
| 249 'photoFlippedAccessibleText' : 'photoFlippedBackAccessibleText'; | |
| 250 this.announceAccessibleMessage_( | |
| 251 loadTimeData.getString(flipMessageId)); | |
|
Nikita (slow)
2014/02/14 11:13:30
nit: indent
| |
| 252 }, | |
| 253 | |
| 254 /** | |
| 245 * Handle photo capture from the live camera stream. | 255 * Handle photo capture from the live camera stream. |
| 246 */ | 256 */ |
| 247 handleTakePhoto_: function(e) { | 257 handleTakePhoto_: function(e) { |
| 248 $('user-image-grid').takePhoto(); | 258 $('user-image-grid').takePhoto(); |
| 259 chrome.send('takePhoto'); | |
| 249 }, | 260 }, |
| 250 | 261 |
| 251 /** | 262 /** |
| 252 * Handle photo captured event. | 263 * Handle photo captured event. |
| 253 * @param {Event} e Event with 'dataURL' property containing a data URL. | 264 * @param {Event} e Event with 'dataURL' property containing a data URL. |
| 254 */ | 265 */ |
| 255 handlePhotoTaken_: function(e) { | 266 handlePhotoTaken_: function(e) { |
| 256 chrome.send('photoTaken', [e.dataURL]); | 267 chrome.send('photoTaken', [e.dataURL]); |
| 257 this.announceAccessibleMessage_( | 268 this.announceAccessibleMessage_( |
| 258 loadTimeData.getString('photoCaptureAccessibleText')); | 269 loadTimeData.getString('photoCaptureAccessibleText')); |
| 259 }, | 270 }, |
| 260 | 271 |
| 261 /** | 272 /** |
| 262 * Handle photo updated event. | 273 * Handle photo updated event. |
| 263 * @param {Event} e Event with 'dataURL' property containing a data URL. | 274 * @param {Event} e Event with 'dataURL' property containing a data URL. |
| 264 */ | 275 */ |
| 265 handlePhotoUpdated_: function(e) { | 276 handlePhotoUpdated_: function(e) { |
| 266 chrome.send('photoTaken', [e.dataURL]); | 277 chrome.send('photoTaken', [e.dataURL]); |
| 267 }, | 278 }, |
| 268 | 279 |
| 269 /** | 280 /** |
| 270 * Handle discarding the captured photo. | 281 * Handle discarding the captured photo. |
| 271 */ | 282 */ |
| 272 handleDiscardPhoto_: function(e) { | 283 handleDiscardPhoto_: function(e) { |
| 273 var imageGrid = $('user-image-grid'); | 284 var imageGrid = $('user-image-grid'); |
| 274 imageGrid.discardPhoto(); | 285 imageGrid.discardPhoto(); |
| 286 chrome.send('discardPhoto'); | |
| 275 this.announceAccessibleMessage_( | 287 this.announceAccessibleMessage_( |
| 276 loadTimeData.getString('photoDiscardAccessibleText')); | 288 loadTimeData.getString('photoDiscardAccessibleText')); |
| 277 }, | 289 }, |
| 278 | 290 |
| 279 /** | 291 /** |
| 280 * Add an accessible message to the page that will be announced to | 292 * Add an accessible message to the page that will be announced to |
| 281 * users who have spoken feedback on, but will be invisible to all | 293 * users who have spoken feedback on, but will be invisible to all |
| 282 * other users. It's removed right away so it doesn't clutter the DOM. | 294 * other users. It's removed right away so it doesn't clutter the DOM. |
| 283 */ | 295 */ |
| 284 announceAccessibleMessage_: function(msg) { | 296 announceAccessibleMessage_: function(msg) { |
| (...skipping 188 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 473 UserImageScreen[name] = function(value) { | 485 UserImageScreen[name] = function(value) { |
| 474 $('user-image')[name + '_'](value); | 486 $('user-image')[name + '_'](value); |
| 475 }; | 487 }; |
| 476 }); | 488 }); |
| 477 | 489 |
| 478 return { | 490 return { |
| 479 UserImageScreen: UserImageScreen | 491 UserImageScreen: UserImageScreen |
| 480 }; | 492 }; |
| 481 }); | 493 }); |
| 482 | 494 |
| OLD | NEW |