JSFiddle - React, Tailwind, and code Playground
by icodeforlove
JavaScript
function EasingClamp (func) {
return function (k) {
k = Math.min(Math.max(func(k), 0), 1);
return isNaN(k) ? 0 : k;
};
}
var Easing = {
Linear: {
None: EasingClamp(function (k) {
return k;
})
},
Quadratic: {
In: EasingClamp(function (k) {
return k * k;
}),
Out: EasingClamp(function (k) {
return k * (2 - k);
}),
InOut: EasingClamp(function (k) {
if ((k *= 2) < 1) {
return 0.5 * k * k;
}
return - 0.5 * (--k * (k - 2) - 1);
})
},
Cubic: {
In: EasingClamp(function (k) {
return k * k * k;
}),
Out: EasingClamp(function (k) {
return --k * k * k + 1;
}),
InOut: EasingClamp(function (k) {
if ((k *= 2) < 1) {
return 0.5 * k * k * k;
}
return 0.5 * ((k -= 2) * k * k + 2);
})
},
Quartic: {
In: EasingClamp(function (k) {
return k * k * k * k;
}),
Out: EasingClamp(function (k) {
return 1 - (--k * k * k * k);
}),
InOut: EasingClamp(function (k) {
if ((k *= 2) < 1) {
return 0.5 * k * k * k * k;
}
return - 0.5 * ((k -= 2) * k * k * k - 2);
})
},
Quintic: {
In: EasingClamp(function (k) {
return k * k * k * k * k;
}),
Out: EasingClamp(function (k) {
return --k * k * k * k * k + 1;
}),
InOut: EasingClamp(function (k) {
if ((k *= 2) < 1) {
return 0.5 * k * k * k * k * k;
}
return 0.5 * ((k -= 2) * k * k * k * k + 2);
})
},
Sinusoidal: {
In: EasingClamp(function (k) {
return 1 - Math.cos(k * Math.PI / 2);
}),
Out: EasingClamp(function (k) {
return Math.sin(k * Math.PI / 2);
}),
InOut: EasingClamp(function (k) {
return 0.5 * (1 - Math.cos(Math.PI * k));
})
},
Exponential: {
In: EasingClamp(function (k) {
return k === 0 ? 0 : Math.pow(1024, k - 1);
}),
Out: EasingClamp(function (k) {
return k === 1 ? 1 : 1 - Math.pow(2, - 10 * k);
}),
InOut: EasingClamp(function (k) {
if (k === 0) {
return 0;
}
if (k === 1) {
return 1;
}
if ((k *= 2) < 1) {
return 0.5 * Math.pow(1024, k -...