Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(17)

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

Issue 1261403002: Add paper-menu-button and its dependencies to third_party/polymer (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: reproduce.sh Created 5 years, 5 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
Download patch
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
new file mode 100644
index 0000000000000000000000000000000000000000..cdc931d62d138736d3049bc68ca1286d4f34f435
--- /dev/null
+++ b/third_party/polymer/v1_0/components-chromium/iron-dropdown/iron-dropdown-extracted.js
@@ -0,0 +1,278 @@
+
+ (function() {
+ 'use strict';
+
+ Polymer({
+ is: 'iron-dropdown',
+
+ behaviors: [
+ Polymer.IronControlState,
+ Polymer.IronA11yKeysBehavior,
+ Polymer.IronOverlayBehavior,
+ Polymer.NeonAnimationRunnerBehavior
+ ],
+
+ properties: {
+ /**
+ * The orientation against which to align the dropdown content
+ * horizontally relative to the dropdown trigger.
+ */
+ horizontalAlign: {
+ type: String,
+ value: 'left',
+ reflectToAttribute: true
+ },
+
+ /**
+ * The orientation against which to align the dropdown content
+ * vertically relative to the dropdown trigger.
+ */
+ verticalAlign: {
+ type: String,
+ value: 'top',
+ reflectToAttribute: true
+ },
+
+ /**
+ * The element that should be used to position the dropdown when
+ * it is opened.
+ */
+ positionTarget: {
+ type: Object,
+ observer: '_positionTargetChanged'
+ },
+
+ /**
+ * An animation config. If provided, this will be used to animate the
+ * opening of the dropdown.
+ */
+ openAnimationConfig: {
+ type: Object
+ },
+
+ /**
+ * An animation config. If provided, this will be used to animate the
+ * closing of the dropdown.
+ */
+ closeAnimationConfig: {
+ type: Object
+ },
+
+ /**
+ * Set to true to disable animations when opening and closing the
+ * dropdown.
+ */
+ noAnimations: {
+ 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
+ }
+ },
+
+ listeners: {
+ 'neon-animation-finish': '_onNeonAnimationFinish'
+ },
+
+ observers: [
+ '_updateOverlayPosition(verticalAlign, horizontalAlign)'
+ ],
+
+ attached: function() {
+ if (this.positionTarget === undefined) {
+ this.positionTarget = this._defaultPositionTarget;
+ }
+ },
+
+ /**
+ * The element that is contained by the dropdown, if any.
+ */
+ get containedElement() {
+ return Polymer.dom(this.$.content).getDistributedNodes()[0];
+ },
+
+ get _defaultPositionTarget() {
+ var parent = Polymer.dom(this).parentNode;
+
+ if (parent.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {
+ parent = parent.host;
+ }
+
+ return parent;
+ },
+
+ get _positionRect() {
+ if (!this._positionRectMemo && this.positionTarget) {
+ this._positionRectMemo = this.positionTarget.getBoundingClientRect();
+ }
+
+ return this._positionRectMemo;
+ },
+
+ get _horizontalAlignTargetValue() {
+ var target;
+
+ if (this.horizontalAlign === 'right') {
+ target = document.documentElement.clientWidth - this._positionRect.right;
+ } else {
+ target = this._positionRect.left;
+ }
+
+ return Math.max(target, 0);
+ },
+
+ get _verticalAlignTargetValue() {
+ var target;
+
+ if (this.verticalAlign === 'bottom') {
+ target = document.documentElement.clientHeight - this._positionRect.bottom;
+ } else {
+ target = this._positionRect.top;
+ }
+
+ return Math.max(target, 0);
+ },
+
+ _openedChanged: function(opened) {
+ if (opened && this.disabled) {
+ this.cancel();
+ } else {
+ this._cancelAnimations();
+ this._prepareDropdown();
+ Polymer.IronOverlayBehaviorImpl._openedChanged.apply(this, arguments);
+ }
+ },
+
+ _renderOpened: function() {
+ Polymer.IronDropdownScrollManager.pushScrollLock(this);
+ if (!this.noAnimations && this.animationConfig && this.animationConfig.open) {
+ this.$.contentWrapper.classList.add('animating');
+ this.playAnimation('open');
+ } else {
+ this._focusContent();
+ Polymer.IronOverlayBehaviorImpl._renderOpened.apply(this, arguments);
+ }
+ },
+
+ _renderClosed: function() {
+ Polymer.IronDropdownScrollManager.removeScrollLock(this);
+ if (!this.noAnimations && this.animationConfig && this.animationConfig.close) {
+ this.$.contentWrapper.classList.add('animating');
+ this.playAnimation('close');
+ } else {
+ Polymer.IronOverlayBehaviorImpl._renderClosed.apply(this, arguments);
+ }
+ },
+
+ _onNeonAnimationFinish: function() {
+ this.$.contentWrapper.classList.remove('animating');
+ if (this.opened) {
+ Polymer.IronOverlayBehaviorImpl._renderOpened.apply(this);
+ } else {
+ Polymer.IronOverlayBehaviorImpl._renderClosed.apply(this);
+ }
+ },
+
+ _onIronResize: function() {
+ var containedElement = this.containedElement;
+ var scrollTop;
+ var scrollLeft;
+
+ if (containedElement) {
+ scrollTop = containedElement.scrollTop;
+ scrollLeft = containedElement.scrollLeft;
+ }
+
+ if (this.opened) {
+ this._updateOverlayPosition();
+ }
+
+ Polymer.IronOverlayBehaviorImpl._onIronResize.apply(this, arguments);
+
+ if (containedElement) {
+ containedElement.scrollTop = scrollTop;
+ containedElement.scrollLeft = scrollLeft;
+ }
+ },
+
+ _positionTargetChanged: function() {
+ this._updateOverlayPosition();
+ },
+
+ _cancelAnimations: function() {
+ this.cancelAnimation();
+ },
+
+ _updateAnimationConfig: function() {
+ var animationConfig = {};
+ var animations = [];
+
+ if (this.openAnimationConfig) {
+ // NOTE(cdata): When making `display:none` elements visible in Safari,
+ // the element will paint once in a fully visible state, causing the
+ // dropdown to flash before it fades in. We prepend an
+ // `opaque-animation` to fix this problem:
+ animationConfig.open = [{
+ name: 'opaque-animation',
+ }].concat(this.openAnimationConfig);
+ animations = animations.concat(animationConfig.open);
+ }
+
+ if (this.closeAnimationConfig) {
+ animationConfig.close = this.closeAnimationConfig;
+ animations = animations.concat(animationConfig.close);
+ }
+
+ animations.forEach(function(animation) {
+ animation.node = this.containedElement;
+ }, this);
+
+ this.animationConfig = animationConfig;
+ },
+
+ _prepareDropdown: function() {
+ this.sizingTarget = this.containedElement || this.sizingTarget;
+ this._updateAnimationConfig();
+ this._updateOverlayPosition();
+ },
+
+ _updateOverlayPosition: function() {
+ this._positionRectMemo = null;
+
+ if (!this.positionTarget) {
+ return;
+ }
+
+ this.style[this.horizontalAlign] =
+ this._horizontalAlignTargetValue + 'px';
+
+ this.style[this.verticalAlign] =
+ this._verticalAlignTargetValue + 'px';
+
+ // 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];
+
+ this._fitInfo.inlineStyle[this.verticalAlign] =
+ this.style[this.verticalAlign];
+ }
+ },
+
+ _focusContent: function() {
+ if (this.containedElement) {
+ this.containedElement.focus();
+ }
+ }
+ });
+ })();
+

Powered by Google App Engine
This is Rietveld 408576698