Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(8)

Side by Side Diff: chrome/browser/resources/chromeos/user_images_grid.js

Issue 10986046: Merge 158045 - [cros] Avatar picker: various fixes for web camera problems. (Closed) Base URL: svn://svn.chromium.org/chrome/branches/1271/src/
Patch Set: Created 8 years, 2 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
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 cr.define('options', function() { 5 cr.define('options', function() {
6 /** @const */ var ArrayDataModel = cr.ui.ArrayDataModel; 6 /** @const */ var ArrayDataModel = cr.ui.ArrayDataModel;
7 /** @const */ var Grid = cr.ui.Grid; 7 /** @const */ var Grid = cr.ui.Grid;
8 /** @const */ var GridItem = cr.ui.GridItem; 8 /** @const */ var GridItem = cr.ui.GridItem;
9 /** @const */ var GridSelectionController = cr.ui.GridSelectionController; 9 /** @const */ var GridSelectionController = cr.ui.GridSelectionController;
10 /** @const */ var ListSingleSelectionModel = cr.ui.ListSingleSelectionModel; 10 /** @const */ var ListSingleSelectionModel = cr.ui.ListSingleSelectionModel;
11 11
12 /** 12 /**
13 * Interval between consecutive camera presence checks in msec while camera is 13 * Interval between consecutive camera presence checks in msec while camera is
14 * not present. 14 * not present.
15 * @const 15 * @const
16 */ 16 */
17 var CAMERA_CHECK_INTERVAL_MS = 3000; 17 var CAMERA_CHECK_INTERVAL_MS = 3000;
18 18
19 /** 19 /**
20 * Interval between consecutive camera liveness checks in msec. 20 * Interval between consecutive camera liveness checks in msec.
21 * @const 21 * @const
22 */ 22 */
23 var CAMERA_LIVENESS_CHECK_MS = 1000; 23 var CAMERA_LIVENESS_CHECK_MS = 3000;
24 24
25 /** 25 /**
26 * Number of frames recorded by takeVideo(). 26 * Number of frames recorded by takeVideo().
27 * @const 27 * @const
28 */ 28 */
29 var RECORD_FRAMES = 48; 29 var RECORD_FRAMES = 48;
30 30
31 /** 31 /**
32 * FPS at which camera stream is recorded. 32 * FPS at which camera stream is recorded.
33 * @const 33 * @const
(...skipping 129 matching lines...) Expand 10 before | Expand all | Expand 10 after
163 163
164 /** 164 /**
165 * Handles selection change. 165 * Handles selection change.
166 * @param {Event} e Double click Event. 166 * @param {Event} e Double click Event.
167 * @private 167 * @private
168 */ 168 */
169 handleChange_: function(e) { 169 handleChange_: function(e) {
170 if (this.selectedItem === null) 170 if (this.selectedItem === null)
171 return; 171 return;
172 172
173 var oldSelectionType = this.selectionType;
174
173 // Update current selection type. 175 // Update current selection type.
174 this.selectionType = this.selectedItem.type; 176 this.selectionType = this.selectedItem.type;
175 177
176 // Show grey silhouette with the same border as stock images. 178 // Show grey silhouette with the same border as stock images.
177 if (/^chrome:\/\/theme\//.test(this.selectedItemUrl)) 179 if (/^chrome:\/\/theme\//.test(this.selectedItemUrl))
178 this.previewElement.classList.add('default-image'); 180 this.previewElement.classList.add('default-image');
179 181
180 this.updatePreview_(); 182 this.updatePreview_();
181 183
182 cr.dispatchSimpleEvent(this, 'select'); 184 var e = new cr.Event('select', false, false);
185 e.oldSelectionType = oldSelectionType;
186 this.dispatchEvent(e);
183 }, 187 },
184 188
185 /** 189 /**
186 * Updates the preview image, if present. 190 * Updates the preview image, if present.
187 * @private 191 * @private
188 */ 192 */
189 updatePreview_: function() { 193 updatePreview_: function() {
190 var url = this.selectedItemUrl; 194 var url = this.selectedItemUrl;
191 if (url && this.previewImage_) 195 if (url && this.previewImage_)
192 this.previewImage_.src = url; 196 this.previewImage_.src = url;
(...skipping 41 matching lines...) Expand 10 before | Expand all | Expand 10 after
234 * delay. 238 * delay.
235 */ 239 */
236 checkCameraPresence: function(onAvailable, onAbsent) { 240 checkCameraPresence: function(onAvailable, onAbsent) {
237 this.cameraOnline = false; 241 this.cameraOnline = false;
238 if (this.cameraPresentCheckTimer_) { 242 if (this.cameraPresentCheckTimer_) {
239 clearTimeout(this.cameraPresentCheckTimer_); 243 clearTimeout(this.cameraPresentCheckTimer_);
240 this.cameraPresentCheckTimer_ = null; 244 this.cameraPresentCheckTimer_ = null;
241 } 245 }
242 if (!this.cameraVideo_) 246 if (!this.cameraVideo_)
243 return; 247 return;
248 this.cameraCheckInProgress_ = true;
244 navigator.webkitGetUserMedia( 249 navigator.webkitGetUserMedia(
245 {video: true}, 250 {video: true},
246 this.handleCameraAvailable_.bind(this, onAvailable), 251 this.handleCameraAvailable_.bind(this, onAvailable),
247 // Needs both arguments since it may call checkCameraPresence again. 252 // Needs both arguments since it may call checkCameraPresence again.
248 this.handleCameraAbsent_.bind(this, onAvailable, onAbsent)); 253 this.handleCameraAbsent_.bind(this, onAvailable, onAbsent));
249 }, 254 },
250 255
251 /** 256 /**
252 * Stops camera capture, if it's currently active. 257 * Stops camera capture, if it's currently active.
253 */ 258 */
254 stopCamera: function() { 259 stopCamera: function() {
255 this.cameraOnline = false; 260 this.cameraOnline = false;
256 if (this.cameraVideo_) 261 if (this.cameraVideo_)
257 this.cameraVideo_.src = ''; 262 this.cameraVideo_.src = '';
263 // Cancel any pending getUserMedia() checks.
264 this.cameraCheckInProgress_ = false;
258 }, 265 },
259 266
260 /** 267 /**
261 * Handles successful camera check. 268 * Handles successful camera check.
262 * @param {function(): boolean} onAvailable Callback to call. If it returns 269 * @param {function(): boolean} onAvailable Callback to call. If it returns
263 * |true|, capture is started immediately. 270 * |true|, capture is started immediately.
264 * @param {MediaStream} stream Stream object as returned by getUserMedia. 271 * @param {MediaStream} stream Stream object as returned by getUserMedia.
265 * @private 272 * @private
266 */ 273 */
267 handleCameraAvailable_: function(onAvailable, stream) { 274 handleCameraAvailable_: function(onAvailable, stream) {
268 this.cameraPresent = true; 275 this.cameraPresent = true;
269 if (onAvailable()) 276 if (this.cameraCheckInProgress_ && onAvailable())
270 this.cameraVideo_.src = window.webkitURL.createObjectURL(stream); 277 this.cameraVideo_.src = window.webkitURL.createObjectURL(stream);
278 this.cameraCheckInProgress_ = false;
271 }, 279 },
272 280
273 /** 281 /**
274 * Handles camera check failure. 282 * Handles camera check failure.
275 * @param {function(): boolean} onAvailable Callback that is called if 283 * @param {function(): boolean} onAvailable Callback that is called if
276 * camera is available in future re-checks. If it returns |true|, 284 * camera is available in future re-checks. If it returns |true|,
277 * capture is started immediately. 285 * capture is started immediately.
278 * @param {function(): boolean} onAbsent Callback to call. If it returns 286 * @param {function(): boolean} onAbsent Callback to call. If it returns
279 * |true|, camera is checked again after some delay. 287 * |true|, camera is checked again after some delay.
280 * @param {NavigatorUserMediaError=} err Error object. 288 * @param {NavigatorUserMediaError=} err Error object.
281 * @private 289 * @private
282 */ 290 */
283 handleCameraAbsent_: function(onAvailable, onAbsent, err) { 291 handleCameraAbsent_: function(onAvailable, onAbsent, err) {
284 this.cameraPresent = false; 292 this.cameraPresent = false;
285 this.cameraOnline = false; 293 this.cameraOnline = false;
286 if (onAbsent()) { 294 if (onAbsent()) {
287 // Repeat the check. 295 // Repeat the check.
288 this.cameraPresentCheckTimer_ = setTimeout( 296 this.cameraPresentCheckTimer_ = setTimeout(
289 this.checkCameraPresence.bind(this, onAvailable, onAbsent), 297 this.checkCameraPresence.bind(this, onAvailable, onAbsent),
290 CAMERA_CHECK_INTERVAL_MS); 298 CAMERA_CHECK_INTERVAL_MS);
291 } 299 }
300 this.cameraCheckInProgress_ = false;
292 }, 301 },
293 302
294 /** 303 /**
295 * Handles successful camera capture start. 304 * Handles successful camera capture start.
296 * @private 305 * @private
297 */ 306 */
298 handleVideoStarted_: function() { 307 handleVideoStarted_: function() {
299 this.cameraOnline = true; 308 this.cameraOnline = true;
300 this.handleVideoUpdate_(); 309 this.handleVideoUpdate_();
301 }, 310 },
(...skipping 143 matching lines...) Expand 10 before | Expand all | Expand 10 after
445 }, 454 },
446 set previewElement(value) { 455 set previewElement(value) {
447 this.previewElement_ = value; 456 this.previewElement_ = value;
448 this.previewImage_ = value.querySelector('img'); 457 this.previewImage_ = value.querySelector('img');
449 this.cameraVideo_ = value.querySelector('video'); 458 this.cameraVideo_ = value.querySelector('video');
450 this.cameraVideo_.addEventListener('canplay', 459 this.cameraVideo_.addEventListener('canplay',
451 this.handleVideoStarted_.bind(this)); 460 this.handleVideoStarted_.bind(this));
452 this.cameraVideo_.addEventListener('timeupdate', 461 this.cameraVideo_.addEventListener('timeupdate',
453 this.handleVideoUpdate_.bind(this)); 462 this.handleVideoUpdate_.bind(this));
454 this.updatePreview_(); 463 this.updatePreview_();
464 this.checkCameraPresence(
465 function() {
466 return false; // Don't start streaming if camera is present.
467 },
468 function() {
469 return false; // Don't retry if camera is absent.
470 });
455 }, 471 },
456 472
457 /** 473 /**
458 * Whether the camera live stream and photo should be flipped horizontally. 474 * Whether the camera live stream and photo should be flipped horizontally.
459 * @type {boolean} 475 * @type {boolean}
460 */ 476 */
461 get flipPhoto() { 477 get flipPhoto() {
462 return this.flipPhoto_ || false; 478 return this.flipPhoto_ || false;
463 }, 479 },
464 set flipPhoto(value) { 480 set flipPhoto(value) {
(...skipping 221 matching lines...) Expand 10 before | Expand all | Expand 10 after
686 UserImagesGrid.ButtonImages = { 702 UserImagesGrid.ButtonImages = {
687 TAKE_PHOTO: 'chrome://theme/IDR_BUTTON_USER_IMAGE_TAKE_PHOTO', 703 TAKE_PHOTO: 'chrome://theme/IDR_BUTTON_USER_IMAGE_TAKE_PHOTO',
688 CHOOSE_FILE: 'chrome://theme/IDR_BUTTON_USER_IMAGE_CHOOSE_FILE', 704 CHOOSE_FILE: 'chrome://theme/IDR_BUTTON_USER_IMAGE_CHOOSE_FILE',
689 PROFILE_PICTURE: 'chrome://theme/IDR_PROFILE_PICTURE_LOADING' 705 PROFILE_PICTURE: 'chrome://theme/IDR_PROFILE_PICTURE_LOADING'
690 }; 706 };
691 707
692 return { 708 return {
693 UserImagesGrid: UserImagesGrid 709 UserImagesGrid: UserImagesGrid
694 }; 710 };
695 }); 711 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698