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 |