Index: third_party/polymer/components-chromium/core-animated-pages/core-animated-pages-extracted.js |
diff --git a/third_party/polymer/components-chromium/core-animated-pages/core-animated-pages-extracted.js b/third_party/polymer/components-chromium/core-animated-pages/core-animated-pages-extracted.js |
new file mode 100644 |
index 0000000000000000000000000000000000000000..902436abbd1ab00c1a6f8223473469123861f531 |
--- /dev/null |
+++ b/third_party/polymer/components-chromium/core-animated-pages/core-animated-pages-extracted.js |
@@ -0,0 +1,188 @@ |
+ |
+ |
+ Polymer('core-animated-pages',{ |
+ |
+ eventDelegates: { |
+ 'core-transitionend': 'transitionEnd' |
+ }, |
+ |
+ /** |
+ * A space-delimited string of transitions to use when switching between pages in this element. |
+ * The strings are `id`s of `core-transition-pages` elements included elsewhere. See the |
+ * individual transition's document for specific details. |
+ * |
+ * @attribute transitions |
+ * @type string |
+ * @default '' |
+ */ |
+ transitions: '', |
+ |
+ selected: 0, |
+ |
+ /** |
+ * The last page selected. This property is useful to dynamically set transitions based |
+ * on incoming and outgoing pages. |
+ * |
+ * @attribute lastSelected |
+ * @type Object |
+ * @default null |
+ */ |
+ lastSelected: null, |
+ |
+ registerCallback: function() { |
+ this.tmeta = document.createElement('core-transition'); |
+ }, |
+ |
+ created: function() { |
+ this._transitions = []; |
+ this.transitioning = []; |
+ }, |
+ |
+ transitionsChanged: function() { |
+ this._transitions = this.transitions.split(' '); |
+ }, |
+ |
+ _transitionsChanged: function(old) { |
+ if (this._transitionElements) { |
+ this._transitionElements.forEach(function(t) { |
+ t.teardown(this); |
+ }, this); |
+ } |
+ this._transitionElements = []; |
+ this._transitions.forEach(function(transitionId) { |
+ var t = this.getTransition(transitionId); |
+ if (t) { |
+ this._transitionElements.push(t); |
+ t.setup(this); |
+ } |
+ }, this); |
+ }, |
+ |
+ getTransition: function(transitionId) { |
+ return this.tmeta.byId(transitionId); |
+ }, |
+ |
+ selectionSelect: function(e, detail) { |
+ this.updateSelectedItem(); |
+ // Wait to call applySelection when we run the transition |
+ }, |
+ |
+ applyTransition: function(src, dst) { |
+ if (this.animating) { |
+ this.cancelAsync(this.animating); |
+ this.animating = null; |
+ } |
+ |
+ Platform.flush(); |
+ |
+ if (this.transitioning.indexOf(src) === -1) { |
+ this.transitioning.push(src); |
+ } |
+ if (this.transitioning.indexOf(dst) === -1) { |
+ this.transitioning.push(dst); |
+ } |
+ // force src, dst to display |
+ src.setAttribute('animate', ''); |
+ dst.setAttribute('animate', ''); |
+ // |
+ var options = { |
+ src: src, |
+ dst: dst, |
+ easing: 'cubic-bezier(0.4, 0, 0.2, 1)' |
+ } |
+ |
+ // fire an event so clients have a chance to do something when the |
+ // new page becomes visible but before it draws. |
+ this.fire('core-animated-pages-transition-prepare'); |
+ |
+ // |
+ // prepare transition |
+ this._transitionElements.forEach(function(transition) { |
+ transition.prepare(this, options); |
+ }, this); |
+ // |
+ // force layout! |
+ src.offsetTop; |
+ |
+ // |
+ // apply selection |
+ this.applySelection(dst, true); |
+ this.applySelection(src, false); |
+ // |
+ // start transition |
+ this._transitionElements.forEach(function(transition) { |
+ transition.go(this, options); |
+ }, this); |
+ |
+ if (!this._transitionElements.length) { |
+ this.complete(); |
+ } else { |
+ this.animating = this.async(this.complete.bind(this), null, 5000); |
+ } |
+ }, |
+ |
+ complete: function() { |
+ if (this.animating) { |
+ this.cancelAsync(this.animating); |
+ this.animating = null; |
+ } |
+ |
+ this.transitioning.forEach(function(t) { |
+ t.removeAttribute('animate'); |
+ }); |
+ this.transitioning = []; |
+ |
+ this._transitionElements.forEach(function(transition) { |
+ transition.ensureComplete(this); |
+ }, this); |
+ |
+ this.fire('core-animated-pages-transition-end'); |
+ }, |
+ |
+ transitionEnd: function(e) { |
+ if (this.transitioning.length) { |
+ var completed = true; |
+ this._transitionElements.forEach(function(transition) { |
+ if (!transition.completed) { |
+ completed = false; |
+ } |
+ }); |
+ if (completed) { |
+ this.job('transitionWatch', function() { |
+ this.complete(); |
+ }, 100); |
+ } |
+ } |
+ }, |
+ |
+ selectedChanged: function(old) { |
+ this.lastSelected = old; |
+ this.super(arguments); |
+ }, |
+ |
+ selectedItemChanged: function(oldItem) { |
+ this.super(arguments); |
+ |
+ if (!oldItem) { |
+ this.applySelection(this.selectedItem, true); |
+ return; |
+ } |
+ |
+ if (this.hasAttribute('no-transition') || !this._transitionElements || !this._transitionElements.length) { |
+ this.applySelection(oldItem, false); |
+ this.applySelection(this.selectedItem, true); |
+ return; |
+ } |
+ |
+ if (oldItem && this.selectedItem) { |
+ // TODO(sorvell): allow bindings to update first? |
+ var self = this; |
+ Platform.flush(); |
+ Platform.endOfMicrotask(function() { |
+ self.applyTransition(oldItem, self.selectedItem); |
+ }); |
+ } |
+ } |
+ |
+ }); |
+ |