third_party/polymer/v1_0/components-chromium/neon-animation/animations/hero-animation-extracted.js

   1
   2
   3   Polymer({
   4
   5     is: 'hero-animation',
   6
   7     behaviors: [
   8       Polymer.NeonSharedElementAnimationBehavior
   9     ],
  10
  11     configure: function(config) {
  12       var shared = this.findSharedElements(config);
  13       if (!shared) {
  14         return;
  15       }
  16
  17       var fromRect = shared.from.getBoundingClientRect();
  18       var toRect = shared.to.getBoundingClientRect();
  19
  20       var deltaLeft = fromRect.left - toRect.left;
  21       var deltaTop = fromRect.top - toRect.top;
  22       var deltaWidth = fromRect.width / toRect.width;
  23       var deltaHeight = fromRect.height / toRect.height;
  24
  25       this.setPrefixedProperty(shared.to, 'transformOrigin', '0 0');
  26       shared.to.style.zIndex = 10000;
  27       shared.from.style.visibility = 'hidden';
  28
  29       this._effect = new KeyframeEffect(shared.to, [
  30         {'transform': 'translate(' + deltaLeft + 'px,' + deltaTop + 'px) scale(' + deltaWidth + ',' + deltaHeight + ')'},
  31         {'transform': 'none'}
  32       ], this.timingFromConfig(config));
  33
  34       return this._effect;
  35     },
  36
  37     complete: function(config) {
  38       var shared = this.findSharedElements(config);
  39       if (!shared) {
  40         return null;
  41       }
  42       shared.to.style.zIndex = '';
  43       shared.from.style.visibility = '';
  44     }
  45
  46   });
  47