Chromium Code Reviews| OLD | NEW |
|---|---|
| 1 // Copyright 2014 The Chromium Authors. All rights reserved. | 1 // Copyright 2014 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('extensions', function() { | 5 cr.define('extensions', function() { |
| 6 'use strict'; | 6 'use strict'; |
| 7 | 7 |
| 8 /** | 8 /** |
| 9 * The ExtensionOptionsOverlay will show an extension's options page using | 9 * The ExtensionOptionsOverlay will show an extension's options page using |
| 10 * an <extensionoptions> element. | 10 * an <extensionoptions> element. |
| (...skipping 22 matching lines...) Expand all Loading... | |
| 33 initializePage: function(showOverlay) { | 33 initializePage: function(showOverlay) { |
| 34 var overlay = $('overlay'); | 34 var overlay = $('overlay'); |
| 35 | 35 |
| 36 cr.ui.overlay.setupOverlay(overlay); | 36 cr.ui.overlay.setupOverlay(overlay); |
| 37 cr.ui.overlay.globalInitialization(); | 37 cr.ui.overlay.globalInitialization(); |
| 38 overlay.addEventListener('cancelOverlay', this.handleDismiss_.bind(this)); | 38 overlay.addEventListener('cancelOverlay', this.handleDismiss_.bind(this)); |
| 39 | 39 |
| 40 this.showOverlay_ = showOverlay; | 40 this.showOverlay_ = showOverlay; |
| 41 }, | 41 }, |
| 42 | 42 |
| 43 setInitialFocus: function() { | |
| 44 this.getExentionOptions_().focus(); | |
| 45 }, | |
| 46 | |
| 47 /** @return {?Element} */ | |
| 48 getExentionOptions_: function() { | |
|
not at google - send to devlin
2015/02/03 20:52:04
Exention -> Extension
kudos on being consistent,
Dan Beam
2015/02/04 17:15:38
Done. (ah, the magic of Ctrl+n)
| |
| 49 return $('extension-options-overlay-guest').querySelector( | |
| 50 'extensionoptions'); | |
| 51 }, | |
| 52 | |
| 43 /** | 53 /** |
| 44 * Handles a click on the close button. | 54 * Handles a click on the close button. |
| 45 * @param {Event} event The click event. | 55 * @param {Event} event The click event. |
| 46 * @private | 56 * @private |
| 47 */ | 57 */ |
| 48 handleDismiss_: function(event) { | 58 handleDismiss_: function(event) { |
| 49 this.setVisible_(false); | 59 this.setVisible_(false); |
| 50 var extensionoptions = | 60 var extensionoptions = this.getExentionOptions_(); |
| 51 $('extension-options-overlay-guest') | |
| 52 .querySelector('extensionoptions'); | |
| 53 | |
| 54 if (extensionoptions) | 61 if (extensionoptions) |
| 55 $('extension-options-overlay-guest').removeChild(extensionoptions); | 62 $('extension-options-overlay-guest').removeChild(extensionoptions); |
| 56 | 63 |
| 57 $('extension-options-overlay-icon').removeAttribute('src'); | 64 $('extension-options-overlay-icon').removeAttribute('src'); |
| 58 | 65 |
| 59 // Remove the options query string. | 66 // Remove the options query string. |
| 60 uber.replaceState({}, ''); | 67 uber.replaceState({}, ''); |
| 61 }, | 68 }, |
| 62 | 69 |
| 63 /** | 70 /** |
| (...skipping 54 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 118 var newHeight = Math.min(evt.height, maxHeight); | 125 var newHeight = Math.min(evt.height, maxHeight); |
| 119 | 126 |
| 120 // animationTime is the amount of time in ms that will be used to resize | 127 // animationTime is the amount of time in ms that will be used to resize |
| 121 // the overlay. It is calculated by multiplying the pythagorean distance | 128 // the overlay. It is calculated by multiplying the pythagorean distance |
| 122 // between old and the new size (in px) with a constant speed of | 129 // between old and the new size (in px) with a constant speed of |
| 123 // 0.25 ms/px. | 130 // 0.25 ms/px. |
| 124 var animationTime = 0.25 * Math.sqrt( | 131 var animationTime = 0.25 * Math.sqrt( |
| 125 Math.pow(newWidth - oldWidth, 2) + | 132 Math.pow(newWidth - oldWidth, 2) + |
| 126 Math.pow(newHeight - oldHeight, 2)); | 133 Math.pow(newHeight - oldHeight, 2)); |
| 127 | 134 |
| 128 if (animation) { | 135 if (animation) |
| 129 animation.cancel(); | 136 animation.cancel(); |
| 130 } | 137 |
| 131 animation = overlay.animate([ | 138 animation = overlay.animate([ |
| 132 {width: oldWidth + 'px', height: oldHeight + 'px'}, | 139 {width: oldWidth + 'px', height: oldHeight + 'px'}, |
| 133 {width: newWidth + 'px', height: newHeight + 'px'} | 140 {width: newWidth + 'px', height: newHeight + 'px'} |
| 134 ], { | 141 ], { |
| 135 duration: animationTime, | 142 duration: animationTime, |
| 136 delay: 0 | 143 delay: 0 |
| 137 }); | 144 }); |
| 138 | 145 |
| 139 animation.onfinish = function(e) { | 146 animation.onfinish = function(e) { |
| 140 animation = null; | 147 animation = null; |
| 148 | |
| 141 // The <extensionoptions> element is ready to place back in the | 149 // The <extensionoptions> element is ready to place back in the |
| 142 // overlay. Make sure that it's sized to take up the full | 150 // overlay. Make sure that it's sized to take up the full width/height |
| 143 // width/height of the overlay. | 151 // of the overlay. |
| 144 overlayGuest.style.position = ''; | 152 overlayGuest.style.position = ''; |
| 145 overlayGuest.style.left = ''; | 153 overlayGuest.style.left = ''; |
| 146 overlayGuest.style.width = newWidth + 'px'; | 154 overlayGuest.style.width = newWidth + 'px'; |
| 147 overlayGuest.style.height = newHeight + 'px'; | 155 overlayGuest.style.height = newHeight + 'px'; |
| 156 | |
| 157 cr.dispatchSimpleEvent($('overlay'), 'animationFinished'); | |
| 148 }; | 158 }; |
| 149 }.bind(this); | 159 }.bind(this); |
| 150 | 160 |
| 151 // Move the <extensionoptions> off screen until the overlay is ready. | 161 // Move the <extensionoptions> off screen until the overlay is ready. |
| 152 overlayGuest.style.position = 'fixed'; | 162 overlayGuest.style.position = 'fixed'; |
| 153 overlayGuest.style.left = window.outerWidth + 'px'; | 163 overlayGuest.style.left = window.outerWidth + 'px'; |
| 154 // Begin rendering at the default dimensions. This is also necessary to | 164 // Begin rendering at the default dimensions. This is also necessary to |
| 155 // cancel any width/height set on a previous render. | 165 // cancel any width/height set on a previous render. |
| 156 // TODO(kalman): This causes a visual jag where the overlay guest shows | 166 // TODO(kalman): This causes a visual jag where the overlay guest shows |
| 157 // up briefly. It would be better to render this off-screen first, then | 167 // up briefly. It would be better to render this off-screen first, then |
| (...skipping 15 matching lines...) Expand all Loading... | |
| 173 /** @type {HTMLDivElement} */($('extension-options-overlay')) : | 183 /** @type {HTMLDivElement} */($('extension-options-overlay')) : |
| 174 null); | 184 null); |
| 175 } | 185 } |
| 176 }; | 186 }; |
| 177 | 187 |
| 178 // Export | 188 // Export |
| 179 return { | 189 return { |
| 180 ExtensionOptionsOverlay: ExtensionOptionsOverlay | 190 ExtensionOptionsOverlay: ExtensionOptionsOverlay |
| 181 }; | 191 }; |
| 182 }); | 192 }); |
| OLD | NEW |