Skip to content
This repository has been archived by the owner on Dec 19, 2024. It is now read-only.

Commit

Permalink
remove duplicate code (now done in iron-fit-behavior) (#79)
Browse files Browse the repository at this point in the history
  • Loading branch information
@valdrinkoshi
valdrinkoshi committed May 5, 2016
1 parent f7a47d4 commit 51283cf
Showing 1 changed file with 2 additions and 155 deletions.
157 changes: 2 additions & 155 deletions iron-dropdown.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -81,6 +81,7 @@
/**
* The orientation against which to align the dropdown content
* horizontally relative to the dropdown trigger.
* Overridden from `Polymer.IronFitBehavior`.
*/
horizontalAlign: {
type: String,
Expand All @@ -91,61 +92,14 @@
/**
* The orientation against which to align the dropdown content
* vertically relative to the dropdown trigger.
* Overridden from `Polymer.IronFitBehavior`.
*/
verticalAlign: {
type: String,
value: 'top',
reflectToAttribute: true
},

/**
* A pixel value that will be added to the position calculated for the
* given `horizontalAlign`, in the direction of alignment. You can think
* of it as increasing or decreasing the distance to the side of the
* screen given by `horizontalAlign`.
*
* If `horizontalAlign` is "left", this offset will increase or decrease
* the distance to the left side of the screen: a negative offset will
* move the dropdown to the left; a positive one, to the right.
*
* Conversely if `horizontalAlign` is "right", this offset will increase
* or decrease the distance to the right side of the screen: a negative
* offset will move the dropdown to the right; a positive one, to the left.
*/
horizontalOffset: {
type: Number,
value: 0,
notify: true
},

/**
* A pixel value that will be added to the position calculated for the
* given `verticalAlign`, in the direction of alignment. You can think
* of it as increasing or decreasing the distance to the side of the
* screen given by `verticalAlign`.
*
* If `verticalAlign` is "top", this offset will increase or decrease
* the distance to the top side of the screen: a negative offset will
* move the dropdown upwards; a positive one, downwards.
*
* Conversely if `verticalAlign` is "bottom", this offset will increase
* or decrease the distance to the bottom side of the screen: a negative
* offset will move the dropdown downwards; a positive one, upwards.
*/
verticalOffset: {
type: Number,
value: 0,
notify: true
},

/**
* The element that should be used to position the dropdown when
* it is opened.
*/
positionTarget: {
type: Object
},

/**
* An animation config. If provided, this will be used to animate the
* opening of the dropdown.
Expand Down Expand Up @@ -199,12 +153,6 @@
'_updateOverlayPosition(positionTarget, verticalAlign, horizontalAlign, verticalOffset, horizontalOffset)'
],

attached: function() {
// Memoize this to avoid expensive calculations & relayouts.
this._isRTL = window.getComputedStyle(this).direction == 'rtl';
this.positionTarget = this.positionTarget || this._defaultPositionTarget;
},

/**
* The element that is contained by the dropdown, if any.
*/
Expand All @@ -220,72 +168,6 @@
return this.focusTarget || this.containedElement;
},

/**
* The element that should be used to position the dropdown when
* it opens, if no position target is configured.
*/
get _defaultPositionTarget() {
var parent = Polymer.dom(this).parentNode;

if (parent.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {
parent = parent.host;
}

return parent;
},

/**
* 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;
}
},

/**
* The horizontal offset value used to position the dropdown.
* @param {ClientRect} dropdownRect
* @param {ClientRect} positionRect
* @param {boolean=} fromRight
* @return {number} pixels
* @private
*/
_horizontalAlignTargetValue: function(dropdownRect, positionRect, fromRight) {
var target;
if (fromRight) {
target = document.documentElement.clientWidth - positionRect.right - (this._fitWidth - dropdownRect.right);
} else {
target = positionRect.left - dropdownRect.left;
}
target += this.horizontalOffset;

return Math.max(target, 0);
},

/**
* The vertical offset value used to position the dropdown.
* @param {ClientRect} dropdownRect
* @param {ClientRect} positionRect
* @param {boolean=} fromBottom
* @return {number} pixels
* @private
*/
_verticalAlignTargetValue: function(dropdownRect, positionRect, fromBottom) {
var target;
if (fromBottom) {
target = document.documentElement.clientHeight - positionRect.bottom - (this._fitHeight - dropdownRect.bottom);
} else {
target = positionRect.top - dropdownRect.top;
}
target += this.verticalOffset;

return Math.max(target, 0);
},

/**
* Called when the value of `opened` changes.
* Overridden from `IronOverlayBehavior`
Expand Down Expand Up @@ -417,41 +299,6 @@
}
},

/**
* Resets the target element's position and size constraints, and clear
* the memoized data.
*/
resetFit: function() {
Polymer.IronFitBehavior.resetFit.apply(this, arguments);

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';

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;
},

/**
* Apply focus to focusTarget or containedElement
*/
Expand Down

0 comments on commit 51283cf

Please sign in to comment.