Permalink
Browse files

Share remaining duration between all remaining parts of an effect, al…

…low 0 duration.

Fixes #726
1 parent 4b6beab commit 60c9113413b9fb8cd2c8bd0fa3ef247557c8c329 @Rycochet Rycochet committed Dec 10, 2016
Showing with 38 additions and 28 deletions.
  1. +37 −27 velocity.ui.js
  2. +1 −1 velocity.ui.min.js
View
@@ -2,7 +2,7 @@
Velocity UI Pack
**********************/
-/* VelocityJS.org UI Pack (5.1.2). (C) 2014 Julian Shapiro. MIT @license: en.wikipedia.org/wiki/MIT_License. Portions copyright Daniel Eden, Christian Pucci. */
+/* VelocityJS.org UI Pack (5.2.0). (C) 2014 Julian Shapiro. MIT @license: en.wikipedia.org/wiki/MIT_License. Portions copyright Daniel Eden, Christian Pucci. */
(function(factory) {
"use strict";
@@ -107,7 +107,8 @@
/* Register a custom redirect for each effect. */
Velocity.Redirects[effectName] = function(element, redirectOptions, elementsIndex, elementsSize, elements, promiseData, loop) {
- var finalElement = (elementsIndex === elementsSize - 1);
+ var finalElement = (elementsIndex === elementsSize - 1),
+ totalDuration = 0;
loop = loop || properties.loop;
if (typeof properties.defaultDuration === "function") {
@@ -116,8 +117,17 @@
properties.defaultDuration = parseFloat(properties.defaultDuration);
}
- /* Iterate through each effect's call array. */
+ /* Get the total duration used, so we can share it out with everything that doesn't have a duration */
for (var callIndex = 0; callIndex < properties.calls.length; callIndex++) {
+ durationPercentage = properties.calls[callIndex][1];
+ if (typeof durationPercentage === "number") {
+ totalDuration += durationPercentage;
+ }
+ }
+ var shareDuration = totalDuration >= 1 ? 0 : properties.calls.length ? (1 - totalDuration) / properties.calls.length : 1;
+
+ /* Iterate through each effect's call array. */
+ for (callIndex = 0; callIndex < properties.calls.length; callIndex++) {
var call = properties.calls[callIndex],
propertyMap = call[0],
redirectDuration = 1000,
@@ -132,7 +142,7 @@
}
/* Assign the whitelisted per-call options. */
- opts.duration = redirectDuration * (durationPercentage || 1);
+ opts.duration = redirectDuration * (typeof durationPercentage === "number" ? durationPercentage : shareDuration);
opts.queue = redirectOptions.queue || "";
opts.easing = callOptions.easing || "ease";
opts.delay = parseFloat(callOptions.delay) || 0;
@@ -270,24 +280,24 @@
"callout.shake": {
defaultDuration: 800,
calls: [
- [{translateX: -11}, 0.125],
- [{translateX: 11}, 0.125],
- [{translateX: -11}, 0.125],
- [{translateX: 11}, 0.125],
- [{translateX: -11}, 0.125],
- [{translateX: 11}, 0.125],
- [{translateX: -11}, 0.125],
- [{translateX: 0}, 0.125]
+ [{translateX: -11}],
+ [{translateX: 11}],
+ [{translateX: -11}],
+ [{translateX: 11}],
+ [{translateX: -11}],
+ [{translateX: 11}],
+ [{translateX: -11}],
+ [{translateX: 0}]
]
},
/* Animate.css */
"callout.flash": {
defaultDuration: 1100,
calls: [
- [{opacity: [0, "easeInOutQuad", 1]}, 0.25],
- [{opacity: [1, "easeInOutQuad"]}, 0.25],
- [{opacity: [0, "easeInOutQuad"]}, 0.25],
- [{opacity: [1, "easeInOutQuad"]}, 0.25]
+ [{opacity: [0, "easeInOutQuad", 1]}],
+ [{opacity: [1, "easeInOutQuad"]}],
+ [{opacity: [0, "easeInOutQuad"]}],
+ [{opacity: [1, "easeInOutQuad"]}]
]
},
/* Animate.css */
@@ -302,11 +312,11 @@
"callout.swing": {
defaultDuration: 950,
calls: [
- [{rotateZ: 15}, 0.20],
- [{rotateZ: -10}, 0.20],
- [{rotateZ: 5}, 0.20],
- [{rotateZ: -5}, 0.20],
- [{rotateZ: 0}, 0.20]
+ [{rotateZ: 15}],
+ [{rotateZ: -10}],
+ [{rotateZ: 5}],
+ [{rotateZ: -5}],
+ [{rotateZ: 0}]
]
},
/* Animate.css */
@@ -384,8 +394,8 @@
"transition.flipBounceXOut": {
defaultDuration: 800,
calls: [
- [{opacity: [0.9, 1], transformPerspective: [400, 400], rotateY: -10}, 0.50],
- [{opacity: 0, rotateY: 90}, 0.50]
+ [{opacity: [0.9, 1], transformPerspective: [400, 400], rotateY: -10}],
+ [{opacity: 0, rotateY: 90}]
],
reset: {transformPerspective: 0, rotateY: 0}
},
@@ -405,8 +415,8 @@
"transition.flipBounceYOut": {
defaultDuration: 800,
calls: [
- [{opacity: [0.9, 1], transformPerspective: [400, 400], rotateX: -15}, 0.50],
- [{opacity: 0, rotateX: 90}, 0.50]
+ [{opacity: [0.9, 1], transformPerspective: [400, 400], rotateX: -15}],
+ [{opacity: 0, rotateX: 90}]
],
reset: {transformPerspective: 0, rotateX: 0}
},
@@ -473,9 +483,9 @@
"transition.bounceIn": {
defaultDuration: 800,
calls: [
- [{opacity: [1, 0], scaleX: [1.05, 0.3], scaleY: [1.05, 0.3]}, 0.40],
+ [{opacity: [1, 0], scaleX: [1.05, 0.3], scaleY: [1.05, 0.3]}, 0.35],
[{scaleX: 0.9, scaleY: 0.9, translateZ: 0}, 0.20],
- [{scaleX: 1, scaleY: 1}, 0.50]
+ [{scaleX: 1, scaleY: 1}, 0.45]
]
},
/* Animate.css */
Oops, something went wrong.

0 comments on commit 60c9113

Please sign in to comment.