@visactor/vrender-components/cjs/player/continuous-player.js

components library for dp visualization

"use strict";

var __awaiter = this && this.__awaiter || function(thisArg, _arguments, P, generator) {
    return new (P || (P = Promise))((function(resolve, reject) {
        function fulfilled(value) {
            try {
                step(generator.next(value));
            } catch (e) {
                reject(e);
            }
        }
        function rejected(value) {
            try {
                step(generator.throw(value));
            } catch (e) {
                reject(e);
            }
        }
        function step(result) {
            var value;
            result.done ? resolve(result.value) : (value = result.value, value instanceof P ? value : new P((function(resolve) {
                resolve(value);
            }))).then(fulfilled, rejected);
        }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    }));
};

Object.defineProperty(exports, "__esModule", {
    value: !0
}), exports.ContinuousPlayer = void 0;

const vrender_core_1 = require("@visactor/vrender-core"), base_player_1 = require("./base-player"), type_1 = require("./type"), constant_1 = require("./controller/constant"), register_1 = require("./register");

(0, register_1.loadContinuousPlayerComponent)();

class ContinuousPlayer extends base_player_1.BasePlayer {
    constructor(attributes) {
        super(attributes), this._isPlaying = !1, this._startTime = Date.now(), this._initAttributes = () => {
            var _a;
            super._initAttributes(), this._maxIndex = this._data.length, this._slider.setAttribute("max", this._maxIndex), 
            this._isPlaying = !1, this._elapsed = 0, this._interval = null !== (_a = this.attribute.interval) && void 0 !== _a ? _a : 1e3;
            const frames = this._data.length;
            this.attribute.totalDuration && this._data.length ? (this._totalDuration = this.attribute.totalDuration, 
            this._interval = this._totalDuration / (null != frames ? frames : 1)) : (this._totalDuration = this._interval * frames, 
            this._interval = this.attribute.interval);
        }, this._initDataIndex = () => {
            var _a;
            this._dataIndex = null !== (_a = this.attribute.dataIndex) && void 0 !== _a ? _a : this._minIndex;
        }, this._initEvents = () => {
            this.attribute.disableTriggerEvent || (this._controller.addEventListener(constant_1.ControllerEventEnum.OnPlay, (e => {
                e.stopPropagation(), this.play();
            })), this._controller.addEventListener(constant_1.ControllerEventEnum.OnPause, (e => {
                e.stopPropagation(), this.pause();
            })), this._controller.addEventListener(constant_1.ControllerEventEnum.OnForward, (e => {
                e.stopPropagation(), this.forward();
            })), this._controller.addEventListener(constant_1.ControllerEventEnum.OnBackward, (e => {
                e.stopPropagation(), this.backward();
            })), this._slider.addEventListener("change", (e => {
                var _a;
                e.stopPropagation();
                const value = null === (_a = e.detail) || void 0 === _a ? void 0 : _a.value, progress = value / this._maxIndex;
                this._elapsed = progress * this._totalDuration, this._startTime = Date.now() - this._elapsed, 
                this._dispatchChange(value);
            })));
        }, this._getSliderValue = () => {
            const progress = this._elapsed / this._totalDuration;
            return Math.min(progress * this._maxIndex, this._maxIndex);
        }, this._updateSlider = () => {
            const value = this._getSliderValue();
            this._dataIndex = Math.floor(value), this._slider.setValue(Math.min(value, this._maxIndex)), 
            this._dispatchChange(Math.floor(value));
        }, this._dispatchChange = value => {
            const index = Math.floor(value);
            index !== this._activeIndex && (this._dataIndex = index, this._activeIndex = index, 
            index !== this._maxIndex && this.dispatchCustomEvent(type_1.PlayerEventEnum.change));
        }, this.play = () => __awaiter(this, void 0, void 0, (function*() {
            this._isPlaying || (this._controller.togglePause(), this._isPlaying = !0, this._elapsed >= this._totalDuration && (this._elapsed = 0), 
            this._startTime = Date.now() - this._elapsed, this.dispatchCustomEvent(type_1.PlayerEventEnum.play), 
            this._rafId = vrender_core_1.vglobal.getRequestAnimationFrame()(this._play.bind(this)));
        })), this._play = () => {
            this._elapsed = Date.now() - this._startTime;
            const value = this._getSliderValue();
            this._updateSlider(), value >= this._maxIndex ? this._playEnd() : this._rafId = vrender_core_1.vglobal.getRequestAnimationFrame()(this._play.bind(this));
        }, this._playEnd = () => {
            this._isPlaying = !1, vrender_core_1.vglobal.getCancelAnimationFrame()(this._rafId), 
            this._controller.togglePlay(), this.dispatchCustomEvent(type_1.PlayerEventEnum.end);
        }, this.pause = () => {
            this._isPlaying && (this._isPlaying = !1, this._elapsed = Date.now() - this._startTime, 
            vrender_core_1.vglobal.getCancelAnimationFrame()(this._rafId), this._controller.togglePlay(), 
            this.dispatchCustomEvent(type_1.PlayerEventEnum.pause));
        }, this.backward = () => {
            const now = Date.now(), interval = 1 * this._interval, elapsed = this._elapsed - interval;
            elapsed <= 0 ? (this._elapsed = 0, this._startTime = now) : (this._elapsed = elapsed, 
            this._startTime = this._startTime + this._interval), this._updateSlider(), this.dispatchCustomEvent(type_1.PlayerEventEnum.backward);
        }, this.forward = () => {
            const now = Date.now(), interval = 1 * this._interval, elapsed = this._elapsed + interval;
            elapsed >= this._totalDuration ? (this._startTime = now - this._totalDuration, this._elapsed = this._totalDuration) : (this._startTime = this._startTime - interval, 
            this._elapsed = elapsed), this._updateSlider(), this.dispatchCustomEvent(type_1.PlayerEventEnum.forward);
        }, this._initAttributes(), this._initDataIndex(), this._initEvents();
    }
    dispatchCustomEvent(eventType) {
        super.dispatchCustomEvent(eventType, this._dataIndex);
    }
    render() {
        super.render();
    }
}

exports.ContinuousPlayer = ContinuousPlayer;
//# sourceMappingURL=continuous-player.js.map