@netless/window-manager 1.0.0-canary.10 → 1.0.0-canary.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@netless/window-manager",
-  "version": "1.0.0-canary.10",
+  "version": "1.0.0-canary.13",
   "description": "",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",
@@ -23,13 +23,13 @@
   },
   "dependencies": {
     "@juggle/resize-observer": "^3.3.1",
-    "@netless/telebox-insider": "1.0.0-alpha.15",
+    "@netless/telebox-insider": "1.0.0-alpha.16",
     "emittery": "^0.9.2",
     "lodash": "^4.17.21",
     "p-retry": "^4.6.1",
     "side-effect-manager": "^1.1.0",
     "uuid": "^7.0.3",
-    "value-enhancer": "^1.2.1",
+    "value-enhancer": "^1.3.0",
     "video.js": ">=7"
   },
   "devDependencies": {

package/pnpm-lock.yaml

@@ -4,7 +4,7 @@ specifiers:
   '@juggle/resize-observer': ^3.3.1
   '@netless/app-docs-viewer': ^0.2.9
   '@netless/app-media-player': 0.1.0-beta.5
-  '@netless/telebox-insider': 1.0.0-alpha.14
+  '@netless/telebox-insider': 1.0.0-alpha.16
   '@rollup/plugin-commonjs': ^20.0.0
   '@rollup/plugin-node-resolve': ^13.0.4
   '@rollup/plugin-url': ^6.1.0
@@ -35,7 +35,7 @@ specifiers:
   svelte: ^3.42.4
   typescript: ^4.5.5
   uuid: ^7.0.3
-  value-enhancer: ^1.2.1
+  value-enhancer: ^1.3.0
   video.js: '>=7'
   vite: ^2.5.3
   vitest: ^0.14.1
@@ -43,13 +43,13 @@ specifiers:
 
 dependencies:
   '@juggle/resize-observer': registry.npmmirror.com/@juggle/resize-observer/3.3.1
-  '@netless/telebox-insider': 1.0.0-alpha.14
+  '@netless/telebox-insider': 1.0.0-alpha.16
   emittery: registry.npmmirror.com/emittery/0.9.2
   lodash: registry.npmmirror.com/lodash/4.17.21
   p-retry: registry.npmmirror.com/p-retry/4.6.1
   side-effect-manager: 1.1.0
   uuid: registry.npmmirror.com/uuid/7.0.3
-  value-enhancer: 1.2.1
+  value-enhancer: 1.3.0
   video.js: registry.npmmirror.com/video.js/7.18.1
 
 devDependencies:
@@ -97,8 +97,8 @@ packages:
       vanilla-lazyload: 17.6.1
     dev: true
 
-  /@netless/telebox-insider/1.0.0-alpha.14:
-    resolution: {integrity: sha512-kDhoxnEZUOCjQDf/lDgHVBb/TaKywlnUXhSlSbyVDWefcVXcaXi6/zEPwDR0gMYWCqQQoEPFz9Jr8hd8hcEkyQ==}
+  /@netless/telebox-insider/1.0.0-alpha.16:
+    resolution: {integrity: sha512-WoBhBMVXKqZuTYEhcDapYOX05ScvngcdCfcrc2fXHkH5PQxtWWwOc4G2X/stK8giHdlGlAkq+HdKTpQ1Ymn7Aw==}
     dependencies:
       '@juggle/resize-observer': 3.3.1
       '@types/shallowequal': 1.1.1
@@ -1002,10 +1002,6 @@ packages:
     engines: {node: '>= 4.0.0'}
     dev: true
 
-  /value-enhancer/1.2.1:
-    resolution: {integrity: sha512-11IrGi9xmVbr3twzuaMRrdUGzhdaE4eXvT6qYZlB5VrhK5uQzSPlYOEBlsIGH+dMvkakNkWGNIbxdZi87/MWuQ==}
-    dev: false
-
   /value-enhancer/1.3.0:
     resolution: {integrity: sha512-shI9N5ML4MGwD6bMu/My1l1+REFqhZGOuIjDN5Gf+k7gACfY2k8WtJEcqgdZMfepwivfhQxIfZp0riobUDZpDQ==}
     dev: false

package/src/App/AppProxy.ts

@@ -58,8 +58,8 @@ export class AppProxy implements PageRemoveService {
     private stateKey: string;
     public _pageState: AppPageStateImpl;
 
-    public appResult?: NetlessApp<any>;
-    public appContext?: AppContext<any, any>;
+    public appResult?: NetlessApp;
+    public appContext?: AppContext;
 
     private sideEffectManager = new SideEffectManager();
     private valManager = new ValManager();
@@ -563,6 +563,7 @@ export class AppProxy implements PageRemoveService {
             const fullPath = this._pageState.getFullPath(index);
             if (fullPath) {
                 this.setFullPath(fullPath);
+                setScenePath(this.manager.room, fullPath);
             }
         }
     }
@@ -584,7 +585,7 @@ export class AppProxy implements PageRemoveService {
         this.size$.setValue(iSize);
     }
 
-    public moveCamera = (camera: Camera) => {
+    public moveCamera = (camera: Partial<Camera>) => {
         if (!this.camera$.value) {
             return;
         }
@@ -664,6 +665,10 @@ export class AppProxy implements PageRemoveService {
         , "size");
     }
 
+    public onFocus = () => {
+        this.setScenePath();
+    }
+
     public close(): Promise<void> {
         return this.destroy(true, true, false);
     }

package/src/App/WhiteboardView.ts

@@ -23,13 +23,14 @@ export class WhiteBoardView implements PageController {
         appProxy.appEmitter.on("pageStateChange", pageState => {
             pageState$.setValue(pageState);
         });
+        view.disableCameraTransform = true;
     }
 
     public get pageState() {
         return this.pageState$.value;
     }
 
-    public moveCamera(camera: Camera) {
+    public moveCamera(camera: Partial<Camera>) {
         this.appProxy.moveCamera(camera);
     }
 

package/src/AppManager.ts

@@ -448,6 +448,7 @@ export class AppManager {
                 setTimeout(() => {
                     const appProxy = this.appProxies.get(focused);
                     if (appProxy) {
+                        appProxy.onFocus();
                         appRegister.notifyApp(appProxy.kind, "focus", { appId: focused });
                     }
                 }, 0);
@@ -657,6 +658,7 @@ export class AppManager {
         if (sceneState) {
             const scenePath = sceneState.scenePath;
             this.appProxies.forEach(appProxy => {
+                console.log("scenePath", scenePath, appProxy.scenePath);
                 if (appProxy.scenePath && scenePath.startsWith(appProxy.scenePath)) {
                     appProxy.emitAppSceneStateChange(sceneState);
                     appProxy.setFullPath(scenePath);

package/src/BoxManager.ts

@@ -80,7 +80,7 @@ export const createBoxManager = (
             setAppFocus: (appId: string) => manager.appManager?.store.setAppFocus(appId, true),
             callbacks,
             emitter,
-            boxEmitter
+            boxEmitter,
         },
         options
     );
@@ -99,17 +99,17 @@ export class BoxManager {
         this.teleBoxManager = this.setupBoxManager(createTeleBoxManagerConfig);
         this.sideEffectManager.add(() => [
             // 使用 _xxx$.reaction 订阅修改的值, 不管有没有 skipUpdate, 修改值都会触发回调
-            this.teleBoxManager._state$.reaction(state => {
+            this.teleBoxManager.onValChanged("state", state => {
                 callbacks.emit("boxStateChange", state);
                 emitter.emit("boxStateChange", state);
             }),
-            this.teleBoxManager._darkMode$.reaction(darkMode => {
+            this.teleBoxManager.onValChanged("darkMode", darkMode => {
                 callbacks.emit("darkModeChange", darkMode);
             }),
-            this.teleBoxManager._prefersColorScheme$.reaction(colorScheme => {
+            this.teleBoxManager.onValChanged("prefersColorScheme", colorScheme => {
                 callbacks.emit("prefersColorSchemeChange", colorScheme);
             }),
-            this.teleBoxManager._minimized$.reaction((minimized, skipUpdate) => {
+            this.teleBoxManager.onValChanged("minimized", (minimized, skipUpdate) => {
                 if (skipUpdate) {
                     return;
                 }
@@ -125,7 +125,7 @@ export class BoxManager {
                     }
                 }
             }),
-            this.teleBoxManager._maximized$.reaction((maximized, skipUpdate) => {
+            this.teleBoxManager.onValChanged("maximized", (maximized, skipUpdate) => {
                 if (skipUpdate) {
                     return;
                 }
@@ -139,7 +139,11 @@ export class BoxManager {
             this.teleBoxManager.events.on(
                 "intrinsic_move",
                 debounce((box: ReadonlyTeleBox): void => {
-                    boxEmitter.emit("move", { appId: box.id, x: box.intrinsicX, y: box.intrinsicY });
+                    boxEmitter.emit("move", {
+                        appId: box.id,
+                        x: box.intrinsicX,
+                        y: box.intrinsicY,
+                    });
                 }, 50)
             ),
             this.teleBoxManager.events.on(

package/src/View/CameraSynchronizer.ts

@@ -19,7 +19,7 @@ export class CameraSynchronizer {
         if (this.remoteCamera && this.remoteSize) {
             this.onRemoteUpdate(this.remoteCamera, this.remoteSize);
         }
-    }, 50);
+    }, 10);
 
     public setView(view: View) {
         this.view = view;
@@ -46,10 +46,11 @@ export class CameraSynchronizer {
                     animationMode: AnimationMode.Immediately,
                 });
             }
+            moveCamera();
             // TODO 直接调用 moveCamera 依然会出现 camera 错误的情况,这里暂时加一个 delay 保证 camera 是对的, 后续需要 SDK 进行修改
             delay(moveCamera, 50);
         }
-    }, 50);
+    }, 10);
 
     public onRemoteSizeUpdate(size: ISize) {
         if (this.rect) {

package/src/index.ts

@@ -179,7 +179,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> imple
     public static async mount(params: MountParams): Promise<WindowManager> {
         const room = params.room;
         WindowManager.container = params.container;
-        const containerSizeRatio = params.containerSizeRatio;
+
         const debug = params.debug;
 
         const cursor = params.cursor;
@@ -225,22 +225,21 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> imple
             throw new Error("[WindowManager]: create manager failed");
         }
 
-        if (containerSizeRatio) {
-            WindowManager.containerSizeRatio = containerSizeRatio;
+        if (params.containerSizeRatio) {
+            WindowManager.containerSizeRatio = params.containerSizeRatio;
         }
+        manager.containerSizeRatio = WindowManager.containerSizeRatio;
         await manager.ensureAttributes();
 
         manager.appManager = new AppManager(manager);
         manager._pageState = new PageStateImpl(manager.appManager);
         manager.cursorManager = new CursorManager(manager.appManager, Boolean(cursor), params.applianceIcons);
-        if (containerSizeRatio) {
-            manager.containerSizeRatio = containerSizeRatio;
-        }
+
         manager.boxManager = createBoxManager(manager, callbacks, emitter, boxEmitter, {
             collectorContainer: params.collectorContainer,
             collectorStyles: params.collectorStyles,
             prefersColorScheme: params.prefersColorScheme,
-            stageRatio: params.containerSizeRatio,
+            stageRatio: WindowManager.containerSizeRatio,
             highlightStage: params.highlightStage
         });
         manager.appManager?.setBoxManager(manager.boxManager);
@@ -907,7 +906,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes> imple
         if (WindowManager.container) {
             this.bindContainer(WindowManager.container);
         }
-        this.appManager?.refresher?.refresh();
+        this.appManager?.refresher.refresh();
     }
 
     public setContainerSizeRatio(ratio: number) {