jw-animator

0.1.5 • Public • Published

jw-animator

A static and stateful instance which hooks into requestAnimationFrame. It uses setInterval if requestAnimationFrame is not available.

NPM version build status node version npm download

Demo

Install

NPM

Methods

Method Parameters Description
setFPS fps: integer set a specific frame rate for the animation.
setPauseOnHidden hidden: boolean set whether the animations to be paused when the page loses focus.
setResumeOnShown shown: boolean set whether the animations to be resume when the page regains focus.
start start the animation loop.
pause pause the animation loop.
resume resume the animation loop.
stop stop the animation loop.
add handler: function bind an event handler to the animate event. A time difference will be passed as a parameter (in seconds).
Returns a method to unbind.
onStart handler: function bind an event handler to the start event.
Returns a method to unbind.
onPause handler: function bind an event handler to the pause event.
Returns a method to unbind.
onResume handler: function bind an event handler to the resume event.
Returns a method to unbind.
onStop handler: function bind an event handler to the stop event.
Returns a method to unbind.

Usage

import Animator from "jw-animator";
 
/* Create an instance of an animator. */
let animator = new Animator();
 
/** Set a specific frame rate for the animation. */
animator.setFPS(fps);
 
/* Set the animations to be paused when the page loses focus. */
animator.setPauseOnHidden(pauseOnHidden);
 
/* Set the animations to be resume when the page regains focus. */
animator.setResumeOnShown(resumeOnShown);
 
/** Start the animation loop. */
animator.start();
 
/** Pause the animation loop. */
animator.pause();
 
/** Resume the animation loop. */
animator.resume();
 
/** Stop the animation loop. */
animator.stop();
 
/** Bind an event handler to the animate event. */
let remove = animator.add(timeDiff => { ... });
 
/** Unbind an event handler from the animate event. */
remove();
 
/** Bind an event handler to the start event. */
let removeStart = animator.onStart(() => { ... });
 
/** Unbind an event handler from the start event. */
removeStart();
 
/** Bind an event handler to the pause event. */
let removePause = animator.onPause(() => { ... });
 
/** Unbind an event handler from the pause event. */
removePause();
 
/** Bind an event handler to the resume event. */
let removeResume = animator.onResume(() => { ... });
 
/** Unbind an event handler from the resume event. */
removeResume();
 
/** Bind an event handler to the stop event. */
let removeStop = animator.onStop(() => { ... });
 
/** Unbind an event handler from the stop event. */
removeStop();

Package Sidebar

Install

npm i jw-animator

Weekly Downloads

0

Version

0.1.5

License

MIT

Unpacked Size

558 kB

Total Files

21

Last publish

Collaborators

  • johnwong