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

Side by Side Diff: chrome/browser/resources/options/chromeos/change_picture_options.js

Issue 2939273002: DO NOT SUBMIT: what chrome/browser/resources/ could eventually look like with clang-format (Closed)
Patch Set: Created 3 years, 6 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
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 var Page = cr.ui.pageManager.Page; 6 var Page = cr.ui.pageManager.Page;
7 var PageManager = cr.ui.pageManager.PageManager; 7 var PageManager = cr.ui.pageManager.PageManager;
8 var UserImagesGrid = options.UserImagesGrid; 8 var UserImagesGrid = options.UserImagesGrid;
9 var ButtonImages = UserImagesGrid.ButtonImages; 9 var ButtonImages = UserImagesGrid.ButtonImages;
10 10
11 /** 11 /**
12 * Array of button URLs used on this page. 12 * Array of button URLs used on this page.
13 * @type {Array<string>} 13 * @type {Array<string>}
14 * @const 14 * @const
15 */ 15 */
16 var ButtonImageUrls = [ 16 var ButtonImageUrls = [ButtonImages.TAKE_PHOTO, ButtonImages.CHOOSE_FILE];
17 ButtonImages.TAKE_PHOTO,
18 ButtonImages.CHOOSE_FILE
19 ];
20 17
21 ///////////////////////////////////////////////////////////////////////////// 18 /////////////////////////////////////////////////////////////////////////////
22 // ChangePictureOptions class: 19 // ChangePictureOptions class:
23 20
24 /** 21 /**
25 * Encapsulated handling of ChromeOS change picture options page. 22 * Encapsulated handling of ChromeOS change picture options page.
26 * @constructor 23 * @constructor
27 * @extends {cr.ui.pageManager.Page} 24 * @extends {cr.ui.pageManager.Page}
28 */ 25 */
29 function ChangePictureOptions() { 26 function ChangePictureOptions() {
30 Page.call(this, 'changePicture', 27 Page.call(
31 loadTimeData.getString('changePicturePage'), 28 this, 'changePicture', loadTimeData.getString('changePicturePage'),
32 'change-picture-page'); 29 'change-picture-page');
33 } 30 }
34 31
35 cr.addSingletonGetter(ChangePictureOptions); 32 cr.addSingletonGetter(ChangePictureOptions);
36 33
37 ChangePictureOptions.prototype = { 34 ChangePictureOptions.prototype = {
38 // Inherit ChangePictureOptions from Page. 35 // Inherit ChangePictureOptions from Page.
39 __proto__: Page.prototype, 36 __proto__: Page.prototype,
40 37
41 /** @override */ 38 /** @override */
42 initializePage: function() { 39 initializePage: function() {
43 Page.prototype.initializePage.call(this); 40 Page.prototype.initializePage.call(this);
44 41
45 var imageGrid = $('user-image-grid'); 42 var imageGrid = $('user-image-grid');
46 UserImagesGrid.decorate(imageGrid); 43 UserImagesGrid.decorate(imageGrid);
47 44
48 // Preview image will track the selected item's URL. 45 // Preview image will track the selected item's URL.
49 var previewElement = $('user-image-preview'); 46 var previewElement = $('user-image-preview');
50 previewElement.oncontextmenu = function(e) { e.preventDefault(); }; 47 previewElement.oncontextmenu = function(e) {
48 e.preventDefault();
49 };
51 50
52 imageGrid.previewElement = previewElement; 51 imageGrid.previewElement = previewElement;
53 imageGrid.selectionType = 'default'; 52 imageGrid.selectionType = 'default';
54 imageGrid.flipPhotoElement = $('flip-photo'); 53 imageGrid.flipPhotoElement = $('flip-photo');
55 54
56 imageGrid.addEventListener('select', 55 imageGrid.addEventListener(
57 this.handleImageSelected_.bind(this)); 56 'select', this.handleImageSelected_.bind(this));
58 imageGrid.addEventListener('activate', 57 imageGrid.addEventListener(
59 this.handleImageActivated_.bind(this)); 58 'activate', this.handleImageActivated_.bind(this));
60 imageGrid.addEventListener('phototaken', 59 imageGrid.addEventListener(
61 this.handlePhotoTaken_.bind(this)); 60 'phototaken', this.handlePhotoTaken_.bind(this));
62 imageGrid.addEventListener('photoupdated', 61 imageGrid.addEventListener(
63 this.handlePhotoTaken_.bind(this)); 62 'photoupdated', this.handlePhotoTaken_.bind(this));
64 63
65 // Add the "Choose file" button. 64 // Add the "Choose file" button.
66 imageGrid.addItem(ButtonImages.CHOOSE_FILE, 65 imageGrid
67 loadTimeData.getString('chooseFile'), 66 .addItem(
68 this.handleChooseFile_.bind(this)).type = 'file'; 67 ButtonImages.CHOOSE_FILE, loadTimeData.getString('chooseFile'),
68 this.handleChooseFile_.bind(this))
69 .type = 'file';
69 70
70 // Profile image data. 71 // Profile image data.
71 this.profileImage_ = imageGrid.addItem( 72 this.profileImage_ = imageGrid.addItem(
72 ButtonImages.PROFILE_PICTURE, 73 ButtonImages.PROFILE_PICTURE,
73 loadTimeData.getString('profilePhotoLoading')); 74 loadTimeData.getString('profilePhotoLoading'));
74 this.profileImage_.type = 'profile'; 75 this.profileImage_.type = 'profile';
75 76
76 // Set the title for camera item in the grid. 77 // Set the title for camera item in the grid.
77 imageGrid.setCameraTitles( 78 imageGrid.setCameraTitles(
78 loadTimeData.getString('takePhoto'), 79 loadTimeData.getString('takePhoto'),
79 loadTimeData.getString('photoFromCamera')); 80 loadTimeData.getString('photoFromCamera'));
80 81
81 $('take-photo').addEventListener( 82 $('take-photo')
82 'click', this.handleTakePhoto_.bind(this)); 83 .addEventListener('click', this.handleTakePhoto_.bind(this));
83 $('discard-photo').addEventListener( 84 $('discard-photo')
84 'click', this.handleDiscardPhoto_.bind(this)); 85 .addEventListener('click', this.handleDiscardPhoto_.bind(this));
85 86
86 // Toggle 'animation' class for the duration of WebKit transition. 87 // Toggle 'animation' class for the duration of WebKit transition.
87 $('flip-photo').addEventListener( 88 $('flip-photo')
88 'click', this.handleFlipPhoto_.bind(this)); 89 .addEventListener('click', this.handleFlipPhoto_.bind(this));
89 $('user-image-stream-crop').addEventListener( 90 $('user-image-stream-crop')
90 'transitionend', function(e) { 91 .addEventListener('transitionend', function(e) {
91 previewElement.classList.remove('animation'); 92 previewElement.classList.remove('animation');
92 }); 93 });
93 $('user-image-preview-img').addEventListener( 94 $('user-image-preview-img')
94 'transitionend', function(e) { 95 .addEventListener('transitionend', function(e) {
95 previewElement.classList.remove('animation'); 96 previewElement.classList.remove('animation');
96 }); 97 });
97 98
98 // Old user image data (if present). 99 // Old user image data (if present).
99 this.oldImage_ = null; 100 this.oldImage_ = null;
100 101
101 $('change-picture-overlay-confirm').addEventListener( 102 $('change-picture-overlay-confirm')
102 'click', this.closeOverlay_.bind(this)); 103 .addEventListener('click', this.closeOverlay_.bind(this));
103 104
104 chrome.send('onChangePicturePageInitialized'); 105 chrome.send('onChangePicturePageInitialized');
105 }, 106 },
106 107
107 /** @override */ 108 /** @override */
108 didShowPage: function() { 109 didShowPage: function() {
109 var imageGrid = $('user-image-grid'); 110 var imageGrid = $('user-image-grid');
110 // Reset camera element. 111 // Reset camera element.
111 imageGrid.cameraImage = null; 112 imageGrid.cameraImage = null;
112 imageGrid.updateAndFocus(); 113 imageGrid.updateAndFocus();
(...skipping 31 matching lines...) Expand 10 before | Expand all | Expand 10 after
144 }, 145 },
145 146
146 /** 147 /**
147 * Handle camera-photo flip. 148 * Handle camera-photo flip.
148 */ 149 */
149 handleFlipPhoto_: function() { 150 handleFlipPhoto_: function() {
150 var imageGrid = $('user-image-grid'); 151 var imageGrid = $('user-image-grid');
151 imageGrid.previewElement.classList.add('animation'); 152 imageGrid.previewElement.classList.add('animation');
152 imageGrid.flipPhoto = !imageGrid.flipPhoto; 153 imageGrid.flipPhoto = !imageGrid.flipPhoto;
153 var flipMessageId = imageGrid.flipPhoto ? 154 var flipMessageId = imageGrid.flipPhoto ?
154 'photoFlippedAccessibleText' : 'photoFlippedBackAccessibleText'; 155 'photoFlippedAccessibleText' :
156 'photoFlippedBackAccessibleText';
155 announceAccessibleMessage(loadTimeData.getString(flipMessageId)); 157 announceAccessibleMessage(loadTimeData.getString(flipMessageId));
156 }, 158 },
157 159
158 /** 160 /**
159 * Handles "Take photo" button click. 161 * Handles "Take photo" button click.
160 * @private 162 * @private
161 */ 163 */
162 handleTakePhoto_: function() { 164 handleTakePhoto_: function() {
163 $('user-image-grid').takePhoto(); 165 $('user-image-grid').takePhoto();
164 chrome.send('takePhoto'); 166 chrome.send('takePhoto');
(...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after
197 /** 199 /**
198 * Handles image selection change. 200 * Handles image selection change.
199 * @param {Event} e Selection change Event. 201 * @param {Event} e Selection change Event.
200 * @private 202 * @private
201 */ 203 */
202 handleImageSelected_: function(e) { 204 handleImageSelected_: function(e) {
203 var imageGrid = $('user-image-grid'); 205 var imageGrid = $('user-image-grid');
204 var url = imageGrid.selectedItemUrl; 206 var url = imageGrid.selectedItemUrl;
205 207
206 // Flip button available only for camera picture. 208 // Flip button available only for camera picture.
207 imageGrid.flipPhotoElement.hidden = 209 imageGrid.flipPhotoElement.hidden = imageGrid.selectionType != 'camera';
208 imageGrid.selectionType != 'camera';
209 // Ignore selection change caused by program itself and selection of one 210 // Ignore selection change caused by program itself and selection of one
210 // of the action buttons. 211 // of the action buttons.
211 if (!imageGrid.inProgramSelection && 212 if (!imageGrid.inProgramSelection && url != ButtonImages.TAKE_PHOTO &&
212 url != ButtonImages.TAKE_PHOTO && url != ButtonImages.CHOOSE_FILE) { 213 url != ButtonImages.CHOOSE_FILE) {
213 chrome.send('selectImage', [url, imageGrid.selectionType]); 214 chrome.send('selectImage', [url, imageGrid.selectionType]);
214 } 215 }
215 // Start/stop camera on (de)selection. 216 // Start/stop camera on (de)selection.
216 if (!imageGrid.inProgramSelection && 217 if (!imageGrid.inProgramSelection &&
217 imageGrid.selectionType != e.oldSelectionType) { 218 imageGrid.selectionType != e.oldSelectionType) {
218 if (imageGrid.selectionType == 'camera') { 219 if (imageGrid.selectionType == 'camera') {
219 imageGrid.startCamera( 220 imageGrid.startCamera(function() {
220 function() { 221 // Start capture if camera is still the selected item.
221 // Start capture if camera is still the selected item. 222 return imageGrid.selectedItem == imageGrid.cameraImage;
222 return imageGrid.selectedItem == imageGrid.cameraImage; 223 });
223 });
224 } else { 224 } else {
225 imageGrid.stopCamera(); 225 imageGrid.stopCamera();
226 } 226 }
227 } 227 }
228 // Update image attribution text. 228 // Update image attribution text.
229 var image = imageGrid.selectedItem; 229 var image = imageGrid.selectedItem;
230 $('user-image-author-name').textContent = image.author; 230 $('user-image-author-name').textContent = image.author;
231 $('user-image-author-website').textContent = image.website; 231 $('user-image-author-website').textContent = image.website;
232 $('user-image-author-website').href = image.website; 232 $('user-image-author-website').href = image.website;
233 $('user-image-attribution').style.visibility = 233 $('user-image-attribution').style.visibility =
(...skipping 83 matching lines...) Expand 10 before | Expand all | Expand 10 after
317 cr.makePublic(ChangePictureOptions, [ 317 cr.makePublic(ChangePictureOptions, [
318 'closeOverlay', 318 'closeOverlay',
319 'setCameraPresent', 319 'setCameraPresent',
320 'setDefaultImages', 320 'setDefaultImages',
321 'setOldImage', 321 'setOldImage',
322 'setProfileImage', 322 'setProfileImage',
323 'setSelectedImage', 323 'setSelectedImage',
324 ]); 324 ]);
325 325
326 // Export 326 // Export
327 return { 327 return {ChangePictureOptions: ChangePictureOptions};
328 ChangePictureOptions: ChangePictureOptions
329 };
330 328
331 }); 329 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698