@netless/window-manager 1.0.13-test.2 → 1.0.13-test.4

package/dist/index.mjs

@@ -352,7 +352,7 @@ const setScenePath = (room, scenePath) => {
   if (room && room.isWritable) {
     if (room.state.sceneState.scenePath !== scenePath) {
       const nextScenePath = scenePath === "/" ? "" : scenePath;
-      console.log("[window-manager] real setScenePath for current room====>", nextScenePath);
+      console.log("[window-manager] real setScenePath for current room  ", nextScenePath);
       room.setScenePath(nextScenePath);
     }
   }
@@ -464,7 +464,7 @@ class AppListeners {
             break;
           }
           case Events.SetMainViewScenePath: {
-            console.log("[window-manager] mainMagixEventListener====>", JSON.stringify(data.payload));
+            console.log("[window-manager] mainMagixEventListener  ", JSON.stringify(data.payload));
             this.setMainViewScenePathHandler(data.payload);
             break;
           }
@@ -5697,6 +5697,35 @@ const log = (...args) => {
     console.log(`[WindowManager]:`, ...args);
   }
 };
+class LocalConsole {
+  constructor(name, debounceTime) {
+    this.name = name;
+    this.debounceTime = debounceTime;
+    this.pendingArgs = null;
+    this.flushTimer = null;
+  }
+  flush() {
+    this.flushTimer = null;
+    const args = this.pendingArgs;
+    this.pendingArgs = null;
+    if (args === null) {
+      return;
+    }
+    console.log(`[window-manager][${this.name}]:`, ...args);
+  }
+  log(...args) {
+    const ms = this.debounceTime;
+    if (ms != null && ms > 0) {
+      this.pendingArgs = args;
+      if (this.flushTimer != null) {
+        clearTimeout(this.flushTimer);
+      }
+      this.flushTimer = setTimeout(() => this.flush(), ms);
+      return;
+    }
+    console.log(`[window-manager][${this.name}]:`, ...args);
+  }
+}
 const setupWrapper = (root) => {
   const playground = document.createElement("div");
   playground.className = "netless-window-manager-playground";
@@ -7004,6 +7033,7 @@ var Fields = /* @__PURE__ */ ((Fields2) => {
 class AttributesDelegate {
   constructor(context) {
     this.context = context;
+    this.setMainViewCameraConsole = new LocalConsole("setMainViewCamera", 50);
     this.setAppFocus = (appId, focus) => {
       if (focus) {
         this.context.safeSetAttributes({ ["focus"]: appId });
@@ -7129,11 +7159,11 @@ class AttributesDelegate {
     return this.attributes["boxState"];
   }
   setMainViewScenePath(scenePath) {
-    console.log("[window-manager] setMainViewScenePath====>", scenePath);
+    console.log("[window-manager] setMainViewScenePath  ", scenePath);
     this.context.safeSetAttributes({ _mainScenePath: scenePath });
   }
   setMainViewSceneIndex(index2) {
-    console.log("[window-manager] setMainViewSceneIndex====>", index2);
+    console.log("[window-manager] setMainViewSceneIndex  ", index2);
     this.context.safeSetAttributes({ _mainSceneIndex: index2 });
   }
   getMainViewCamera() {
@@ -7143,19 +7173,19 @@ class AttributesDelegate {
     return get(this.attributes, ["mainViewSize"]);
   }
   setMainViewCamera(camera) {
-    console.log("[window-manager] setMainViewCamera====>", JSON.stringify(camera));
+    this.setMainViewCameraConsole.log(JSON.stringify(camera));
     this.context.safeSetAttributes({ ["mainViewCamera"]: { ...camera } });
   }
   setMainViewSize(size2) {
     if (size2.width === 0 || size2.height === 0)
       return;
-    console.log("[window-manager] setMainViewSize====>", JSON.stringify(size2));
+    console.log("[window-manager] setMainViewSize  ", JSON.stringify(size2));
     this.context.safeSetAttributes({ ["mainViewSize"]: { ...size2 } });
   }
   setMainViewCameraAndSize(camera, size2) {
     if (size2.width === 0 || size2.height === 0)
       return;
-    console.log("[window-manager] setMainViewCameraAndSize====>", JSON.stringify(camera), JSON.stringify(size2));
+    console.log("[window-manager] setMainViewCameraAndSize  ", JSON.stringify(camera), JSON.stringify(size2));
     this.context.safeSetAttributes({
       ["mainViewCamera"]: { ...camera },
       ["mainViewSize"]: { ...size2 }
@@ -7762,6 +7792,7 @@ class MainViewProxy {
     this.store = this.manager.store;
     this.viewMode = this.manager.windowManger.viewMode;
     this.sideEffectManager = new o$2();
+    this.playgroundSizeChangeListenerLocalConsole = new LocalConsole("playgroundSizeChangeListener", 30);
     this.syncCamera = () => {
       if (!this.polling || this.viewMode !== ViewMode.Broadcaster)
         return;
@@ -7789,7 +7820,7 @@ class MainViewProxy {
         () => this.mainViewCamera,
         (camera) => {
           if (camera && camera.id !== this.manager.uid) {
-            console.log("[window-manager] cameraReaction====>", JSON.stringify(camera), JSON.stringify(this.mainViewSize));
+            console.log("[window-manager] cameraReaction  ", JSON.stringify(camera), JSON.stringify(this.mainViewSize));
             this.moveCameraToContian(this.mainViewSize);
             this.moveCamera(camera);
           }
@@ -7799,15 +7830,15 @@ class MainViewProxy {
     };
     this.sizeChangeHandler = debounce((size2) => {
       if (size2) {
+        console.log("[window-manager] sizeChangeHandler  current size and camera", JSON.stringify(size2), JSON.stringify(this.mainViewCamera));
         this.moveCameraToContian(size2);
         this.moveCamera(this.mainViewCamera);
-        console.log("[window-manager] sizeChangeHandler====> current size and camera", JSON.stringify(size2), JSON.stringify(this.mainViewCamera));
       }
       this.ensureMainViewSize();
     }, 30);
     this.onUpdateContainerSizeRatio = () => {
       const size2 = this.store.getMainViewSize();
-      console.log("[window-manager] onUpdateContainerSizeRatio====>", JSON.stringify(size2));
+      console.log("[window-manager] onUpdateContainerSizeRatio  ", JSON.stringify(size2));
       this.sizeChangeHandler(size2);
     };
     this.onCameraUpdatedByDevice = (camera) => {
@@ -7831,12 +7862,11 @@ class MainViewProxy {
         clearTimeout(this._syncMainViewTimer);
         this._syncMainViewTimer = setTimeout(this.syncMainView, 100, this.manager.room);
       }
-      console.log("[window-manager] onCameraOrSizeUpdated====>", JSON.stringify(this.cameraState));
       this.ensureMainViewSize();
     };
     this.syncMainView = (room) => {
       if (room.isWritable) {
-        console.log("[window-manager] syncMainView====>");
+        console.log("[window-manager] syncMainView  ");
         room.syncMainView(this.mainView);
       }
     };
@@ -7852,7 +7882,17 @@ class MainViewProxy {
       this.startListenWritableChange();
     });
     const playgroundSizeChangeListener = () => {
-      console.log("[window-manager] playgroundSizeChangeListener====>", JSON.stringify(this.mainViewSize));
+      var _a, _b, _c, _d, _e, _f, _g, _h;
+      this.playgroundSizeChangeListenerLocalConsole.log(
+        JSON.stringify(this.mainViewSize),
+        JSON.stringify(this.mainViewCamera),
+        window.outerHeight,
+        window.outerWidth,
+        (_b = (_a = window.visualViewport) == null ? void 0 : _a.width) != null ? _b : "null",
+        (_d = (_c = window.visualViewport) == null ? void 0 : _c.height) != null ? _d : "null",
+        (_f = (_e = window.visualViewport) == null ? void 0 : _e.offsetLeft) != null ? _f : "null",
+        (_h = (_g = window.visualViewport) == null ? void 0 : _g.offsetTop) != null ? _h : "null"
+      );
       this.sizeChangeHandler(this.mainViewSize);
     };
     this.sideEffectManager.add(() => {
@@ -7892,7 +7932,7 @@ class MainViewProxy {
     this.moveCamera(this.mainViewCamera);
   }
   start() {
-    console.log("[window-manager] start====>", JSON.stringify(this.mainViewSize));
+    console.log("[window-manager] start  ", JSON.stringify(this.mainViewSize));
     this.sizeChangeHandler(this.mainViewSize);
     if (this.started)
       return;
@@ -8109,6 +8149,7 @@ class AppManager {
       var _a, _b;
       const { scenePath } = params;
       if (scenePath === ROOT_DIR) {
+        console.log("[window-manager] onRemoveScenes   ROOT_DIR");
         await this.onRootDirRemoved();
         this.dispatchInternalEvent(Events.RootDirRemoved);
         return;
@@ -8121,6 +8162,7 @@ class AppManager {
           sceneName = (_b = this.callbacksNode) == null ? void 0 : _b.scenes[nextIndex];
         }
         if (sceneName) {
+          console.log("[window-manager] onRemoveScenes   setMainViewScenePath", `${ROOT_DIR}${sceneName}`);
           this.setMainViewScenePath(`${ROOT_DIR}${sceneName}`);
         }
         await this.setMainViewSceneIndex(nextIndex);
@@ -8418,7 +8460,7 @@ class AppManager {
         const pageName = scenePath.replace(sceneDir, "").replace("/", "");
         const index2 = scenes.findIndex((scene) => scene.name === pageName);
         if (isInteger(index2) && index2 >= 0) {
-          console.log("[window-manager] updateSceneIndex====>", index2);
+          console.log("[window-manager] updateSceneIndex  ", index2);
           this.safeSetAttributes({ _mainSceneIndex: index2 });
         }
       }
@@ -8686,6 +8728,7 @@ class AppManager {
     (_a = this.boxManager) == null ? void 0 : _a.setMinimized(Boolean(this.store.getMinimized()));
   }
   bindMainView(divElement, disableCameraTransform) {
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     const mainView = this.mainViewProxy.view;
     mainView.disableCameraTransform = disableCameraTransform;
     mainView.divElement = divElement;
@@ -8694,6 +8737,33 @@ class AppManager {
     }
     internalEmitter.emit("mainViewMounted");
     callbacks$1.emit("onMainViewMounted", mainView);
+    const hasRoot = this.hasRoot(mainView.divElement);
+    const rect = this.getRectByDivElement(mainView.divElement);
+    console.log(
+      "[window-manager] bindMainView hasRoot",
+      hasRoot,
+      JSON.stringify(rect),
+      window.outerHeight,
+      window.outerWidth,
+      (_b = (_a = window.visualViewport) == null ? void 0 : _a.width) != null ? _b : "null",
+      (_d = (_c = window.visualViewport) == null ? void 0 : _c.height) != null ? _d : "null",
+      (_f = (_e = window.visualViewport) == null ? void 0 : _e.offsetLeft) != null ? _f : "null",
+      (_h = (_g = window.visualViewport) == null ? void 0 : _g.offsetTop) != null ? _h : "null"
+    );
+  }
+  hasRoot(divElement) {
+    let current = divElement;
+    while (current) {
+      if (current.parentElement === document.body) {
+        return true;
+      }
+      current = current.parentElement;
+    }
+    return false;
+  }
+  getRectByDivElement(divElement) {
+    const rect = divElement.getBoundingClientRect();
+    return rect;
   }
   setMainViewFocusPath(scenePath) {
     var _a;
@@ -8805,7 +8875,7 @@ class AppManager {
   async _setMainViewScenePath(scenePath) {
     const success = this.setMainViewFocusPath(scenePath);
     if (success) {
-      console.log("[window-manager] _setMainViewScenePath====>", scenePath);
+      console.log("[window-manager] _setMainViewScenePath  ", scenePath);
       this.safeSetAttributes({ _mainScenePath: scenePath });
       this.store.setMainViewFocusPath(this.mainView);
       this.updateSceneIndex();
@@ -8833,7 +8903,7 @@ class AppManager {
     }
   }
   dispatchSetMainViewScenePath(scenePath) {
-    console.log("[window-manager] dispatchSetMainViewScenePath====>", JSON.stringify(scenePath));
+    console.log("[window-manager] dispatchSetMainViewScenePath  ", JSON.stringify(scenePath));
     this.dispatchInternalEvent(Events.SetMainViewScenePath, { nextScenePath: scenePath });
     callbacks$1.emit("mainViewScenePathChange", scenePath);
     setScenePath(this.room, scenePath);
@@ -9101,8 +9171,12 @@ const replaceRoomFunction = (room, manager) => {
     });
     const _scalePptToFit = room.scalePptToFit;
     room.scalePptToFit = (...args) => {
-      console.log("[window-manager] scalePptToFit====>", JSON.stringify(args));
+      var _a;
       _scalePptToFit.call(room, ...args);
+      if ((_a = manager.appManager) == null ? void 0 : _a.mainViewProxy) {
+        console.log("[window-manager] scalePptToFit  ", JSON.stringify(args));
+        manager.appManager.mainViewProxy.setCameraAndSize();
+      }
     };
     room.moveCamera = (camera) => manager.moveCamera(camera);
     room.moveCameraToContain = (...args) => manager.moveCameraToContain(...args);
@@ -19694,15 +19768,20 @@ const reconnectRefresher = new ReconnectRefresher({ emitter: internalEmitter });
 const _WindowManager = class extends InvisiblePlugin {
   constructor(context) {
     super(context);
-    this.version = "1.0.13-test.2";
+    this.version = "1.0.13-test.4";
     this.dependencies = { "dependencies": { "@juggle/resize-observer": "^3.3.1", "@netless/telebox-insider": "0.3.0", "emittery": "^0.9.2", "lodash": "^4.17.21", "p-retry": "^4.6.1", "uuid": "^7.0.3", "video.js": ">=7" }, "peerDependencies": { "jspdf": "2.5.1", "white-web-sdk": "^2.16.53" }, "devDependencies": { "@hyrious/dts": "^0.2.2", "@netless/app-docs-viewer": "^0.2.19", "@netless/app-media-player": "0.1.4", "@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.30", "@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", "jspdf": "^2.5.1", "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", "side-effect-manager": "0.1.5", "svelte": "^3.42.4", "typescript": "^4.5.5", "vite": "^2.9.9", "vitest": "^0.14.1", "white-web-sdk": "^2.16.53" } };
     this.emitter = callbacks$1;
     this.viewMode = ViewMode.Broadcaster;
     this.isReplay = isPlayer(this.displayer);
     this._cursorUIDs = [];
     this.containerSizeRatio = _WindowManager.containerSizeRatio;
+    this.visibleStateListener = () => {
+      console.log("[window-manager] visibleStateListener  isVisible:", !document.hidden);
+    };
     _WindowManager.displayer = context.displayer;
     window.NETLESS_DEPS = { "dependencies": { "@juggle/resize-observer": "^3.3.1", "@netless/telebox-insider": "0.3.0", "emittery": "^0.9.2", "lodash": "^4.17.21", "p-retry": "^4.6.1", "uuid": "^7.0.3", "video.js": ">=7" }, "peerDependencies": { "jspdf": "2.5.1", "white-web-sdk": "^2.16.53" }, "devDependencies": { "@hyrious/dts": "^0.2.2", "@netless/app-docs-viewer": "^0.2.19", "@netless/app-media-player": "0.1.4", "@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.30", "@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", "jspdf": "^2.5.1", "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", "side-effect-manager": "0.1.5", "svelte": "^3.42.4", "typescript": "^4.5.5", "vite": "^2.9.9", "vitest": "^0.14.1", "white-web-sdk": "^2.16.53" } };
+    this.visibleStateListener();
+    document.addEventListener("visibilitychange", this.visibleStateListener);
   }
   get Logger() {
     return this._roomLogger;
@@ -20378,6 +20457,7 @@ const _WindowManager = class extends InvisiblePlugin {
       (_e = _WindowManager.playground.parentNode) == null ? void 0 : _e.removeChild(_WindowManager.playground);
     }
     _WindowManager.params = void 0;
+    document.removeEventListener("visibilitychange", this.visibleStateListener);
     (_f = this._iframeBridge) == null ? void 0 : _f.destroy();
     this._iframeBridge = void 0;
     log("Destroyed");