| Index: third_party/polymer/v1_0/components-chromium/iron-dropdown/iron-dropdown-extracted.js
|
| diff --git a/third_party/polymer/v1_0/components-chromium/iron-dropdown/iron-dropdown-extracted.js b/third_party/polymer/v1_0/components-chromium/iron-dropdown/iron-dropdown-extracted.js
|
| index df95b6a0f32e8c73c360a5cdec3dbdfc55110f06..750fbbbd578b723e3114db18a6263ce28054f2ef 100644
|
| --- a/third_party/polymer/v1_0/components-chromium/iron-dropdown/iron-dropdown-extracted.js
|
| +++ b/third_party/polymer/v1_0/components-chromium/iron-dropdown/iron-dropdown-extracted.js
|
| @@ -77,8 +77,7 @@
|
| * it is opened.
|
| */
|
| positionTarget: {
|
| - type: Object,
|
| - observer: '_positionTargetChanged'
|
| + type: Object
|
| },
|
|
|
| /**
|
| @@ -123,15 +122,6 @@
|
| allowOutsideScroll: {
|
| type: Boolean,
|
| value: false
|
| - },
|
| -
|
| - /**
|
| - * We memoize the positionTarget bounding rectangle so that we can
|
| - * limit the number of times it is queried per resize / relayout.
|
| - * @type {?Object}
|
| - */
|
| - _positionRectMemo: {
|
| - type: Object
|
| }
|
| },
|
|
|
| @@ -140,13 +130,13 @@
|
| },
|
|
|
| observers: [
|
| - '_updateOverlayPosition(verticalAlign, horizontalAlign, verticalOffset, horizontalOffset)'
|
| + '_updateOverlayPosition(positionTarget, verticalAlign, horizontalAlign, verticalOffset, horizontalOffset)'
|
| ],
|
|
|
| attached: function() {
|
| - if (this.positionTarget === undefined) {
|
| - this.positionTarget = this._defaultPositionTarget;
|
| - }
|
| + this.positionTarget = this.positionTarget || this._defaultPositionTarget;
|
| + // Memoize this to avoid expensive calculations & relayouts.
|
| + this._isRTL = window.getComputedStyle(this).direction == 'rtl';
|
| },
|
|
|
| /**
|
| @@ -165,13 +155,6 @@
|
| },
|
|
|
| /**
|
| - * Whether the text direction is RTL
|
| - */
|
| - _isRTL: function() {
|
| - return window.getComputedStyle(this).direction == 'rtl';
|
| - },
|
| -
|
| - /**
|
| * The element that should be used to position the dropdown when
|
| * it opens, if no position target is configured.
|
| */
|
| @@ -186,31 +169,32 @@
|
| },
|
|
|
| /**
|
| - * The bounding rect of the position target.
|
| + * The horizontal align value, accounting for the RTL/LTR text direction.
|
| */
|
| - get _positionRect() {
|
| - if (!this._positionRectMemo && this.positionTarget) {
|
| - this._positionRectMemo = this.positionTarget.getBoundingClientRect();
|
| + get _localeHorizontalAlign() {
|
| + // In RTL, "left" becomes "right".
|
| + if (this._isRTL) {
|
| + return this.horizontalAlign === 'right' ? 'left' : 'right';
|
| + } else {
|
| + return this.horizontalAlign;
|
| }
|
| -
|
| - return this._positionRectMemo;
|
| },
|
|
|
| /**
|
| * The horizontal offset value used to position the dropdown.
|
| + * @param {ClientRect} dropdownRect
|
| + * @param {ClientRect} positionRect
|
| + * @param {boolean=false} fromRight
|
| + * @return {number} pixels
|
| + * @private
|
| */
|
| - get _horizontalAlignTargetValue() {
|
| + _horizontalAlignTargetValue: function(dropdownRect, positionRect, fromRight) {
|
| var target;
|
| -
|
| - // In RTL, the direction flips, so what is "right" in LTR becomes "left".
|
| - var isRTL = this._isRTL();
|
| - if ((!isRTL && this.horizontalAlign === 'right') ||
|
| - (isRTL && this.horizontalAlign === 'left')) {
|
| - target = document.documentElement.clientWidth - this._positionRect.right;
|
| + if (fromRight) {
|
| + target = document.documentElement.clientWidth - positionRect.right - (this._fitWidth - dropdownRect.right);
|
| } else {
|
| - target = this._positionRect.left;
|
| + target = positionRect.left - dropdownRect.left;
|
| }
|
| -
|
| target += this.horizontalOffset;
|
|
|
| return Math.max(target, 0);
|
| @@ -218,34 +202,25 @@
|
|
|
| /**
|
| * The vertical offset value used to position the dropdown.
|
| + * @param {ClientRect} dropdownRect
|
| + * @param {ClientRect} positionRect
|
| + * @param {boolean=false} fromBottom
|
| + * @return {number} pixels
|
| + * @private
|
| */
|
| - get _verticalAlignTargetValue() {
|
| + _verticalAlignTargetValue: function(dropdownRect, positionRect, fromBottom) {
|
| var target;
|
| -
|
| - if (this.verticalAlign === 'bottom') {
|
| - target = document.documentElement.clientHeight - this._positionRect.bottom;
|
| + if (fromBottom) {
|
| + target = document.documentElement.clientHeight - positionRect.bottom - (this._fitHeight - dropdownRect.bottom);
|
| } else {
|
| - target = this._positionRect.top;
|
| + target = positionRect.top - dropdownRect.top;
|
| }
|
| -
|
| target += this.verticalOffset;
|
|
|
| return Math.max(target, 0);
|
| },
|
|
|
| /**
|
| - * The horizontal align value, accounting for the RTL/LTR text direction.
|
| - */
|
| - get _localeHorizontalAlign() {
|
| - // In RTL, "left" becomes "right".
|
| - if (this._isRTL()) {
|
| - return this.horizontalAlign === 'right' ? 'left' : 'right';
|
| - } else {
|
| - return this.horizontalAlign;
|
| - }
|
| - },
|
| -
|
| - /**
|
| * Called when the value of `opened` changes.
|
| *
|
| * @param {boolean} opened True if the dropdown is opened.
|
| @@ -255,7 +230,8 @@
|
| this.cancel();
|
| } else {
|
| this.cancelAnimation();
|
| - this._prepareDropdown();
|
| + this.sizingTarget = this.containedElement || this.sizingTarget;
|
| + this._updateAnimationConfig();
|
| Polymer.IronOverlayBehaviorImpl._openedChanged.apply(this, arguments);
|
| }
|
| },
|
| @@ -269,6 +245,9 @@
|
| }
|
|
|
| if (!this.noAnimations && this.animationConfig && this.animationConfig.open) {
|
| + if (this.withBackdrop) {
|
| + this.backdropElement.open();
|
| + }
|
| this.$.contentWrapper.classList.add('animating');
|
| this.playAnimation('open');
|
| } else {
|
| @@ -282,6 +261,9 @@
|
| _renderClosed: function() {
|
| Polymer.IronDropdownScrollManager.removeScrollLock(this);
|
| if (!this.noAnimations && this.animationConfig && this.animationConfig.close) {
|
| + if (this.withBackdrop) {
|
| + this.backdropElement.close();
|
| + }
|
| this.$.contentWrapper.classList.add('animating');
|
| this.playAnimation('close');
|
| } else {
|
| @@ -298,45 +280,13 @@
|
| _onNeonAnimationFinish: function() {
|
| this.$.contentWrapper.classList.remove('animating');
|
| if (this.opened) {
|
| - Polymer.IronOverlayBehaviorImpl._renderOpened.apply(this);
|
| + Polymer.IronOverlayBehaviorImpl._finishRenderOpened.apply(this);
|
| } else {
|
| - Polymer.IronOverlayBehaviorImpl._renderClosed.apply(this);
|
| + Polymer.IronOverlayBehaviorImpl._finishRenderClosed.apply(this);
|
| }
|
| },
|
|
|
| /**
|
| - * Called when an `iron-resize` event fires.
|
| - */
|
| - _onIronResize: function() {
|
| - var containedElement = this.containedElement;
|
| - var scrollTop;
|
| - var scrollLeft;
|
| -
|
| - if (this.opened && containedElement) {
|
| - scrollTop = containedElement.scrollTop;
|
| - scrollLeft = containedElement.scrollLeft;
|
| - }
|
| -
|
| - if (this.opened) {
|
| - this._updateOverlayPosition();
|
| - }
|
| -
|
| - Polymer.IronOverlayBehaviorImpl._onIronResize.apply(this, arguments);
|
| -
|
| - if (this.opened && containedElement) {
|
| - containedElement.scrollTop = scrollTop;
|
| - containedElement.scrollLeft = scrollLeft;
|
| - }
|
| - },
|
| -
|
| - /**
|
| - * Called when the `positionTarget` property changes.
|
| - */
|
| - _positionTargetChanged: function() {
|
| - this._updateOverlayPosition();
|
| - },
|
| -
|
| - /**
|
| * Constructs the final animation config from different properties used
|
| * to configure specific parts of the opening and closing animations.
|
| */
|
| @@ -368,43 +318,73 @@
|
| },
|
|
|
| /**
|
| - * Prepares the dropdown for opening by updating measured layout
|
| - * values.
|
| + * Updates the overlay position based on configured horizontal
|
| + * and vertical alignment.
|
| */
|
| - _prepareDropdown: function() {
|
| - this.sizingTarget = this.containedElement || this.sizingTarget;
|
| - this._updateAnimationConfig();
|
| - this._updateOverlayPosition();
|
| + _updateOverlayPosition: function() {
|
| + if (this.isAttached) {
|
| + // This triggers iron-resize, and iron-overlay-behavior will call refit if needed.
|
| + this.notifyResize();
|
| + }
|
| },
|
|
|
| /**
|
| - * Updates the overlay position based on configured horizontal
|
| - * and vertical alignment, and re-memoizes these values for the sake
|
| - * of behavior in `IronFitBehavior`.
|
| + * Useful to call this after the element, the window, or the `fitInfo`
|
| + * element has been resized. Will maintain the scroll position.
|
| */
|
| - _updateOverlayPosition: function() {
|
| - this._positionRectMemo = null;
|
| + refit: function () {
|
| + if (!this.opened) {
|
| + return
|
| + }
|
| + var containedElement = this.containedElement;
|
| + var scrollTop;
|
| + var scrollLeft;
|
|
|
| - if (!this.positionTarget) {
|
| - return;
|
| + if (containedElement) {
|
| + scrollTop = containedElement.scrollTop;
|
| + scrollLeft = containedElement.scrollLeft;
|
| }
|
| + Polymer.IronFitBehavior.refit.apply(this, arguments);
|
|
|
| - this.style[this._localeHorizontalAlign] =
|
| - this._horizontalAlignTargetValue + 'px';
|
| + if (containedElement) {
|
| + containedElement.scrollTop = scrollTop;
|
| + containedElement.scrollLeft = scrollLeft;
|
| + }
|
| + },
|
|
|
| - this.style[this.verticalAlign] =
|
| - this._verticalAlignTargetValue + 'px';
|
| + /**
|
| + * Resets the target element's position and size constraints, and clear
|
| + * the memoized data.
|
| + */
|
| + resetFit: function() {
|
| + Polymer.IronFitBehavior.resetFit.apply(this, arguments);
|
|
|
| - // NOTE(cdata): We re-memoize inline styles here, otherwise
|
| - // calling `refit` from `IronFitBehavior` will reset inline styles
|
| - // to whatever they were when the dropdown first opened.
|
| - if (this._fitInfo) {
|
| - this._fitInfo.inlineStyle[this.horizontalAlign] =
|
| - this.style[this.horizontalAlign];
|
| + var hAlign = this._localeHorizontalAlign;
|
| + var vAlign = this.verticalAlign;
|
| + // Set to 0, 0 in order to discover any offset caused by parent stacking contexts.
|
| + this.style[hAlign] = this.style[vAlign] = '0px';
|
|
|
| - this._fitInfo.inlineStyle[this.verticalAlign] =
|
| - this.style[this.verticalAlign];
|
| - }
|
| + var dropdownRect = this.getBoundingClientRect();
|
| + var positionRect = this.positionTarget.getBoundingClientRect();
|
| + var horizontalValue = this._horizontalAlignTargetValue(dropdownRect, positionRect, hAlign === 'right');
|
| + var verticalValue = this._verticalAlignTargetValue(dropdownRect, positionRect, vAlign === 'bottom');
|
| +
|
| + this.style[hAlign] = horizontalValue + 'px';
|
| + this.style[vAlign] = verticalValue + 'px';
|
| + },
|
| +
|
| + /**
|
| + * Overridden from `IronFitBehavior`.
|
| + * Ensure positionedBy has correct values for horizontally & vertically.
|
| + */
|
| + _discoverInfo: function() {
|
| + Polymer.IronFitBehavior._discoverInfo.apply(this, arguments);
|
| + // Note(valdrin): in Firefox, an element with style `position: fixed; bottom: 90vh; height: 20vh`
|
| + // would have `getComputedStyle(element).top < 0` (instead of being `auto`) http://jsbin.com/cofired/3/edit?html,output
|
| + // This would cause IronFitBehavior's `constrain` to wrongly calculate sizes
|
| + // (it would use `top` instead of `bottom`), so we ensure we give the correct values.
|
| + this._fitInfo.positionedBy.horizontally = this._localeHorizontalAlign;
|
| + this._fitInfo.positionedBy.vertically = this.verticalAlign;
|
| },
|
|
|
| /**
|
|
|