| 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);
|
| + });
|
| + }
|
| + }
|
| +
|
| + });
|
| +
|
|
|