@netless/slide 1.4.31-alpha.3 → 1.4.32-alpha.0

package/lib/StateDriveSlide.js

@@ -0,0 +1,664 @@
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    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) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import * as localForage from "localforage";
+import { PPTPlayer, PLAYER_EVENTS } from "@netless/ppt-player";
+import { isEqual } from "lodash";
+import EventEmitter from "eventemitter3";
+import { ResizeObserver as ResizeObserverPolyfill } from "@juggle/resize-observer";
+import { RenderingTaskManager } from "./RenderingTaskManager";
+import { waitUntil } from "./waitUntil";
+import { PlayerController } from "./PlayerController";
+// @ts-ignore
+if (!window.__slide_local_logger__) {
+    // @ts-ignore
+    window.__slide_local_logger__ = localForage.createInstance({
+        name: "_slide_local_log_",
+        driver: localForage.INDEXEDDB,
+        version: 1,
+    });
+}
+// @ts-ignore
+var logger = window.__slide_local_logger__;
+var ResizeObserver = window.ResizeObserver || ResizeObserverPolyfill;
+export var SLIDE_EVENTS = {
+    /** 当前 slide 渲染开始触发 */
+    renderStart: "renderStart",
+    /** 当前 slide 渲染完毕触发 */
+    renderEnd: "renderEnd",
+    /** 当前 slide 渲染出错触发 */
+    renderError: "renderError",
+    /** slide 页码变化时触发 */
+    slideChange: "slideChange",
+    // 任意动画开始时触发
+    animateStart: "animateStart",
+    // 任意动画结束时触发
+    animateEnd: "animateEnd",
+    /** slide 状态变化触发 */
+    stateChange: "stateChange",
+};
+var StateDriveSlide = /** @class */ (function (_super) {
+    __extends(StateDriveSlide, _super);
+    function StateDriveSlide(config) {
+        var _this = _super.call(this) || this;
+        _this.__slideState = {
+            taskId: "",
+            url: "",
+            currentSlideIndex: 0,
+            timeNodeSeqState: Object.create(null),
+            mediaState: Object.create(null),
+        };
+        _this.resize = false;
+        _this.isAnimating = false;
+        _this.renderingTaskManager = new RenderingTaskManager();
+        _this.isLoading = false;
+        _this.interactive = true;
+        _this.frameWidth = 1;
+        _this.frameHeight = 1;
+        _this.frame = document.createElement("div");
+        _this.medianController = document.createElement("div");
+        _this.frameResizeObserver = new ResizeObserver(function (entries) {
+            return _this.frameResizeHandler(entries);
+        });
+        _this.timestamp = function () { return Date.now(); };
+        _this.mode = "local";
+        _this.log = "";
+        _this.logId = "";
+        _this.lastEmitedState = null;
+        _this.persistLog = function () { return __awaiter(_this, void 0, void 0, function () {
+            var log, pre, _a;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        if (!(logger && this.logId)) return [3 /*break*/, 5];
+                        _b.label = 1;
+                    case 1:
+                        _b.trys.push([1, 4, , 5]);
+                        log = this.log;
+                        return [4 /*yield*/, logger.getItem(this.logId)];
+                    case 2:
+                        pre = (_b.sent()) || "";
+                        return [4 /*yield*/, logger.setItem(this.logId, pre + log)];
+                    case 3:
+                        _b.sent();
+                        this.log = "";
+                        return [3 /*break*/, 5];
+                    case 4:
+                        _a = _b.sent();
+                        return [3 /*break*/, 5];
+                    case 5: return [2 /*return*/];
+                }
+            });
+        }); };
+        _this.handleSlideStateLog = function () {
+            console.log(_this.logId);
+            console.log(JSON.stringify(_this.slideState, null, 2));
+        };
+        _this.handleLogDownload = function () { return __awaiter(_this, void 0, void 0, function () {
+            var logStr, _a, element;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        logStr = "";
+                        if (!logger) return [3 /*break*/, 2];
+                        _a = logStr;
+                        return [4 /*yield*/, logger.getItem(this.logId)];
+                    case 1:
+                        logStr = _a + ((_b.sent()) || "");
+                        _b.label = 2;
+                    case 2:
+                        logStr += this.log;
+                        element = document.createElement('a');
+                        element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(logStr));
+                        element.setAttribute('download', this.logId);
+                        element.style.display = 'none';
+                        document.body.appendChild(element);
+                        element.click();
+                        document.body.removeChild(element);
+                        return [2 /*return*/];
+                }
+            });
+        }); };
+        if (config.timestamp) {
+            _this.timestamp = config.timestamp;
+        }
+        _this.anchor = config.anchor;
+        _this.resize = config.resize || false;
+        _this.interactive = config.interactive;
+        _this.player = new PPTPlayer(_this.mode);
+        _this.player.setInteractive(_this.interactive);
+        _this.player.updateConfig(config.renderOptions || {});
+        _this.frame.style.cssText = "width:100%;height:100%;display:flex;justify-content:center;align-items:center";
+        _this.frame.appendChild(_this.player.view);
+        _this.setMedianControllerAttribute();
+        _this.frame.appendChild(_this.medianController);
+        _this.anchor.appendChild(_this.frame);
+        if (config === null || config === void 0 ? void 0 : config.controller) {
+            new PlayerController({
+                player: _this.player,
+                params: config.renderOptions || {},
+                target: _this.frame
+            });
+        }
+        _this.frameResizeObserver.observe(_this.frame);
+        _this.player.on(PLAYER_EVENTS.renderStart, function (index) {
+            _this.isLoading = true;
+            _this.emit(SLIDE_EVENTS.renderStart, index);
+        });
+        _this.player.on(PLAYER_EVENTS.renderEnd, function (index) {
+            _this.isLoading = false;
+            _this.emit(SLIDE_EVENTS.renderEnd, index);
+        });
+        _this.player.on(PLAYER_EVENTS.slideChange, function (nextSlideIndex) {
+            _this.__slideState.currentSlideIndex = nextSlideIndex;
+            _this.emit(SLIDE_EVENTS.slideChange, nextSlideIndex);
+        });
+        _this.player.on(PLAYER_EVENTS.seqStateChange, function (args) {
+            _this.__slideState.timeNodeSeqState[args.id] = args;
+            _this.emitStateChange();
+        });
+        _this.player.on(PLAYER_EVENTS.seqStepChange, function (args) {
+            _this.__slideState.timeNodeSeqState[args.id] = args;
+            _this.emitStateChange();
+        });
+        _this.player.on(PLAYER_EVENTS.animateStart, function () {
+            if (_this.isAnimating !== true) {
+                _this.isAnimating = true;
+                _this.emit(SLIDE_EVENTS.animateStart);
+            }
+        });
+        _this.player.on(PLAYER_EVENTS.animateEnd, function () {
+            if (_this.isAnimating !== false) {
+                _this.isAnimating = false;
+                _this.emit(SLIDE_EVENTS.animateEnd);
+            }
+        });
+        _this.player.on(PLAYER_EVENTS.mediaPlay, function (evt) {
+            var mediaState = {
+                type: "play",
+                time: _this.timestamp() - evt.time * 1000,
+            };
+            _this.__slideState.mediaState[evt.id] = mediaState;
+            _this.emitStateChange();
+        });
+        _this.player.on(PLAYER_EVENTS.mediaPause, function (evt) {
+            var mediaState = {
+                type: "pause",
+                time: evt.time,
+            };
+            _this.__slideState.mediaState[evt.id] = mediaState;
+            _this.emitStateChange();
+        });
+        _this.player.on(PLAYER_EVENTS.mediaSeek, function (evt) {
+            var state = {
+                type: "pause",
+                time: 0,
+            };
+            if (evt.isPlaying) {
+                state.type = "play";
+                if (_this.__slideState.mediaState[evt.id]) {
+                    state.time = _this.__slideState.mediaState[evt.id].time - evt.time * 1000;
+                }
+                else {
+                    state.time = _this.timestamp() - evt.time * 1000;
+                }
+                _this.__slideState.mediaState[evt.id] = state;
+            }
+            else {
+                state.type = "pause";
+                state.time = evt.time;
+                _this.__slideState.mediaState[evt.id] = state;
+            }
+            _this.emitStateChange();
+        });
+        _this.renderingTaskManager.eventHub.on("task-error", function (_a) {
+            var error = _a.error, task = _a.task;
+            _this.emit(SLIDE_EVENTS.renderError, { error: error, index: task.slideIndex });
+        });
+        window.addEventListener("__slide_log__", _this.handleLogDownload);
+        window.addEventListener("__slide_state__", _this.handleSlideStateLog);
+        _this.persistLogId = window.setInterval(_this.persistLog, 5000);
+        return _this;
+    }
+    StateDriveSlide.prototype.setMedianControllerAttribute = function () {
+        this.medianController.id = "median-container";
+        this.medianController.style.position = "absolute";
+        this.medianController.style.left = "0";
+        this.medianController.style.top = "0";
+        this.medianController.style.zIndex = "2";
+    };
+    StateDriveSlide.prototype.frameResizeHandler = function (entries) {
+        var _a = entries[0].contentRect, width = _a.width, height = _a.height;
+        this.frameWidth = width;
+        this.frameHeight = height;
+        this.resizeView();
+    };
+    StateDriveSlide.prototype.resizeView = function () {
+        var _this = this;
+        var viewWidth = this.width;
+        var viewHeight = this.height;
+        if (viewWidth > 0 && viewHeight > 0) {
+            var scale_1 = this.frameWidth / viewWidth;
+            var nextHeight = scale_1 * viewHeight;
+            if (nextHeight > this.frameHeight) {
+                scale_1 *= this.frameHeight / nextHeight;
+            }
+            if (this.resize) {
+                // @ts-ignore
+                var app_1 = this.player.app;
+                app_1.ticker.addOnce(function () {
+                    var r = scale_1 * (_this.player.config.resolution || window.devicePixelRatio);
+                    app_1.renderer.resolution = r;
+                    app_1.renderer.plugins.interaction.resolution = app_1.renderer.resolution;
+                    app_1.renderer.resize(_this.width, _this.height);
+                });
+            }
+            this.view.style.transform = "scale(" + scale_1 + ")";
+            this.medianController.style.transform = "scale(" + scale_1 + ")";
+            this.medianController.style.top = (this.frameHeight - viewHeight * scale_1) / 2 + "px";
+        }
+    };
+    /**
+     * 设置整个 slide 的状态, slide 会以传入的状态更新画面.
+     * 供整体同步时候调用.
+     * @param state ISlideState
+     */
+    StateDriveSlide.prototype.setSlideState = function (state) {
+        return __awaiter(this, void 0, void 0, function () {
+            var keys, i, len, key, next, current;
+            var _this = this;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        this.log += "=== stateChange receive [" + new Date().toISOString() + "] ===\n";
+                        this.log += JSON.stringify(state, null, 2);
+                        this.log += "\n\n";
+                        if (state.taskId && state.taskId !== this.__slideState.taskId) {
+                            this.__slideState.taskId = state.taskId;
+                            this.player.setResourceData(state.taskId, this.__slideState.url);
+                        }
+                        if (state.url && state.url !== this.__slideState.url) {
+                            this.__slideState.url = state.url;
+                            this.player.setResourceData(this.__slideState.taskId, state.url);
+                        }
+                        if (!(Number.isInteger(state.currentSlideIndex) && state.currentSlideIndex !== this.__slideState.currentSlideIndex)) return [3 /*break*/, 2];
+                        this.__slideState.currentSlideIndex = state.currentSlideIndex;
+                        return [4 /*yield*/, this.doRenderSlide(state.currentSlideIndex)];
+                    case 1:
+                        _a.sent();
+                        _a.label = 2;
+                    case 2: 
+                    // @ts-ignore
+                    return [4 /*yield*/, waitUntil(function () { return _this.player.currentIndex === state.currentSlideIndex && _this.player.currentStage; }, 30000)];
+                    case 3:
+                        // @ts-ignore
+                        _a.sent();
+                        if (state.timeNodeSeqState) {
+                            keys = Object.keys(state.timeNodeSeqState);
+                            for (i = 0, len = keys.length; i < len; i++) {
+                                key = keys[i];
+                                next = state.timeNodeSeqState[key];
+                                current = this.__slideState.timeNodeSeqState[key];
+                                if (current) {
+                                    this.player.setTimeNodeSeqStep(key, next.step, next.state);
+                                }
+                            }
+                        }
+                        if (state.mediaState) {
+                            this.initMedia(state);
+                            this.__slideState.mediaState = state.mediaState;
+                        }
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    StateDriveSlide.prototype.initMedia = function (state) {
+        var _this = this;
+        var _loop_1 = function (key) {
+            var mediaState = state.mediaState[key];
+            var oldState = this_1.__slideState.mediaState[key];
+            if (oldState && mediaState.type === oldState.type && mediaState.time === oldState.time) {
+                return "continue";
+            }
+            if (mediaState.type === "play") {
+                this_1.player.setMediaState(key, true).then(function () {
+                    var now = _this.timestamp();
+                    _this.player.setMediaCurrentTime(key, (now - mediaState.time) / 1000);
+                });
+            }
+            else {
+                this_1.player.setMediaState(key, false).then(function () {
+                    _this.player.setMediaCurrentTime(key, mediaState.time);
+                });
+            }
+        };
+        var this_1 = this;
+        for (var key in state.mediaState) {
+            _loop_1(key);
+        }
+    };
+    Object.defineProperty(StateDriveSlide.prototype, "slideCount", {
+        /**
+         * 返回 slide 总页数
+         */
+        get: function () {
+            return this.player.slideCount;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(StateDriveSlide.prototype, "slideState", {
+        /**
+         * 整个 slide 的状态, 将获取的值传递给另一个客户端, 并调用 setSlideState
+         * 可以完成整体同步. 只读属性.
+         * @readonly
+         */
+        get: function () {
+            return JSON.parse(JSON.stringify(this.__slideState));
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(StateDriveSlide.prototype, "mainSeqLength", {
+        /**
+         * 主序列动画步数, 只读属性
+         * @readonly
+         */
+        get: function () {
+            return this.player.mainSeqLength();
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(StateDriveSlide.prototype, "mainSeqStep", {
+        /**
+         * 主序列动画, 当前步, 只读属性
+         * @readonly
+         */
+        get: function () {
+            return this.player.mainSeqStep();
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(StateDriveSlide.prototype, "mainSeqState", {
+        /**
+         * 主序列动画, 当前状态, 只读属性
+         *   "idle": 动画尚未运行
+         *   "running": 动画运行中
+         *   "end": 动画已经结束
+         *   null: 当前 Slide 没有主序列动画
+         * @readonly
+         */
+        get: function () {
+            return this.player.mainSeqState();
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(StateDriveSlide.prototype, "renderOptions", {
+        /**
+         * 实时渲染属性, 只读属性.
+         * @readonly
+         */
+        get: function () {
+            return this.player.config;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(StateDriveSlide.prototype, "drawCall", {
+        /**
+         * drawCall 次数, 即每帧调用 gpu drawElements 次数, 只读属性.
+         * @readonly
+         */
+        get: function () {
+            return this.player.runtime.drawCall;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(StateDriveSlide.prototype, "renderFps", {
+        /**
+         * 渲染 fps, 只读属性.
+         * @readonly
+         */
+        get: function () {
+            return this.player.runtime.fps;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(StateDriveSlide.prototype, "runtimeFps", {
+        /**
+         * js 运行时 fps, 只读属性.
+         * @readonly
+         */
+        get: function () {
+            return this.player.fps.value;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(StateDriveSlide.prototype, "view", {
+        /**
+         * 渲染 Slide 的 canvas 元素.
+         * @readonly
+         */
+        get: function () {
+            return this.player.view;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(StateDriveSlide.prototype, "width", {
+        /**
+         * Slide 宽度. 此宽度为设计宽度, 由 ppt 决定. 只读属性.
+         * @readonly
+         */
+        get: function () {
+            return this.player.width;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(StateDriveSlide.prototype, "height", {
+        /**
+         * Slide 高度. 此高度为设计高度, 由 ppt 决定. 只读属性.
+         * @readonly
+         */
+        get: function () {
+            return this.player.height;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    /**
+     * 更新渲染属性
+     * @param renderOptions
+     */
+    StateDriveSlide.prototype.updateRenderOption = function (renderOptions) {
+        this.player.updateConfig(renderOptions);
+    };
+    /**
+     * 设置 ppt 转换后的资源
+     * @param taskId 转换任务 id
+     * @param url 资源 url 前缀
+     */
+    StateDriveSlide.prototype.setResource = function (taskId, url) {
+        this.player.setResourceData(taskId, url);
+        this.__slideState.taskId = taskId;
+        this.__slideState.url = url;
+        this.logId = taskId + "-" + Math.random().toString(32).substr(2);
+        this.emitStateChange();
+    };
+    StateDriveSlide.prototype._renderSlide = function (index) {
+        return __awaiter(this, void 0, void 0, function () {
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        this.isLoading = true;
+                        return [4 /*yield*/, this.player.renderSlide(index)];
+                    case 1:
+                        _a.sent();
+                        this.__slideState.currentSlideIndex = index;
+                        this.isLoading = false;
+                        this.resizeView();
+                        this.emitStateChange();
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    /**
+     * 渲染 index 参数对应的 ppt 页.
+     * @param index 要显示的页码, 从 1 开始
+     */
+    StateDriveSlide.prototype.renderSlide = function (index) {
+        var indexNum = Number(index);
+        if (indexNum === this.player.currentIndex && !this.renderingTaskManager.hasStartTask()) {
+            return;
+        }
+        if (indexNum > this.slideCount && this.slideCount > 0) {
+            return;
+        }
+        this.doRenderSlide(indexNum);
+    };
+    StateDriveSlide.prototype.doRenderSlide = function (index) {
+        var _this = this;
+        this.player.clearForward();
+        this.renderingTaskManager.addTask(function () { return _this._renderSlide(index); }, index);
+    };
+    /**
+     * 执行下一个主序列动画
+     */
+    StateDriveSlide.prototype.nextStep = function () {
+        if (this.isLoading) {
+            return;
+        }
+        this.player.nextStep();
+    };
+    /**
+     * 执行上一个主序列动画
+     */
+    StateDriveSlide.prototype.prevStep = function () {
+        if (this.isLoading) {
+            return;
+        }
+        this.player.prevStep();
+    };
+    StateDriveSlide.prototype.emitStateChange = function () {
+        if (this.mode !== "local") {
+            var nextState = this.slideState;
+            if (!isEqual(this.lastEmitedState, nextState)) {
+                this.lastEmitedState = nextState;
+                this.emit(SLIDE_EVENTS.stateChange, this.slideState);
+                this.log += "=== stateChange dispatch [" + new Date().toISOString() + "] ===\n";
+                this.log += JSON.stringify(this.slideState, null, 2);
+                this.log += "\n\n";
+            }
+        }
+    };
+    /**
+     * 重置主序列动画
+     * @param index 将要重置到的步数
+     * @param status 将要重置到的状态, "start" 重置到动画开始, "end" 重置到动画结束
+     */
+    StateDriveSlide.prototype.setMainSeqStep = function (index, status) {
+        this.player.setMainSeqStep(index, status);
+    };
+    /**
+     * 设置是否可以互动
+     * @param val boolean
+     */
+    StateDriveSlide.prototype.setInteractive = function (val) {
+        this.interactive = val;
+        this.player.setInteractive(val);
+    };
+    /**
+     * 暂停播放
+     */
+    StateDriveSlide.prototype.pause = function () {
+        this.player.pause();
+    };
+    /**
+     * 恢复播放状态
+     */
+    StateDriveSlide.prototype.resume = function () {
+        this.player.resume();
+    };
+    /**
+     * 销毁方法.
+     */
+    StateDriveSlide.prototype.destroy = function () {
+        this.frameResizeObserver.disconnect();
+        this.player.removeAllListeners();
+        this.player.destroy();
+        this.player.removeAllListeners();
+        window.removeEventListener("__slide_log__", this.handleLogDownload);
+        window.removeEventListener("__slide_state__", this.handleSlideStateLog);
+        window.clearInterval(this.persistLogId);
+        if (logger) {
+            logger.removeItem(this.logId).catch(function () {
+                // ignore
+            });
+        }
+        try {
+            this.anchor.removeChild(this.player.view);
+        }
+        catch (e) {
+            // ignore remove error
+        }
+    };
+    return StateDriveSlide;
+}(EventEmitter));
+export { StateDriveSlide };

package/lib/SyncEventQueue.d.ts

@@ -0,0 +1,13 @@
+import { SyncEvent } from "./Slide";
+import EventEmitter from "eventemitter3";
+export declare class SyncEventQueue extends EventEmitter {
+    private queue;
+    private slideIndex;
+    private isLoading;
+    constructor();
+    private findLastRenderSlideIndex;
+    private schedule;
+    setSlideIndex(index: number): void;
+    setIsLoading(val: boolean): void;
+    addEvent(evt: SyncEvent): void;
+}