@netless/window-manager 0.4.0-canary.27 → 0.4.0-canary.30

package/docs/api.md

@@ -11,6 +11,9 @@
     - [`closeApp`](#closeApp)
     - [`setMainViewSceneIndex`](#setMainViewSceneIndex)
     - [`setBoxState`](#setBoxState)
+    - [`cleanCurrentScene`](#cleanCurrentScene)
+    - [`redo`](#redo)
+    - [`undo`](#undo)
   - [实例属性](#prototypes)
   - [事件回调](#events)
 
@@ -128,19 +131,45 @@ manager.setMainViewSceneIndex(1)
 manager.setBoxState("normal") // boxState: normal | maximized | minimized
 ```
 
+<h3 id="cleanCurrentScene">cleanCurrentScene</h3>
+
+> 清除当前 focus 的 view 的笔迹
+
+```ts
+manager.cleanCurrentScene()
+```
+
+<h3 id="redo">redo</h3>
+
+> 在当前 focus 的 view 上重做上一步操作
+
+```ts
+manager.redo()
+```
+
+<h3 id="undo">undo</h3>
+
+> 在当前 focus 的 view 上撤消上一步操作
+
+```ts
+manager.undo()
+```
+
 <br>
 
 <h2 id="prototypes">实例属性</h2>
 
-| name               | type    | default | desc              |
-| ------------------ | ------- | ------- | ----------------- |
-| mainView           | View    |         | 主白板               |
-| mainViewSceneIndex | number  |         | 当前主白板的 SceneIndex |
+| name               | type    | default | desc                   |
+| ------------------ | ------- | ------- | -----------------      |
+| mainView           | View    |         | 主白板                  |
+| mainViewSceneIndex | number  |         | 当前主白板的 SceneIndex  |
 | mainViewScenesLength | number |        | mainView 的 scenes 长度 |
-| boxState           | string  |         | 当前窗口状态            |
-| darkMode           | boolean |         | 黑夜模式              |
-| prefersColorScheme | string  |         | 颜色主题              |
-| focused            | string |         | focus 的 app      |
+| boxState           | string  |         | 当前窗口状态             |
+| darkMode           | boolean |         | 黑夜模式                 |
+| prefersColorScheme | string  |         | 颜色主题                 |
+| focused            | string |          | focus 的 app            |
+| canRedoSteps       | number  |         | 当前 focus 的 view 可以重做的步数 |
+| canRedoSteps       | number  |         | 当前 focus 的 view 可以撤销的步数 |
 
 <br>
 
@@ -159,4 +188,6 @@ manager.callbacks.on(events, listener)
 | prefersColorSchemeChange | string         |         | auto,light,dark            |
 | cameraStateChange        | CameraState    |         |                            |
 | focusedChange            | string, undefined |     | 当前 focus 的 appId，主白板时为 undefined  |
-| mainViewScenesLengthChange | number      |         | mainView scenes 添加或删除时触发 |
+| mainViewScenesLengthChange | number      |         | mainView scenes 添加或删除时触发 |
+| canRedoStepsChange       | number         |         | 当前 focus 的 view 可重做步数改变 |
+| canUndoStepsChange       | number         |         | 当前 focus 的 view 可撤销步数改变 |

package/docs/replay.md

@@ -0,0 +1,40 @@
+## 回放
+
+> 注意: 多窗口的回放只支持从创建房间开始就是多窗口的房间
+
+> 如果是一开始作为单窗口模式使用，又转变成多窗口模式使用, 则会造成回放渲染空白
+
+<br>
+
+
+```typescript
+import { WhiteWebSdk } from "white-web-sdk";
+import { WindowManager, BuiltinApps } from "@netless/window-manager";
+import "@netless/window-manager/dist/style.css";
+
+const sdk = new WhiteWebSdk({
+    appIdentifier: "appIdentifier",
+    useMobXState: true // 请确保打开这个选项
+});
+
+let manager: WindowManager;
+
+sdk.replayRoom({
+    uuid: "room uuid",
+    roomToken: "room token",
+    invisiblePlugins: [WindowManager],
+    useMultiViews: true, // 多窗口必须用开启 useMultiViews
+}).then(player => {
+   player.callbacks.on("onPhaseChanged", async (phase) => {
+       if (phase === PlayerPhase.Playing) {
+           if (manager) return;
+            manager = await WindowManager.mount({
+                room: player,
+                container: document.getElementById("container")
+            });
+       }
+   })
+});
+
+player.play(); // WindowManager 只有在播放之后才能挂载
+```

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@netless/window-manager",
-  "version": "0.4.0-canary.27",
+  "version": "0.4.0-canary.30",
   "description": "",
   "main": "dist/index.es.js",
   "module": "dist/index.es.js",
@@ -58,6 +58,6 @@
     "typescript": "^4.3.5",
     "video.js": "^7.14.3",
     "vite": "^2.5.3",
-    "white-web-sdk": "^2.16.1"
+    "white-web-sdk": "^2.16.4"
   }
 }

package/src/AppContext.ts

@@ -152,7 +152,10 @@ export class AppContext<TAttributes = any, TMagixEventPayloads = any, TAppOption
     }
 
     /** Dispatch events to other clients (and self). */
-    public dispatchMagixEvent: MagixEventDispatcher<TMagixEventPayloads> = (this.manager.displayer as Room).dispatchMagixEvent.bind(this.manager.displayer)
+    public dispatchMagixEvent: MagixEventDispatcher<TMagixEventPayloads> = (...args) => {
+        // can't dispatch events on replay mode
+        return this.manager.room?.dispatchMagixEvent(...args);
+    }
 
     /** Listen to events from others clients (and self messages). */
     public addMagixEventListener: MagixEventAddListener<TMagixEventPayloads> = (event, handler, options) => {

package/src/AppManager.ts

@@ -1,4 +1,5 @@
 import { AppAttributes, AppStatus, Events, MagixEventName, ROOT_DIR } from "./constants";
+import { AppCreateQueue } from "./Utils/AppCreateQueue";
 import { AppListeners } from "./AppListener";
 import { AppProxy } from "./AppProxy";
 import { appRegister } from "./Register";
@@ -20,9 +21,8 @@ import {
 } from "./Utils/Common";
 import type { ReconnectRefresher } from "./ReconnectRefresher";
 import type { BoxManager } from "./BoxManager";
-import type { Displayer, DisplayerState, Room, ScenesCallbacksNode } from "white-web-sdk";
+import type { Displayer, DisplayerState, Room, ScenesCallbacksNode, View } from "white-web-sdk";
 import type { AddAppParams, BaseInsertParams, TeleBoxRect, EmitterEvent } from "./index";
-import { AppCreateQueue } from "./Utils/AppCreateQueue";
 
 export class AppManager {
     public displayer: Displayer;
@@ -187,6 +187,10 @@ export class AppManager {
                 const focused = get(this.attributes, "focus");
                 if (this._prevFocused !== focused) {
                     callbacks.emit("focusedChange", focused);
+                    this.disposePrevFocusViewRedoUndoListeners(this._prevFocused);
+                    setTimeout(() => {
+                        this.addRedoUndoListeners(focused);
+                    }, 0);
                     this._prevFocused = focused;
                     if (focused !== undefined) {
                         this.boxManager?.focusBox({ appId: focused });
@@ -212,8 +216,60 @@ export class AppManager {
         this.displayerWritableListener(!this.room?.isWritable);
         this.displayer.callbacks.on("onEnableWriteNowChanged", this.displayerWritableListener);
         this._prevFocused = this.attributes.focus;
+        this.addRedoUndoListeners(this.attributes.focus);
     }
 
+    private disposePrevFocusViewRedoUndoListeners = (prevFocused: string | undefined) => {
+        if (prevFocused === undefined) {
+            this.mainView.callbacks.off("onCanRedoStepsUpdate", this.onCanRedoStepsUpdate);
+            this.mainView.callbacks.off("onCanUndoStepsUpdate", this.onCanRedoStepsUpdate);
+        } else {
+            const appProxy = this.appProxies.get(prevFocused);
+            if (appProxy) {
+                appProxy.view?.callbacks.off("onCanRedoStepsUpdate", this.onCanRedoStepsUpdate);
+                appProxy.view?.callbacks.off("onCanUndoStepsUpdate", this.onCanUndoStepsUpdate);
+            }
+        }
+    };
+
+    private addRedoUndoListeners = (focused: string | undefined) => {
+        if (focused === undefined) {
+            this.addViewCallbacks(
+                this.mainView,
+                this.onCanRedoStepsUpdate,
+                this.onCanUndoStepsUpdate
+            );
+        } else {
+            const focusApp = this.appProxies.get(focused);
+            if (focusApp && focusApp.view) {
+                this.addViewCallbacks(
+                    focusApp.view,
+                    this.onCanRedoStepsUpdate,
+                    this.onCanUndoStepsUpdate
+                );
+            }
+        }
+    };
+
+    private addViewCallbacks = (
+        view: View,
+        redoListener: (steps: number) => void,
+        undoListener: (steps: number) => void
+    ) => {
+        redoListener(view.canRedoSteps);
+        undoListener(view.canUndoSteps);
+        view.callbacks.on("onCanRedoStepsUpdate", redoListener);
+        view.callbacks.on("onCanUndoStepsUpdate", undoListener);
+    };
+
+    private onCanRedoStepsUpdate = (steps: number) => {
+        callbacks.emit("canRedoStepsChange", steps);
+    };
+
+    private onCanUndoStepsUpdate = (steps: number) => {
+        callbacks.emit("canUndoStepsChange", steps);
+    };
+
     /**
      * 插件更新 attributes 时的回调
      *
@@ -439,7 +495,7 @@ export class AppManager {
             this.safeSetAttributes({ _mainScenePath: scenePath });
             this.store.setMainViewFocusPath(this.mainView);
             this.updateSceneIndex();
-            this.dispatchInternalEvent(Events.SetMainViewScenePath, { nextScenePath: scenePath });
+            this.dispatchSetMainViewScenePath(scenePath);
         }
     }
 
@@ -469,9 +525,7 @@ export class AppManager {
                     if (success) {
                         this.store.setMainViewScenePath(scenePath);
                         this.safeSetAttributes({ _mainSceneIndex: index });
-                        this.dispatchInternalEvent(Events.SetMainViewScenePath, {
-                            nextScenePath: scenePath,
-                        });
+                        this.dispatchSetMainViewScenePath(scenePath);
                     }
                 } else {
                     throw new Error(`[WindowManager]: ${sceneDir}: ${index} not valid index`);
@@ -480,6 +534,12 @@ export class AppManager {
         }
     }
 
+    private dispatchSetMainViewScenePath(scenePath: string): void {
+        this.dispatchInternalEvent(Events.SetMainViewScenePath, { nextScenePath: scenePath });
+        // 兼容 15 的 SDK, 需要 room 的当前 ScenePath
+        setScenePath(this.room, scenePath);
+    }
+
     public getAppInitPath(appId: string): string | undefined {
         const attrs = this.store.getAppAttributes(appId);
         if (attrs) {
@@ -587,6 +647,8 @@ export class AppManager {
         callbacks.clearListeners();
         this.callbacksNode?.dispose();
         this.appCreateQueue.destroy();
+        this.disposePrevFocusViewRedoUndoListeners(this._prevFocused);
+        this._prevFocused = undefined;
         this._prevSceneIndex = undefined;
     }
 }

package/src/ContainerResizeObserver.ts

@@ -1,6 +1,6 @@
 import { ResizeObserver as ResizeObserverPolyfill } from "@juggle/resize-observer";
 import { WindowManager } from "./index";
-import type { EmitterType} from "./index";
+import type { EmitterType } from "./index";
 
 const ResizeObserver = window.ResizeObserver || ResizeObserverPolyfill;
 
@@ -13,7 +13,7 @@ export class ContainerResizeObserver {
         container: HTMLElement,
         sizer: HTMLElement,
         wrapper: HTMLDivElement,
-        emitter: EmitterType,
+        emitter: EmitterType
     ) {
         const containerResizeObserver = new ContainerResizeObserver(emitter);
         containerResizeObserver.observePlaygroundSize(container, sizer, wrapper);
@@ -31,7 +31,7 @@ export class ContainerResizeObserver {
             const containerRect = entries[0]?.contentRect;
             if (containerRect) {
                 this.updateSizer(containerRect, sizer, wrapper);
-                this.emitter.emit("playgroundSizeChange", containerRect)
+                this.emitter.emit("playgroundSizeChange", containerRect);
             }
         });
 

package/src/Cursor/Cursor.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
     import { isEmpty } from "lodash";
+    import { ApplianceNames } from "white-web-sdk";
 
     export let cursorName: string;
     export let tagName: string;
@@ -19,6 +20,7 @@
     $: hasTagName = !isEmpty(tagName);
     $: hasAvatar = !isEmpty(avatar);
     $: display = visible ? "initial" : "none";
+    $: isLaserPointer = appliance === ApplianceNames.laserPointer;
 
     const computedAvatarStyle = () => {
         return Object.entries({
@@ -36,28 +38,30 @@
 <div
     class="netless-window-manager-cursor-mid"
     style="transform: translateX({x}px) translateY({y}px);display: {display}"
->
-    <div class="netless-window-manager-cursor-name">
-        <div
-            class={theme}
-            style="background-color: {backgroundColor};color: {color};opacity: {opacity}"
-        >
-            {#if hasAvatar}
-                <img
-                    class="netless-window-manager-cursor-selector-avatar"
-                    style={computedAvatarStyle()}
-                    src={avatar}
-                    alt="avatar"
-                />
-            {/if}
-            <span style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis;max-width: 80px">{cursorName}</span>
-            {#if hasTagName}
-                <span class="netless-window-manager-cursor-tag-name" style="background-color: {cursorTagBackgroundColor}">
-                    {tagName}
-                </span>
-            {/if}
+>   
+    {#if !isLaserPointer}
+        <div class="netless-window-manager-cursor-name">
+            <div
+                class={theme}
+                style="background-color: {backgroundColor};color: {color};opacity: {opacity}"
+            >
+                {#if hasAvatar}
+                    <img
+                        class="netless-window-manager-cursor-selector-avatar"
+                        style={computedAvatarStyle()}
+                        src={avatar}
+                        alt="avatar"
+                    />
+                {/if}
+                <span style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis;max-width: 80px">{cursorName}</span>
+                {#if hasTagName}
+                    <span class="netless-window-manager-cursor-tag-name" style="background-color: {cursorTagBackgroundColor}">
+                        {tagName}
+                    </span>
+                {/if}
+            </div>
         </div>
-    </div>
+    {/if}
     <div class="cursor-image-wrapper">
         <img class="netless-window-manager-cursor-{appliance}-image" {src} alt={appliance} />
     </div>

package/src/Cursor/Cursor.ts

@@ -23,7 +23,7 @@ export class Cursor {
         private cursorManager: CursorManager,
         private wrapper?: HTMLElement
     ) {
-        this.setMember();
+        this.updateMember();
         this.createCursor();
         this.autoHidden();
     }
@@ -158,9 +158,10 @@ export class Cursor {
         }
     }
 
-    public setMember() {
+    public updateMember() {
         this.member = this.manager.findMemberByUid(this.memberId);
         this.updateComponent();
+        return this.member;
     }
 
     private updateComponent() {

package/src/Cursor/icons.ts

@@ -4,6 +4,7 @@ import selector from "../image/selector-cursor.png";
 import eraser from "../image/eraser-cursor.png";
 import shape from "../image/shape-cursor.svg";
 import text from "../image/text-cursor.svg";
+import laser from "../image/laser-pointer-cursor.svg";
 
 export const ApplianceMap: {
     [key: string]: string;
@@ -13,4 +14,5 @@ export const ApplianceMap: {
     [ApplianceNames.eraser]: eraser,
     [ApplianceNames.shape]: shape,
     [ApplianceNames.text]: text,
+    [ApplianceNames.laserPointer]: laser,
 };

package/src/Cursor/index.ts

@@ -1,8 +1,9 @@
-import { throttle } from "lodash";
+import { ApplianceNames } from "white-web-sdk";
 import { Cursor } from "./Cursor";
 import { CursorState, Events } from "../constants";
 import { emitter, WindowManager } from "../index";
 import { SideEffectManager } from "side-effect-manager";
+import { throttle } from "lodash";
 import type { CursorMovePayload } from "../index";
 import type { PositionType } from "../AttributesDelegate";
 import type { Point, RoomMember, View } from "white-web-sdk";
@@ -27,7 +28,7 @@ export class CursorManager {
     private sideEffectManager = new SideEffectManager();
     private store = this.manager.store;
 
-    constructor(private manager: AppManager) {
+    constructor(private manager: AppManager, private enableCursor: boolean) {
         this.roomMembers = this.manager.room?.state.roomMembers;
         const wrapper = WindowManager.wrapper;
         if (wrapper) {
@@ -42,8 +43,12 @@ export class CursorManager {
             if (payload.state === CursorState.Leave) {
                 cursorInstance.leave();
             } else {
-                cursorInstance.setMember();
-                cursorInstance.move(payload.position);
+                const member = cursorInstance.updateMember();
+                const isLaserPointer =
+                    member?.memberState.currentApplianceName === ApplianceNames.laserPointer;
+                if (this.enableCursor || isLaserPointer) {
+                    cursorInstance.move(payload.position);
+                }
             }
         });
         this.sideEffectManager.add(() => {
@@ -51,7 +56,7 @@ export class CursorManager {
                 this.updateContainerRect();
             });
             return unsubscribe;
-        })
+        });
     }
 
     public setupWrapper(wrapper: HTMLElement) {

package/src/Helper.ts

@@ -1,3 +1,7 @@
+import { getVersionNumber } from "./Utils/Common";
+import { REQUIRE_VERSION } from "./constants";
+import { WhiteVersion } from "white-web-sdk";
+import { WhiteWebSDKInvalidError } from "./Utils/error";
 import { WindowManager } from "./index";
 
 export const setupWrapper = (
@@ -27,4 +31,11 @@ export const setupWrapper = (
     WindowManager.wrapper = wrapper;
 
     return { playground, wrapper, sizer, mainViewElement };
-};
+};
+
+export const checkVersion = () => {
+    const version = getVersionNumber(WhiteVersion);
+    if (version < getVersionNumber(REQUIRE_VERSION)) {
+        throw new WhiteWebSDKInvalidError(REQUIRE_VERSION);
+    }
+};

package/src/image/laser-pointer-cursor.svg

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 55.1 (78136) - https://sketchapp.com -->
+    <title>编组 2</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <filter x="-120.0%" y="-120.0%" width="340.0%" height="340.0%" filterUnits="objectBoundingBox" id="filter-1">
+            <feGaussianBlur stdDeviation="4" in="SourceGraphic"></feGaussianBlur>
+        </filter>
+    </defs>
+    <g id="页面1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="编组-2" transform="translate(9.000000, 9.000000)" fill="#FF0100">
+            <circle id="椭圆形" filter="url(#filter-1)" cx="5" cy="5" r="5"></circle>
+            <path d="M5,8 C6.65685425,8 8,6.65685425 8,5 C8,3.34314575 6.65685425,2 5,2 C3.34314575,2 2,3.34314575 2,5 C2,6.65685425 3.34314575,8 5,8 Z M5,6.28571429 C4.28991961,6.28571429 3.71428571,5.71008039 3.71428571,5 C3.71428571,4.28991961 4.28991961,3.71428571 5,3.71428571 C5.71008039,3.71428571 6.28571429,4.28991961 6.28571429,5 C6.28571429,5.71008039 5.71008039,6.28571429 5,6.28571429 Z" id="椭圆形" fill-rule="nonzero"></path>
+        </g>
+    </g>
+</svg>

package/src/index.ts

@@ -2,25 +2,25 @@ import Emittery from "emittery";
 import pRetry from "p-retry";
 import { AppManager } from "./AppManager";
 import { appRegister } from "./Register";
+import { checkVersion, setupWrapper } from "./Helper";
 import { ContainerResizeObserver } from "./ContainerResizeObserver";
 import { createBoxManager } from "./BoxManager";
 import { CursorManager } from "./Cursor";
-import { DEFAULT_CONTAINER_RATIO, Events, REQUIRE_VERSION } from "./constants";
+import { DEFAULT_CONTAINER_RATIO, Events } from "./constants";
 import { Fields } from "./AttributesDelegate";
 import { initDb } from "./Register/storage";
+import { InvisiblePlugin, isPlayer, isRoom, RoomPhase, ViewMode } from "white-web-sdk";
 import { isNull, isObject } from "lodash";
 import { log } from "./Utils/log";
 import { ReconnectRefresher } from "./ReconnectRefresher";
 import { replaceRoomFunction } from "./Utils/RoomHacker";
 import { setupBuiltin } from "./BuiltinApps";
-import { setupWrapper } from "./Helper";
 import "./style.css";
 import "@netless/telebox-insider/dist/style.css";
 import {
     addEmitterOnceListener,
     ensureValidScenePath,
     entireScenes,
-    getVersionNumber,
     isValidScenePath,
     wait,
 } from "./Utils/Common";
@@ -30,17 +30,8 @@ import {
     AppManagerNotInitError,
     InvalidScenePath,
     ParamsInvalidError,
-    WhiteWebSDKInvalidError,
 } from "./Utils/error";
 import type { Apps, Position } from "./AttributesDelegate";
-import {
-    InvisiblePlugin,
-    isPlayer,
-    isRoom,
-    RoomPhase,
-    ViewMode,
-    WhiteVersion,
-} from "white-web-sdk";
 import type {
     Displayer,
     SceneDefinition,
@@ -159,6 +150,8 @@ export type PublicEvent = {
     mainViewSceneIndexChange: number;
     focusedChange: string | undefined;
     mainViewScenesLengthChange: number;
+    canRedoStepsChange: number;
+    canUndoStepsChange: number;
 };
 
 export type MountParams = {
@@ -224,7 +217,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
         const cursor = params.cursor;
         WindowManager.params = params;
 
-        this.checkVersion();
+        checkVersion();
         let manager: WindowManager | undefined = undefined;
         if (isRoom(room)) {
             if (room.phase !== RoomPhase.Connected) {
@@ -270,10 +263,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
         await manager.ensureAttributes();
 
         manager.appManager = new AppManager(manager);
-
-        if (cursor) {
-            manager.cursorManager = new CursorManager(manager.appManager);
-        }
+        manager.cursorManager = new CursorManager(manager.appManager, Boolean(cursor));
 
         if (params.container) {
             manager.bindContainer(params.container);
@@ -641,6 +631,24 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
         return this.appManager?.mainViewScenesLength || 0;
     }
 
+    public get canRedoSteps(): number {
+        const focused = this.focused;
+        if (focused) {
+            return this.appManager?.focusApp?.view?.canRedoSteps || 0;
+        } else {
+            return this.mainView.canRedoSteps;
+        }
+    }
+
+    public get canUndoSteps(): number {
+        const focused = this.focused;
+        if (focused) {
+            return this.appManager?.focusApp?.view?.canUndoSteps || 0;
+        } else {
+            return this.mainView.canUndoSteps;
+        }
+    }
+
     /**
      * 查询所有的 App
      */
@@ -749,18 +757,38 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
         this.appManager?.boxManager?.setPrefersColorScheme(scheme);
     }
 
-    private isDynamicPPT(scenes: SceneDefinition[]) {
-        const sceneSrc = scenes[0]?.ppt?.src;
-        return sceneSrc?.startsWith("pptx://");
+    public cleanCurrentScene(): void {
+        const focused = this.focused;
+        if (focused) {
+            this.appManager?.focusApp?.view?.cleanCurrentScene();
+        } else {
+            this.mainView.cleanCurrentScene();
+        }
     }
 
-    private static checkVersion() {
-        const version = getVersionNumber(WhiteVersion);
-        if (version < getVersionNumber(REQUIRE_VERSION)) {
-            throw new WhiteWebSDKInvalidError(REQUIRE_VERSION);
+    public redo(): void {
+        const focused = this.focused;
+        if (focused) {
+            this.appManager?.focusApp?.view?.redo();
+        } else {
+            this.mainView.redo();
         }
     }
 
+    public undo(): void {
+        const focused = this.focused;
+        if (focused) {
+            this.appManager?.focusApp?.view?.undo();
+        } else {
+            this.mainView.undo();
+        }
+    }
+
+    private isDynamicPPT(scenes: SceneDefinition[]) {
+        const sceneSrc = scenes[0]?.ppt?.src;
+        return sceneSrc?.startsWith("pptx://");
+    }
+
     private async ensureAttributes() {
         if (isNull(this.attributes)) {
             await wait(50);