@netless/window-manager 1.0.0-canary.57 → 1.0.0-canary.58

package/src/Cursor/Cursor.ts

@@ -157,14 +157,21 @@ export class Cursor {
             cursorTagBackgroundColor: this.memberCursorTagBackgroundColor,
             opacity: this.memberOpacity,
             tagName: this.memberTagName,
+            pencilEraserSize: this.member?.memberState.pencilEraserSize,
         };
     }
 
     private getIcon() {
         if (this.member) {
             const icons = this.cursorManager.applianceIcons;
-            const applianceSrc = icons[this.memberApplianceName || ApplianceNames.shape];
-            return applianceSrc || icons[ApplianceNames.shape];
+            let applianceSrc = icons[ApplianceNames.shape];
+            if (this.memberApplianceName === ApplianceNames.pencilEraser) {
+                const size = this.member?.memberState.pencilEraserSize || 1;
+                applianceSrc = icons[`${this.memberApplianceName}${size}`];
+            } else {
+                applianceSrc = icons[this.memberApplianceName || ApplianceNames.shape];
+            }
+            return applianceSrc;
         }
     }
 

package/src/Cursor/icons.ts

@@ -5,6 +5,9 @@ import eraser from "../image/eraser-cursor.png";
 import shape from "../image/shape-cursor.svg";
 import text from "../image/text-cursor.svg";
 import laser from "../image/laser-pointer-cursor.svg";
+import pencilEraser1 from "../image/pencil-eraser-1.svg";
+import pencilEraser2 from "../image/pencil-eraser-2.svg";
+import pencilEraser3 from "../image/pencil-eraser-3.svg";
 
 export const ApplianceMap: {
     [key: string]: string;
@@ -15,4 +18,7 @@ export const ApplianceMap: {
     [ApplianceNames.shape]: shape,
     [ApplianceNames.text]: text,
     [ApplianceNames.laserPointer]: laser,
+    ["pencilEraser1"]: pencilEraser1,
+    ["pencilEraser2"]: pencilEraser2,
+    ["pencilEraser3"]: pencilEraser3,
 };

package/src/View/ScrollMode.ts

@@ -4,6 +4,7 @@ import { combine, derive, Val } from "value-enhancer";
 import { createScrollStorage } from "../storage";
 import { SCROLL_MODE_BASE_HEIGHT, SCROLL_MODE_BASE_WIDTH } from "../constants";
 import { SideEffectManager } from "side-effect-manager";
+import { round } from "lodash";
 import type { ReadonlyVal } from "value-enhancer";
 import type { AppManager } from "../AppManager";
 import type { ScrollStorage } from "../storage";
@@ -138,9 +139,9 @@ export class ScrollMode {
             [this._scrollTop$, this._page$, maxScrollPage$],
             ([scrollTop, page, maxScrollPage]) => {
                 return {
-                    scrollTop,
-                    page,
-                    maxScrollPage,
+                    scrollTop: round(scrollTop, 2),
+                    page: round(page, 2),
+                    maxScrollPage: round(maxScrollPage, 2),
                 };
             }
         );

package/src/View/ViewSync.ts

@@ -3,8 +3,9 @@ import { CameraSynchronizer } from "./CameraSynchronizer";
 import { combine, derive } from "value-enhancer";
 import { isEqual } from "lodash";
 import { SideEffectManager } from "side-effect-manager";
+import { Val } from "value-enhancer";
 import type { Camera, View } from "white-web-sdk";
-import type { Val, ReadonlyVal } from "value-enhancer";
+import type { ReadonlyVal } from "value-enhancer";
 import type { ICamera, ISize } from "../AttributesDelegate";
 import type { TeleBoxRect } from "@netless/telebox-insider";
 import type { ManagerViewMode } from "../typings";
@@ -43,6 +44,8 @@ export class ViewSync {
         ]);
         if (context.viewMode$) {
             this.needRecoverCamera$ = derive(context.viewMode$, mode => mode !== "scroll");
+        } else {
+            this.needRecoverCamera$ = new Val(true);
         }
         const camera$size$ = combine([this.context.camera$, this.context.size$]);
         camera$size$.reaction(([camera, size]) => {

package/src/image/pencil-eraser-1.svg

@@ -0,0 +1,3 @@
+<svg width="18" height="26" viewBox="0 0 18 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="17" height="25" rx="3.5" fill="black" fill-opacity="0.35" stroke="white"/>
+</svg>

package/src/image/pencil-eraser-2.svg

@@ -0,0 +1,3 @@
+<svg width="26" height="34" viewBox="0 0 26 34" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="25" height="33" rx="3.5" fill="black" fill-opacity="0.35" stroke="white"/>
+</svg>

package/src/image/pencil-eraser-3.svg

@@ -0,0 +1,3 @@
+<svg width="34" height="50" viewBox="0 0 34 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="33" height="49" rx="3.5" fill="black" fill-opacity="0.35" stroke="white"/>
+</svg>

package/src/index.ts

@@ -1019,6 +1019,17 @@ export class WindowManager extends InvisiblePlugin<WindowMangerAttributes, any>
             });
         }, 500);
     }
+    /**
+     * 切换 focus 到指定的 app, 并且把这个 app 放到最前面
+     */
+     public focusApp(appId: string) {
+        const box = this.boxManager?.getBox(appId);
+        if (box) {
+            this.boxManager?.focusBox({ appId }, false);
+            // 1.0 版本这里会有正式的 api
+            (this.boxManager?.teleBoxManager as any).makeBoxTop(box, false);
+        }
+    }
 
     public createPPTHandler() {
         return {

package/src/style.css

@@ -119,6 +119,20 @@
     margin-top: 3px;
 }
 
+.netless-window-manager-cursor-pencilEraser-image {
+    margin-left: -22px;
+    margin-top: 3px;
+}
+
+.netless-window-manager-laserPointer-pencilEraser-offset {
+    margin-left: -18px;
+}
+
+.netless-window-manager-pencilEraser-3-offset {
+    margin-top: -14px;
+    margin-left: -6px;
+}
+
 .netless-window-manager-cursor-name {
     width: 100%;
     height: 48px;

package/src/typings.ts

@@ -87,7 +87,7 @@ export type RegisterParams<AppOptions = any, SetupResult = any, Attributes exten
 
 export type AppListenerKeys = keyof AppEmitterEvent;
 
-export type ApplianceIcons = Partial<Record<ApplianceNames, string>>;
+export type ApplianceIcons = Partial<Record<`${ApplianceNames}` | string, string>>;
 
 export type Writeable<T> = { -readonly [P in keyof T]: T[P] };