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

Side by Side Diff: chrome/browser/resources/extensions/extensions.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 // <include src="../../../../ui/webui/resources/js/cr/ui/focus_row.js"> 5 // <include src="../../../../ui/webui/resources/js/cr/ui/focus_row.js">
6 // <include src="../../../../ui/webui/resources/js/cr/ui/focus_grid.js"> 6 // <include src="../../../../ui/webui/resources/js/cr/ui/focus_grid.js">
7 // <include src="drag_and_drop_handler.js"> 7 // <include src="drag_and_drop_handler.js">
8 // <include src="extension_code.js"> 8 // <include src="extension_code.js">
9 // <include src="extension_commands_overlay.js"> 9 // <include src="extension_commands_overlay.js">
10 // <include src="extension_error_overlay.js"> 10 // <include src="extension_error_overlay.js">
(...skipping 56 matching lines...) Expand 10 before | Expand all | Expand 10 after
67 cr.ui.FocusOutlineManager.forDocument(document); 67 cr.ui.FocusOutlineManager.forDocument(document);
68 measureCheckboxStrings(); 68 measureCheckboxStrings();
69 69
70 var extensionList = new ExtensionList(this); 70 var extensionList = new ExtensionList(this);
71 extensionList.id = 'extension-settings-list'; 71 extensionList.id = 'extension-settings-list';
72 var wrapper = $('extension-list-wrapper'); 72 var wrapper = $('extension-list-wrapper');
73 wrapper.insertBefore(extensionList, wrapper.firstChild); 73 wrapper.insertBefore(extensionList, wrapper.firstChild);
74 74
75 // Get the initial profile state, and register to be notified of any 75 // Get the initial profile state, and register to be notified of any
76 // future changes. 76 // future changes.
77 chrome.developerPrivate.getProfileConfiguration( 77 chrome.developerPrivate.getProfileConfiguration(this.update_.bind(this));
78 this.update_.bind(this));
79 chrome.developerPrivate.onProfileStateChanged.addListener( 78 chrome.developerPrivate.onProfileStateChanged.addListener(
80 this.update_.bind(this)); 79 this.update_.bind(this));
81 80
82 var extensionLoader = extensions.ExtensionLoader.getInstance(); 81 var extensionLoader = extensions.ExtensionLoader.getInstance();
83 82
84 $('toggle-dev-on').addEventListener('change', function(e) { 83 $('toggle-dev-on').addEventListener('change', function(e) {
85 this.updateDevControlsVisibility_(true); 84 this.updateDevControlsVisibility_(true);
86 chrome.developerPrivate.updateProfileConfiguration( 85 chrome.developerPrivate.updateProfileConfiguration(
87 {inDeveloperMode: e.target.checked}); 86 {inDeveloperMode: e.target.checked});
88 var suffix = $('toggle-dev-on').checked ? 'Enabled' : 'Disabled'; 87 var suffix = $('toggle-dev-on').checked ? 'Enabled' : 'Disabled';
89 chrome.send('metricsHandler:recordAction', 88 chrome.send(
90 ['Options_ToggleDeveloperMode_' + suffix]); 89 'metricsHandler:recordAction',
90 ['Options_ToggleDeveloperMode_' + suffix]);
91 }.bind(this)); 91 }.bind(this));
92 92
93 window.addEventListener('resize', function() { 93 window.addEventListener('resize', function() {
94 this.updateDevControlsVisibility_(false); 94 this.updateDevControlsVisibility_(false);
95 }.bind(this)); 95 }.bind(this));
96 96
97 // Set up the three dev mode buttons (load unpacked, pack and update). 97 // Set up the three dev mode buttons (load unpacked, pack and update).
98 $('load-unpacked').addEventListener('click', function(e) { 98 $('load-unpacked').addEventListener('click', function(e) {
99 chrome.send('metricsHandler:recordAction', 99 chrome.send(
100 ['Options_LoadUnpackedExtension']); 100 'metricsHandler:recordAction', ['Options_LoadUnpackedExtension']);
101 extensionLoader.loadUnpacked(); 101 extensionLoader.loadUnpacked();
102 }); 102 });
103 $('pack-extension').addEventListener('click', 103 $('pack-extension')
104 this.handlePackExtension_.bind(this)); 104 .addEventListener('click', this.handlePackExtension_.bind(this));
105 $('update-extensions-now').addEventListener('click', 105 $('update-extensions-now')
106 this.handleUpdateExtensionNow_.bind(this)); 106 .addEventListener('click', this.handleUpdateExtensionNow_.bind(this));
107 107
108 var dragTarget = document.documentElement; 108 var dragTarget = document.documentElement;
109 /** @private {extensions.DragAndDropHandler} */ 109 /** @private {extensions.DragAndDropHandler} */
110 this.dragWrapperHandler_ = 110 this.dragWrapperHandler_ =
111 new extensions.DragAndDropHandler(true, dragTarget); 111 new extensions.DragAndDropHandler(true, dragTarget);
112 dragTarget.addEventListener('extension-drag-started', function() { 112 dragTarget.addEventListener('extension-drag-started', function() {
113 ExtensionSettings.showOverlay($('drop-target-overlay')); 113 ExtensionSettings.showOverlay($('drop-target-overlay'));
114 }); 114 });
115 dragTarget.addEventListener('extension-drag-ended', function() { 115 dragTarget.addEventListener('extension-drag-ended', function() {
116 var overlay = ExtensionSettings.getCurrentOverlay(); 116 var overlay = ExtensionSettings.getCurrentOverlay();
117 if (overlay && overlay.id === 'drop-target-overlay') 117 if (overlay && overlay.id === 'drop-target-overlay')
118 ExtensionSettings.showOverlay(null); 118 ExtensionSettings.showOverlay(null);
119 }); 119 });
120 this.dragWrapper_ = 120 this.dragWrapper_ =
121 new cr.ui.DragWrapper(dragTarget, this.dragWrapperHandler_); 121 new cr.ui.DragWrapper(dragTarget, this.dragWrapperHandler_);
122 122
123 extensions.PackExtensionOverlay.getInstance().initializePage(); 123 extensions.PackExtensionOverlay.getInstance().initializePage();
124 124
125 // Hook up the configure commands link to the overlay. 125 // Hook up the configure commands link to the overlay.
126 var link = document.querySelector('.extension-commands-config'); 126 var link = document.querySelector('.extension-commands-config');
127 link.addEventListener('click', 127 link.addEventListener(
128 this.handleExtensionCommandsConfig_.bind(this)); 128 'click', this.handleExtensionCommandsConfig_.bind(this));
129 129
130 // Initialize the Commands overlay. 130 // Initialize the Commands overlay.
131 extensions.ExtensionCommandsOverlay.getInstance().initializePage(); 131 extensions.ExtensionCommandsOverlay.getInstance().initializePage();
132 132
133 extensions.ExtensionErrorOverlay.getInstance().initializePage( 133 extensions.ExtensionErrorOverlay.getInstance().initializePage(
134 extensions.ExtensionSettings.showOverlay); 134 extensions.ExtensionSettings.showOverlay);
135 135
136 extensions.ExtensionOptionsOverlay.getInstance().initializePage( 136 extensions.ExtensionOptionsOverlay.getInstance().initializePage(
137 extensions.ExtensionSettings.showOverlay); 137 extensions.ExtensionSettings.showOverlay);
138 138
139 // Add user action logging for bottom links. 139 // Add user action logging for bottom links.
140 var moreExtensionLink = 140 var moreExtensionLink =
141 document.getElementsByClassName('more-extensions-link'); 141 document.getElementsByClassName('more-extensions-link');
142 for (var i = 0; i < moreExtensionLink.length; i++) { 142 for (var i = 0; i < moreExtensionLink.length; i++) {
143 moreExtensionLink[i].addEventListener('click', function(e) { 143 moreExtensionLink[i].addEventListener('click', function(e) {
144 chrome.send('metricsHandler:recordAction', 144 chrome.send(
145 ['Options_GetMoreExtensions']); 145 'metricsHandler:recordAction', ['Options_GetMoreExtensions']);
146 }); 146 });
147 } 147 }
148 148
149 // Initialize the kiosk overlay. 149 // Initialize the kiosk overlay.
150 if (cr.isChromeOS) { 150 if (cr.isChromeOS) {
151 var kioskOverlay = extensions.KioskAppsOverlay.getInstance(); 151 var kioskOverlay = extensions.KioskAppsOverlay.getInstance();
152 kioskOverlay.initialize(); 152 kioskOverlay.initialize();
153 153
154 $('add-kiosk-app').addEventListener('click', function() { 154 $('add-kiosk-app').addEventListener('click', function() {
155 ExtensionSettings.showOverlay($('kiosk-apps-page')); 155 ExtensionSettings.showOverlay($('kiosk-apps-page'));
(...skipping 45 matching lines...) Expand 10 before | Expand all | Expand 10 after
201 devControlsCheckbox.disabled = 201 devControlsCheckbox.disabled =
202 supervised || developerModeControlledByPolicy; 202 supervised || developerModeControlledByPolicy;
203 203
204 // This is necessary e.g. if developer mode is now disabled by policy 204 // This is necessary e.g. if developer mode is now disabled by policy
205 // but extension developer tools were visible. 205 // but extension developer tools were visible.
206 this.updateDevControlsVisibility_(false); 206 this.updateDevControlsVisibility_(false);
207 this.updateDevToggleControlledIndicator_(developerModeControlledByPolicy); 207 this.updateDevToggleControlledIndicator_(developerModeControlledByPolicy);
208 208
209 $('load-unpacked').disabled = !profileInfo.canLoadUnpacked; 209 $('load-unpacked').disabled = !profileInfo.canLoadUnpacked;
210 var extensionList = $('extension-settings-list'); 210 var extensionList = $('extension-settings-list');
211 extensionList.updateExtensionsData( 211 extensionList
212 profileInfo.isIncognitoAvailable, 212 .updateExtensionsData(
213 profileInfo.appInfoDialogEnabled).then(function() { 213 profileInfo.isIncognitoAvailable,
214 if (!this.hasLoaded_) { 214 profileInfo.appInfoDialogEnabled)
215 this.hasLoaded_ = true; 215 .then(function() {
216 this.setLoading_(false); 216 if (!this.hasLoaded_) {
217 } 217 this.hasLoaded_ = true;
218 this.onExtensionCountChanged(); 218 this.setLoading_(false);
219 }.bind(this)); 219 }
220 this.onExtensionCountChanged();
221 }.bind(this));
220 }, 222 },
221 223
222 /** 224 /**
223 * Shows or hides the 'controlled by policy' indicator on the dev-toggle 225 * Shows or hides the 'controlled by policy' indicator on the dev-toggle
224 * checkbox. 226 * checkbox.
225 * @param {boolean} devModeControlledByPolicy true if the indicator 227 * @param {boolean} devModeControlledByPolicy true if the indicator
226 * should be showing. 228 * should be showing.
227 * @private 229 * @private
228 */ 230 */
229 updateDevToggleControlledIndicator_: function(devModeControlledByPolicy) { 231 updateDevToggleControlledIndicator_: function(devModeControlledByPolicy) {
230 var controlledIndicator = document.querySelector( 232 var controlledIndicator =
231 '#dev-toggle .controlled-setting-indicator'); 233 document.querySelector('#dev-toggle .controlled-setting-indicator');
232 234
233 if (!(controlledIndicator instanceof cr.ui.ControlledIndicator)) 235 if (!(controlledIndicator instanceof cr.ui.ControlledIndicator))
234 cr.ui.ControlledIndicator.decorate(controlledIndicator); 236 cr.ui.ControlledIndicator.decorate(controlledIndicator);
235 237
236 // We control the visibility of the ControlledIndicator by setting or 238 // We control the visibility of the ControlledIndicator by setting or
237 // removing the 'controlled-by' attribute (see controlled_indicator.css). 239 // removing the 'controlled-by' attribute (see controlled_indicator.css).
238 var isVisible = controlledIndicator.getAttribute('controlled-by'); 240 var isVisible = controlledIndicator.getAttribute('controlled-by');
239 if (devModeControlledByPolicy && !isVisible) { 241 if (devModeControlledByPolicy && !isVisible) {
240 var controlledBy = 'policy'; 242 var controlledBy = 'policy';
241 controlledIndicator.setAttribute( 243 controlledIndicator.setAttribute('controlled-by', controlledBy);
242 'controlled-by', controlledBy);
243 controlledIndicator.setAttribute( 244 controlledIndicator.setAttribute(
244 'text' + controlledBy, 245 'text' + controlledBy,
245 loadTimeData.getString('extensionControlledSettingPolicy')); 246 loadTimeData.getString('extensionControlledSettingPolicy'));
246 } else if (!devModeControlledByPolicy && isVisible) { 247 } else if (!devModeControlledByPolicy && isVisible) {
247 // This hides the element - see above. 248 // This hides the element - see above.
248 controlledIndicator.removeAttribute('controlled-by'); 249 controlledIndicator.removeAttribute('controlled-by');
249 } 250 }
250 }, 251 },
251 252
252 /** 253 /**
(...skipping 21 matching lines...) Expand all
274 ExtensionSettings.showOverlay($('pack-extension-overlay')); 275 ExtensionSettings.showOverlay($('pack-extension-overlay'));
275 chrome.send('metricsHandler:recordAction', ['Options_PackExtension']); 276 chrome.send('metricsHandler:recordAction', ['Options_PackExtension']);
276 }, 277 },
277 278
278 /** 279 /**
279 * Shows the Extension Commands configuration UI. 280 * Shows the Extension Commands configuration UI.
280 * @private 281 * @private
281 */ 282 */
282 showExtensionCommandsConfigUi_: function() { 283 showExtensionCommandsConfigUi_: function() {
283 ExtensionSettings.showOverlay($('extension-commands-overlay')); 284 ExtensionSettings.showOverlay($('extension-commands-overlay'));
284 chrome.send('metricsHandler:recordAction', 285 chrome.send('metricsHandler:recordAction', ['Options_ExtensionCommands']);
285 ['Options_ExtensionCommands']);
286 }, 286 },
287 287
288 /** 288 /**
289 * Handles the Configure (Extension) Commands link. 289 * Handles the Configure (Extension) Commands link.
290 * @param {Event} e Change event. 290 * @param {Event} e Change event.
291 * @private 291 * @private
292 */ 292 */
293 handleExtensionCommandsConfig_: function(e) { 293 handleExtensionCommandsConfig_: function(e) {
294 this.showExtensionCommandsConfigUi_(); 294 this.showExtensionCommandsConfigUi_();
295 }, 295 },
296 296
297 /** 297 /**
298 * Handles the Update Extension Now button. 298 * Handles the Update Extension Now button.
299 * @param {Event} e Change event. 299 * @param {Event} e Change event.
300 * @private 300 * @private
301 */ 301 */
302 handleUpdateExtensionNow_: function(e) { 302 handleUpdateExtensionNow_: function(e) {
303 chrome.developerPrivate.autoUpdate(); 303 chrome.developerPrivate.autoUpdate();
304 chrome.send('metricsHandler:recordAction', 304 chrome.send('metricsHandler:recordAction', ['Options_UpdateExtensions']);
305 ['Options_UpdateExtensions']);
306 }, 305 },
307 306
308 /** 307 /**
309 * Updates the visibility of the developer controls based on whether the 308 * Updates the visibility of the developer controls based on whether the
310 * [x] Developer mode checkbox is checked. 309 * [x] Developer mode checkbox is checked.
311 * @param {boolean} animated Whether to animate any updates. 310 * @param {boolean} animated Whether to animate any updates.
312 * @private 311 * @private
313 */ 312 */
314 updateDevControlsVisibility_: function(animated) { 313 updateDevControlsVisibility_: function(animated) {
315 var showDevControls = $('toggle-dev-on').checked; 314 var showDevControls = $('toggle-dev-on').checked;
316 $('extension-settings').classList.toggle('dev-mode', showDevControls); 315 $('extension-settings').classList.toggle('dev-mode', showDevControls);
317 316
318 var devControls = $('dev-controls'); 317 var devControls = $('dev-controls');
319 devControls.classList.toggle('animated', animated); 318 devControls.classList.toggle('animated', animated);
320 319
321 var buttons = devControls.querySelector('.button-container'); 320 var buttons = devControls.querySelector('.button-container');
322 Array.prototype.forEach.call(buttons.querySelectorAll('a, button'), 321 Array.prototype.forEach.call(
323 function(control) { 322 buttons.querySelectorAll('a, button'), function(control) {
324 control.tabIndex = showDevControls ? 0 : -1; 323 control.tabIndex = showDevControls ? 0 : -1;
325 }); 324 });
326 buttons.setAttribute('aria-hidden', !showDevControls); 325 buttons.setAttribute('aria-hidden', !showDevControls);
327 326
328 window.requestAnimationFrame(function() { 327 window.requestAnimationFrame(function() {
329 devControls.style.height = !showDevControls ? '' : 328 devControls.style.height =
330 buttons.offsetHeight + 'px'; 329 !showDevControls ? '' : buttons.offsetHeight + 'px';
331 330
332 document.dispatchEvent(new Event('devControlsVisibilityUpdated')); 331 document.dispatchEvent(new Event('devControlsVisibilityUpdated'));
333 }.bind(this)); 332 }.bind(this));
334 }, 333 },
335 334
336 /** @override */ 335 /** @override */
337 onExtensionCountChanged: function() { 336 onExtensionCountChanged: function() {
338 /** @const */ 337 /** @const */
339 var hasExtensions = $('extension-settings-list').getNumExtensions() != 0; 338 var hasExtensions = $('extension-settings-list').getNumExtensions() != 0;
340 $('no-extensions').hidden = hasExtensions; 339 $('no-extensions').hidden = hasExtensions;
(...skipping 94 matching lines...) Expand 10 before | Expand all | Expand 10 after
435 loadTimeData.getString('extensionSettingsEnable'); 434 loadTimeData.getString('extensionSettingsEnable');
436 measuringDiv.className = 'enable-text'; 435 measuringDiv.className = 'enable-text';
437 pxWidth = Math.max(measuringDiv.clientWidth + trashWidth, pxWidth); 436 pxWidth = Math.max(measuringDiv.clientWidth + trashWidth, pxWidth);
438 measuringDiv.textContent = 437 measuringDiv.textContent =
439 loadTimeData.getString('extensionSettingsDeveloperMode'); 438 loadTimeData.getString('extensionSettingsDeveloperMode');
440 measuringDiv.className = ''; 439 measuringDiv.className = '';
441 pxWidth = Math.max(measuringDiv.clientWidth, pxWidth); 440 pxWidth = Math.max(measuringDiv.clientWidth, pxWidth);
442 441
443 var style = document.createElement('style'); 442 var style = document.createElement('style');
444 style.type = 'text/css'; 443 style.type = 'text/css';
445 style.textContent = 444 style.textContent = '.enable-checkbox-text {' +
446 '.enable-checkbox-text {' +
447 ' min-width: ' + (pxWidth - trashWidth) + 'px;' + 445 ' min-width: ' + (pxWidth - trashWidth) + 'px;' +
448 '}' + 446 '}' +
449 '#dev-toggle span {' + 447 '#dev-toggle span {' +
450 ' min-width: ' + pxWidth + 'px;' + 448 ' min-width: ' + pxWidth + 'px;' +
451 '}'; 449 '}';
452 document.querySelector('head').appendChild(style); 450 document.querySelector('head').appendChild(style);
453 } 451 }
454 452
455 // Export 453 // Export
456 return { 454 return {ExtensionSettings: ExtensionSettings};
457 ExtensionSettings: ExtensionSettings
458 };
459 }); 455 });
460 456
461 window.addEventListener('load', function(e) { 457 window.addEventListener('load', function(e) {
462 extensions.ExtensionSettings.getInstance().initialize(); 458 extensions.ExtensionSettings.getInstance().initialize();
463 }); 459 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698