@netless/slide 0.1.4 → 0.1.5

package/README.md

@@ -48,4 +48,6 @@ slide.setSlideState(args);
 
 ### 运行状态
 
-Slide 对象上暴露了一系列只读属性, 可以获取当前运行状态, 参考 d.ts 类型定义文件.
+Slide 对象上暴露了一系列只读属性, 可以获取当前运行状态, 参考 d.ts 类型定义文件.
+
+### [changelog](./changelog.md)

package/lib/RenderingTaskManager.d.ts

@@ -0,0 +1,19 @@
+import EventEmitter from "eventemitter3";
+export declare class Task {
+    state: "idle" | "start" | "end";
+    index: number;
+    slideIndex: number;
+    private fn;
+    private eventHub;
+    constructor(index: number, slideIndex: number, fn: () => Promise<void>, eventHub: EventEmitter);
+    apply(): Promise<void>;
+}
+export declare class RenderingTaskManager {
+    eventHub: EventEmitter;
+    private tasks;
+    private index;
+    constructor();
+    private replaceIdleTask;
+    addTask(fn: () => Promise<void>, slideIndex: number): void;
+    hasStartTask(): boolean;
+}

package/lib/RenderingTaskManager.js

@@ -0,0 +1,134 @@
+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 EventEmitter from "eventemitter3";
+var Task = /** @class */ (function () {
+    function Task(index, slideIndex, fn, eventHub) {
+        this.state = "idle";
+        this.index = -1;
+        this.slideIndex = -1;
+        this.fn = fn;
+        this.index = index;
+        this.slideIndex = slideIndex;
+        this.eventHub = eventHub;
+    }
+    Task.prototype.apply = function () {
+        return __awaiter(this, void 0, void 0, function () {
+            var e_1;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        this.eventHub.emit("task-start", this);
+                        _a.label = 1;
+                    case 1:
+                        _a.trys.push([1, 3, , 4]);
+                        this.state = "start";
+                        return [4 /*yield*/, this.fn()];
+                    case 2:
+                        _a.sent();
+                        this.state = "end";
+                        this.eventHub.emit("task-end", this);
+                        return [3 /*break*/, 4];
+                    case 3:
+                        e_1 = _a.sent();
+                        this.eventHub.emit("task-error", {
+                            task: this,
+                            error: e_1,
+                        });
+                        return [3 /*break*/, 4];
+                    case 4: return [2 /*return*/];
+                }
+            });
+        });
+    };
+    return Task;
+}());
+export { Task };
+var RenderingTaskManager = /** @class */ (function () {
+    function RenderingTaskManager() {
+        var _this = this;
+        this.eventHub = new EventEmitter();
+        this.tasks = [];
+        this.index = 0;
+        this.eventHub.on("task-end", function (task) {
+            var _a;
+            var selfIndex = _this.tasks.findIndex(function (t) { return t.index === task.index; });
+            var nextIndex = selfIndex + 1;
+            if (nextIndex >= 0) {
+                (_a = _this.tasks[nextIndex]) === null || _a === void 0 ? void 0 : _a.apply();
+            }
+            if (selfIndex >= 0) {
+                _this.tasks.splice(selfIndex, 1);
+                _this.replaceIdleTask();
+            }
+        });
+        this.eventHub.on("task-error", function (_a) {
+            var task = _a.task;
+            var selfIndex = _this.tasks.findIndex(function (t) { return t.index === task.index; });
+            if (selfIndex >= 0) {
+                _this.tasks.splice(selfIndex, 1);
+                _this.replaceIdleTask();
+            }
+        });
+    }
+    RenderingTaskManager.prototype.replaceIdleTask = function () {
+        var _this = this;
+        var _a;
+        var ids = new Set();
+        for (var i = 0, len = this.tasks.length; i < len; i++) {
+            if (this.tasks[i].state === "idle" && ((_a = this.tasks[i + 1]) === null || _a === void 0 ? void 0 : _a.state) === "idle") {
+                ids.add(i);
+            }
+        }
+        Array.from(ids).forEach(function (id) {
+            _this.tasks.splice(id, 1);
+        });
+    };
+    RenderingTaskManager.prototype.addTask = function (fn, slideIndex) {
+        var task = new Task(this.index++, slideIndex, fn, this.eventHub);
+        this.tasks.push(task);
+        this.tasks.sort(function (a, b) { return a.index - b.index; });
+        this.replaceIdleTask();
+        if (this.tasks.length === 1) {
+            task.apply();
+        }
+    };
+    RenderingTaskManager.prototype.hasStartTask = function () {
+        return this.tasks.some(function (t) { return t.state === "start"; });
+    };
+    return RenderingTaskManager;
+}());
+export { RenderingTaskManager };

package/lib/Slide.d.ts

@@ -3,10 +3,20 @@ export declare const SLIDE_EVENTS: {
     syncDispatch: string;
     /** 同步事件接收 */
     syncReceive: string;
+    /** 当前 slide 渲染开始触发 */
+    renderStart: string;
     /** 当前 slide 渲染完毕触发 */
-    render: string;
+    renderEnd: string;
+    /** 当前 slide 渲染出错触发 */
+    renderError: string;
     /** slide 页码变化时触发 */
     slideChange: string;
+    /** 主序列动画开始时触发 */
+    mainSeqStepStart: string;
+    /** 主序列动画结束时触发 */
+    mainSeqStepEnd: string;
+    animateStart: string;
+    animateEnd: string;
 };
 export interface ISlideRenderOptions {
     /** 预期最低渲染 fps, 默认 40 */
@@ -36,40 +46,74 @@ interface ISlideState {
     currentSlideIndex: number;
     mainSeqStep: number;
     mainSeqState: "idle" | "running" | "end" | null;
+    appliedInteractiveSeqIds: string[];
 }
-export declare type SyncEvent = SyncPrevStepEvent | SyncNextStepEvent | SyncRenderSlideEvent | SyncSetResourceEvent;
-export interface SyncPrevStepEvent {
+export declare type SyncEvent = SyncInteractiveAnimEvent | SyncPrevStepEvent | SyncNextStepEvent | SyncRenderSlideEvent | SyncSetResourceEvent;
+export interface BasicSyncEvent {
+}
+export interface SyncInteractiveAnimEvent extends BasicSyncEvent {
+    type: "interactiveAnim";
+    action: string;
+}
+export interface SyncPrevStepEvent extends BasicSyncEvent {
     type: "prevStep";
     next: number;
 }
-export interface SyncNextStepEvent {
+export interface SyncNextStepEvent extends BasicSyncEvent {
     type: "nextStep";
     next: number;
 }
-export interface SyncRenderSlideEvent {
+export interface SyncRenderSlideEvent extends BasicSyncEvent {
     type: "renderSlide";
     index: number;
 }
-export interface SyncSetResourceEvent {
+export interface SyncSetResourceEvent extends BasicSyncEvent {
     type: "setResource";
     taskId: string;
     url: string;
 }
 export interface SlideEventEmitter {
-    emit(event: typeof SLIDE_EVENTS.render): boolean;
-    on(event: typeof SLIDE_EVENTS.render, listener: () => void): this;
+    emit(event: typeof SLIDE_EVENTS.renderStart, index: number): boolean;
+    on(event: typeof SLIDE_EVENTS.renderStart, listener: (index: number) => void): this;
+    emit(event: typeof SLIDE_EVENTS.renderEnd, index: number): boolean;
+    on(event: typeof SLIDE_EVENTS.renderEnd, listener: (index: number) => void): this;
     emit(event: typeof SLIDE_EVENTS.slideChange, nextSlideIndex: number): boolean;
     on(event: typeof SLIDE_EVENTS.slideChange, listener: (nextSlideIndex: number) => void): this;
     emit(event: typeof SLIDE_EVENTS.syncDispatch, args: SyncEvent): boolean;
     on(event: typeof SLIDE_EVENTS.syncReceive, listener: (event: SyncEvent) => void): this;
+    emit(event: typeof SLIDE_EVENTS.renderError, args: {
+        error: Error;
+        index: number;
+    }): boolean;
+    on(event: typeof SLIDE_EVENTS.renderError, listener: (args: {
+        error: Error;
+        index: number;
+    }) => void): this;
+    emit(event: typeof SLIDE_EVENTS.animateStart): boolean;
+    on(event: typeof SLIDE_EVENTS.animateStart, listener: () => void): this;
+    emit(event: typeof SLIDE_EVENTS.animateEnd): boolean;
+    on(event: typeof SLIDE_EVENTS.animateEnd, listener: () => void): this;
+    emit(event: typeof SLIDE_EVENTS.mainSeqStepStart, index: number): boolean;
+    on(event: typeof SLIDE_EVENTS.mainSeqStepStart, listener: (index: number) => void): this;
+    emit(event: typeof SLIDE_EVENTS.mainSeqStepEnd, index: number): boolean;
+    on(event: typeof SLIDE_EVENTS.mainSeqStepEnd, listener: (index: number) => void): this;
 }
 declare const Slide_base: new () => SlideEventEmitter;
 export declare class Slide extends Slide_base {
     private __slideState;
+    private isAnimating;
+    private renderingTaskManager;
+    private isLoading;
     private interactive;
     private anchor;
     private player;
+    private frameWidth;
+    private frameHeight;
+    private frame;
+    private frameResizeObserver;
     constructor(config: ISlideConfig);
+    private frameResizeHandler;
+    private resizeView;
     private receiveSyncHandler;
     /**
      * 设置整个 slide 的状态, slide 会以传入的状态更新画面.
@@ -77,6 +121,10 @@ export declare class Slide extends Slide_base {
      * @param state ISlideState
      */
     setSlideState(state: Partial<ISlideState>): Promise<void>;
+    /**
+     * 返回 slide 总页数
+     */
+    get slideCount(): number;
     /**
      * 整个 slide 的状态, 将获取的值传递给另一个客户端, 并调用 setSlideState
      * 可以完成整体同步. 只读属性.
@@ -148,25 +196,39 @@ export declare class Slide extends Slide_base {
      * @param url 资源 url 前缀
      */
     setResource(taskId: string, url: string): void;
+    private _renderSlide;
     /**
      * 渲染 index 参数对应的 ppt 页.
-     * @param index
+     * @param index 要显示的页码, 从 1 开始
      */
-    renderSlide(index: number): Promise<void>;
+    renderSlide(index: number, isReceive?: boolean): void;
     /**
      * 执行下一个主序列动画
      */
-    nextStep(): void;
+    nextStep(isReceive?: boolean): void;
     /**
      * 执行上一个主序列动画
      */
-    prevStep(): void;
+    prevStep(isReceive?: boolean): void;
     /**
      * 重置主序列动画
      * @param index 将要重置到的步数
      * @param status 将要重置到的状态, "start" 重置到动画开始, "end" 重置到动画结束
      */
     setMainSeqStep(index: number, status: "start" | "end"): void;
+    /**
+     * 设置是否可以互动
+     * @param val boolean
+     */
+    setInteractive(val: boolean): void;
+    /**
+     * 暂停播放
+     */
+    pause(): void;
+    /**
+     * 恢复播放状态
+     */
+    resume(): void;
     /**
      * 销毁方法.
      */