third_party/polymer/v1_0/components-chromium/iron-overlay-behavior/iron-overlay-behavior-extracted.js - Issue 2633003003: Update iron-overlay-behavior to version 1.10.2.

Unified Diff: third_party/polymer/v1_0/components-chromium/iron-overlay-behavior/iron-overlay-behavior-extracted.js

Issue 2633003003: Update iron-overlay-behavior to version 1.10.2. (Closed)

Patch Set: Rebased. Created 3 years, 11 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 side-by-side diff with in-line comments

« no previous file with comments | « third_party/polymer/v1_0/components-chromium/iron-overlay-behavior/iron-overlay-behavior.html ('k') | third_party/polymer/v1_0/components-chromium/iron-pages/compiled_resources2.gyp » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

Index: third_party/polymer/v1_0/components-chromium/iron-overlay-behavior/iron-overlay-behavior-extracted.js

diff --git a/third_party/polymer/v1_0/components-chromium/iron-overlay-behavior/iron-overlay-behavior-extracted.js b/third_party/polymer/v1_0/components-chromium/iron-overlay-behavior/iron-overlay-behavior-extracted.js

index 2f63c9204a68e78a006171cfb4036d0db1c13568..620b1d052d982dbbe510cd5686bd12181370726d 100644

--- a/third_party/polymer/v1_0/components-chromium/iron-overlay-behavior/iron-overlay-behavior-extracted.js

+++ b/third_party/polymer/v1_0/components-chromium/iron-overlay-behavior/iron-overlay-behavior-extracted.js

@@ -1,49 +1,7 @@

(function() {

-'use strict';

-/**

-Use `Polymer.IronOverlayBehavior` to implement an element that can be hidden or shown, and displays

-on top of other content. It includes an optional backdrop, and can be used to implement a variety

-of UI controls including dialogs and drop downs. Multiple overlays may be displayed at once.

-See the [demo source code](https://github.com/PolymerElements/iron-overlay-behavior/blob/master/demo/simple-overlay.html)

-for an example.

-### Closing and canceling

-An overlay may be hidden by closing or canceling. The difference between close and cancel is user

-intent. Closing generally implies that the user acknowledged the content on the overlay. By default,

-it will cancel whenever the user taps outside it or presses the escape key. This behavior is

-configurable with the `no-cancel-on-esc-key` and the `no-cancel-on-outside-click` properties.

-`close()` should be called explicitly by the implementer when the user interacts with a control

-in the overlay element. When the dialog is canceled, the overlay fires an 'iron-overlay-canceled'

-event. Call `preventDefault` on this event to prevent the overlay from closing.

-### Positioning

-By default the element is sized and positioned to fit and centered inside the window. You can

-position and size it manually using CSS. See `Polymer.IronFitBehavior`.

-### Backdrop

-Set the `with-backdrop` attribute to display a backdrop behind the overlay. The backdrop is

-appended to `<body>` and is of type `<iron-overlay-backdrop>`. See its doc page for styling

-options.

-In addition, `with-backdrop` will wrap the focus within the content in the light DOM.

-Override the [`_focusableNodes` getter](#Polymer.IronOverlayBehavior:property-_focusableNodes)

-to achieve a different behavior.

-### Limitations

-The element is styled to appear on top of other content by setting its `z-index` property. You

-must ensure no element has a stacking context with a higher `z-index` than its parent stacking

-context. You should place this element as a child of `<body>` whenever possible.

-@demo demo/index.html

-@polymerBehavior Polymer.IronOverlayBehavior

-*/

+ 'use strict';

+ /** @polymerBehavior */

Polymer.IronOverlayBehaviorImpl = {

properties: {

@@ -179,45 +137,7 @@ context. You should place this element as a child of `<body>` whenever possible.

* @protected

get _focusableNodes() {

- // Elements that can be focused even if they have [disabled] attribute.

- var FOCUSABLE_WITH_DISABLED = [

- 'a[href]',

- 'area[href]',

- 'iframe',

- '[tabindex]',

- '[contentEditable=true]'

- ];

- // Elements that cannot be focused if they have [disabled] attribute.

- var FOCUSABLE_WITHOUT_DISABLED = [

- 'input',

- 'select',

- 'textarea',

- 'button'

- ];

- // Discard elements with tabindex=-1 (makes them not focusable).

- var selector = FOCUSABLE_WITH_DISABLED.join(':not([tabindex="-1"]),') +

- ':not([tabindex="-1"]),' +

- FOCUSABLE_WITHOUT_DISABLED.join(':not([disabled]):not([tabindex="-1"]),') +

- ':not([disabled]):not([tabindex="-1"])';

- var focusables = Polymer.dom(this).querySelectorAll(selector);

- if (this.tabIndex >= 0) {

- // Insert at the beginning because we might have all elements with tabIndex = 0,

- // and the overlay should be the first of the list.

- focusables.splice(0, 0, this);

- }

- // Sort by tabindex.

- return focusables.sort(function (a, b) {

- if (a.tabIndex === b.tabIndex) {

- return 0;

- }

- if (a.tabIndex === 0 || a.tabIndex > b.tabIndex) {

- return 1;

- }

- return -1;

- });

+ return Polymer.IronFocusablesHelper.getTabbableNodes(this);

ready: function() {

@@ -291,6 +211,14 @@ context. You should place this element as a child of `<body>` whenever possible.

this.opened = false;

+ /**

+ * Invalidates the cached tabbable nodes. To be called when any of the focusable

+ * content changes (e.g. a button is disabled).

+ */

+ invalidateTabbables: function() {

+ this.__firstFocusableNode = this.__lastFocusableNode = null;

+ },

_ensureSetup: function() {

if (this._overlaySetup) {

return;

@@ -389,11 +317,6 @@ context. You should place this element as a child of `<body>` whenever possible.

this.notifyResize();

this.__isAnimating = false;

- // Store it so we don't query too much.

- var focusableNodes = this._focusableNodes;

- this.__firstFocusableNode = focusableNodes[0];

- this.__lastFocusableNode = focusableNodes[focusableNodes.length - 1];

this.fire('iron-overlay-opened');

@@ -510,6 +433,7 @@ context. You should place this element as a child of `<body>` whenever possible.

if (!this.withBackdrop) {

return;

}

+ this.__ensureFirstLastFocusables();

// TAB wraps from last to first focusable.

// Shift + TAB wraps from first to last focusable.

var shift = event.shiftKey;

@@ -566,11 +490,25 @@ context. You should place this element as a child of `<body>` whenever possible.

_onNodesChange: function() {

if (this.opened && !this.__isAnimating) {

+ // It might have added focusable nodes, so invalidate cached values.

+ this.invalidateTabbables();

this.notifyResize();

}

/**

+ * Will set first and last focusable nodes if any of them is not set.

+ * @private

+ */

+ __ensureFirstLastFocusables: function() {

+ if (!this.__firstFocusableNode || !this.__lastFocusableNode) {

+ var focusableNodes = this._focusableNodes;

+ this.__firstFocusableNode = focusableNodes[0];

+ this.__lastFocusableNode = focusableNodes[focusableNodes.length - 1];

+ }

+ },

+ /**

* Tasks executed when opened changes: prepare for the opening, move the

* focus, update the manager, render opened/closed.

* @private

@@ -614,7 +552,48 @@ context. You should place this element as a child of `<body>` whenever possible.

};

- /** @polymerBehavior */

+ /**

+ Use `Polymer.IronOverlayBehavior` to implement an element that can be hidden or shown, and displays

+ on top of other content. It includes an optional backdrop, and can be used to implement a variety

+ of UI controls including dialogs and drop downs. Multiple overlays may be displayed at once.

+ See the [demo source code](https://github.com/PolymerElements/iron-overlay-behavior/blob/master/demo/simple-overlay.html)

+ for an example.

+ ### Closing and canceling

+ An overlay may be hidden by closing or canceling. The difference between close and cancel is user

+ intent. Closing generally implies that the user acknowledged the content on the overlay. By default,

+ it will cancel whenever the user taps outside it or presses the escape key. This behavior is

+ configurable with the `no-cancel-on-esc-key` and the `no-cancel-on-outside-click` properties.

+ `close()` should be called explicitly by the implementer when the user interacts with a control

+ in the overlay element. When the dialog is canceled, the overlay fires an 'iron-overlay-canceled'

+ event. Call `preventDefault` on this event to prevent the overlay from closing.

+ ### Positioning

+ By default the element is sized and positioned to fit and centered inside the window. You can

+ position and size it manually using CSS. See `Polymer.IronFitBehavior`.

+ ### Backdrop

+ Set the `with-backdrop` attribute to display a backdrop behind the overlay. The backdrop is

+ appended to `<body>` and is of type `<iron-overlay-backdrop>`. See its doc page for styling

+ options.

+ In addition, `with-backdrop` will wrap the focus within the content in the light DOM.

+ Override the [`_focusableNodes` getter](#Polymer.IronOverlayBehavior:property-_focusableNodes)

+ to achieve a different behavior.

+ ### Limitations

+ The element is styled to appear on top of other content by setting its `z-index` property. You

+ must ensure no element has a stacking context with a higher `z-index` than its parent stacking

+ context. You should place this element as a child of `<body>` whenever possible.

+ @demo demo/index.html

+ @polymerBehavior

+ */

Polymer.IronOverlayBehavior = [Polymer.IronFitBehavior, Polymer.IronResizableBehavior, Polymer.IronOverlayBehaviorImpl];

/**