@netless/window-manager 0.4.5 → 0.4.8-canary.0

package/src/RedoUndo.ts

@@ -0,0 +1,87 @@
+import { callbacks, emitter } from "./index";
+import type { View } from "white-web-sdk";
+import type { AppProxy } from "./AppProxy";
+
+export type RedoUndoContext = {
+    mainView: () => View;
+    focus: () => string | undefined;
+    getAppProxy: (id: string) => AppProxy | undefined;
+};
+
+export class RedoUndo {
+    constructor(private context: RedoUndoContext) {
+        emitter.on("focusedChange", changed => {
+            this.disposePrevFocusViewRedoUndoListeners(changed.prev);
+            setTimeout(() => {
+                this.addRedoUndoListeners(changed.focused);
+            }, 0);
+        });
+        emitter.on("rootDirRemoved", () => {
+            this.disposePrevFocusViewRedoUndoListeners(context.focus());
+            this.addRedoUndoListeners(context.focus());
+        });
+        this.addRedoUndoListeners(context.focus());
+    }
+
+    private addRedoUndoListeners = (focused: string | undefined) => {
+        if (focused === undefined) {
+            this.addViewCallbacks(
+                this.context.mainView(),
+                this.onCanRedoStepsUpdate,
+                this.onCanUndoStepsUpdate
+            );
+        } else {
+            const focusApp = this.context.getAppProxy(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 disposeViewCallbacks = (view: View) => {
+        view.callbacks.off("onCanRedoStepsUpdate", this.onCanRedoStepsUpdate);
+        view.callbacks.off("onCanUndoStepsUpdate", this.onCanUndoStepsUpdate);
+    };
+
+    private onCanRedoStepsUpdate = (steps: number) => {
+        callbacks.emit("canRedoStepsChange", steps);
+    };
+
+    private onCanUndoStepsUpdate = (steps: number) => {
+        callbacks.emit("canUndoStepsChange", steps);
+    };
+
+    private disposePrevFocusViewRedoUndoListeners = (prevFocused: string | undefined) => {
+        let view: View | undefined = undefined;
+        if (prevFocused === undefined) {
+            view = this.context.mainView();
+        } else {
+            const appProxy = this.context.getAppProxy(prevFocused);
+            if (appProxy && appProxy.view) {
+                view = appProxy.view;
+            }
+        }
+        if (view) {
+            this.disposeViewCallbacks(view);
+        }
+    };
+
+    public destroy() {
+        this.disposePrevFocusViewRedoUndoListeners(this.context.focus());
+    }
+}

package/src/Utils/RoomHacker.ts

@@ -33,7 +33,7 @@ export const replaceRoomFunction = (room: Room | Player, manager: WindowManager)
             },
         });
 
-        room.moveCamera = (camera: Camera) => manager.mainView.moveCamera(camera);
+        room.moveCamera = (camera: Camera) => manager.moveCamera(camera);
         room.moveCameraToContain = (...args) => manager.moveCameraToContain(...args);
         room.convertToPointInWorld = (...args) => manager.mainView.convertToPointInWorld(...args);
         room.setCameraBound = (...args) => manager.mainView.setCameraBound(...args);

package/src/View/MainView.ts

@@ -110,6 +110,17 @@ export class MainViewProxy {
         }
     }
 
+    public rebind(): void {
+        const divElement = this.mainView.divElement;
+        const disableCameraTransform = this.mainView.disableCameraTransform;
+        this.stop();
+        this.mainView.release();
+        this.mainView = this.createMainView();
+        this.mainView.disableCameraTransform = disableCameraTransform;
+        this.mainView.divElement = divElement;
+        this.start();
+    }
+
     private onCameraUpdatedByDevice = (camera: Camera) => {
         this.store.setMainViewCamera({ ...camera, id: this.manager.uid });
         if (!isEqual(this.mainViewSize, { ...this.mainView.size, id: this.manager.uid })) {

package/src/index.ts

@@ -6,7 +6,7 @@ import { checkVersion, setupWrapper } from "./Helper";
 import { ContainerResizeObserver } from "./ContainerResizeObserver";
 import { createBoxManager } from "./BoxManager";
 import { CursorManager } from "./Cursor";
-import { DEFAULT_CONTAINER_RATIO, Events } from "./constants";
+import { DEFAULT_CONTAINER_RATIO, Events, ROOT_DIR } from "./constants";
 import { Fields } from "./AttributesDelegate";
 import { initDb } from "./Register/storage";
 import { InvisiblePlugin, isPlayer, isRoom, RoomPhase, ViewMode } from "white-web-sdk";
@@ -15,6 +15,7 @@ import { log } from "./Utils/log";
 import { ReconnectRefresher } from "./ReconnectRefresher";
 import { replaceRoomFunction } from "./Utils/RoomHacker";
 import { setupBuiltin } from "./BuiltinApps";
+import "video.js/dist/video-js.css";
 import "./style.css";
 import "@netless/telebox-insider/dist/style.css";
 import type { LoadAppEvent } from "./Register";
@@ -137,6 +138,9 @@ export type EmitterEvent = {
     onReconnected: void;
     removeScenes: string;
     cursorMove: CursorMovePayload;
+    updateManagerRect: undefined;
+    focusedChange: { focused: string | undefined, prev: string | undefined };
+    rootDirRemoved: undefined;
 };
 
 export type EmitterType = Emittery<EmitterEvent>;
@@ -178,6 +182,11 @@ export const callbacks: CallbacksType = new Emittery();
 
 export const reconnectRefresher = new ReconnectRefresher({ emitter });
 
+export type AddPageParams = {
+    after?: boolean;
+    scene?: SceneDefinition;
+}
+
 export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
     public static kind = "WindowManager";
     public static displayer: Displayer;
@@ -368,7 +377,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
                 }
             }
         }
-        this.boxManager?.updateManagerRect();
+        emitter.emit("updateManagerRect");
         this.appManager?.refresh();
         this.appManager?.resetMaximized();
         this.appManager?.resetMinimized();
@@ -483,6 +492,47 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
         }
     }
 
+    public async nextPage(): Promise<boolean> {
+        if (this.appManager) {
+            const nextIndex = this.mainViewSceneIndex + 1;
+            if (nextIndex >= this.mainViewScenesLength)  {
+                console.warn(`[WindowManager]: current page is the last page`);
+                return false;
+            };
+            await this.appManager.setMainViewSceneIndex(nextIndex);
+            return true;
+        } else {
+            return false;
+        }
+    }
+
+    public async prevPage(): Promise<boolean> {
+        if (this.appManager) {
+            const prevIndex = this.mainViewSceneIndex - 1;
+            if (prevIndex < 0) {
+                console.warn(`[WindowManager]: current page is the first page`);
+                return false;
+            };
+            await this.appManager.setMainViewSceneIndex(prevIndex);
+            return true;
+        } else {
+            return false;
+        }
+    }
+
+    public async addPage(params?: AddPageParams): Promise<void> {
+        if (this.appManager) {
+            const after = params?.after;
+            const scene = params?.scene;
+            if (after) {
+                const nextIndex = this.mainViewSceneIndex + 1;
+                this.room.putScenes(ROOT_DIR, [scene || {}], nextIndex);
+            } else {
+                this.room.putScenes(ROOT_DIR, [scene || {}]);
+            }
+        }
+    }
+
     /**
      * 返回 mainView 的 ScenePath
      */