OLD | NEW |
| (Empty) |
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 | |
3 // found in the LICENSE file. | |
4 | |
5 cr.define('options', function() { | |
6 | |
7 var OptionsPage = options.OptionsPage; | |
8 var UserImagesGrid = options.UserImagesGrid; | |
9 var ButtonImages = UserImagesGrid.ButtonImages; | |
10 | |
11 /** | |
12 * Array of button URLs used on this page. | |
13 * @type {Array.<string>} | |
14 */ | |
15 const ButtonImageUrls = [ | |
16 ButtonImages.TAKE_PHOTO, | |
17 ButtonImages.CHOOSE_FILE | |
18 ]; | |
19 | |
20 ///////////////////////////////////////////////////////////////////////////// | |
21 // ChangePictureOptions class: | |
22 | |
23 /** | |
24 * Encapsulated handling of ChromeOS change picture options page. | |
25 * @constructor | |
26 */ | |
27 function ChangePictureOptions() { | |
28 OptionsPage.call( | |
29 this, | |
30 'changePicture', | |
31 localStrings.getString('changePicturePage'), | |
32 'change-picture-page'); | |
33 } | |
34 | |
35 cr.addSingletonGetter(ChangePictureOptions); | |
36 | |
37 ChangePictureOptions.prototype = { | |
38 // Inherit ChangePictureOptions from OptionsPage. | |
39 __proto__: options.OptionsPage.prototype, | |
40 | |
41 /** | |
42 * Initializes ChangePictureOptions page. | |
43 */ | |
44 initializePage: function() { | |
45 // Call base class implementation to start preferences initialization. | |
46 OptionsPage.prototype.initializePage.call(this); | |
47 | |
48 var imageGrid = $('images-grid'); | |
49 UserImagesGrid.decorate(imageGrid); | |
50 | |
51 imageGrid.addEventListener('change', | |
52 this.handleImageSelected_.bind(this)); | |
53 imageGrid.addEventListener('activate', | |
54 this.handleImageActivated_.bind(this)); | |
55 imageGrid.addEventListener('dblclick', | |
56 this.handleImageDblClick_.bind(this)); | |
57 | |
58 // Add the "Choose file" button. | |
59 imageGrid.addItem(ButtonImages.CHOOSE_FILE, | |
60 localStrings.getString('chooseFile'), | |
61 this.handleChooseFile_.bind(this)); | |
62 | |
63 // Profile image data. | |
64 this.profileImage_ = imageGrid.addItem( | |
65 ButtonImages.PROFILE_PICTURE, | |
66 localStrings.getString('profilePhotoLoading')); | |
67 | |
68 // Old user image data (if present). | |
69 this.oldImage_ = null; | |
70 | |
71 chrome.send('onChangePicturePageInitialized'); | |
72 }, | |
73 | |
74 /** | |
75 * Called right after the page has been shown to user. | |
76 */ | |
77 didShowPage: function() { | |
78 $('images-grid').updateAndFocus(); | |
79 chrome.send('onChangePicturePageShown'); | |
80 }, | |
81 | |
82 /** | |
83 * Called right before the page is hidden. | |
84 */ | |
85 willHidePage: function() { | |
86 var imageGrid = $('images-grid'); | |
87 imageGrid.blur(); // Make sure the image grid is not active. | |
88 if (this.oldImage_) { | |
89 imageGrid.removeItem(this.oldImage_); | |
90 this.oldImage_ = null; | |
91 } | |
92 }, | |
93 | |
94 /** | |
95 * Closes current page, returning back to Personal Stuff page. | |
96 * @private | |
97 */ | |
98 closePage_: function() { | |
99 OptionsPage.navigateToPage('personal'); | |
100 }, | |
101 | |
102 /** | |
103 * Handles "Take photo" button activation. | |
104 * @private | |
105 */ | |
106 handleTakePhoto_: function() { | |
107 chrome.send('takePhoto'); | |
108 this.closePage_(); | |
109 }, | |
110 | |
111 /** | |
112 * Handles "Choose a file" button activation. | |
113 * @private | |
114 */ | |
115 handleChooseFile_: function() { | |
116 chrome.send('chooseFile'); | |
117 this.closePage_(); | |
118 }, | |
119 | |
120 /** | |
121 * Handles image selection change. | |
122 * @private | |
123 */ | |
124 handleImageSelected_: function() { | |
125 var imageGrid = $('images-grid'); | |
126 var url = imageGrid.selectedItemUrl; | |
127 // Ignore deselection, selection change caused by program itself and | |
128 // selection of one of the action buttons. | |
129 if (url && | |
130 !imageGrid.inProgramSelection && | |
131 ButtonImageUrls.indexOf(url) == -1) { | |
132 chrome.send('selectImage', [url]); | |
133 } | |
134 }, | |
135 | |
136 /** | |
137 * Handles image activation (by pressing Enter). | |
138 * @private | |
139 */ | |
140 handleImageActivated_: function() { | |
141 switch ($('images-grid').selectedItemUrl) { | |
142 case ButtonImages.TAKE_PHOTO: | |
143 this.handleTakePhoto_(); | |
144 break; | |
145 case ButtonImages.CHOOSE_FILE: | |
146 this.handleChooseFile_(); | |
147 break; | |
148 default: | |
149 this.closePage_(); | |
150 break; | |
151 } | |
152 }, | |
153 | |
154 /** | |
155 * Handles double click on the image grid. | |
156 * @param {Event} e Double click Event. | |
157 */ | |
158 handleImageDblClick_: function(e) { | |
159 // Close page unless the click target is the grid itself or | |
160 // any of the buttons. | |
161 var url = e.target.src; | |
162 if (url && ButtonImageUrls.indexOf(url) == -1) | |
163 this.closePage_(); | |
164 }, | |
165 | |
166 /** | |
167 * URL of the current user image. | |
168 * @type {string} | |
169 */ | |
170 get currentUserImageUrl() { | |
171 return 'chrome://userimage/' + PersonalOptions.getLoggedInUsername() + | |
172 '?id=' + (new Date()).getTime(); | |
173 }, | |
174 | |
175 /** | |
176 * Notifies about camera presence change. | |
177 * @param {boolean} present Whether a camera is present or not. | |
178 * @private | |
179 */ | |
180 setCameraPresent_: function(present) { | |
181 var imageGrid = $('images-grid'); | |
182 if (present && !this.takePhotoButton_) { | |
183 this.takePhotoButton_ = imageGrid.addItem( | |
184 ButtonImages.TAKE_PHOTO, | |
185 localStrings.getString('takePhoto'), | |
186 this.handleTakePhoto_.bind(this), | |
187 1); | |
188 } else if (!present && this.takePhotoButton_) { | |
189 imageGrid.removeItem(this.takePhotoButton_); | |
190 this.takePhotoButton_ = null; | |
191 } | |
192 }, | |
193 | |
194 /** | |
195 * Adds or updates old user image taken from file/camera (neither a profile | |
196 * image nor a default one). | |
197 * @private | |
198 */ | |
199 setOldImage_: function() { | |
200 var imageGrid = $('images-grid'); | |
201 var url = this.currentUserImageUrl; | |
202 if (this.oldImage_) { | |
203 this.oldImage_ = imageGrid.updateItem(this.oldImage_, url); | |
204 } else { | |
205 // Insert next to the profile image. | |
206 var pos = imageGrid.indexOf(this.profileImage_) + 1; | |
207 this.oldImage_ = imageGrid.addItem(url, undefined, undefined, pos); | |
208 imageGrid.selectedItem = this.oldImage_; | |
209 } | |
210 }, | |
211 | |
212 /** | |
213 * Updates user's profile image. | |
214 * @param {string} imageUrl Profile image, encoded as data URL. | |
215 * @param {boolean} select If true, profile image should be selected. | |
216 * @private | |
217 */ | |
218 setProfileImage_: function(imageUrl, select) { | |
219 var imageGrid = $('images-grid'); | |
220 this.profileImage_ = imageGrid.updateItem( | |
221 this.profileImage_, imageUrl, localStrings.getString('profilePhoto')); | |
222 if (select) | |
223 imageGrid.selectedItem = this.profileImage_; | |
224 }, | |
225 | |
226 /** | |
227 * Selects user image with the given URL. | |
228 * @param {string} url URL of the image to select. | |
229 * @private | |
230 */ | |
231 setSelectedImage_: function(url) { | |
232 $('images-grid').selectedItemUrl = url; | |
233 }, | |
234 | |
235 /** | |
236 * Appends default images to the image grid. Should only be called once. | |
237 * @param {Array.<string>} images An array of URLs to default images. | |
238 * @private | |
239 */ | |
240 setDefaultImages_: function(images) { | |
241 var imageGrid = $('images-grid'); | |
242 for (var i = 0, url; url = images[i]; i++) { | |
243 imageGrid.addItem(url); | |
244 } | |
245 }, | |
246 }; | |
247 | |
248 // Forward public APIs to private implementations. | |
249 [ | |
250 'setCameraPresent', | |
251 'setDefaultImages', | |
252 'setOldImage', | |
253 'setProfileImage', | |
254 'setSelectedImage', | |
255 ].forEach(function(name) { | |
256 ChangePictureOptions[name] = function() { | |
257 var instance = ChangePictureOptions.getInstance(); | |
258 return instance[name + '_'].apply(instance, arguments); | |
259 }; | |
260 }); | |
261 | |
262 // Export | |
263 return { | |
264 ChangePictureOptions: ChangePictureOptions | |
265 }; | |
266 | |
267 }); | |
268 | |
OLD | NEW |