led-matrix-ts/dist/esm/lib/player/panel-player.js

Highly customizable led matrix for the browser

import { Event } from '../utils/event';
import { Exception } from '../utils/exception';
import { RendererBuilder } from './rendering/renderer-builder';
export class PanelPlayer {
    constructor(params) {
        this.CLASS_NAME = PanelPlayer.name;
        this.onPanelUpdate = new Event();
        this.onReachingBoundary = new Event();
        this._index = 0;
        this.fps = params.fps;
        this._renderer = params.renderer;
        this._sequence = params.sequence;
    }
    get PanelUpdate() { return this.onPanelUpdate.expose(); }
    get ReachingBoundary() { return this.onReachingBoundary.expose(); }
    get sequence() {
        return this._sequence;
    }
    get index() {
        return this._index;
    }
    get fps() {
        return this._fps;
    }
    get renderer() {
        return this._renderer;
    }
    set sequence(value) {
        Exception.throwIfNull(value, Exception.getDescriptionForProperty(this.CLASS_NAME, 'sequence'));
        this._sequence = value;
    }
    set fps(value) {
        const fpsDescription = Exception.getDescriptionForProperty(this.CLASS_NAME, 'fps');
        Exception.throwIfNull(value, fpsDescription);
        Exception.throwIfNotBetween(value, fpsDescription, 0, 60);
        this._fps = value;
        this._fpsIntervalLengthInMs = 1000 / this._fps;
    }
    set renderer(value) {
        Exception.throwIfNull(value, Exception.getDescriptionForProperty(this.CLASS_NAME, 'renderer'));
        this._renderer = value;
        this._render();
    }
    play() {
        this._index = 0;
        this._render();
        this._startLoop();
    }
    stop() {
        this._index = 0;
        this._render();
        this._shouldUpdate = false;
    }
    resume() {
        this._startLoop();
    }
    pause() {
        this._shouldUpdate = false;
    }
    step() {
        this._nextPanelFrame();
    }
    seek(frame) {
        const seekDescription = Exception.getDescriptionForProperty(this.CLASS_NAME, 'seek');
        Exception.throwIfNull(frame, seekDescription);
        Exception.throwIfNotBetween(frame, seekDescription, 0, this._sequence.length);
        this._index = frame;
        this._render();
    }
    setRendererFromBuilder(value) {
        this.renderer = RendererBuilder.build(value.rendererType, value.elementId);
    }
    _nextPanelFrame() {
        Exception.throwIfNull(this._sequence, Exception.getDescriptionForProperty(this.CLASS_NAME, 'sequence'));
        this._incrementIndex();
        this._render();
    }
    _render() {
        this.onPanelUpdate.trigger({ display: this._sequence[this._index] });
        this._renderer.render(this._sequence[this._index]);
    }
    _incrementIndex() {
        const reachedBoundary = this._index >= this._sequence.length;
        if (reachedBoundary) {
            this.onReachingBoundary.trigger();
        }
        this._index = (this._index + 1) % this._sequence.length;
    }
    _startLoop() {
        this._then = Date.now();
        this._shouldUpdate = true;
        this._loop();
    }
    _loop() {
        requestAnimationFrame(this._loop.bind(this));
        if (this._shouldUpdate) {
            this._callIfReadyForNextFrame(this._nextPanelFrame.bind(this));
        }
    }
    _callIfReadyForNextFrame(callback) {
        this._now = Date.now();
        this._elapsed = this._now - this._then;
        if (this._elapsed > this._fpsIntervalLengthInMs) {
            this._then = this._now - (this._elapsed % this._fpsIntervalLengthInMs);
            callback();
        }
    }
}
;
//# sourceMappingURL=panel-player.js.map