@netless/window-manager 0.3.0-canary.2 → 0.3.2-canary.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@netless/window-manager",
-  "version": "0.3.0-canary.2",
+  "version": "0.3.2-canary.0",
   "description": "",
   "main": "dist/index.es.js",
   "module": "dist/index.es.js",
@@ -24,7 +24,7 @@
     "@juggle/resize-observer": "^3.3.1",
     "@netless/app-docs-viewer": "^0.1.21",
     "@netless/app-media-player": "0.1.0-beta.5",
-    "@netless/telebox-insider": "0.2.3",
+    "@netless/telebox-insider": "0.2.4",
     "emittery": "^0.9.2",
     "lodash": "^4.17.21",
     "p-retry": "^4.6.1",

package/src/AppContext.ts

@@ -102,13 +102,8 @@ export class AppContext<TAttrs extends Record<string, any>, AppOptions = any> {
 
     public async setScenePath(scenePath: string): Promise<void> {
         if (!this.appProxy.box) return;
-        if (this.appProxy.box.focus) {
-            setScenePath(this.getRoom(), scenePath);
-        } else {
-            this.emitter.emit("focus", true);
-            await wait(50);
-            setScenePath(this.getRoom(), scenePath);
-        }
+        this.appProxy.setFullPath(scenePath);
+        this.manager.viewManager.switchAppToWriter(this.appId);
     }
 
     public mountView(dom: HTMLDivElement): void {

package/src/AppListener.ts

@@ -30,10 +30,6 @@ export class AppListeners {
                     this.appResizeHandler(data.payload);
                     break;
                 }
-                case Events.AppBlur: {
-                    this.appBlurHandler(data.payload);
-                    break;
-                }
                 case Events.AppBoxStateChange: {
                     this.appBoxStateHandler(data.payload);
                     break;
@@ -57,21 +53,10 @@ export class AppListeners {
         this.manager.room?.refreshViewSize();
     };
 
-    private appBlurHandler = (payload: any) => {
-        const proxy = this.appProxies.get(payload.appId);
-        if (proxy) {
-            proxy.appEmitter.emit("writableChange", false);
-            if (proxy.view?.mode === ViewVisionMode.Writable) {
-                this.manager.viewManager.refreshViews();
-            }
-        }
-    };
-
     private appBoxStateHandler = (payload: any) => {
         this.boxManager.setBoxState(payload.state);
     };
 
-
     private switchViewsToFreedomHandler = () => {
         this.manager.viewManager.freedomAllViews();
     };

package/src/AppManager.ts

@@ -80,16 +80,20 @@ export class AppManager {
         this.refresher?.add("maximized", () => {
             return autorun(
                 () => {
-                    const maximized = this.attributes.maximized
-                    this.boxManager.teleBoxManager.setMaximized(Boolean(maximized), true);
+                    const maximized = this.attributes.maximized;
+                    if (this.boxManager.teleBoxManager.maximized !== maximized) {
+                        this.boxManager.teleBoxManager.setMaximized(Boolean(maximized), true);
+                    }
                 }
             )
         });
         this.refresher?.add("minimized", () => {
             return autorun(
                 () => {
-                    const minimized = this.attributes.minimized
-                    this.boxManager.teleBoxManager.setMinimized(Boolean(minimized), true);
+                    const minimized = this.attributes.minimized;
+                    if (this.boxManager.teleBoxManager.minimized !== minimized) {
+                        this.boxManager.teleBoxManager.setMinimized(Boolean(minimized), true);
+                    }
                 }
             )
         });
@@ -98,7 +102,7 @@ export class AppManager {
             if (!mainScenePath) return;
             const sceneState = this.displayer.state.sceneState;
             if (sceneState.scenePath !== mainScenePath) {
-                this.room?.setScenePath(mainScenePath);
+                setScenePath(this.room, mainScenePath);
             }
         }
         this.displayerWritableListener(!this.room?.isWritable);
@@ -459,6 +463,7 @@ export class AppManager {
             });
         }
         this.viewManager.destroy();
+        this.boxManager.destroy();
         this.refresher?.destroy();
         this.mainViewProxy.destroy();
         callbacks.clearListeners();

package/src/AttributesDelegate.ts

@@ -52,6 +52,10 @@ export class AttributesDelegate {
         return get(this.apps(), [id, Fields.State]);
     }
 
+    public getMaximized() {
+        return get(this.manager.attributes, ["maximized"])
+    }
+
     public setupAppAttributes(params: AddAppParams, id: string, isDynamicPPT: boolean) {
         const attributes = this.manager.attributes;
         if (!attributes.apps) {

package/src/BoxManager.ts

@@ -216,7 +216,8 @@ export class BoxManager {
             if (state.maximized != null) {
                 this.teleBoxManager.setMaximized(Boolean(state.maximized), true);
                 this.teleBoxManager.setMinimized(Boolean(state.minimized), true);
-            } else if (state.boxState) {
+            } 
+            if (state.boxState) {
                 this.teleBoxManager.setState(state.boxState, true);
             }
             setTimeout(() => {
@@ -224,6 +225,7 @@ export class BoxManager {
                     this.teleBoxManager.update(box.id, { focus: true }, true);
                 }
             }, 50);
+            callbacks.emit("boxStateChange", this.teleBoxManager.state);
         }
     }
 
@@ -283,4 +285,8 @@ export class BoxManager {
         this.teleBoxManager.setState(state, true);
         callbacks.emit("boxStateChange", state);
     }
+
+    public destroy() {
+        this.teleBoxManager.destroy();
+    }
 }

package/src/Cursor/Cursor.ts

@@ -38,9 +38,6 @@ export class Cursor extends Base {
             if (!this.cursorPosition) {
                 throw new Error();
             }
-            if (this.memberId === this.context.uid) {
-                return;
-            }
             this.startReaction();
         }, { retries: 3 });
         this.autoHidden();
@@ -145,6 +142,7 @@ export class Cursor extends Base {
         }
         this.timer = window.setTimeout(() => {
             this.hide();
+            this.store.updateCursorState(this.context.uid, CursorState.Leave);
         }, 1000 * 10); // 10 秒钟自动隐藏
     }
 

package/src/Cursor/index.ts

@@ -22,7 +22,6 @@ export type MoveCursorParams = {
 export class CursorManager extends Base {
     public containerRect?: DOMRect;
     public wrapperRect?: DOMRect;
-    private disposer: any;
     public cursorInstances: Map<string, Cursor> = new Map();
     public roomMembers?: readonly RoomMember[];
     private mainViewElement?: HTMLDivElement;
@@ -48,20 +47,25 @@ export class CursorManager extends Base {
     }
 
     private startReaction(wrapper: HTMLElement) {
-        this.disposer = onObjectInserted(this.cursors, () => {
-            this.handleRoomMembersChange(wrapper);
-        });
+        this.manager.refresher?.add("cursors", () => {
+            return onObjectInserted(this.cursors, () => {
+                this.handleRoomMembersChange(wrapper);
+            });
+        })
     }
 
-    private handleRoomMembersChange(wrapper: HTMLElement) {
+    private handleRoomMembersChange = debounce((wrapper: HTMLElement) => {
         const uids = this.roomMembers?.map(member => member.payload?.uid);
+        const cursors = Object.keys(this.cursors);
         if (uids?.length) {
-            for (const uid in this.cursors) {
+            cursors.map(uid => {
                 if (
                     uids.includes(uid) &&
-                    !this.cursorInstances.has(uid) &&
-                    uid !== this.context.uid
+                    !this.cursorInstances.has(uid)
                 ) {
+                    if (uid === this.context.uid) {
+                        return;
+                    }
                     const component = new Cursor(
                         this.appManager,
                         this.cursors,
@@ -71,9 +75,9 @@ export class CursorManager extends Base {
                     );
                     this.cursorInstances.set(uid, component);
                 }
-            }
+            })
         }
-    }
+    }, 100);
 
     public get cursors() {
         return this.manager.attributes?.[Fields.Cursors];
@@ -221,10 +225,10 @@ export class CursorManager extends Base {
             wrapper.removeEventListener("mouseleave", this.mouseLeaveListener);
             wrapper.removeEventListener("touchend", this.mouseLeaveListener);
         }
-        this.disposer && this.disposer();
         if (this.cursorInstances.size) {
             this.cursorInstances.forEach(cursor => cursor.destroy());
             this.cursorInstances.clear();
         }
+        this.manager.refresher?.remove("cursors");
     }
 }

package/src/Utils/Common.ts

@@ -26,7 +26,7 @@ export const setScenePath = (room: Room | undefined, scenePath: string) => {
             room.setScenePath(scenePath);
         }
     }
-};
+}
 
 export const setViewMode = (view: View, mode: ViewVisionMode) => {
     if (view.mode !== mode) {

package/src/index.ts

@@ -20,9 +20,9 @@ import { log } from './Utils/log';
 import { replaceRoomFunction } from './Utils/RoomHacker';
 import { ResizeObserver as ResizeObserverPolyfill } from '@juggle/resize-observer';
 import { setupWrapper } from './ViewManager';
-import { TELE_BOX_STATE } from './BoxManager';
 import './style.css';
 import '@netless/telebox-insider/dist/style.css';
+import type { TELE_BOX_STATE } from './BoxManager';
 import {
     AppCreateError,
     AppManagerNotInitError,
@@ -170,7 +170,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
     public static containerSizeRatio = DEFAULT_CONTAINER_RATIO;
     private static isCreated = false;
 
-    public version = "0.3.0-canary.2";
+    public version = "0.3.2-canary.0";
 
     public appListeners?: AppListeners;
 
@@ -504,7 +504,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> {
 
     public get boxState(): TeleBoxState {
         if (this.appManager) {
-            return this.appManager.store.getBoxState() || TELE_BOX_STATE.Normal;
+            return this.appManager.boxManager.teleBoxManager.state;
         } else {
             throw new AppManagerNotInitError();
         }

package/src/viewManager.ts

@@ -2,7 +2,6 @@ import { Base } from "./Base";
 import { callbacks, WindowManager } from "./index";
 import { reaction, ViewVisionMode } from "white-web-sdk";
 import { SET_SCENEPATH_DELAY } from "./constants";
-import { TELE_BOX_STATE } from "@netless/telebox-insider";
 import {
     notifyMainViewModeChange,
     setScenePath,
@@ -15,6 +14,7 @@ import type { AppManager } from "./AppManager";
 export class ViewManager extends Base {
     private views: Map<string, View> = new Map();
     private timer?: number;
+    private appTimer?: number;
 
     private mainViewProxy = this.manager.mainViewProxy;
     private displayer = this.manager.displayer;
@@ -133,13 +133,13 @@ export class ViewManager extends Base {
     public switchAppToWriter(id: string): void {
         this.freedomAllViews();
         // 为了同步端不闪烁, 需要给 room setScenePath 一个延迟
-        setTimeout(() => {
+        if (this.appTimer) {
+            clearTimeout(this.appTimer);
+        }
+        this.appTimer = setTimeout(() => {
             const appProxy = this.manager.appProxies.get(id);
             if (appProxy) {
-                const boxState = this.store.getBoxState();
-                if (boxState && boxState === TELE_BOX_STATE.Minimized) {
-                    return;
-                }
+                if (this.manager.boxManager.teleBoxManager.minimized) return;
                 appProxy.setScenePath();
                 appProxy.switchToWritable();
                 appProxy.focusBox();