| OLD | NEW |
|---|
| 1 <!-- | 1 <!-- |
| 2 @license | 2 @license |
| 3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. | 3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. |
| 4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt | 4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt |
| 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt |
| 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt | 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt |
| 7 Code distributed by Google as part of the polymer project is also | 7 Code distributed by Google as part of the polymer project is also |
| 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt | 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt |
| 9 --> | 9 --> |
| 10 | 10 |
| (...skipping 10 matching lines...) Expand all Loading... |
| 21 on top of other content. It includes an optional backdrop, and can be used to im
plement a variety | 21 on top of other content. It includes an optional backdrop, and can be used to im
plement a variety |
| 22 of UI controls including dialogs and drop downs. Multiple overlays may be displa
yed at once. | 22 of UI controls including dialogs and drop downs. Multiple overlays may be displa
yed at once. |
| 23 | 23 |
| 24 ### Closing and canceling | 24 ### Closing and canceling |
| 25 | 25 |
| 26 A dialog may be hidden by closing or canceling. The difference between close and
cancel is user | 26 A dialog may be hidden by closing or canceling. The difference between close and
cancel is user |
| 27 intent. Closing generally implies that the user acknowledged the content on the
overlay. By default, | 27 intent. Closing generally implies that the user acknowledged the content on the
overlay. By default, |
| 28 it will cancel whenever the user taps outside it or presses the escape key. This
behavior is | 28 it will cancel whenever the user taps outside it or presses the escape key. This
behavior is |
| 29 configurable with the `no-cancel-on-esc-key` and the `no-cancel-on-outside-click
` properties. | 29 configurable with the `no-cancel-on-esc-key` and the `no-cancel-on-outside-click
` properties. |
| 30 `close()` should be called explicitly by the implementer when the user interacts
with a control | 30 `close()` should be called explicitly by the implementer when the user interacts
with a control |
| 31 in the overlay element. | 31 in the overlay element. When the dialog is canceled, the overlay fires an 'iron-
overlay-canceled' |
| 32 event. Call `preventDefault` on this event to prevent the overlay from closing. |
| 32 | 33 |
| 33 ### Positioning | 34 ### Positioning |
| 34 | 35 |
| 35 By default the element is sized and positioned to fit and centered inside the wi
ndow. You can | 36 By default the element is sized and positioned to fit and centered inside the wi
ndow. You can |
| 36 position and size it manually using CSS. See `Polymer.IronFitBehavior`. | 37 position and size it manually using CSS. See `Polymer.IronFitBehavior`. |
| 37 | 38 |
| 38 ### Backdrop | 39 ### Backdrop |
| 39 | 40 |
| 40 Set the `with-backdrop` attribute to display a backdrop behind the overlay. The
backdrop is | 41 Set the `with-backdrop` attribute to display a backdrop behind the overlay. The
backdrop is |
| 41 appended to `<body>` and is of type `<iron-overlay-backdrop>`. See its doc page
for styling | 42 appended to `<body>` and is of type `<iron-overlay-backdrop>`. See its doc page
for styling |
| (...skipping 90 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 132 _boundOnCaptureKeydown: { | 133 _boundOnCaptureKeydown: { |
| 133 type: Function, | 134 type: Function, |
| 134 value: function() { | 135 value: function() { |
| 135 return this._onCaptureKeydown.bind(this); | 136 return this._onCaptureKeydown.bind(this); |
| 136 } | 137 } |
| 137 } | 138 } |
| 138 | 139 |
| 139 }, | 140 }, |
| 140 | 141 |
| 141 listeners: { | 142 listeners: { |
| 142 'click': '_onClick', | 143 'tap': '_onClick', |
| 143 'iron-resize': '_onIronResize' | 144 'iron-resize': '_onIronResize' |
| 144 }, | 145 }, |
| 145 | 146 |
| 146 /** | 147 /** |
| 147 * The backdrop element. | 148 * The backdrop element. |
| 148 * @type Node | 149 * @type Node |
| 149 */ | 150 */ |
| 150 get backdropElement() { | 151 get backdropElement() { |
| 151 return this._backdrop; | 152 return this._backdrop; |
| 152 }, | 153 }, |
| (...skipping 39 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 192 */ | 193 */ |
| 193 close: function() { | 194 close: function() { |
| 194 this.opened = false; | 195 this.opened = false; |
| 195 this._setCanceled(false); | 196 this._setCanceled(false); |
| 196 }, | 197 }, |
| 197 | 198 |
| 198 /** | 199 /** |
| 199 * Cancels the overlay. | 200 * Cancels the overlay. |
| 200 */ | 201 */ |
| 201 cancel: function() { | 202 cancel: function() { |
| 202 this.opened = false, | 203 var cancelEvent = this.fire('iron-overlay-canceled', undefined, {cancelabl
e: true}); |
| 204 if (cancelEvent.defaultPrevented) { |
| 205 return; |
| 206 } |
| 207 |
| 208 this.opened = false; |
| 203 this._setCanceled(true); | 209 this._setCanceled(true); |
| 204 }, | 210 }, |
| 205 | 211 |
| 206 _ensureSetup: function() { | 212 _ensureSetup: function() { |
| 207 if (this._overlaySetup) { | 213 if (this._overlaySetup) { |
| 208 return; | 214 return; |
| 209 } | 215 } |
| 210 this._overlaySetup = true; | 216 this._overlaySetup = true; |
| 211 this.style.outline = 'none'; | 217 this.style.outline = 'none'; |
| 212 this.style.display = 'none'; | 218 this.style.display = 'none'; |
| (...skipping 37 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 250 | 256 |
| 251 }, | 257 }, |
| 252 | 258 |
| 253 _canceledChanged: function() { | 259 _canceledChanged: function() { |
| 254 this.closingReason = this.closingReason || {}; | 260 this.closingReason = this.closingReason || {}; |
| 255 this.closingReason.canceled = this.canceled; | 261 this.closingReason.canceled = this.canceled; |
| 256 }, | 262 }, |
| 257 | 263 |
| 258 _toggleListener: function(enable, node, event, boundListener, capture) { | 264 _toggleListener: function(enable, node, event, boundListener, capture) { |
| 259 if (enable) { | 265 if (enable) { |
| 266 // enable document-wide tap recognizer |
| 267 if (event === 'tap') { |
| 268 Polymer.Gestures.add(document, 'tap', null); |
| 269 } |
| 260 node.addEventListener(event, boundListener, capture); | 270 node.addEventListener(event, boundListener, capture); |
| 261 } else { | 271 } else { |
| 272 // disable document-wide tap recognizer |
| 273 if (event === 'tap') { |
| 274 Polymer.Gestures.remove(document, 'tap', null); |
| 275 } |
| 262 node.removeEventListener(event, boundListener, capture); | 276 node.removeEventListener(event, boundListener, capture); |
| 263 } | 277 } |
| 264 }, | 278 }, |
| 265 | 279 |
| 266 _toggleListeners: function() { | 280 _toggleListeners: function() { |
| 267 if (this._toggleListenersAsync) { | 281 if (this._toggleListenersAsync) { |
| 268 this.cancelAsync(this._toggleListenersAsync); | 282 this.cancelAsync(this._toggleListenersAsync); |
| 269 } | 283 } |
| 270 // async so we don't auto-close immediately via a click. | 284 // async so we don't auto-close immediately via a click. |
| 271 this._toggleListenersAsync = this.async(function() { | 285 this._toggleListenersAsync = this.async(function() { |
| 272 this._toggleListener(this.opened, document, 'click', this._boundOnCaptur
eClick, true); | 286 this._toggleListener(this.opened, document, 'tap', this._boundOnCaptureC
lick, true); |
| 273 this._toggleListener(this.opened, document, 'keydown', this._boundOnCapt
ureKeydown, true); | 287 this._toggleListener(this.opened, document, 'keydown', this._boundOnCapt
ureKeydown, true); |
| 274 this._toggleListenersAsync = null; | 288 this._toggleListenersAsync = null; |
| 275 }); | 289 }, 1); |
| 276 }, | 290 }, |
| 277 | 291 |
| 278 // tasks which must occur before opening; e.g. making the element visible | 292 // tasks which must occur before opening; e.g. making the element visible |
| 279 _prepareRenderOpened: function() { | 293 _prepareRenderOpened: function() { |
| 280 this._manager.addOverlay(this); | 294 this._manager.addOverlay(this); |
| 281 | 295 |
| 282 if (this.withBackdrop) { | 296 if (this.withBackdrop) { |
| 283 this.backdropElement.prepare(); | 297 this.backdropElement.prepare(); |
| 284 this._manager.trackBackdrop(this); | 298 this._manager.trackBackdrop(this); |
| 285 } | 299 } |
| (...skipping 138 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 424 * @event iron-overlay-closed | 438 * @event iron-overlay-closed |
| 425 * @param {{canceled: (boolean|undefined)}} set to the `closingReason` attribute | 439 * @param {{canceled: (boolean|undefined)}} set to the `closingReason` attribute |
| 426 */ | 440 */ |
| 427 }; | 441 }; |
| 428 | 442 |
| 429 /** @polymerBehavior */ | 443 /** @polymerBehavior */ |
| 430 Polymer.IronOverlayBehavior = [Polymer.IronFitBehavior, Polymer.IronResizableB
ehavior, Polymer.IronOverlayBehaviorImpl]; | 444 Polymer.IronOverlayBehavior = [Polymer.IronFitBehavior, Polymer.IronResizableB
ehavior, Polymer.IronOverlayBehaviorImpl]; |
| 431 | 445 |
| 432 | 446 |
| 433 </script> | 447 </script> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1418513006:
update elements and fix some bugs (Closed)
Base URL: git@github.com:dart-lang/polymer_elements.git@master