@pooder/kit 4.3.1 → 5.0.0

package/src/edgeScale.ts

@@ -0,0 +1,19 @@
+export interface BoundsLike {
+  width: number;
+  height: number;
+}
+
+export function computeDetectEdgeSize(
+  currentMax: number,
+  baseBounds: BoundsLike,
+  expandedBounds: BoundsLike,
+): { width: number; height: number; scale: number } {
+  const baseMax = Math.max(baseBounds.width, baseBounds.height);
+  const scale = baseMax > 0 ? currentMax / baseMax : 1;
+  return {
+    scale,
+    width: expandedBounds.width * scale,
+    height: expandedBounds.height * scale,
+  };
+}
+

package/src/feature.ts

@@ -4,10 +4,10 @@ import {
   ContributionPointIds,
   CommandContribution,
   ConfigurationService,
+  ToolSessionService,
 } from "@pooder/core";
 import { Circle, Group, Point, Rect } from "fabric";
 import CanvasService from "./CanvasService";
-import { DielineGeometry } from "./dieline";
 import {
   getNearestPointOnDieline,
   DielineFeature,
@@ -17,7 +17,10 @@ import { ConstraintRegistry, ConstraintFeature } from "./constraints";
 import {
   completeFeaturesStrict,
 } from "./featureComplete";
-import { parseLengthToMm } from "./units";
+import {
+  readSizeState,
+  type SceneGeometrySnapshot as DielineGeometry,
+} from "./sceneLayoutModel";
 
 export class FeatureTool implements Extension {
   id = "pooder.kit.feature";
@@ -31,10 +34,12 @@ export class FeatureTool implements Extension {
   private context?: ExtensionContext;
   private isUpdatingConfig = false;
   private isToolActive = false;
+  private hasWorkingChanges = false;
+  private dirtyTrackerDisposable?: { dispose(): void };
 
   private handleMoving: ((e: any) => void) | null = null;
   private handleModified: ((e: any) => void) | null = null;
-  private handleDielineChange: ((geometry: DielineGeometry) => void) | null =
+  private handleSceneGeometryChange: ((geometry: DielineGeometry) => void) | null =
     null;
 
   private currentGeometry: DielineGeometry | null = null;
@@ -65,6 +70,7 @@ export class FeatureTool implements Extension {
       const features = (configService.get("dieline.features", []) ||
         []) as ConstraintFeature[];
       this.workingFeatures = this.cloneFeatures(features);
+      this.hasWorkingChanges = false;
 
       configService.onAnyChange((e: { key: string; value: any }) => {
         if (this.isUpdatingConfig) return;
@@ -72,12 +78,20 @@ export class FeatureTool implements Extension {
         if (e.key === "dieline.features") {
           const next = (e.value || []) as ConstraintFeature[];
           this.workingFeatures = this.cloneFeatures(next);
+          this.hasWorkingChanges = false;
           this.redraw();
           this.emitWorkingChange();
         }
       });
     }
 
+    const toolSessionService =
+      context.services.get<ToolSessionService>("ToolSessionService");
+    this.dirtyTrackerDisposable = toolSessionService?.registerDirtyTracker(
+      this.id,
+      () => this.hasWorkingChanges,
+    );
+
     // Listen to tool activation
     context.eventBus.on("tool:activated", this.onToolActivated);
 
@@ -86,6 +100,8 @@ export class FeatureTool implements Extension {
 
   deactivate(context: ExtensionContext) {
     context.eventBus.off("tool:activated", this.onToolActivated);
+    this.dirtyTrackerDisposable?.dispose();
+    this.dirtyTrackerDisposable = undefined;
     this.teardown();
     this.canvasService = undefined;
     this.context = undefined;
@@ -118,6 +134,22 @@ export class FeatureTool implements Extension {
 
   contribute() {
     return {
+      [ContributionPointIds.TOOLS]: [
+        {
+          id: this.id,
+          name: "Feature",
+          interaction: "session",
+          commands: {
+            begin: "resetWorkingFeatures",
+            commit: "completeFeatures",
+            rollback: "resetWorkingFeatures",
+          },
+          session: {
+            autoBegin: false,
+            leavePolicy: "block",
+          },
+        },
+      ],
       [ContributionPointIds.COMMANDS]: [
         {
           command: "addFeature",
@@ -145,6 +177,7 @@ export class FeatureTool implements Extension {
           title: "Clear Features",
           handler: () => {
             this.setWorkingFeatures([]);
+            this.hasWorkingChanges = true;
             this.redraw();
             this.emitWorkingChange();
             return true;
@@ -163,6 +196,26 @@ export class FeatureTool implements Extension {
           handler: async (features: ConstraintFeature[]) => {
             await this.refreshGeometry();
             this.setWorkingFeatures(this.cloneFeatures(features || []));
+            this.hasWorkingChanges = true;
+            this.redraw();
+            this.emitWorkingChange();
+            return { ok: true };
+          },
+        },
+        {
+          command: "resetWorkingFeatures",
+          title: "Reset Working Features",
+          handler: async () => {
+            const configService =
+              this.context?.services.get<ConfigurationService>(
+                "ConfigurationService",
+              );
+            const next = (configService?.get("dieline.features", []) ||
+              []) as ConstraintFeature[];
+
+            await this.refreshGeometry();
+            this.setWorkingFeatures(this.cloneFeatures(next));
+            this.hasWorkingChanges = false;
             this.redraw();
             this.emitWorkingChange();
             return { ok: true };
@@ -201,7 +254,9 @@ export class FeatureTool implements Extension {
     const commandService = this.context.services.get<any>("CommandService");
     if (!commandService) return;
     try {
-      const g = await Promise.resolve(commandService.executeCommand("getGeometry"));
+      const g = await Promise.resolve(
+        commandService.executeCommand("getSceneGeometry"),
+      );
       if (g) this.currentGeometry = g as DielineGeometry;
     } catch (e) {}
   }
@@ -217,14 +272,9 @@ export class FeatureTool implements Extension {
       this.context?.services.get<ConfigurationService>("ConfigurationService");
     if (!configService) return { ok: false };
 
-    const dielineWidth = parseLengthToMm(
-      configService.get("dieline.width") ?? 500,
-      "mm",
-    );
-    const dielineHeight = parseLengthToMm(
-      configService.get("dieline.height") ?? 500,
-      "mm",
-    );
+    const sizeState = readSizeState(configService);
+    const dielineWidth = sizeState.actualWidthMm;
+    const dielineHeight = sizeState.actualHeightMm;
 
     let changed = false;
     const next = this.workingFeatures.map((f) => {
@@ -250,6 +300,7 @@ export class FeatureTool implements Extension {
     if (!changed) return { ok: true };
 
     this.setWorkingFeatures(next);
+    this.hasWorkingChanges = true;
     this.redraw();
     this.enforceConstraints();
     this.emitWorkingChange();
@@ -276,14 +327,9 @@ export class FeatureTool implements Extension {
       };
     }
 
-    const dielineWidth = parseLengthToMm(
-      configService.get("dieline.width") ?? 500,
-      "mm",
-    );
-    const dielineHeight = parseLengthToMm(
-      configService.get("dieline.height") ?? 500,
-      "mm",
-    );
+    const sizeState = readSizeState(configService);
+    const dielineWidth = sizeState.actualWidthMm;
+    const dielineHeight = sizeState.actualHeightMm;
 
     const result = completeFeaturesStrict(
       this.workingFeatures,
@@ -308,6 +354,9 @@ export class FeatureTool implements Extension {
       };
     }
 
+    this.hasWorkingChanges = false;
+    // Keep feature markers above dieline overlay after config-driven redraw.
+    this.redraw();
     return { ok: true };
   }
 
@@ -330,6 +379,7 @@ export class FeatureTool implements Extension {
     };
 
     this.setWorkingFeatures([...(this.workingFeatures || []), newFeature]);
+    this.hasWorkingChanges = true;
     this.redraw();
     this.emitWorkingChange();
     return true;
@@ -370,6 +420,7 @@ export class FeatureTool implements Extension {
     };
 
     this.setWorkingFeatures([...(this.workingFeatures || []), lug, hole]);
+    this.hasWorkingChanges = true;
     this.redraw();
     this.emitWorkingChange();
     return true;
@@ -388,16 +439,16 @@ export class FeatureTool implements Extension {
     if (!this.canvasService || !this.context) return;
     const canvas = this.canvasService.canvas;
 
-    // 1. Listen for Dieline Geometry Changes
-    if (!this.handleDielineChange) {
-      this.handleDielineChange = (geometry: DielineGeometry) => {
+    // 1. Listen for Scene Geometry Changes
+    if (!this.handleSceneGeometryChange) {
+      this.handleSceneGeometryChange = (geometry: DielineGeometry) => {
         this.currentGeometry = geometry;
         this.redraw();
         this.enforceConstraints();
       };
       this.context.eventBus.on(
-        "dieline:geometry:change",
-        this.handleDielineChange,
+        "scene:geometry:change",
+        this.handleSceneGeometryChange,
       );
     }
 
@@ -405,7 +456,7 @@ export class FeatureTool implements Extension {
     const commandService = this.context.services.get<any>("CommandService");
     if (commandService) {
       try {
-        Promise.resolve(commandService.executeCommand("getGeometry")).then(
+        Promise.resolve(commandService.executeCommand("getSceneGeometry")).then(
           (g) => {
             if (g) {
               this.currentGeometry = g as DielineGeometry;
@@ -521,6 +572,7 @@ export class FeatureTool implements Extension {
           });
 
           this.setWorkingFeatures(newFeatures);
+          this.hasWorkingChanges = true;
           this.emitWorkingChange();
         } else {
           // Single object
@@ -543,12 +595,12 @@ export class FeatureTool implements Extension {
       canvas.off("object:modified", this.handleModified);
       this.handleModified = null;
     }
-    if (this.handleDielineChange && this.context) {
+    if (this.handleSceneGeometryChange && this.context) {
       this.context.eventBus.off(
-        "dieline:geometry:change",
-        this.handleDielineChange,
+        "scene:geometry:change",
+        this.handleSceneGeometryChange,
       );
-      this.handleDielineChange = null;
+      this.handleSceneGeometryChange = null;
     }
 
     const objects = canvas
@@ -636,6 +688,7 @@ export class FeatureTool implements Extension {
     const newFeatures = [...this.workingFeatures];
     newFeatures[index] = updatedFeature;
     this.setWorkingFeatures(newFeatures);
+    this.hasWorkingChanges = true;
     this.emitWorkingChange();
   }
 

package/src/film.ts

@@ -1,194 +1,194 @@
-import {
-  Extension,
-  ExtensionContext,
-  ContributionPointIds,
-  CommandContribution,
-  ConfigurationContribution,
-} from "@pooder/core";
-import { FabricImage as Image } from "fabric";
-import CanvasService from "./CanvasService";
-
-export class FilmTool implements Extension {
-  id = "pooder.kit.film";
-
-  public metadata = {
-    name: "FilmTool",
-  };
-
-  private url: string = "";
-  private opacity: number = 0.5;
-
-  private canvasService?: CanvasService;
-
-  constructor(
-    options?: Partial<{
-      url: string;
-      opacity: number;
-    }>,
-  ) {
-    if (options) {
-      Object.assign(this, options);
-    }
-  }
-
-  activate(context: ExtensionContext) {
-    this.canvasService = context.services.get<CanvasService>("CanvasService");
-    if (!this.canvasService) {
-      console.warn("CanvasService not found for FilmTool");
-      return;
-    }
-
-    const configService = context.services.get<any>("ConfigurationService");
-    if (configService) {
-      // Load initial config
-      this.url = configService.get("film.url", this.url);
-      this.opacity = configService.get("film.opacity", this.opacity);
-
-      // Listen for changes
-      configService.onAnyChange((e: { key: string; value: any }) => {
-        if (e.key.startsWith("film.")) {
-          const prop = e.key.split(".")[1];
-          console.log(
-            `[FilmTool] Config change detected: ${e.key} -> ${e.value}`,
-          );
-          if (prop && prop in this) {
-            (this as any)[prop] = e.value;
-            this.updateFilm();
-          }
-        }
-      });
-    }
-
-    this.initLayer();
-    this.updateFilm();
-  }
-
-  deactivate(context: ExtensionContext) {
-    if (this.canvasService) {
-      const layer = this.canvasService.getLayer("overlay");
-      if (layer) {
-        const img = this.canvasService.getObject("film-image", "overlay");
-        if (img) {
-          layer.remove(img);
-          this.canvasService.requestRenderAll();
-        }
-      }
-      this.canvasService = undefined;
-    }
-  }
-
-  contribute() {
-    return {
-      [ContributionPointIds.CONFIGURATIONS]: [
-        {
-          id: "film.url",
-          type: "string",
-          label: "Film Image URL",
-          default: "",
-        },
-        {
-          id: "film.opacity",
-          type: "number",
-          label: "Opacity",
-          min: 0,
-          max: 1,
-          step: 0.1,
-          default: 0.5,
-        },
-      ] as ConfigurationContribution[],
-      [ContributionPointIds.COMMANDS]: [
-        {
-          command: "setFilmImage",
-          title: "Set Film Image",
-          handler: (url: string, opacity: number) => {
-            if (this.url === url && this.opacity === opacity) return true;
-
-            this.url = url;
-            this.opacity = opacity;
-
-            this.updateFilm();
-
-            return true;
-          },
-        },
-      ] as CommandContribution[],
-    };
-  }
-
-  private initLayer() {
-    if (!this.canvasService) return;
-    let overlayLayer = this.canvasService.getLayer("overlay");
-    if (!overlayLayer) {
-      const width = this.canvasService.canvas.width || 800;
-      const height = this.canvasService.canvas.height || 600;
-
-      const layer = this.canvasService.createLayer("overlay", {
-        width,
-        height,
-        left: 0,
-        top: 0,
-        originX: "left",
-        originY: "top",
-        selectable: false,
-        evented: false,
-        subTargetCheck: false,
-        interactive: false,
-      });
-
-      this.canvasService.canvas.bringObjectToFront(layer);
-    }
-  }
-
-  private async updateFilm() {
-    if (!this.canvasService) return;
-    const layer = this.canvasService.getLayer("overlay");
-    if (!layer) {
-      console.warn("[FilmTool] Overlay layer not found");
-      return;
-    }
-
-    const { url, opacity } = this;
-
-    if (!url) {
-      const img = this.canvasService.getObject("film-image", "overlay");
-      if (img) {
-        layer.remove(img);
-        this.canvasService.requestRenderAll();
-      }
-      return;
-    }
-
-    const width = this.canvasService.canvas.width || 800;
-    const height = this.canvasService.canvas.height || 600;
-
-    let img = this.canvasService.getObject("film-image", "overlay") as Image;
-    try {
-      if (img) {
-        if (img.getSrc() !== url) {
-          await img.setSrc(url);
-        }
-        img.set({ opacity });
-      } else {
-        img = await Image.fromURL(url, { crossOrigin: "anonymous" });
-        img.scaleToWidth(width);
-        if (img.getScaledHeight() < height) img.scaleToHeight(height);
-        img.set({
-          originX: "left",
-          originY: "top",
-          left: 0,
-          top: 0,
-          opacity,
-          selectable: false,
-          evented: false,
-          data: { id: "film-image" },
-        });
-        layer.add(img);
-      }
-      this.canvasService.requestRenderAll();
-    } catch (error) {
-      console.error("[FilmTool] Failed to load film image", url, error);
-    }
-    layer.dirty = true;
-    this.canvasService.requestRenderAll();
-  }
-}
+import {
+  Extension,
+  ExtensionContext,
+  ContributionPointIds,
+  CommandContribution,
+  ConfigurationContribution,
+} from "@pooder/core";
+import { FabricImage as Image } from "fabric";
+import CanvasService from "./CanvasService";
+
+export class FilmTool implements Extension {
+  id = "pooder.kit.film";
+
+  public metadata = {
+    name: "FilmTool",
+  };
+
+  private url: string = "";
+  private opacity: number = 0.5;
+
+  private canvasService?: CanvasService;
+
+  constructor(
+    options?: Partial<{
+      url: string;
+      opacity: number;
+    }>,
+  ) {
+    if (options) {
+      Object.assign(this, options);
+    }
+  }
+
+  activate(context: ExtensionContext) {
+    this.canvasService = context.services.get<CanvasService>("CanvasService");
+    if (!this.canvasService) {
+      console.warn("CanvasService not found for FilmTool");
+      return;
+    }
+
+    const configService = context.services.get<any>("ConfigurationService");
+    if (configService) {
+      // Load initial config
+      this.url = configService.get("film.url", this.url);
+      this.opacity = configService.get("film.opacity", this.opacity);
+
+      // Listen for changes
+      configService.onAnyChange((e: { key: string; value: any }) => {
+        if (e.key.startsWith("film.")) {
+          const prop = e.key.split(".")[1];
+          console.log(
+            `[FilmTool] Config change detected: ${e.key} -> ${e.value}`,
+          );
+          if (prop && prop in this) {
+            (this as any)[prop] = e.value;
+            this.updateFilm();
+          }
+        }
+      });
+    }
+
+    this.initLayer();
+    this.updateFilm();
+  }
+
+  deactivate(context: ExtensionContext) {
+    if (this.canvasService) {
+      const layer = this.canvasService.getLayer("overlay");
+      if (layer) {
+        const img = this.canvasService.getObject("film-image", "overlay");
+        if (img) {
+          layer.remove(img);
+          this.canvasService.requestRenderAll();
+        }
+      }
+      this.canvasService = undefined;
+    }
+  }
+
+  contribute() {
+    return {
+      [ContributionPointIds.CONFIGURATIONS]: [
+        {
+          id: "film.url",
+          type: "string",
+          label: "Film Image URL",
+          default: "",
+        },
+        {
+          id: "film.opacity",
+          type: "number",
+          label: "Opacity",
+          min: 0,
+          max: 1,
+          step: 0.1,
+          default: 0.5,
+        },
+      ] as ConfigurationContribution[],
+      [ContributionPointIds.COMMANDS]: [
+        {
+          command: "setFilmImage",
+          title: "Set Film Image",
+          handler: (url: string, opacity: number) => {
+            if (this.url === url && this.opacity === opacity) return true;
+
+            this.url = url;
+            this.opacity = opacity;
+
+            this.updateFilm();
+
+            return true;
+          },
+        },
+      ] as CommandContribution[],
+    };
+  }
+
+  private initLayer() {
+    if (!this.canvasService) return;
+    let overlayLayer = this.canvasService.getLayer("overlay");
+    if (!overlayLayer) {
+      const width = this.canvasService.canvas.width || 800;
+      const height = this.canvasService.canvas.height || 600;
+
+      const layer = this.canvasService.createLayer("overlay", {
+        width,
+        height,
+        left: 0,
+        top: 0,
+        originX: "left",
+        originY: "top",
+        selectable: false,
+        evented: false,
+        subTargetCheck: false,
+        interactive: false,
+      });
+
+      this.canvasService.canvas.bringObjectToFront(layer);
+    }
+  }
+
+  private async updateFilm() {
+    if (!this.canvasService) return;
+    const layer = this.canvasService.getLayer("overlay");
+    if (!layer) {
+      console.warn("[FilmTool] Overlay layer not found");
+      return;
+    }
+
+    const { url, opacity } = this;
+
+    if (!url) {
+      const img = this.canvasService.getObject("film-image", "overlay");
+      if (img) {
+        layer.remove(img);
+        this.canvasService.requestRenderAll();
+      }
+      return;
+    }
+
+    const width = this.canvasService.canvas.width || 800;
+    const height = this.canvasService.canvas.height || 600;
+
+    let img = this.canvasService.getObject("film-image", "overlay") as Image;
+    try {
+      if (img) {
+        if (img.getSrc() !== url) {
+          await img.setSrc(url);
+        }
+        img.set({ opacity });
+      } else {
+        img = await Image.fromURL(url, { crossOrigin: "anonymous" });
+        img.scaleToWidth(width);
+        if (img.getScaledHeight() < height) img.scaleToHeight(height);
+        img.set({
+          originX: "left",
+          originY: "top",
+          left: 0,
+          top: 0,
+          opacity,
+          selectable: false,
+          evented: false,
+          data: { id: "film-image" },
+        });
+        layer.add(img);
+      }
+      this.canvasService.requestRenderAll();
+    } catch (error) {
+      console.error("[FilmTool] Failed to load film image", url, error);
+    }
+    layer.dirty = true;
+    this.canvasService.requestRenderAll();
+  }
+}