@netless/window-manager 0.4.62 → 0.4.64

package/src/Utils/RoomHacker.ts

@@ -1,4 +1,4 @@
-import { emitter } from "../InternalEmitter";
+import { internalEmitter } from "../InternalEmitter";
 import { isPlayer } from "white-web-sdk";
 import type { WindowManager } from "../index";
 import type { Camera, Room, Player, PlayerSeekingResult } from "white-web-sdk";
@@ -66,7 +66,7 @@ const delegateRemoveScenes = (room: Room, manager: WindowManager) => {
             manager.appManager?.updateRootDirRemoving(true);
         }
         const result = originRemoveScenes.call(room, scenePath);
-        emitter.emit("removeScenes", { scenePath, index });
+        internalEmitter.emit("removeScenes", { scenePath, index });
         return result;
     };
 };
@@ -76,9 +76,9 @@ const delegateSeekToProgressTime = (player: Player) => {
     // eslint-disable-next-line no-inner-declarations
     async function newSeek(time: number): Promise<PlayerSeekingResult> {
         // seek 时需要先关闭所有的 app 防止内部使用的 mobx 出现错误
-        await emitter.emit("seekStart");
+        await internalEmitter.emit("seekStart");
         const seekResult = await originSeek.call(player, time);
-        emitter.emit("seek", time); 
+        internalEmitter.emit("seek", time); 
         return seekResult;
     }
     player.seekToProgressTime = newSeek;

package/src/View/MainView.ts

@@ -2,7 +2,7 @@ import { AnimationMode, reaction, ViewMode } from "white-web-sdk";
 import { callbacks } from "../callback";
 import { createView } from "./ViewManager";
 import { debounce, get, isEmpty, isEqual } from "lodash";
-import { emitter } from "../InternalEmitter";
+import { internalEmitter } from "../InternalEmitter";
 import { Fields } from "../AttributesDelegate";
 import { setViewFocusScenePath } from "../Utils/Common";
 import { SideEffectManager } from "side-effect-manager";
@@ -23,7 +23,7 @@ export class MainViewProxy {
     constructor(private manager: AppManager) {
         this.mainView = this.createMainView();
         this.moveCameraSizeByAttributes();
-        emitter.once("mainViewMounted").then(() => {
+        internalEmitter.once("mainViewMounted").then(() => {
             this.addMainViewListener();
             this.start();
             this.ensureCameraAndSize();
@@ -33,13 +33,13 @@ export class MainViewProxy {
             this.sizeChangeHandler(this.mainViewSize);
         };
         this.sideEffectManager.add(() => {
-            return emitter.on("playgroundSizeChange", playgroundSizeChangeListener);
+            return internalEmitter.on("playgroundSizeChange", playgroundSizeChangeListener);
         });
         this.sideEffectManager.add(() => {
-            return emitter.on("containerSizeRatioUpdate", this.onUpdateContainerSizeRatio);
+            return internalEmitter.on("containerSizeRatioUpdate", this.onUpdateContainerSizeRatio);
         });
         this.sideEffectManager.add(() => {
-            return emitter.on("startReconnect", () => {
+            return internalEmitter.on("startReconnect", () => {
                 if (!this.didRelease) {
                     this.mainView.release();
                 }
@@ -49,7 +49,7 @@ export class MainViewProxy {
 
     private startListenWritableChange = () => {
         this.sideEffectManager.add(() => {
-            return emitter.on("writableChange", isWritable => {
+            return internalEmitter.on("writableChange", isWritable => {
                 if (isWritable) {
                     this.ensureCameraAndSize();
                 }
@@ -87,6 +87,7 @@ export class MainViewProxy {
         if (this.started) return;
         this.addCameraListener();
         this.addCameraReaction();
+        if (this.manager.room) this.syncMainView(this.manager.room);
         this.started = true;
     }
 

package/src/callback.ts

@@ -20,6 +20,8 @@ export type PublicEvent = {
     ready: undefined; // 所有 APP 创建完毕时触发
     sceneStateChange: SceneState;
     pageStateChange: PageState;
+    fullscreenChange: boolean;
+    appsChange: string[]; // APP 列表变化时触发
 };
 
 export type CallbacksType = Emittery<PublicEvent>;

package/src/index.ts

@@ -7,7 +7,7 @@ import { ContainerResizeObserver } from "./ContainerResizeObserver";
 import { createBoxManager } from "./BoxManager";
 import { CursorManager } from "./Cursor";
 import { DEFAULT_CONTAINER_RATIO, Events, INIT_DIR, ROOT_DIR } from "./constants";
-import { emitter } from "./InternalEmitter";
+import { internalEmitter } from "./InternalEmitter";
 import { Fields } from "./AttributesDelegate";
 import { initDb } from "./Register/storage";
 import { InvisiblePlugin, isPlayer, isRoom, RoomPhase, ViewMode } from "white-web-sdk";
@@ -130,7 +130,7 @@ export type MountParams = {
     container?: HTMLElement;
     /** 白板高宽比例, 默认为 9 / 16 */
     containerSizeRatio?: number;
-    /** 显示 PS 透明背景，默认 true */
+    /** @deprecated 显示 PS 透明背景，默认 true */
     chessboard?: boolean;
     collectorContainer?: HTMLElement;
     collectorStyles?: Partial<CSSStyleDeclaration>;
@@ -140,14 +140,16 @@ export type MountParams = {
     disableCameraTransform?: boolean;
     prefersColorScheme?: TeleBoxColorScheme;
     applianceIcons?: ApplianceIcons;
+    fullscreen?: boolean;
 };
 
-export const reconnectRefresher = new ReconnectRefresher({ emitter });
+export const reconnectRefresher = new ReconnectRefresher({ emitter: internalEmitter });
 
 export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any> implements PageController {
     public static kind = "WindowManager";
     public static displayer: Displayer;
     public static wrapper?: HTMLElement;
+    public static sizer?: HTMLElement;
     public static playground?: HTMLElement;
     public static container?: HTMLElement;
     public static debug = false;
@@ -166,6 +168,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
     public viewMode = ViewMode.Broadcaster;
     public isReplay = isPlayer(this.displayer);
     private _pageState?: PageStateImpl;
+    private _fullscreen?: boolean;
 
     private boxManager?: BoxManager;
     private static params?: MountParams;
@@ -234,6 +237,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
         }
         await manager.ensureAttributes();
 
+        manager._fullscreen = params.fullscreen;
         manager.appManager = new AppManager(manager);
         manager._pageState = new PageStateImpl(manager.appManager);
         manager.cursorManager = new CursorManager(manager.appManager, Boolean(cursor), params.applianceIcons);
@@ -246,7 +250,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
         }
 
         replaceRoomFunction(room, manager);
-        emitter.emit("onCreated");
+        internalEmitter.emit("onCreated");
         WindowManager.isCreated = true;
         try {
             await initDb();
@@ -282,9 +286,17 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
     private static initContainer(
         manager: WindowManager,
         container: HTMLElement,
-        chessboard: boolean | undefined,
-        overwriteStyles: string | undefined
+        params: {
+            chessboard?: boolean,
+            overwriteStyles?: string,
+            fullscreen?: boolean,
+        }
     ) {
+        const {
+            chessboard,
+            overwriteStyles,
+            fullscreen,
+        } = params;
         if (!WindowManager.container) {
             WindowManager.container = container;
         }
@@ -293,6 +305,9 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
         if (chessboard) {
             sizer.classList.add("netless-window-manager-chess-sizer");
         }
+        if (fullscreen) {
+            sizer.classList.add("netless-window-manager-fullscreen");
+        }
         if (overwriteStyles) {
             const style = document.createElement("style");
             style.textContent = overwriteStyles;
@@ -302,9 +317,10 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
             playground,
             sizer,
             wrapper,
-            emitter
+            internalEmitter
         );
         WindowManager.wrapper = wrapper;
+        WindowManager.sizer = sizer;
         return mainViewElement;
     }
 
@@ -323,16 +339,11 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
         } else {
             if (WindowManager.params) {
                 const params = WindowManager.params;
-                const mainViewElement = WindowManager.initContainer(
-                    this,
-                    container,
-                    params.chessboard,
-                    params.overwriteStyles
-                );
+                const mainViewElement = WindowManager.initContainer(this, container, params);
                 if (this.boxManager) {
                     this.boxManager.destroy();
                 }
-                const boxManager = createBoxManager(this, callbacks, emitter, boxEmitter, {
+                const boxManager = createBoxManager(this, callbacks, internalEmitter, boxEmitter, {
                     collectorContainer: params.collectorContainer,
                     collectorStyles: params.collectorStyles,
                     prefersColorScheme: params.prefersColorScheme,
@@ -345,7 +356,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
                 }
             }
         }
-        emitter.emit("updateManagerRect");
+        internalEmitter.emit("updateManagerRect");
         this.appManager?.refresh();
         this.appManager?.resetMaximized();
         this.appManager?.resetMinimized();
@@ -385,7 +396,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
             // 移除根目录时需要做一些异步的释放操作 addApp 需要等待释放完成才可以继续添加
             if (this.appManager.rootDirRemoving) {
                 return new Promise((resolve, reject) => {
-                    emitter.once("rootDirRemoved").then(async () => {
+                    internalEmitter.once("rootDirRemoved").then(async () => {
                         try {
                             const appId = await this._addApp(params);
                             resolve(appId);
@@ -583,7 +594,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
     public setReadonly(readonly: boolean): void {
         this.readonly = readonly;
         this.boxManager?.setReadonly(readonly);
-        emitter.emit("setReadonly", readonly);
+        internalEmitter.emit("setReadonly", readonly);
     }
 
     /**
@@ -646,6 +657,14 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
         this.boxManager?.setMinimized(minimized, false);
     }
 
+    public setFullscreen(fullscreen: boolean): void {
+        if (this._fullscreen !== fullscreen) {
+            this._fullscreen = fullscreen;
+            WindowManager.sizer?.classList.toggle("netless-window-manager-fullscreen", fullscreen);
+            callbacks.emit("fullscreenChange", fullscreen);
+        }
+    }
+
     public get mainView(): View {
         if (this.appManager) {
             return this.appManager.mainViewProxy.view;
@@ -747,6 +766,10 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
         }
     }
 
+    public get fullscreen(): boolean {
+        return Boolean(this._fullscreen);
+    }
+
     /**
      * 查询所有的 App
      */
@@ -828,6 +851,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
         this.cursorManager?.destroy();
         WindowManager.container = undefined;
         WindowManager.wrapper = undefined;
+        WindowManager.sizer = undefined;
         WindowManager.isCreated = false;
         if (WindowManager.playground) {
             WindowManager.playground.parentNode?.removeChild(WindowManager.playground);
@@ -945,7 +969,7 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
         }
         WindowManager.containerSizeRatio = ratio;
         this.containerSizeRatio = ratio;
-        emitter.emit("containerSizeRatioUpdate", ratio);
+        internalEmitter.emit("containerSizeRatioUpdate", ratio);
     }
 
     private isDynamicPPT(scenes: SceneDefinition[]) {

package/src/style.css

@@ -197,3 +197,11 @@
 .netless-iframe-brdige-hidden {
     display: none;
 }
+
+.netless-window-manager-fullscreen .telebox-titlebar,
+.netless-window-manager-fullscreen .telebox-max-titlebar-maximized,
+.netless-window-manager-fullscreen .netless-app-slide-footer,
+.netless-window-manager-fullscreen .telebox-footer-wrap,
+.netless-window-manager-fullscreen .telebox-titlebar-wrap {
+    display: none;
+}