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 var OptionsPage = options.OptionsPage; | |
7 var ArrayDataModel = cr.ui.ArrayDataModel; | |
8 | |
9 const localStrings = new LocalStrings(); | |
10 | |
11 /** | |
12 * ManageProfileOverlay class | |
13 * Encapsulated handling of the 'Manage profile...' overlay page. | |
14 * @constructor | |
15 * @class | |
16 */ | |
17 function ManageProfileOverlay() { | |
18 OptionsPage.call(this, | |
19 'manageProfile', | |
20 templateData.manageProfileOverlayTabTitle, | |
21 'manage-profile-overlay'); | |
22 }; | |
23 | |
24 cr.addSingletonGetter(ManageProfileOverlay); | |
25 | |
26 ManageProfileOverlay.prototype = { | |
27 // Inherit from OptionsPage. | |
28 __proto__: OptionsPage.prototype, | |
29 | |
30 // Info about the currently managed/deleted profile. | |
31 profileInfo_: null, | |
32 | |
33 // An object containing all known profile names. | |
34 profileNames_: {}, | |
35 | |
36 // The currently selected icon in the icon grid. | |
37 iconGridSelectedURL_: null, | |
38 | |
39 /** | |
40 * Initialize the page. | |
41 */ | |
42 initializePage: function() { | |
43 // Call base class implementation to start preference initialization. | |
44 OptionsPage.prototype.initializePage.call(this); | |
45 | |
46 var self = this; | |
47 var iconGrid = $('manage-profile-icon-grid'); | |
48 options.ProfilesIconGrid.decorate(iconGrid); | |
49 iconGrid.addEventListener('change', function(e) { | |
50 self.onIconGridSelectionChanged_(); | |
51 }); | |
52 | |
53 $('manage-profile-name').oninput = this.onNameChanged_.bind(this); | |
54 $('manage-profile-cancel').onclick = | |
55 $('delete-profile-cancel').onclick = function(event) { | |
56 OptionsPage.closeOverlay(); | |
57 }; | |
58 $('manage-profile-ok').onclick = function(event) { | |
59 OptionsPage.closeOverlay(); | |
60 self.submitManageChanges_(); | |
61 }; | |
62 $('delete-profile-ok').onclick = function(event) { | |
63 OptionsPage.closeOverlay(); | |
64 chrome.send('deleteProfile', [self.profileInfo_.filePath]); | |
65 }; | |
66 }, | |
67 | |
68 /** @inheritDoc */ | |
69 didShowPage: function() { | |
70 chrome.send('requestDefaultProfileIcons'); | |
71 | |
72 // Use the hash to specify the profile index. | |
73 var hash = location.hash; | |
74 if (hash) { | |
75 $('manage-profile-overlay-manage').hidden = false; | |
76 $('manage-profile-overlay-delete').hidden = true; | |
77 ManageProfileOverlay.getInstance().hideErrorBubble_(); | |
78 | |
79 chrome.send('requestProfileInfo', [parseInt(hash.slice(1), 10)]); | |
80 } | |
81 | |
82 $('manage-profile-name').focus(); | |
83 }, | |
84 | |
85 /** | |
86 * Set the profile info used in the dialog. | |
87 * @param {Object} profileInfo An object of the form: | |
88 * profileInfo = { | |
89 * name: "Profile Name", | |
90 * iconURL: "chrome://path/to/icon/image", | |
91 * filePath: "/path/to/profile/data/on/disk" | |
92 * isCurrentProfile: false, | |
93 * }; | |
94 * @private | |
95 */ | |
96 setProfileInfo_: function(profileInfo) { | |
97 this.iconGridSelectedURL_ = profileInfo.iconURL; | |
98 this.profileInfo_ = profileInfo; | |
99 $('manage-profile-name').value = profileInfo.name; | |
100 $('manage-profile-icon-grid').selectedItem = profileInfo.iconURL; | |
101 }, | |
102 | |
103 /** | |
104 * Sets the name of the currently edited profile. | |
105 * @private | |
106 */ | |
107 setProfileName_: function(name) { | |
108 if (this.profileInfo_) | |
109 this.profileInfo_.name = name; | |
110 $('manage-profile-name').value = name; | |
111 }, | |
112 | |
113 /** | |
114 * Set an array of default icon URLs. These will be added to the grid that | |
115 * the user will use to choose their profile icon. | |
116 * @param {Array.<string>} iconURLs An array of icon URLs. | |
117 * @private | |
118 */ | |
119 receiveDefaultProfileIcons_: function(iconURLs) { | |
120 $('manage-profile-icon-grid').dataModel = new ArrayDataModel(iconURLs); | |
121 | |
122 // Changing the dataModel resets the selectedItem. Re-select it, if there | |
123 // is one. | |
124 if (this.profileInfo_) | |
125 $('manage-profile-icon-grid').selectedItem = this.profileInfo_.iconURL; | |
126 | |
127 var grid = $('manage-profile-icon-grid'); | |
128 // Recalculate the measured item size. | |
129 grid.measured_ = null; | |
130 grid.columns = 0; | |
131 grid.redraw(); | |
132 }, | |
133 | |
134 /** | |
135 * Set a dictionary of all profile names. These are used to prevent the | |
136 * user from naming two profiles the same. | |
137 * @param {Object} profileNames A dictionary of profile names. | |
138 * @private | |
139 */ | |
140 receiveProfileNames_: function(profileNames) { | |
141 this.profileNames_ = profileNames; | |
142 }, | |
143 | |
144 /** | |
145 * Display the error bubble, with |errorText| in the bubble. | |
146 * @param {string} errorText The localized string id to display as an error. | |
147 * @private | |
148 */ | |
149 showErrorBubble_: function(errorText) { | |
150 var nameErrorEl = $('manage-profile-error-bubble'); | |
151 nameErrorEl.hidden = false; | |
152 nameErrorEl.textContent = localStrings.getString(errorText); | |
153 | |
154 $('manage-profile-ok').disabled = true; | |
155 }, | |
156 | |
157 /** | |
158 * Hide the error bubble. | |
159 * @private | |
160 */ | |
161 hideErrorBubble_: function() { | |
162 $('manage-profile-error-bubble').hidden = true; | |
163 $('manage-profile-ok').disabled = false; | |
164 }, | |
165 | |
166 /** | |
167 * oninput callback for <input> field. | |
168 * @param event The event object | |
169 * @private | |
170 */ | |
171 onNameChanged_: function(event) { | |
172 var newName = event.target.value; | |
173 var oldName = this.profileInfo_.name; | |
174 | |
175 if (newName == oldName) { | |
176 this.hideErrorBubble_(); | |
177 } else if (this.profileNames_[newName] != undefined) { | |
178 this.showErrorBubble_('manageProfilesDuplicateNameError'); | |
179 } else { | |
180 this.hideErrorBubble_(); | |
181 | |
182 var nameIsValid = $('manage-profile-name').validity.valid; | |
183 $('manage-profile-ok').disabled = !nameIsValid; | |
184 } | |
185 }, | |
186 | |
187 /** | |
188 * Called when the user clicks "OK". Saves the newly changed profile info. | |
189 * @private | |
190 */ | |
191 submitManageChanges_: function() { | |
192 var name = $('manage-profile-name').value; | |
193 var iconURL = $('manage-profile-icon-grid').selectedItem; | |
194 chrome.send('setProfileNameAndIcon', | |
195 [this.profileInfo_.filePath, name, iconURL]); | |
196 }, | |
197 | |
198 /** | |
199 * Called when the selected icon in the icon grid changes. | |
200 * @private | |
201 */ | |
202 onIconGridSelectionChanged_: function() { | |
203 var iconURL = $('manage-profile-icon-grid').selectedItem; | |
204 if (!iconURL || iconURL == this.iconGridSelectedURL_) | |
205 return; | |
206 this.iconGridSelectedURL_ = iconURL; | |
207 chrome.send('profileIconSelectionChanged', | |
208 [this.profileInfo_.filePath, iconURL]); | |
209 }, | |
210 | |
211 /** | |
212 * Display the "Manage Profile" dialog. | |
213 * @param {Object} profileInfo The profile object of the profile to manage. | |
214 * @private | |
215 */ | |
216 showManageDialog_: function(profileInfo) { | |
217 ManageProfileOverlay.setProfileInfo(profileInfo); | |
218 $('manage-profile-overlay-manage').hidden = false; | |
219 $('manage-profile-overlay-delete').hidden = true; | |
220 ManageProfileOverlay.getInstance().hideErrorBubble_(); | |
221 | |
222 // Intentionally don't show the URL in the location bar as we don't want | |
223 // people trying to navigate here by hand. | |
224 OptionsPage.showPageByName('manageProfile', false); | |
225 }, | |
226 | |
227 /** | |
228 * Display the "Delete Profile" dialog. | |
229 * @param {Object} profileInfo The profile object of the profile to delete. | |
230 * @private | |
231 */ | |
232 showDeleteDialog_: function(profileInfo) { | |
233 ManageProfileOverlay.setProfileInfo(profileInfo); | |
234 $('manage-profile-overlay-manage').hidden = true; | |
235 $('manage-profile-overlay-delete').hidden = false; | |
236 $('delete-profile-message').textContent = | |
237 localStrings.getStringF('deleteProfileMessage', profileInfo.name); | |
238 $('delete-profile-message').style.backgroundImage = 'url("' + | |
239 profileInfo.iconURL + '")'; | |
240 | |
241 // Intentionally don't show the URL in the location bar as we don't want | |
242 // people trying to navigate here by hand. | |
243 OptionsPage.showPageByName('manageProfile', false); | |
244 }, | |
245 }; | |
246 | |
247 // Forward public APIs to private implementations. | |
248 [ | |
249 'receiveDefaultProfileIcons', | |
250 'receiveProfileNames', | |
251 'setProfileInfo', | |
252 'setProfileName', | |
253 'showManageDialog', | |
254 'showDeleteDialog', | |
255 ].forEach(function(name) { | |
256 ManageProfileOverlay[name] = function() { | |
257 var instance = ManageProfileOverlay.getInstance(); | |
258 return instance[name + '_'].apply(instance, arguments); | |
259 }; | |
260 }); | |
261 | |
262 // Export | |
263 return { | |
264 ManageProfileOverlay: ManageProfileOverlay | |
265 }; | |
266 }); | |
OLD | NEW |