@pooder/kit 5.4.0 → 6.0.0

package/.test-dist/src/extensions/featureComplete.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.validateFeaturesStrict = validateFeaturesStrict;
+exports.completeFeaturesStrict = completeFeaturesStrict;
+const constraints_1 = require("./constraints");
+function validateFeaturesStrict(features, context) {
+    const eps = 1e-6;
+    const issues = [];
+    for (const f of features) {
+        if (!f.constraints || f.constraints.length === 0)
+            continue;
+        // Pass ALL constraints (including validateOnly) for strict validation check
+        const constrained = constraints_1.ConstraintRegistry.apply(f.x, f.y, f, context, f.constraints);
+        if (Math.abs(constrained.x - f.x) > eps ||
+            Math.abs(constrained.y - f.y) > eps) {
+            issues.push({
+                featureId: f.id,
+                groupId: f.groupId,
+                reason: "Position violates constraint strategy",
+            });
+        }
+    }
+    return { ok: issues.length === 0, issues: issues.length ? issues : undefined };
+}
+function completeFeaturesStrict(features, context, update) {
+    const validation = validateFeaturesStrict(features, context);
+    if (!validation.ok)
+        return validation;
+    const next = JSON.parse(JSON.stringify(features || []));
+    update(next);
+    return { ok: true };
+}

package/.test-dist/src/extensions/film.js

@@ -0,0 +1,226 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FilmTool = void 0;
+const core_1 = require("@pooder/core");
+const fabric_1 = require("fabric");
+const FILM_LAYER_ID = "overlay";
+const FILM_IMAGE_ID = "film-image";
+const DEFAULT_WIDTH = 800;
+const DEFAULT_HEIGHT = 600;
+class FilmTool {
+    constructor(options) {
+        this.id = "pooder.kit.film";
+        this.metadata = {
+            name: "FilmTool",
+        };
+        this.url = "";
+        this.opacity = 0.5;
+        this.specs = [];
+        this.renderSeq = 0;
+        this.renderImageUrl = "";
+        this.sourceSizeBySrc = new Map();
+        this.pendingSizeBySrc = new Map();
+        this.onCanvasResized = () => {
+            this.updateFilm();
+        };
+        if (options) {
+            Object.assign(this, options);
+        }
+    }
+    activate(context) {
+        this.canvasService = context.services.get("CanvasService");
+        if (!this.canvasService) {
+            console.warn("CanvasService not found for FilmTool");
+            return;
+        }
+        this.renderProducerDisposable?.dispose();
+        this.renderProducerDisposable = this.canvasService.registerRenderProducer(this.id, () => ({
+            passes: [
+                {
+                    id: FILM_LAYER_ID,
+                    stack: 1000,
+                    order: 0,
+                    objects: this.specs,
+                },
+            ],
+        }), { priority: 500 });
+        const configService = context.services.get("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) => {
+                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[prop] = e.value;
+                        this.updateFilm();
+                    }
+                }
+            });
+        }
+        context.eventBus.on("canvas:resized", this.onCanvasResized);
+        this.updateFilm();
+    }
+    deactivate(context) {
+        context.eventBus.off("canvas:resized", this.onCanvasResized);
+        this.renderSeq += 1;
+        this.specs = [];
+        this.renderImageUrl = "";
+        this.renderProducerDisposable?.dispose();
+        this.renderProducerDisposable = undefined;
+        if (!this.canvasService)
+            return;
+        void this.canvasService.flushRenderFromProducers();
+        this.canvasService.requestRenderAll();
+        this.canvasService = undefined;
+    }
+    contribute() {
+        return {
+            [core_1.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,
+                },
+            ],
+            [core_1.ContributionPointIds.COMMANDS]: [
+                {
+                    command: "setFilmImage",
+                    title: "Set Film Image",
+                    handler: (url, opacity) => {
+                        if (this.url === url && this.opacity === opacity)
+                            return true;
+                        this.url = url;
+                        this.opacity = opacity;
+                        this.updateFilm();
+                        return true;
+                    },
+                },
+            ],
+        };
+    }
+    getViewportSize() {
+        const width = Number(this.canvasService?.canvas.width || 0);
+        const height = Number(this.canvasService?.canvas.height || 0);
+        return {
+            width: width > 0 ? width : DEFAULT_WIDTH,
+            height: height > 0 ? height : DEFAULT_HEIGHT,
+        };
+    }
+    clampOpacity(value) {
+        return Math.max(0, Math.min(1, Number(value)));
+    }
+    buildFilmSpecs(imageUrl, opacity) {
+        if (!imageUrl) {
+            return [];
+        }
+        const { width, height } = this.getViewportSize();
+        const sourceSize = this.sourceSizeBySrc.get(imageUrl);
+        const sourceWidth = Math.max(1, Number(sourceSize?.width || width));
+        const sourceHeight = Math.max(1, Number(sourceSize?.height || height));
+        const coverScale = Math.max(width / sourceWidth, height / sourceHeight);
+        return [
+            {
+                id: FILM_IMAGE_ID,
+                type: "image",
+                src: imageUrl,
+                space: "screen",
+                data: {
+                    id: FILM_IMAGE_ID,
+                    layerId: FILM_LAYER_ID,
+                    type: "film-image",
+                },
+                props: {
+                    left: 0,
+                    top: 0,
+                    originX: "left",
+                    originY: "top",
+                    opacity: this.clampOpacity(opacity),
+                    scaleX: coverScale,
+                    scaleY: coverScale,
+                    selectable: false,
+                    evented: false,
+                    excludeFromExport: true,
+                },
+            },
+        ];
+    }
+    async ensureImageSize(src) {
+        if (!src)
+            return null;
+        const cached = this.sourceSizeBySrc.get(src);
+        if (cached)
+            return cached;
+        const pending = this.pendingSizeBySrc.get(src);
+        if (pending) {
+            return pending;
+        }
+        const task = this.loadImageSize(src);
+        this.pendingSizeBySrc.set(src, task);
+        try {
+            return await task;
+        }
+        finally {
+            if (this.pendingSizeBySrc.get(src) === task) {
+                this.pendingSizeBySrc.delete(src);
+            }
+        }
+    }
+    async loadImageSize(src) {
+        try {
+            const image = await fabric_1.FabricImage.fromURL(src, {
+                crossOrigin: "anonymous",
+            });
+            const width = Number(image?.width || 0);
+            const height = Number(image?.height || 0);
+            if (width > 0 && height > 0) {
+                const size = { width, height };
+                this.sourceSizeBySrc.set(src, size);
+                return size;
+            }
+        }
+        catch (error) {
+            console.error("[FilmTool] Failed to load film image", src, error);
+        }
+        return null;
+    }
+    updateFilm() {
+        void this.updateFilmAsync();
+    }
+    async updateFilmAsync() {
+        if (!this.canvasService)
+            return;
+        const seq = ++this.renderSeq;
+        const nextUrl = String(this.url || "").trim();
+        if (!nextUrl) {
+            this.renderImageUrl = "";
+        }
+        else if (nextUrl !== this.renderImageUrl) {
+            const loaded = await this.ensureImageSize(nextUrl);
+            if (seq !== this.renderSeq)
+                return;
+            if (loaded) {
+                this.renderImageUrl = nextUrl;
+            }
+        }
+        this.specs = this.buildFilmSpecs(this.renderImageUrl, this.opacity);
+        await this.canvasService.flushRenderFromProducers();
+        if (seq !== this.renderSeq)
+            return;
+        this.canvasService.requestRenderAll();
+    }
+}
+exports.FilmTool = FilmTool;