@netless/telebox-insider 0.3.0-beta.1 → 0.3.0-beta.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@netless/telebox-insider",
-  "version": "0.3.0-beta.1",
+  "version": "0.3.0-beta.3",
   "private": false,
   "description": "Window widget for Whiteboard",
   "author": "CRIMX <straybugs@gmail.com> (https://github.com/crimx/)",

package/src/TeleBoxManager/MaxTitleBar/index.ts

@@ -12,11 +12,12 @@ export interface MaxTitleBarConfig extends DefaultTitleBarConfig {
     boxes: MaxTitleBarTeleBox[];
     containerRect: TeleBoxRect;
     focusedBox?: MaxTitleBarTeleBox;
-    boxesStatus?: Map<string, TeleBoxState>;
+    getBoxesStatus?: () => Map<string, TeleBoxState>;
 }
 
 export class MaxTitleBar extends DefaultTitleBar {
-    public boxesStatus?: Map<string, TeleBoxState>;
+
+    public getBoxesStatus?: MaxTitleBarConfig["getBoxesStatus"];
     public constructor(config: MaxTitleBarConfig) {
         super(config);
 
@@ -24,22 +25,27 @@ export class MaxTitleBar extends DefaultTitleBar {
         this.focusedBox = config.focusedBox;
         this.containerRect = config.containerRect;
         this.darkMode = config.darkMode;
-        this.boxesStatus = config.boxesStatus;
+        this.getBoxesStatus = config.getBoxesStatus;
     }
-
     public hasMaximizedBoxInStatus(): boolean {
-        if (!this.boxesStatus || this.boxesStatus.size === 0) {
-            return false
+        if (this.getBoxesStatus) {
+            const boxesStatus = this.getBoxesStatus();
+            if (boxesStatus.size) {
+                const hasMaximizedBox = [...boxesStatus.values()].find((state) => state === TELE_BOX_STATE.Maximized);
+                return !!hasMaximizedBox;
+            }
         }
-        const hasMaximizedBox = [...this.boxesStatus.values()].find((state) => state === TELE_BOX_STATE.Maximized);
-        return !!hasMaximizedBox;
+        return false;
     }
 
     public get MaximizedBoxes(): MaxTitleBarTeleBox[] {
-        if (!this.boxesStatus || this.boxesStatus.size === 0) {
-            return [];
+        if (this.getBoxesStatus) {
+            const boxesStatus = this.getBoxesStatus();
+            if (boxesStatus) {
+                return this.boxes.filter((box) => boxesStatus && boxesStatus.get(box.id) === TELE_BOX_STATE.Maximized);
+            }
         }
-        return this.boxes.filter((box) => this.boxesStatus && this.boxesStatus.get(box.id) === TELE_BOX_STATE.Maximized);
+        return [];
     }
 
     /**
@@ -103,8 +109,7 @@ export class MaxTitleBar extends DefaultTitleBar {
         }
     }
 
-    public setBoxesStatus(boxesStatus: Map<string, TeleBoxState>): void {
-        this.boxesStatus = boxesStatus;
+    public updateBoxesStatus(): void {
         if (this.hasMaximizedBoxInStatus()) {
             this.setBoxStatus(TELE_BOX_STATE.Maximized);
         }

package/src/TeleBoxManager/index.ts

@@ -315,7 +315,9 @@ export class TeleBoxManager {
             state: state$.value,
             boxes: this.boxes$.value,
             containerRect: containerRect$.value,
-            boxesStatus: this.boxesStatus$,
+            getBoxesStatus: () => {
+                return this.boxesStatus$;
+            },
             onEvent: (event): void => {
                 switch (event.type) {
                     case TELE_BOX_DELEGATE_EVENT.Maximize: {
@@ -452,7 +454,8 @@ export class TeleBoxManager {
         }
     }
 
-    private setBoxesStatus(boxesStatus: Map<string, TeleBoxState>, skipUpdate = false): void {
+    public setBoxesStatus(boxesStatus: Map<string, TeleBoxState>, skipUpdate = false): void {
+        this.boxesStatus$ = boxesStatus;
         let topBox:TeleBox | undefined;
         const topBoxId = this.topBox?.id;
         let hasMinimizedBox = false;
@@ -480,11 +483,11 @@ export class TeleBoxManager {
         }
         if (topBox && topBoxId !== topBox.id) {
             this.makeBoxTop(topBox, skipUpdate);
-            this.focusTopBox();
             this.topBox$.setValue(topBox);
+            this.focusTopBox();
         }
         if (this.maxTitleBar) {
-            this.maxTitleBar.setBoxesStatus(boxesStatus);
+            this.maxTitleBar.updateBoxesStatus();
         }
     }
     
@@ -509,7 +512,8 @@ export class TeleBoxManager {
         }
     }
 
-    private setLastNotMinimizedBoxesStatus(lastNotMinimizedBoxesStatus: Map<string, NotMinimizedBoxState>, skipUpdate = false): void {
+    public setLastNotMinimizedBoxesStatus(lastNotMinimizedBoxesStatus: Map<string, NotMinimizedBoxState>, skipUpdate = false): void {
+        this.lastNotMinimizedBoxesStatus$ = lastNotMinimizedBoxesStatus;
         this.boxes.forEach((box) => {
             const boxStatus = lastNotMinimizedBoxesStatus.get(box.id);
             if (boxStatus) {
@@ -684,6 +688,10 @@ export class TeleBoxManager {
             const deletedBoxes = boxes.splice(index, 1);
             this.boxes$.setValue(boxes);
             deletedBoxes.forEach((box) => box.destroy());
+            if (box) {
+                this.boxesStatus$.delete(box.id);
+                this.lastNotMinimizedBoxesStatus$.delete(box.id);
+            }
             if (!skipUpdate) {
                 if (this.boxes.length <= 0) {
                     this.setMaximized(false);
@@ -939,7 +947,7 @@ export class TeleBoxManager {
                     return currentBox;
                 }
                 return topBox.zIndex > currentBox.zIndex ? topBox : currentBox;
-            });
+            }, );
             if (maximizedBox) {
                 this.maxTitleBar.focusBox(maximizedBox);
             }