@netless/window-manager 0.4.0-canary.14 → 0.4.0-canary.18

package/src/Utils/Common.ts

@@ -1,6 +1,7 @@
 import { appRegister } from "../Register";
 import { debounce } from "lodash";
 import { emitter } from "../index";
+import { ScenePathType } from "white-web-sdk";
 import { v4 } from "uuid";
 import type { PublicEvent } from "../index";
 import type { Displayer, ViewVisionMode, Room, View } from "white-web-sdk";
@@ -17,6 +18,14 @@ export const genAppId = async (kind: string) => {
 export const setViewFocusScenePath = (view: View, focusScenePath: string) => {
     if (view.focusScenePath !== focusScenePath) {
         view.focusScenePath = focusScenePath;
+        return view;
+    }
+};
+
+export const setViewSceneIndex = (view: View, index: number) => {
+    if (view.focusSceneIndex !== index) {
+        view.focusSceneIndex = index;
+        return view;
     }
 };
 
@@ -42,6 +51,15 @@ export const getScenePath = (
     }
 };
 
+export const removeScenes = (room: Room | undefined, scenePath: string) => {
+    if (room) {
+        const type = room.scenePathType(scenePath);
+        if (type !== ScenePathType.None) {
+            room.removeScenes(scenePath);
+        }
+    }
+};
+
 export const setViewMode = (view: View, mode: ViewVisionMode) => {
     if (!(view as any).didRelease && view.mode !== mode) {
         view.mode = mode;
@@ -70,7 +88,9 @@ export const notifyMainViewModeChange = debounce(
 export const makeValidScenePath = (displayer: Displayer, scenePath: string, index = 0) => {
     const scenes = entireScenes(displayer)[scenePath];
     if (!scenes) return;
-    const firstSceneName = scenes[index].name;
+    const scene = scenes[index];
+    if (!scene) return;
+    const firstSceneName = scene.name;
     if (scenePath === "/") {
         return `/${firstSceneName}`;
     } else {
@@ -86,6 +106,17 @@ export const isValidScenePath = (scenePath: string) => {
     return scenePath.startsWith("/");
 };
 
+export const parseSceneDir = (scenePath: string) => {
+    const sceneList = scenePath.split("/");
+    sceneList.pop();
+    let sceneDir = sceneList.join("/");
+    // "/page1" 的 dir 为 "/"
+    if (sceneDir === "") {
+        sceneDir = "/";
+    }
+    return sceneDir;
+};
+
 export const ensureValidScenePath = (scenePath: string) => {
     if (scenePath.endsWith("/")) {
         return scenePath.slice(0, -1);

package/src/Utils/RoomHacker.ts

@@ -1,22 +1,13 @@
 import { emitter } from "../index";
 import { isPlayer } from "white-web-sdk";
-import type { WindowManager } from '../index';
-import type { Camera, Room , Player , PlayerSeekingResult } from "white-web-sdk";
+import type { WindowManager } from "../index";
+import type { Camera, Room, Player, PlayerSeekingResult } from "white-web-sdk";
 
 // 修改多窗口状态下一些失效的方法实现到 manager 的 mainview 上, 降低迁移成本
 export const replaceRoomFunction = (room: Room, manager: WindowManager) => {
     if (isPlayer(room)) {
         const player = room as unknown as Player;
-        const originSeek = player.seekToProgressTime;
-        // eslint-disable-next-line no-inner-declarations
-        async function newSeek(time: number): Promise<PlayerSeekingResult> {
-            const seekResult = await originSeek.call(player, time);
-            if (seekResult === "success") {
-                emitter.emit("seek", time);
-            }
-            return seekResult;
-        }
-        player.seekToProgressTime = newSeek;
+        delegateSeekToProgressTime(player);
     } else {
         const descriptor = Object.getOwnPropertyDescriptor(room, "disableCameraTransform");
         if (descriptor) return;
@@ -32,13 +23,13 @@ export const replaceRoomFunction = (room: Room, manager: WindowManager) => {
         Object.defineProperty(room, "canUndoSteps", {
             get() {
                 return manager.mainView.canUndoSteps;
-            }
+            },
         });
 
         Object.defineProperty(room, "canRedoSteps", {
             get() {
                 return manager.mainView.canRedoSteps;
-            }
+            },
         });
 
         room.moveCamera = (camera: Camera) => manager.mainView.moveCamera(camera);
@@ -52,6 +43,28 @@ export const replaceRoomFunction = (room: Room, manager: WindowManager) => {
         room.redo = () => manager.mainView.redo();
         room.undo = () => manager.mainView.undo();
         room.cleanCurrentScene = () => manager.mainView.cleanCurrentScene();
+        delegateRemoveScenes(room);
     }
+};
 
-};
+const delegateRemoveScenes = (room: Room) => {
+    const originRemoveScenes = room.removeScenes;
+    room.removeScenes = (scenePath: string) => {
+        const result = originRemoveScenes.call(room, scenePath);
+        emitter.emit("removeScenes", scenePath);
+        return result;
+    };
+};
+
+const delegateSeekToProgressTime = (player: Player) => {
+    const originSeek = player.seekToProgressTime;
+    // eslint-disable-next-line no-inner-declarations
+    async function newSeek(time: number): Promise<PlayerSeekingResult> {
+        const seekResult = await originSeek.call(player, time);
+        if (seekResult === "success") {
+            emitter.emit("seek", time);
+        }
+        return seekResult;
+    }
+    player.seekToProgressTime = newSeek;
+};

package/src/View/MainView.ts

@@ -1,5 +1,4 @@
 import { AnimationMode, reaction } from "white-web-sdk";
-import { Base } from "../Base";
 import { callbacks, emitter } from "../index";
 import { createView } from "./ViewManager";
 import { debounce, isEmpty, isEqual } from "lodash";
@@ -9,17 +8,17 @@ import { SideEffectManager } from "side-effect-manager";
 import type { Camera, Size, View } from "white-web-sdk";
 import type { AppManager } from "../AppManager";
 
-export class MainViewProxy extends Base {
+export class MainViewProxy {
     private scale?: number;
     private started = false;
     private mainViewIsAddListener = false;
     private mainView: View;
     private viewId = "mainView";
+    private store = this.manager.store;
 
     private sideEffectManager = new SideEffectManager();
 
-    constructor(manager: AppManager) {
-        super(manager);
+    constructor(private manager: AppManager) {
         this.mainView = this.createMainView();
         this.moveCameraSizeByAttributes();
         emitter.once("mainViewMounted").then(() => {
@@ -62,15 +61,15 @@ export class MainViewProxy extends Base {
     }
 
     public setCameraAndSize(): void {
-        this.store.setMainViewCamera({ ...this.mainView.camera, id: this.context.uid });
-        this.store.setMainViewSize({ ...this.mainView.size, id: this.context.uid });
+        this.store.setMainViewCamera({ ...this.mainView.camera, id: this.manager.uid });
+        this.store.setMainViewSize({ ...this.mainView.size, id: this.manager.uid });
     }
 
     private cameraReaction = () => {
         return reaction(
             () => this.mainViewCamera,
             camera => {
-                if (camera && camera.id !== this.context.uid) {
+                if (camera && camera.id !== this.manager.uid) {
                     this.moveCameraToContian(this.mainViewSize);
                     this.moveCamera(camera);
                 }
@@ -106,8 +105,8 @@ export class MainViewProxy extends Base {
     }
 
     private onCameraUpdatedByDevice = (camera: Camera) => {
-        this.store.setMainViewCamera({ ...camera, id: this.context.uid });
-        if (!isEqual(this.mainViewSize, { ...this.mainView.size, id: this.context.uid })) {
+        this.store.setMainViewCamera({ ...camera, id: this.manager.uid });
+        if (!isEqual(this.mainViewSize, { ...this.mainView.size, id: this.manager.uid })) {
             this.setMainViewSize(this.view.size);
         }
     };
@@ -135,11 +134,11 @@ export class MainViewProxy extends Base {
     public async mainViewClickHandler(): Promise<void> {
         if (!this.manager.canOperate) return;
         this.store.cleanFocus();
-        this.context.blurFocusBox();
+        this.manager.boxManager?.blurAllBox();
     }
 
     public setMainViewSize = debounce(size => {
-        this.store.setMainViewSize({ ...size, id: this.context.uid });
+        this.store.setMainViewSize({ ...size, id: this.manager.uid });
     }, 50);
 
     private addCameraListener() {

package/src/constants.ts

@@ -10,7 +10,8 @@ export enum Events {
     SetMainViewScenePath = "SetMainViewScenePath",
     SetMainViewSceneIndex = "SetMainViewSceneIndex",
     SwitchViewsToFreedom = "SwitchViewsToFreedom",
-    MoveCameraToContain = "MoveCameraToContain"
+    MoveCameraToContain = "MoveCameraToContain",
+    CursorMove = "CursorMove",
 }
 
 export const MagixEventName = "__WindowManger";
@@ -37,7 +38,7 @@ export enum CursorState {
     Normal = "normal",
 }
 
-export const REQUIRE_VERSION = "2.16.0";
+export const REQUIRE_VERSION = "2.16.1";
 
 export const MIN_WIDTH = 340 / 720;
 export const MIN_HEIGHT = 340 / 720;

package/src/index.ts

@@ -21,6 +21,7 @@ import {
     ensureValidScenePath,
     getVersionNumber,
     isValidScenePath,
+    parseSceneDir,
     wait,
 } from "./Utils/Common";
 import type { TELE_BOX_STATE, BoxManager } from "./BoxManager";
@@ -31,7 +32,7 @@ import {
     ParamsInvalidError,
     WhiteWebSDKInvalidError,
 } from "./Utils/error";
-import type { Apps } from "./AttributesDelegate";
+import type { Apps, Position } from "./AttributesDelegate";
 import {
     InvisiblePlugin,
     isPlayer,
@@ -124,6 +125,8 @@ export type AppInitState = {
     zIndex?: number;
 };
 
+export type CursorMovePayload = { uid: string; state?: "leave"; position: Position };
+
 export type EmitterEvent = {
     onCreated: undefined;
     InitReplay: AppInitState;
@@ -138,6 +141,8 @@ export type EmitterEvent = {
     boxStateChange: string;
     playgroundSizeChange: DOMRect;
     onReconnected: void;
+    removeScenes: string;
+    cursorMove: CursorMovePayload;
 };
 
 export type EmitterType = Emittery<EmitterEvent>;
@@ -186,6 +191,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
     private static isCreated = false;
 
     public version = __APP_VERSION__;
+    public dependencies = __APP_DEPENDENCIES__;
 
     public appListeners?: AppListeners;
 
@@ -204,6 +210,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
     constructor(context: InvisiblePluginContext) {
         super(context);
         WindowManager.displayer = context.displayer;
+        (window as any).NETLESS_DEPS = __APP_DEPENDENCIES__;
     }
 
     public static async mount(params: MountParams): Promise<WindowManager> {
@@ -427,6 +434,12 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
                     const appScenePath = appManager.store.getAppScenePath(appId);
                     if (appScenePath && appScenePath === scenePath) {
                         console.warn(`[WindowManager]: ScenePath ${scenePath} Already opened`);
+                        if (this.boxManager) {
+                            const topBox = this.boxManager.getTopBox();
+                            if (topBox) {
+                                this.boxManager.setZIndex(appId, topBox.zIndex + 1, false);
+                            }
+                        }
                         return;
                     }
                 }
@@ -471,7 +484,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
     /**
      * 返回 mainView 的 ScenePath
      */
-    public getMainViewScenePath(): string {
+    public getMainViewScenePath(): string | undefined {
         return this.appManager?.store.getMainViewScenePath();
     }
 
@@ -519,6 +532,35 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
         this.viewMode = mode;
     }
 
+    public setBoxState(boxState: TeleBoxState): void {
+        if (!this.canOperate) return;
+        switch (boxState) {
+            case "normal":
+                this.setMaximized(false);
+                this.setMinimized(false);
+                break;
+            case "maximized":
+                this.setMaximized(true);
+                this.setMinimized(false);
+                break;
+            case "minimized":
+                this.setMinimized(true);
+                break;
+            default:
+                break;
+        }
+    }
+
+    public setMaximized(maximized: boolean): void {
+        if (!this.canOperate) return;
+        this.boxManager?.setMaximized(maximized, false);
+    }
+
+    public setMinimized(minimized: boolean): void {
+        if (!this.canOperate) return;
+        this.boxManager?.setMinimized(minimized, false);
+    }
+
     public get mainView(): View {
         if (this.appManager) {
             return this.appManager.mainViewProxy.view;
@@ -575,6 +617,19 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
         return this.appManager?.store.getMainViewSceneIndex();
     }
 
+    public get mainViewSceneDir(): string {
+        const scenePath = this.appManager?.store.getMainViewScenePath();
+        if (scenePath) {
+            return parseSceneDir(scenePath);
+        } else {
+            throw new Error("[WindowManager]: mainViewSceneDir not found");
+        }
+    }
+
+    public get topApp(): string | undefined {
+        return this.boxManager?.getTopBox()?.id;
+    }
+
     /**
      * 查询所有的 App
      */
@@ -715,6 +770,10 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
             }
         }
     }
+
+    private _removeScenes = (scenePath: string) => {
+        this.room.removeScenes(scenePath);
+    };
 }
 
 setupBuiltin();

package/src/shim.d.ts

@@ -7,4 +7,5 @@ declare module "*.svelte" {
 
 declare global {
     const __APP_VERSION__: string;
-  }
+    const __APP_DEPENDENCIES__: Record<string, string>;
+}

package/src/style.css

@@ -122,7 +122,7 @@
     left: 0;
     top: 0;
     will-change: transform;
-    transition: transform 0.05s;
+    transition: transform 0.1s;
     transform-origin: 0 0;
     user-select: none;
 }

package/vite.config.js

@@ -1,7 +1,7 @@
 import path from "path";
 import { defineConfig } from "vite";
 import { svelte } from "@sveltejs/vite-plugin-svelte";
-import { dependencies ,peerDependencies, version } from "./package.json"
+import { dependencies, peerDependencies, version, devDependencies } from "./package.json"
 
 
 export default defineConfig(({ mode }) => {
@@ -10,6 +10,9 @@ export default defineConfig(({ mode }) => {
     return {
         define: {
             __APP_VERSION__: JSON.stringify(version),
+            __APP_DEPENDENCIES__: JSON.stringify({
+                dependencies, peerDependencies, devDependencies
+            }),
         },
         plugins: [
             svelte({
@@ -23,7 +26,7 @@ export default defineConfig(({ mode }) => {
             lib: {
                 // eslint-disable-next-line no-undef
                 entry: path.resolve(__dirname, "src/index.ts"),
-                formats: ["es","umd"], // TODO cjs 版本待修复
+                formats: ["es", "umd"], // TODO cjs 版本待修复
                 name: "WindowManager",
                 fileName: "index"
             },

package/dist/Base/Context.d.ts

@@ -1,12 +0,0 @@
-import type { AppManager } from "../AppManager";
-export declare class Context {
-    private manager;
-    observerId: number;
-    constructor(manager: AppManager);
-    get uid(): string;
-    findMember: (memberId: number) => import("white-web-sdk").RoomMember | undefined;
-    findMemberByUid: (uid: string) => import("white-web-sdk").RoomMember | undefined;
-    updateManagerRect(): void;
-    blurFocusBox(): void;
-}
-export declare const createContext: (manager: AppManager) => Context;

package/dist/Base/index.d.ts

@@ -1,7 +0,0 @@
-import type { AppManager } from "../AppManager";
-export declare class Base {
-    manager: AppManager;
-    store: import("../AttributesDelegate").AttributesDelegate;
-    context: import("./Context").Context;
-    constructor(manager: AppManager);
-}

package/src/Base/Context.ts

@@ -1,45 +0,0 @@
-import { emitter } from "../index";
-import type { AppManager } from "../AppManager";
-
-export class Context {
-    public observerId: number;
-
-    constructor(private manager: AppManager) {
-        this.observerId = manager.displayer.observerId;
-
-        emitter.on("observerIdChange", id => {
-            this.observerId = id;
-        });
-    };
-
-    public get uid() {
-        return this.manager.room?.uid || "";
-    }
-
-    public findMember = (memberId: number) => {
-        const roomMembers = this.manager.room?.state.roomMembers;
-        return roomMembers?.find(member => member.memberId === memberId);
-    }
-
-    public findMemberByUid = (uid: string) => {
-        const roomMembers = this.manager.room?.state.roomMembers;
-        return roomMembers?.find(member => member.payload?.uid === uid);
-    }
-
-    public updateManagerRect() {
-        this.manager.boxManager?.updateManagerRect();
-    }
-
-    public blurFocusBox() {
-        this.manager.boxManager?.blurAllBox();
-    }
-}
-
-let context: Context;
-
-export const createContext = (manager: AppManager) => {
-    if (!context) {
-        context = new Context(manager);
-    }
-    return context;
-};

package/src/Base/index.ts

@@ -1,10 +0,0 @@
-import type { AppManager } from "../AppManager";
-import { store } from "../AttributesDelegate";
-import { createContext } from "./Context";
-
-export class Base {
-    public store = store;
-    public context = createContext(this.manager);
-
-    constructor(public manager: AppManager) {}
-}