@netless/window-manager 1.0.0-canary.18 → 1.0.0-canary.20

package/dist/index.d.ts

@@ -70,6 +70,11 @@ export declare type AppInitState = {
     sceneIndex?: number;
     boxState?: TeleBoxState;
     zIndex?: number;
+    visible?: boolean;
+    stageRatio?: number;
+    resizable?: boolean;
+    draggable?: boolean;
+    ratio?: number;
 };
 export declare type CursorMovePayload = {
     uid: string;
@@ -81,6 +86,8 @@ export declare type MountParams = {
     container?: HTMLElement;
     /** 白板高宽比例, 默认为 9 / 16 */
     containerSizeRatio?: number;
+    /** @deprecated */
+    chessboard?: boolean;
     /** 是否高亮显示同步区域, 默认为 true */
     highlightStage?: boolean;
     collectorContainer?: HTMLElement;

package/dist/index.es.js

@@ -54,6 +54,11 @@ var AppAttributes = /* @__PURE__ */ ((AppAttributes2) => {
   AppAttributes2["Position"] = "position";
   AppAttributes2["SceneIndex"] = "SceneIndex";
   AppAttributes2["ZIndex"] = "zIndex";
+  AppAttributes2["Visible"] = "visible";
+  AppAttributes2["Ratio"] = "ratio";
+  AppAttributes2["StageRatio"] = "stageRatio";
+  AppAttributes2["Draggable"] = "draggable";
+  AppAttributes2["Resizable"] = "resizable";
   return AppAttributes2;
 })(AppAttributes || {});
 var AppEvents = /* @__PURE__ */ ((AppEvents2) => {
@@ -656,6 +661,16 @@ const safeListenPropsUpdated = (getProps, callback, onDestroyed) => {
 };
 const onObjectRemoved = onObjectByEvent(UpdateEventKind.Removed);
 onObjectByEvent(UpdateEventKind.Inserted);
+const createValSync = (expr, Val2, isAddApp) => {
+  let skipUpdate = false;
+  return reaction(expr, (val) => {
+    if (isAddApp && !skipUpdate) {
+      skipUpdate = true;
+    } else {
+      Val2.setValue(val);
+    }
+  }, { fireImmediately: true });
+};
 const plainObjectKeys = Object.keys;
 function isRef(e2) {
   return Boolean(has(e2, "__isRef"));
@@ -1070,7 +1085,7 @@ class AppContext {
       (_a = this.room) == null ? void 0 : _a.putScenes(this.appProxy.scenePath, scenes);
     };
     this.getInitScenePath = () => {
-      return this.manager.getAppInitPath(this.appId);
+      return this.appProxy.scenePath;
     };
     this.setAttributes = (attributes) => {
       this.manager.safeSetAttributes({ [this.appId]: attributes });
@@ -1228,12 +1243,17 @@ class CameraSynchronizer {
         const nextScale = camera.scale * scale2;
         const moveCamera = () => {
           var _a;
-          (_a = this.view) == null ? void 0 : _a.moveCamera({
-            centerX: camera.centerX,
-            centerY: camera.centerY,
+          const config = {
             scale: nextScale,
             animationMode: AnimationMode.Immediately
-          });
+          };
+          if (camera.centerX !== null) {
+            config.centerX = camera.centerX;
+          }
+          if (camera.centerY !== null) {
+            config.centerY = camera.centerY;
+          }
+          (_a = this.view) == null ? void 0 : _a.moveCamera(config);
         };
         moveCamera();
         delay(moveCamera, 50);
@@ -1280,7 +1300,9 @@ class ViewSync {
       }, "view");
     };
     this.onCameraUpdatedByDevice = (camera) => {
-      this.synchronizer.onLocalCameraUpdate(camera);
+      if (!camera)
+        return;
+      this.synchronizer.onLocalCameraUpdate(Object.assign(camera, { id: this.context.uid }));
       const stage = this.context.stageRect$.value;
       if (stage) {
         const size2 = { width: stage.width, height: stage.height, id: this.context.uid };
@@ -1290,15 +1312,12 @@ class ViewSync {
       }
     };
     this.synchronizer = new CameraSynchronizer((camera) => {
-      const iCamera = __spreadValues({
-        id: this.context.uid
-      }, camera);
-      this.context.camera$.setValue(iCamera, true);
+      this.context.camera$.setValue(camera, true);
       const notStoreCamera = this.context.viewMode$ && this.context.viewMode$.value === ViewMode.Freedom;
       if (notStoreCamera) {
         return;
       } else {
-        this.context.storeCamera(iCamera);
+        this.context.storeCamera(camera);
       }
     });
     this.bindView(this.context.view$.value);
@@ -1742,8 +1761,8 @@ class AppProxy {
       if (box && view) {
         if (!this.camera$.value) {
           this.storeCamera({
-            centerX: 0,
-            centerY: 0,
+            centerX: null,
+            centerY: null,
             scale: 1,
             id: this.uid
           });
@@ -1776,6 +1795,48 @@ class AppProxy {
       }
     }));
     this.sideEffectManager.add(() => emitter.on("memberStateChange", this.onMemberStateChange));
+    this.box$.subscribe((box) => {
+      if (!box)
+        return;
+      this.sideEffectManager.add(() => [
+        createValSync(() => {
+          var _a2;
+          return (_a2 = this.appAttributes) == null ? void 0 : _a2.state.visible;
+        }, box._visible$, this.isAddApp),
+        createValSync(() => {
+          var _a2;
+          return (_a2 = this.appAttributes) == null ? void 0 : _a2.state.ratio;
+        }, box._ratio$, this.isAddApp),
+        createValSync(() => {
+          var _a2;
+          return (_a2 = this.appAttributes) == null ? void 0 : _a2.state.stageRatio;
+        }, box._stageRatio$, this.isAddApp),
+        createValSync(() => {
+          var _a2;
+          return (_a2 = this.appAttributes) == null ? void 0 : _a2.state.draggable;
+        }, box._draggable$, this.isAddApp),
+        createValSync(() => {
+          var _a2;
+          return (_a2 = this.appAttributes) == null ? void 0 : _a2.state.resizable;
+        }, box._resizable$, this.isAddApp),
+        box._visible$.subscribe((visible) => {
+          this.store.updateAppState(this.id, AppAttributes.Visible, visible);
+        }),
+        box._ratio$.subscribe((ratio) => {
+          this.store.updateAppState(this.id, AppAttributes.Ratio, ratio);
+        }),
+        box._stageRatio$.subscribe((stageRatio) => {
+          this.store.updateAppState(this.id, AppAttributes.StageRatio, stageRatio);
+        }),
+        box._draggable$.subscribe((draggable) => {
+          this.store.updateAppState(this.id, AppAttributes.Draggable, draggable);
+        }),
+        box._resizable$.subscribe((resizable) => {
+          console.log("resizable change", resizable);
+          this.store.updateAppState(this.id, AppAttributes.Resizable, resizable);
+        })
+      ]);
+    });
   }
   createAppDir() {
     const scenePath = this.scenePath || this.appScenePath;
@@ -15619,7 +15680,7 @@ const reconnectRefresher = new ReconnectRefresher({ emitter });
 const _WindowManager = class extends InvisiblePlugin {
   constructor(context) {
     super(context);
-    this.version = "1.0.0-canary.18";
+    this.version = "1.0.0-canary.20";
     this.dependencies = { "dependencies": { "@juggle/resize-observer": "^3.3.1", "@netless/telebox-insider": "1.0.0-alpha.18", "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.3.0", "video.js": ">=7" }, "peerDependencies": { "white-web-sdk": "^2.16.0" }, "devDependencies": { "@netless/app-docs-viewer": "^0.2.9", "@netless/app-media-player": "0.1.0-beta.5", "@rollup/plugin-commonjs": "^20.0.0", "@rollup/plugin-node-resolve": "^13.0.4", "@rollup/plugin-url": "^6.1.0", "@sveltejs/vite-plugin-svelte": "^1.0.0-next.22", "@tsconfig/svelte": "^2.0.1", "@types/debug": "^4.1.7", "@types/lodash": "^4.14.182", "@types/lodash-es": "^4.17.4", "@types/uuid": "^8.3.1", "@typescript-eslint/eslint-plugin": "^4.30.0", "@typescript-eslint/parser": "^4.30.0", "@vitest/ui": "^0.14.1", "cypress": "^8.7.0", "dotenv": "^10.0.0", "eslint": "^7.32.0", "eslint-config-prettier": "^8.3.0", "eslint-plugin-svelte3": "^3.2.0", "jsdom": "^19.0.0", "less": "^4.1.1", "prettier": "^2.3.2", "prettier-plugin-svelte": "^2.4.0", "rollup-plugin-analyzer": "^4.0.0", "rollup-plugin-styles": "^3.14.1", "svelte": "^3.42.4", "typescript": "^4.5.5", "vite": "^2.5.3", "vitest": "^0.14.1", "white-web-sdk": "2.16.10" } };
     this.emitter = callbacks$1;
     this.viewMode = ViewMode.Broadcaster;