Add: setting window for tauri - bugs not fixed yet

frontend/tauri-ui/src/renderer/pixi_pet.ts

@@ -28,6 +28,8 @@ export type UiSnapshot = {
   y: number;
   scale: number;
   active_sprite_pack: string;
+  visible: boolean;
+  always_on_top: boolean;
 };
 
 type AnimationMap = Map<string, UiAnimationClip>;
@@ -41,6 +43,7 @@ export class PixiPetRenderer {
   private frameCursor = 0;
   private frameElapsedMs = 0;
   private baseTexture: BaseTexture;
+  private disposed = false;
 
   private constructor(
     app: Application,
@@ -67,8 +70,6 @@ export class PixiPetRenderer {
       antialias: true,
       resizeTo: container
     });
-    container.replaceChildren(app.view as HTMLCanvasElement);
-
     const baseTexture = await PixiPetRenderer.loadBaseTexture(pack.atlas_data_url);
     if (baseTexture.width <= 0 || baseTexture.height <= 0) {
       throw new Error("Atlas image loaded with invalid dimensions.");
@@ -76,6 +77,7 @@ export class PixiPetRenderer {
     const sprite = new Sprite();
     sprite.anchor.set(pack.anchor.x, pack.anchor.y);
     app.stage.addChild(sprite);
+    container.replaceChildren(app.view as HTMLCanvasElement);
 
     const renderer = new PixiPetRenderer(app, sprite, pack, baseTexture);
     renderer.layoutSprite();
@@ -102,13 +104,25 @@ export class PixiPetRenderer {
         const keyR = 0xff;
         const keyG = 0x00;
         const keyB = 0xff;
-        const tolerance = 28;
+        const hardTolerance = 22;
+        const softTolerance = 46;
         for (let i = 0; i < data.length; i += 4) {
           const dr = Math.abs(data[i] - keyR);
           const dg = Math.abs(data[i + 1] - keyG);
           const db = Math.abs(data[i + 2] - keyB);
-          if (dr <= tolerance && dg <= tolerance && db <= tolerance) {
+          const maxDistance = Math.max(dr, dg, db);
+          if (maxDistance <= hardTolerance) {
             data[i + 3] = 0;
+            continue;
+          }
+          if (maxDistance <= softTolerance) {
+            const alphaScale =
+              (maxDistance - hardTolerance) / (softTolerance - hardTolerance);
+            const suppress = 1 - alphaScale;
+            data[i + 3] = Math.round(data[i + 3] * alphaScale);
+            // Remove magenta spill from antialiased edges after alpha reduction.
+            data[i] = Math.round(data[i] * (1 - 0.4 * suppress));
+            data[i + 2] = Math.round(data[i + 2] * (1 - 0.4 * suppress));
           }
         }
         ctx.putImageData(frame, 0, 0);
@@ -122,13 +136,10 @@ export class PixiPetRenderer {
   }
 
   dispose(): void {
-    this.app.ticker.stop();
-    this.app.ticker.destroy();
-    this.sprite.destroy({
-      children: true,
-      texture: false,
-      baseTexture: false
-    });
+    if (this.disposed) {
+      return;
+    }
+    this.disposed = true;
     this.app.destroy(true, {
       children: true,
       texture: false,
@@ -137,6 +148,9 @@ export class PixiPetRenderer {
   }
 
   applySnapshot(snapshot: UiSnapshot): void {
+    if (this.disposed) {
+      return;
+    }
     const nextClip = this.resolveClip(snapshot.current_animation);
     if (nextClip.name !== this.currentClip.name) {
       this.currentClip = nextClip;
@@ -150,6 +164,9 @@ export class PixiPetRenderer {
 
   private startTicker(): void {
     this.app.ticker.add((ticker) => {
+      if (this.disposed) {
+        return;
+      }
       this.layoutSprite();
       const frameMs = 1000 / Math.max(this.currentClip.fps, 1);
       this.frameElapsedMs += ticker.deltaMS;