Skip to content

Instantly share code, notes, and snippets.

@nkt
Created May 6, 2017
Embed
What would you like to do?
/*
* Copyright 2017 dialog LLC <info@dlg.im>
* @flow
*/
/* eslint no-mixed-operators:0 */
type Config = {
start: number,
end: number,
duration: number,
onUpdate: (value: number) => void,
animation: (x: number) => number
};
function animate(config: Config): void {
const startTime = Date.now();
const step = () => {
const elapsed = Date.now() - startTime;
if (elapsed >= config.duration) {
config.onUpdate(config.end);
} else {
const animation = config.animation(elapsed / config.duration);
config.onUpdate(config.start + (config.end - config.start) * animation);
requestAnimationFrame(step);
}
};
step();
}
export default animate;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment