@netless/window-manager 0.4.73-beta.1 → 0.4.73

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@netless/window-manager",
-  "version": "0.4.73-beta.1",
+  "version": "0.4.73",
   "description": "Multi-window mode for Netless Whiteboard",
   "author": "l1shen <lishen1635@gmail.com> (https://github.com/l1shen)",
   "license": "MIT",
@@ -13,6 +13,14 @@
     "docs",
     "src"
   ],
+  "scripts": {
+    "build": "vite build && npm run type-gen",
+    "lint": "eslint --ext .ts,.tsx,.svelte . && prettier --check .",
+    "predev": "npm run type-gen",
+    "prettier": "prettier --write .",
+    "test": "vitest",
+    "type-gen": "dts src/index.ts -o dist/index.d.ts"
+  },
   "peerDependencies": {
     "jspdf": "2.5.1",
     "white-web-sdk": "^2.16.0"
@@ -65,13 +73,5 @@
     "vite": "^2.9.9",
     "vitest": "^0.14.1",
     "white-web-sdk": "2.16.43"
-  },
-  "scripts": {
-    "build": "vite build && npm run type-gen",
-    "lint": "eslint --ext .ts,.tsx,.svelte . && prettier --check .",
-    "predev": "npm run type-gen",
-    "prettier": "prettier --write .",
-    "test": "vitest",
-    "type-gen": "dts src/index.ts -o dist/index.d.ts"
   }
-}
+}

package/src/App/AppContext.ts

@@ -29,7 +29,6 @@ import type {
 } from "./MagixEvent";
 import type { AddPageParams, PageController, PageState } from "../Page";
 import { internalEmitter } from "../InternalEmitter";
-import { WindowManager } from "../index";
 import { callbacks } from "../callback";
 
 export class AppContext<TAttributes extends {} = any, TMagixEventPayloads = any, TAppOptions = any>
@@ -92,9 +91,7 @@ export class AppContext<TAttributes extends {} = any, TMagixEventPayloads = any,
             setTimeout(() => {
                 // 渲染需要时间，延迟 refresh
                 this.getRoom()?.refreshViewSize();
-                if (WindowManager.supportTeachingAidsPlugin) {
-                    callbacks.emit("onAppViewMounted", { appId: this.appId, view });
-                }
+                callbacks.emit("onAppViewMounted", { appId: this.appId, view });
             }, 1000);
         }
     };

package/src/App/AppProxy.ts

@@ -30,7 +30,6 @@ import type { ReadonlyTeleBox } from "@netless/telebox-insider";
 import type { PageRemoveService, PageState } from "../Page";
 import { calculateNextIndex } from "../Page";
 import { boxEmitter } from "../BoxEmitter";
-import { WindowManager } from "../index";
 import { callbacks } from "../callback";
 
 export type AppEmitter = Emittery<AppEmitterEvent>;
@@ -196,9 +195,7 @@ export class AppProxy implements PageRemoveService {
                     appRegister.notifyApp(this.kind, "created", { appId, result });
                     this.afterSetupApp(boxInitState);
                     this.fixMobileSize();
-                    if (WindowManager.supportTeachingAidsPlugin) {
-                        callbacks.emit("onAppSetup", appId);
-                    }
+                    callbacks.emit("onAppSetup", appId);
                 }, SETUP_APP_DELAY);
             });
             this.boxManager?.createBox({
@@ -396,9 +393,7 @@ export class AppProxy implements PageRemoveService {
     private setFocusScenePathHandler = debounce((fullPath: string | undefined) => {
         if (this.view && fullPath && fullPath !== this.view?.focusScenePath) {
             setViewFocusScenePath(this.view, fullPath);
-            if (WindowManager.supportTeachingAidsPlugin) {
-                callbacks.emit("onAppScenePathChange", { appId: this.id, view: this.view });
-            }
+            callbacks.emit("onAppScenePathChange", { appId: this.id, view: this.view });
         }
     }, 50);
 

package/src/AppManager.ts

@@ -384,9 +384,7 @@ export class AppManager {
             x: payload.x,
             y: payload.y,
         });
-        if (WindowManager.supportTeachingAidsPlugin) {
-            callbacks.emit("onBoxMove", payload);
-        }
+        callbacks.emit("onBoxMove", payload);
     };
 
     private onBoxResize = (payload: BoxResizePayload) => {
@@ -396,18 +394,13 @@ export class AppManager {
                 width: payload.width,
                 height: payload.height,
             });
-            if (WindowManager.supportTeachingAidsPlugin) {
-                callbacks.emit("onBoxResize", payload);
-            }
+            callbacks.emit("onBoxResize", payload);
         }
     };
 
     private onBoxFocus = (payload: BoxFocusPayload) => {
         this.windowManger.safeSetAttributes({ focus: payload.appId });
-        if (WindowManager.supportTeachingAidsPlugin) {
-            // (WindowManager.externalNotifyManager as any).emit('onBoxFocus', payload)
-            callbacks.emit("onBoxFocus", payload);
-        }
+        callbacks.emit("onBoxFocus", payload);
     };
 
     private onBoxClose = (payload: BoxClosePayload) => {
@@ -415,16 +408,12 @@ export class AppManager {
         if (appProxy) {
             appProxy.destroy(false, true, true, payload.error);
         }
-        if (WindowManager.supportTeachingAidsPlugin) {
-            callbacks.emit("onBoxClose", payload);
-        }
+        callbacks.emit("onBoxClose", payload);
     };
 
     private onBoxStateChange = (payload: BoxStateChangePayload) => {
         this.dispatchInternalEvent(Events.AppBoxStateChange, payload);
-        if (WindowManager.supportTeachingAidsPlugin) {
-            callbacks.emit("onBoxStateChange", payload);
-        }
+        callbacks.emit("onBoxStateChange", payload);
     };
 
     public addAppsChangeListener = () => {
@@ -608,9 +597,7 @@ export class AppManager {
             this.setMainViewFocusPath();
         }
         internalEmitter.emit("mainViewMounted");
-        if (WindowManager.supportTeachingAidsPlugin) {
-            callbacks.emit("onMainViewMounted", mainView);
-        }
+        callbacks.emit("onMainViewMounted", mainView);
     }
 
     public setMainViewFocusPath(scenePath?: string) {

package/src/Cursor/Cursor.svelte

@@ -2,6 +2,7 @@
     import { isEmpty } from "lodash";
     import { ApplianceNames } from "white-web-sdk";
 
+    export let uid: string;
     export let cursorName: string;
     export let tagName: string | undefined;
     export let backgroundColor: string;
@@ -21,7 +22,7 @@
     $: hasName = !isEmpty(cursorName);
     $: hasTagName = !isEmpty(tagName);
     $: hasAvatar = !isEmpty(avatar);
-    $: display = visible ? "initial" : "none";
+    $: display = visible ? "" : "none";
     $: isLaserPointer = appliance === ApplianceNames.laserPointer;
     $: isLaserPointerPencilEraser = isLaserPointer || appliance === ApplianceNames.pencilEraser;
     $: offset = isLaserPointerPencilEraser ? "netless-window-manager-laserPointer-pencilEraser-offset" : "";
@@ -43,6 +44,7 @@
 <div
     class={"netless-window-manager-cursor-mid" + (custom ? " netless-window-manager-cursor-custom" : "")}
     style="transform: translateX({x}px) translateY({y}px);display: {display}"
+    data-cursor-uid={uid}
 >
     {#if !isLaserPointer}
         <div class="netless-window-manager-cursor-name {offset} {pencilEraserSize3ImageOffset}">

package/src/Cursor/Cursor.ts

@@ -164,6 +164,7 @@ export class Cursor {
 
     private initProps() {
         return {
+            uid: this.memberId,
             x: 0,
             y: 0,
             appliance: this.memberApplianceName as string,

package/src/Cursor/index.ts

@@ -169,7 +169,7 @@ export class CursorManager {
         if (now - this.mouseMoveTimer > 48) {
             this.mouseMoveTimer = now;
             if (
-                WindowManager.supportTeachingAidsPlugin &&
+                WindowManager.supportAppliancePlugin &&
                 isRoom(WindowManager.displayer) &&
                 (WindowManager.displayer as Room).disableDeviceInputs
             ) {

package/src/View/MainView.ts

@@ -9,7 +9,6 @@ import { SideEffectManager } from "side-effect-manager";
 import type { Camera, Room, Size, View } from "white-web-sdk";
 import type { AppManager } from "../AppManager";
 import { Events } from "../constants";
-import { WindowManager } from "..";
 
 export class MainViewProxy {
     /** Refresh the view's camera in an interval of 1.5s. */
@@ -187,9 +186,7 @@ export class MainViewProxy {
         this.mainView.divElement = divElement;
         this.addMainViewListener();
         this.start();
-        if (WindowManager.supportTeachingAidsPlugin) {
-            callbacks.emit("onMainViewRebind", this.mainView);
-        }
+        callbacks.emit("onMainViewRebind", this.mainView);
     }
 
     private onCameraUpdatedByDevice = (camera: Camera) => {

package/src/index.ts

@@ -153,7 +153,7 @@ export type MountParams = {
     applianceIcons?: ApplianceIcons;
     fullscreen?: boolean;
     polling?: boolean;
-    supportTeachingAidsPlugin?: boolean;
+    supportAppliancePlugin?: boolean;
 };
 
 export const reconnectRefresher = new ReconnectRefresher({ emitter: internalEmitter });
@@ -170,7 +170,7 @@ export class WindowManager
     public static container?: HTMLElement;
     public static debug = false;
     public static containerSizeRatio = DEFAULT_CONTAINER_RATIO;
-    public static supportTeachingAidsPlugin?: boolean;
+    public static supportAppliancePlugin?: boolean;
     private static isCreated = false;
     private static _resolve = (_manager: WindowManager) => void 0;
 
@@ -187,6 +187,8 @@ export class WindowManager
     public isReplay = isPlayer(this.displayer);
     private _pageState?: PageStateImpl;
     private _fullscreen?: boolean;
+    private _cursorUIDs: string[] = [];
+    private _cursorUIDsStyleDOM?: HTMLStyleElement;
 
     private boxManager?: BoxManager;
     private static params?: MountParams;
@@ -207,7 +209,7 @@ export class WindowManager
     public static async mount(params: MountParams): Promise<WindowManager> {
         const room = params.room;
         WindowManager.container = params.container;
-        WindowManager.supportTeachingAidsPlugin = params.supportTeachingAidsPlugin;
+        WindowManager.supportAppliancePlugin = params.supportAppliancePlugin;
         const containerSizeRatio = params.containerSizeRatio;
         const debug = params.debug;
 
@@ -691,6 +693,27 @@ export class WindowManager
         }
     }
 
+    public get cursorUIDs(): string[] {
+        return this._cursorUIDs;
+    }
+
+    public setCursorUIDs(cursorUIDs?: string[] | null): void {
+        this._cursorUIDs = cursorUIDs || [];
+        if (this._cursorUIDs.length === 0) {
+            this._cursorUIDsStyleDOM?.remove();
+        } else {
+            if (!this._cursorUIDsStyleDOM) {
+                this._cursorUIDsStyleDOM = document.createElement("style");
+            }
+            WindowManager.playground?.appendChild(this._cursorUIDsStyleDOM);
+            let style = "[data-cursor-uid] { display: none }";
+            for (const uid of this._cursorUIDs) {
+                style += `\n[data-cursor-uid="${uid}"] { display: flex }`;
+            }
+            this._cursorUIDsStyleDOM.textContent = style;
+        }
+    }
+
     public get mainView(): View {
         if (this.appManager) {
             return this.appManager.mainViewProxy.view;