Commit e1fb048f by Dmitry Baranovskiy

Animation status fix

parent 951f8fb6
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -204,7 +204,7 @@ ...@@ -204,7 +204,7 @@
commaSpaces = /\s*,\s*/, commaSpaces = /\s*,\s*/,
hsrg = {hs: 1, rg: 1}, hsrg = {hs: 1, rg: 1},
p2s = /,?([achlmqrstvxz]),?/gi, p2s = /,?([achlmqrstvxz]),?/gi,
pathCommand = /([achlmqstvz])[\s,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?\s*,?\s*)+)/ig, pathCommand = /([achlmrqstvz])[\s,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?\s*,?\s*)+)/ig,
tCommand = /([rstm])[\s,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?\s*,?\s*)+)/ig, tCommand = /([rstm])[\s,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?\s*,?\s*)+)/ig,
pathValues = /(-?\d*\.?\d*(?:e[\-+]?\d+)?)\s*,?\s*/ig, pathValues = /(-?\d*\.?\d*(?:e[\-+]?\d+)?)\s*,?\s*/ig,
radial_gradient = R._radial_gradient = /^r(?:\(([^,]+?)\s*,\s*([^\)]+?)\))?/, radial_gradient = R._radial_gradient = /^r(?:\(([^,]+?)\s*,\s*([^\)]+?)\))?/,
...@@ -1005,7 +1005,7 @@ ...@@ -1005,7 +1005,7 @@
if (!pathString) { if (!pathString) {
return null; return null;
} }
var paramCounts = {a: 7, c: 6, h: 1, l: 2, m: 2, q: 4, s: 4, t: 2, v: 1, z: 0}, var paramCounts = {a: 7, c: 6, h: 1, l: 2, m: 2, r: 4, q: 4, s: 4, t: 2, v: 1, z: 0},
data = []; data = [];
if (R.is(pathString, array) && R.is(pathString[0], array)) { // rough assumption if (R.is(pathString, array) && R.is(pathString[0], array)) { // rough assumption
data = pathClone(pathString); data = pathClone(pathString);
...@@ -3499,22 +3499,24 @@ ...@@ -3499,22 +3499,24 @@
** **
> Parameters > Parameters
** **
- params (object) final attributes for the element, see also @Element.attr - element (object) element to sync with
- ms (number) number of milliseconds for animation to run - anim (object) animation to sync with
- params (object) #optional final attributes for the element, see also @Element.attr
- ms (number) #optional number of milliseconds for animation to run
- easing (string) #optional easing type. Accept on of @Raphael.easing_formulas or CSS format: `cubic‐bezier(XX, XX, XX, XX)` - easing (string) #optional easing type. Accept on of @Raphael.easing_formulas or CSS format: `cubic‐bezier(XX, XX, XX, XX)`
- callback (function) #optional callback function. Will be called at the end of animation. - callback (function) #optional callback function. Will be called at the end of animation.
* or * or
- animation (object) animation object, see @Raphael.animation - element (object) element to sync with
- anim (object) animation to sync with
- animation (object) #optional animation object, see @Raphael.animation
** **
= (object) original element = (object) original element
\*/ \*/
elproto.animateWith = function (element, params, ms, easing, callback) { elproto.animateWith = function (element, anim, params, ms, easing, callback) {
// var a = R.animation(params, ms, easing, callback); var a = params ? R.animation(params, ms, easing, callback) : anim;
// status = element.status(anim); status = element.status(anim);
// this.animate(a); this.animate(a);
// this.status(a, status); return this.status(a, status * anim.ms / a.ms);
this.animate(params, ms, easing, callback);
return this;
}; };
function CubicBezierAtTime(t, p1x, p1y, p2x, p2y, duration) { function CubicBezierAtTime(t, p1x, p1y, p2x, p2y, duration) {
var cx = 3 * p1x, var cx = 3 * p1x,
...@@ -3811,13 +3813,16 @@ ...@@ -3811,13 +3813,16 @@
totalOrigin: totalOrigin totalOrigin: totalOrigin
}; };
animationElements.push(e); animationElements.push(e);
if (status && !isInAnim) { if (status && !isInAnim && !isInAnimSet) {
e.stop = true; e.stop = true;
e.start = new Date - ms * status; e.start = new Date - ms * status;
if (animationElements.length == 1) { if (animationElements.length == 1) {
return animation(); return animation();
} }
} }
if (isInAnimSet) {
e.start = new Date - e.ms * status;
}
animationElements.length == 1 && requestAnimFrame(animation); animationElements.length == 1 && requestAnimFrame(animation);
} else { } else {
isInAnim.initstatus = status; isInAnim.initstatus = status;
...@@ -3842,6 +3847,9 @@ ...@@ -3842,6 +3847,9 @@
= (object) @Animation = (object) @Animation
\*/ \*/
R.animation = function (params, ms, easing, callback) { R.animation = function (params, ms, easing, callback) {
if (params instanceof Animation) {
return params;
}
if (R.is(easing, "function") || !easing) { if (R.is(easing, "function") || !easing) {
callback = callback || easing || null; callback = callback || easing || null;
easing = null; easing = null;
...@@ -3949,7 +3957,10 @@ ...@@ -3949,7 +3957,10 @@
if (anim) { if (anim) {
return e.status; return e.status;
} }
out.push({anim: e.anim, status: e.status}); out.push({
anim: e.anim,
status: e.status
});
} }
} }
if (anim) { if (anim) {
...@@ -4200,7 +4211,7 @@ ...@@ -4200,7 +4211,7 @@
!--len && callback.call(set); !--len && callback.call(set);
}); });
easing = R.is(easing, string) ? easing : collector; easing = R.is(easing, string) ? easing : collector;
var anim = params instanceof Animation ? params : R.animation(params, ms, easing, collector); var anim = R.animation(params, ms, easing, collector);
item = this.items[--i].animate(anim); item = this.items[--i].animate(anim);
while (i--) { while (i--) {
this.items[i] && !this.items[i].removed && this.items[i].animateWith(item, anim); this.items[i] && !this.items[i].removed && this.items[i].animateWith(item, anim);
......
...@@ -362,7 +362,7 @@ ...@@ -362,7 +362,7 @@
commaSpaces = /\s*,\s*/, commaSpaces = /\s*,\s*/,
hsrg = {hs: 1, rg: 1}, hsrg = {hs: 1, rg: 1},
p2s = /,?([achlmqrstvxz]),?/gi, p2s = /,?([achlmqrstvxz]),?/gi,
pathCommand = /([achlmqstvz])[\s,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?\s*,?\s*)+)/ig, pathCommand = /([achlmrqstvz])[\s,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?\s*,?\s*)+)/ig,
tCommand = /([rstm])[\s,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?\s*,?\s*)+)/ig, tCommand = /([rstm])[\s,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?\s*,?\s*)+)/ig,
pathValues = /(-?\d*\.?\d*(?:e[\-+]?\d+)?)\s*,?\s*/ig, pathValues = /(-?\d*\.?\d*(?:e[\-+]?\d+)?)\s*,?\s*/ig,
radial_gradient = R._radial_gradient = /^r(?:\(([^,]+?)\s*,\s*([^\)]+?)\))?/, radial_gradient = R._radial_gradient = /^r(?:\(([^,]+?)\s*,\s*([^\)]+?)\))?/,
...@@ -884,7 +884,7 @@ ...@@ -884,7 +884,7 @@
if (!pathString) { if (!pathString) {
return null; return null;
} }
var paramCounts = {a: 7, c: 6, h: 1, l: 2, m: 2, q: 4, s: 4, t: 2, v: 1, z: 0}, var paramCounts = {a: 7, c: 6, h: 1, l: 2, m: 2, r: 4, q: 4, s: 4, t: 2, v: 1, z: 0},
data = []; data = [];
if (R.is(pathString, array) && R.is(pathString[0], array)) { // rough assumption if (R.is(pathString, array) && R.is(pathString[0], array)) { // rough assumption
data = pathClone(pathString); data = pathClone(pathString);
...@@ -2559,13 +2559,11 @@ ...@@ -2559,13 +2559,11 @@
return color > 255 ? 255 : color < 0 ? 0 : color; return color > 255 ? 255 : color < 0 ? 0 : color;
}; };
elproto.animateWith = function (element, params, ms, easing, callback) { elproto.animateWith = function (element, anim, params, ms, easing, callback) {
// var a = R.animation(params, ms, easing, callback); var a = params ? R.animation(params, ms, easing, callback) : anim;
// status = element.status(anim); status = element.status(anim);
// this.animate(a); this.animate(a);
// this.status(a, status); return this.status(a, status * anim.ms / a.ms);
this.animate(params, ms, easing, callback);
return this;
}; };
function CubicBezierAtTime(t, p1x, p1y, p2x, p2y, duration) { function CubicBezierAtTime(t, p1x, p1y, p2x, p2y, duration) {
var cx = 3 * p1x, var cx = 3 * p1x,
...@@ -2840,13 +2838,16 @@ ...@@ -2840,13 +2838,16 @@
totalOrigin: totalOrigin totalOrigin: totalOrigin
}; };
animationElements.push(e); animationElements.push(e);
if (status && !isInAnim) { if (status && !isInAnim && !isInAnimSet) {
e.stop = true; e.stop = true;
e.start = new Date - ms * status; e.start = new Date - ms * status;
if (animationElements.length == 1) { if (animationElements.length == 1) {
return animation(); return animation();
} }
} }
if (isInAnimSet) {
e.start = new Date - e.ms * status;
}
animationElements.length == 1 && requestAnimFrame(animation); animationElements.length == 1 && requestAnimFrame(animation);
} else { } else {
isInAnim.initstatus = status; isInAnim.initstatus = status;
...@@ -2856,6 +2857,9 @@ ...@@ -2856,6 +2857,9 @@
} }
R.animation = function (params, ms, easing, callback) { R.animation = function (params, ms, easing, callback) {
if (params instanceof Animation) {
return params;
}
if (R.is(easing, "function") || !easing) { if (R.is(easing, "function") || !easing) {
callback = callback || easing || null; callback = callback || easing || null;
easing = null; easing = null;
...@@ -2912,7 +2916,10 @@ ...@@ -2912,7 +2916,10 @@
if (anim) { if (anim) {
return e.status; return e.status;
} }
out.push({anim: e.anim, status: e.status}); out.push({
anim: e.anim,
status: e.status
});
} }
} }
if (anim) { if (anim) {
...@@ -3078,7 +3085,7 @@ ...@@ -3078,7 +3085,7 @@
!--len && callback.call(set); !--len && callback.call(set);
}); });
easing = R.is(easing, string) ? easing : collector; easing = R.is(easing, string) ? easing : collector;
var anim = params instanceof Animation ? params : R.animation(params, ms, easing, collector); var anim = R.animation(params, ms, easing, collector);
item = this.items[--i].animate(anim); item = this.items[--i].animate(anim);
while (i--) { while (i--) {
this.items[i] && !this.items[i].removed && this.items[i].animateWith(item, anim); this.items[i] && !this.items[i].removed && this.items[i].animateWith(item, anim);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment