2 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
3 This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
4 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
5 The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
6 Code distributed by Google as part of the polymer project is also
7 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
10 <link rel=
"import" href=
"../polymer/polymer.html">
11 <link rel=
"import" href=
"animations/opaque-animation.html">
16 * `Polymer.NeonAnimatableBehavior` is implemented by elements containing animations for use with
17 * elements implementing `Polymer.NeonAnimationRunnerBehavior`.
20 Polymer
.NeonAnimatableBehavior
= {
25 * Animation configuration. See README for more info.
32 * Convenience property for setting an 'entry' animation. Do not set `animationConfig.entry`
33 * manually if using this. The animated node is set to `this` if using this property.
36 observer
: '_entryAnimationChanged',
41 * Convenience property for setting an 'exit' animation. Do not set `animationConfig.exit`
42 * manually if using this. The animated node is set to `this` if using this property.
45 observer
: '_exitAnimationChanged',
51 _entryAnimationChanged: function() {
52 this.animationConfig
= this.animationConfig
|| {};
53 if (this.entryAnimation
!== 'fade-in-animation') {
54 // insert polyfill hack
55 this.animationConfig
['entry'] = [{
56 name
: 'opaque-animation',
59 name
: this.entryAnimation
,
63 this.animationConfig
['entry'] = [{
64 name
: this.entryAnimation
,
70 _exitAnimationChanged: function() {
71 this.animationConfig
= this.animationConfig
|| {};
72 this.animationConfig
['exit'] = [{
73 name
: this.exitAnimation
,
78 _copyProperties: function(config1
, config2
) {
79 // shallowly copy properties from config2 to config1
80 for (var property
in config2
) {
81 config1
[property
] = config2
[property
];
85 _cloneConfig: function(config
) {
89 this._copyProperties(clone
, config
);
93 _getAnimationConfigRecursive: function(type
, map
, allConfigs
) {
94 if (!this.animationConfig
) {
101 thisConfig
= this.animationConfig
[type
];
103 thisConfig
= this.animationConfig
;
106 if (!Array
.isArray(thisConfig
)) {
107 thisConfig
= [thisConfig
];
110 // iterate animations and recurse to process configurations from child nodes
112 for (var config
, index
= 0; config
= thisConfig
[index
]; index
++) {
113 if (config
.animatable
) {
114 config
.animatable
._getAnimationConfigRecursive(config
.type
|| type
, map
, allConfigs
);
117 var cachedConfig
= map
[config
.id
];
119 // merge configurations with the same id, making a clone lazily
120 if (!cachedConfig
.isClone
) {
121 map
[config
.id
] = this._cloneConfig(cachedConfig
)
122 cachedConfig
= map
[config
.id
];
124 this._copyProperties(cachedConfig
, config
);
126 // put any configs with an id into a map
127 map
[config
.id
] = config
;
130 allConfigs
.push(config
);
138 * An element implementing `Polymer.NeonAnimationRunnerBehavior` calls this method to configure
139 * an animation with an optional type. Elements implementing `Polymer.NeonAnimatableBehavior`
140 * should define the property `animationConfig`, which is either a configuration object
141 * or a map of animation type to array of configuration objects.
143 getAnimationConfig: function(type
) {
146 this._getAnimationConfigRecursive(type
, map
, allConfigs
);
147 // append the configurations saved in the map to the array
148 for (var key
in map
) {
149 allConfigs
.push(map
[key
]);