@bitty/animate/dist/animate.esm.js

Create and manage animation functions with AnimationFrame API.

/**
 * @typedef {Object} Animation
 * @property {Boolean} running - Getter that indicates if animation is running.
 * @property {function():void} stop - Stops the animation.
 * @property {function():void} start - Starts the animation.
 */
/**
 * Creates an Animation object to start and stop your animation functions.
 * @example
 * const count = 0;
 *
 * const animation = createAnimation(() => {
 *   context.clearRect(0, 0, width, height);
 *   context.font = "4rem monospace";
 *   context.textAlign = 'center';
 *   context.fillText(count, width / 2, height / 2);
 *
 *   count++;
 * });
 *
 * animation.start();
 * @param {function():void} callback - A callback to handle animation.
 * @returns {Animation}
 */
function animate(callback) {
    var handle = null;
    var running = false;
    var run = function () {
        if (!running)
            return;
        callback();
        handle = window.requestAnimationFrame(run);
    };
    return {
        get running() {
            return running;
        },
        stop: function () {
            if (!running)
                return;
            if (handle) {
                window.cancelAnimationFrame(handle);
                handle = null;
            }
            running = false;
        },
        start: function () {
            if (running)
                return;
            running = true;
            run();
        },
    };
}

export { animate as default };
//# sourceMappingURL=animate.esm.js.map