OLD | NEW |
(Empty) | |
| 1 |
| 2 |
| 3 /** |
| 4 * Use `Polymer.NeonAnimationBehavior` to implement an animation. |
| 5 * @polymerBehavior |
| 6 */ |
| 7 Polymer.NeonAnimationBehavior = { |
| 8 |
| 9 properties: { |
| 10 |
| 11 /** |
| 12 * Defines the animation timing. |
| 13 */ |
| 14 animationTiming: { |
| 15 type: Object, |
| 16 value: function() { |
| 17 return { |
| 18 duration: 500, |
| 19 easing: 'cubic-bezier(0.4, 0, 0.2, 1)', |
| 20 fill: 'both' |
| 21 } |
| 22 } |
| 23 } |
| 24 |
| 25 }, |
| 26 |
| 27 registered: function() { |
| 28 new Polymer.IronMeta({type: 'animation', key: this.is, value: this.constru
ctor}); |
| 29 }, |
| 30 |
| 31 /** |
| 32 * Do any animation configuration here. |
| 33 */ |
| 34 // configure: function(config) { |
| 35 // }, |
| 36 |
| 37 /** |
| 38 * Returns the animation timing by mixing in properties from `config` to the
defaults defined |
| 39 * by the animation. |
| 40 */ |
| 41 timingFromConfig: function(config) { |
| 42 if (config.timing) { |
| 43 for (var property in config.timing) { |
| 44 this.animationTiming[property] = config.timing[property]; |
| 45 } |
| 46 } |
| 47 return this.animationTiming; |
| 48 }, |
| 49 |
| 50 /** |
| 51 * Sets `transform` and `transformOrigin` properties along with the prefixed
versions. |
| 52 */ |
| 53 setPrefixedProperty: function(node, property, value) { |
| 54 var map = { |
| 55 'transform': ['webkitTransform'], |
| 56 'transformOrigin': ['mozTransformOrigin', 'webkitTransformOrigin'] |
| 57 }; |
| 58 var prefixes = map[property]; |
| 59 for (var prefix, index = 0; prefix = prefixes[index]; index++) { |
| 60 node.style[prefix] = value; |
| 61 } |
| 62 node.style[property] = value; |
| 63 }, |
| 64 |
| 65 /** |
| 66 * Called when the animation finishes. |
| 67 */ |
| 68 complete: function() { |
| 69 // FIXME not sure about non-bubbling event |
| 70 this.fire(this.animationEndEvent, null, {bubbles: false}); |
| 71 } |
| 72 |
| 73 }; |
| 74 |
OLD | NEW |