diff options
Diffstat (limited to 'catapult/third_party/polymer/components/iron-resizable-behavior/iron-resizable-behavior.html')
-rw-r--r-- | catapult/third_party/polymer/components/iron-resizable-behavior/iron-resizable-behavior.html | 195 |
1 files changed, 195 insertions, 0 deletions
diff --git a/catapult/third_party/polymer/components/iron-resizable-behavior/iron-resizable-behavior.html b/catapult/third_party/polymer/components/iron-resizable-behavior/iron-resizable-behavior.html new file mode 100644 index 00000000..42b65562 --- /dev/null +++ b/catapult/third_party/polymer/components/iron-resizable-behavior/iron-resizable-behavior.html @@ -0,0 +1,195 @@ +<!-- +@license +Copyright (c) 2015 The Polymer Project Authors. All rights reserved. +This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt +The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt +The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt +Code distributed by Google as part of the polymer project is also +subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt +--> + +<link rel="import" href="../polymer/polymer.html"> + +<script> + /** + * `IronResizableBehavior` is a behavior that can be used in Polymer elements to + * coordinate the flow of resize events between "resizers" (elements that control the + * size or hidden state of their children) and "resizables" (elements that need to be + * notified when they are resized or un-hidden by their parents in order to take + * action on their new measurements). + * + * Elements that perform measurement should add the `IronResizableBehavior` behavior to + * their element definition and listen for the `iron-resize` event on themselves. + * This event will be fired when they become showing after having been hidden, + * when they are resized explicitly by another resizable, or when the window has been + * resized. + * + * Note, the `iron-resize` event is non-bubbling. + * + * @polymerBehavior Polymer.IronResizableBehavior + * @demo demo/index.html + **/ + Polymer.IronResizableBehavior = { + properties: { + /** + * The closest ancestor element that implements `IronResizableBehavior`. + */ + _parentResizable: { + type: Object, + observer: '_parentResizableChanged' + }, + + /** + * True if this element is currently notifying its descendant elements of + * resize. + */ + _notifyingDescendant: { + type: Boolean, + value: false + } + }, + + listeners: { + 'iron-request-resize-notifications': '_onIronRequestResizeNotifications' + }, + + created: function() { + // We don't really need property effects on these, and also we want them + // to be created before the `_parentResizable` observer fires: + this._interestedResizables = []; + this._boundNotifyResize = this.notifyResize.bind(this); + }, + + attached: function() { + this.fire('iron-request-resize-notifications', null, { + node: this, + bubbles: true, + cancelable: true + }); + + if (!this._parentResizable) { + window.addEventListener('resize', this._boundNotifyResize); + this.notifyResize(); + } + }, + + detached: function() { + if (this._parentResizable) { + this._parentResizable.stopResizeNotificationsFor(this); + } else { + window.removeEventListener('resize', this._boundNotifyResize); + } + + this._parentResizable = null; + }, + + /** + * Can be called to manually notify a resizable and its descendant + * resizables of a resize change. + */ + notifyResize: function() { + if (!this.isAttached) { + return; + } + + this._interestedResizables.forEach(function(resizable) { + if (this.resizerShouldNotify(resizable)) { + this._notifyDescendant(resizable); + } + }, this); + + this._fireResize(); + }, + + /** + * Used to assign the closest resizable ancestor to this resizable + * if the ancestor detects a request for notifications. + */ + assignParentResizable: function(parentResizable) { + this._parentResizable = parentResizable; + }, + + /** + * Used to remove a resizable descendant from the list of descendants + * that should be notified of a resize change. + */ + stopResizeNotificationsFor: function(target) { + var index = this._interestedResizables.indexOf(target); + + if (index > -1) { + this._interestedResizables.splice(index, 1); + this.unlisten(target, 'iron-resize', '_onDescendantIronResize'); + } + }, + + /** + * This method can be overridden to filter nested elements that should or + * should not be notified by the current element. Return true if an element + * should be notified, or false if it should not be notified. + * + * @param {HTMLElement} element A candidate descendant element that + * implements `IronResizableBehavior`. + * @return {boolean} True if the `element` should be notified of resize. + */ + resizerShouldNotify: function(element) { return true; }, + + _onDescendantIronResize: function(event) { + if (this._notifyingDescendant) { + event.stopPropagation(); + return; + } + + // NOTE(cdata): In ShadowDOM, event retargeting makes echoing of the + // otherwise non-bubbling event "just work." We do it manually here for + // the case where Polymer is not using shadow roots for whatever reason: + if (!Polymer.Settings.useShadow) { + this._fireResize(); + } + }, + + _fireResize: function() { + this.fire('iron-resize', null, { + node: this, + bubbles: false + }); + }, + + _onIronRequestResizeNotifications: function(event) { + var target = event.path ? event.path[0] : event.target; + + if (target === this) { + return; + } + + if (this._interestedResizables.indexOf(target) === -1) { + this._interestedResizables.push(target); + this.listen(target, 'iron-resize', '_onDescendantIronResize'); + } + + target.assignParentResizable(this); + this._notifyDescendant(target); + + event.stopPropagation(); + }, + + _parentResizableChanged: function(parentResizable) { + if (parentResizable) { + window.removeEventListener('resize', this._boundNotifyResize); + } + }, + + _notifyDescendant: function(descendant) { + // NOTE(cdata): In IE10, attached is fired on children first, so it's + // important not to notify them if the parent is not attached yet (or + // else they will get redundantly notified when the parent attaches). + if (!this.isAttached) { + return; + } + + this._notifyingDescendant = true; + descendant.notifyResize(); + this._notifyingDescendant = false; + } + }; +</script> + |