chenglou / react-tween-state

React animation.
Other
1.74k stars 70 forks source link

Tweening functions are returning NaN #52

Closed charliematters closed 8 years ago

charliematters commented 9 years ago

I'm having some issues with cancelling a running transition with {duration:0, stackBehavior: DESTRUCTIVE}.

After chasing it down, the problem is demonstrated by the following code:

var easeInOutQuad= function(t, b, _c, d) {
    var c = _c - b;
    if ((t /= d / 2) < 1) {
        return c / 2 * t * t + b;
    } else {
        return -c / 2 * ((--t) * (t - 2) - 1) + b;
    }
}

easeInOutQuad(0,1,1,0) // Produces NaN

isNaN(t/d) == isNaN(0/0) == true

This has a number of knock-on problems which I now have to add guards for.

Is it worth adding divide-by-zero protection to the functions?

chenglou commented 8 years ago

Eeeeh, you're right. Sorry for the trouble.

I don't think the tween-functions library should have its functions changed. A duration of 0 is ambiguous for a simple easing function.

I've pushed a change in this lib instead, where a duration of 0 will jump you to the end, as expected.