@sliiu/present-renderer 0.0.0-stage → 0.1.0

package/dist/esm/selection.js

@@ -0,0 +1,122 @@
+export class Selection {
+    ids = new Set();
+    listeners = new Set();
+    get() {
+        return [...this.ids];
+    }
+    has(id) {
+        return this.ids.has(id);
+    }
+    set(ids) {
+        this.ids = new Set(ids);
+        this.fire();
+    }
+    add(id) {
+        this.ids.add(id);
+        this.fire();
+    }
+    remove(id) {
+        this.ids.delete(id);
+        this.fire();
+    }
+    toggle(id) {
+        if (this.ids.has(id))
+            this.ids.delete(id);
+        else
+            this.ids.add(id);
+        this.fire();
+    }
+    clear() {
+        if (this.ids.size === 0)
+            return;
+        this.ids.clear();
+        this.fire();
+    }
+    on(fn) {
+        this.listeners.add(fn);
+        return () => this.listeners.delete(fn);
+    }
+    fire() {
+        for (const l of this.listeners)
+            l(this.ids);
+    }
+}
+export function nodeWorldBBox(node) {
+    const b = node.shape.bbox;
+    const cx = b.x + b.w / 2;
+    const cy = b.y + b.h / 2;
+    const flipX = node.shape.transform?.scaleX ?? 1;
+    const flipY = node.shape.transform?.scaleY ?? 1;
+    const sx = node.scale * node.scaleX * node.widthScale * (flipX < 0 ? -1 : 1);
+    const sy = node.scale * node.scaleY * node.heightScale * (flipY < 0 ? -1 : 1);
+    return {
+        x: b.x + node.tx + (1 - sx) * (cx - b.x),
+        y: b.y + node.ty + (1 - sy) * (cy - b.y),
+        w: b.w * sx,
+        h: b.h * sy,
+    };
+}
+export function hitTest(scene, x, y, opts = {}) {
+    let result = null;
+    const visit = (node) => {
+        if (node.shape.kind !== "group") {
+            if (opts.ignoreLocked && node.shape.locked)
+                return;
+            if (pointInNode(node, x, y))
+                result = node;
+        }
+        for (const c of node.children)
+            visit(c);
+    };
+    visit(scene.root);
+    return result;
+}
+export function pointInNode(node, x, y) {
+    const b = node.shape.bbox;
+    const cx = b.x + b.w / 2;
+    const cy = b.y + b.h / 2;
+    let lx = x - node.tx;
+    let ly = y - node.ty;
+    const flipX = node.shape.transform?.scaleX ?? 1;
+    const flipY = node.shape.transform?.scaleY ?? 1;
+    const sx = node.scale * node.scaleX * node.widthScale * (flipX < 0 ? -1 : 1);
+    const sy = node.scale * node.scaleY * node.heightScale * (flipY < 0 ? -1 : 1);
+    if (sx !== 1)
+        lx = (lx - cx) / sx + cx;
+    if (sy !== 1)
+        ly = (ly - cy) / sy + cy;
+    if (node.rotation !== 0) {
+        const a = (-node.rotation * Math.PI) / 180;
+        const dx = lx - cx;
+        const dy = ly - cy;
+        lx = cx + dx * Math.cos(a) - dy * Math.sin(a);
+        ly = cy + dx * Math.sin(a) + dy * Math.cos(a);
+    }
+    if (node.shape.kind === "ellipse") {
+        const rx = b.w / 2;
+        const ry = b.h / 2;
+        const dx = (lx - cx) / rx;
+        const dy = (ly - cy) / ry;
+        return dx * dx + dy * dy <= 1;
+    }
+    return lx >= b.x && lx <= b.x + b.w && ly >= b.y && ly <= b.y + b.h;
+}
+export function attachPointerSelection(hostEl, scene, selection) {
+    const onClick = (e) => {
+        const rect = hostEl.getBoundingClientRect();
+        const sx = (e.clientX - rect.left) * (scene.width / rect.width);
+        const sy = (e.clientY - rect.top) * (scene.height / rect.height);
+        const hit = hitTest(scene, sx, sy);
+        if (!hit) {
+            if (!e.shiftKey)
+                selection.clear();
+            return;
+        }
+        if (e.shiftKey)
+            selection.toggle(hit.id);
+        else
+            selection.set([hit.id]);
+    };
+    hostEl.addEventListener("pointerdown", onClick);
+    return () => hostEl.removeEventListener("pointerdown", onClick);
+}

package/dist/esm/shape-effects.js

@@ -0,0 +1,60 @@
+const EMPTY = { outer: [], glow: [] };
+export function collectShapeEffects(s) {
+    const list = s.effects && s.effects.length ? s.effects : s.shadow ? [s.shadow] : undefined;
+    if (!list)
+        return EMPTY;
+    const out = { outer: [], glow: [] };
+    for (const fx of list) {
+        switch (fx.kind) {
+            case "outer":
+                out.outer.push(fx);
+                break;
+            case "inner":
+                if (!out.inner)
+                    out.inner = fx;
+                break;
+            case "glow":
+                out.glow.push(fx);
+                break;
+            case "softEdge":
+                if (!out.softEdge)
+                    out.softEdge = fx;
+                break;
+            case "reflection":
+                if (!out.reflection)
+                    out.reflection = fx;
+                break;
+            default:
+                // blur/duotone/alphaMod 等位图效果由 paint-canvas 的图像通道处理，不在此列。
+                break;
+        }
+    }
+    return out;
+}
+export function hasAnyEffect(fx) {
+    return fx.outer.length > 0 || fx.glow.length > 0 || !!fx.inner || !!fx.softEdge || !!fx.reflection;
+}
+export function effectHexWithAlpha(color, alpha) {
+    if (alpha >= 1)
+        return color;
+    if (/^#([0-9a-f]{6})$/i.test(color)) {
+        const a = Math.round(Math.max(0, Math.min(1, alpha)) * 255)
+            .toString(16)
+            .padStart(2, "0");
+        return color + a;
+    }
+    return color;
+}
+/** outer shadow + glow 的 CSS filter 链（SVG style.filter / Canvas ctx.filter 通用）。 */
+export function cssFilterForEffects(fx) {
+    const parts = [];
+    for (const sh of fx.outer) {
+        parts.push(`drop-shadow(${sh.dx}px ${sh.dy}px ${sh.blur}px ${effectHexWithAlpha(sh.color, sh.alpha)})`);
+    }
+    for (const g of fx.glow) {
+        const c = effectHexWithAlpha(g.color, g.alpha);
+        parts.push(`drop-shadow(0 0 ${g.radius}px ${c})`);
+        parts.push(`drop-shadow(0 0 ${g.radius}px ${c})`);
+    }
+    return parts.join(" ");
+}

package/dist/esm/shape-front.js

@@ -0,0 +1,35 @@
+import { rasterizeShapeFront } from "./canvas-backend.js";
+const cache = new Map();
+/** 文字 3D 的正面：字形画进 PNG，再贴到挤出体上。非文字返回 undefined。 */
+export function shapeFrontImageSrc(scene, shape) {
+    if (shape.kind !== "text" || typeof document === "undefined")
+        return undefined;
+    const key = JSON.stringify({
+        id: shape.id,
+        w: Math.round(shape.bbox.w),
+        h: Math.round(shape.bbox.h),
+        p: shape.paragraphs,
+        f: shape.fill ?? null,
+        i: shape.insets ?? null,
+    });
+    const hit = cache.get(key);
+    if (hit)
+        return hit;
+    const canvas = rasterizeShapeFront(scene, shape.id);
+    if (!canvas)
+        return undefined;
+    let url;
+    try {
+        url = canvas.toDataURL("image/png");
+    }
+    catch {
+        return undefined;
+    }
+    cache.set(key, url);
+    if (cache.size > 40) {
+        const oldest = cache.keys().next().value;
+        if (oldest)
+            cache.delete(oldest);
+    }
+    return url;
+}

package/dist/esm/stage-chrome.js

@@ -0,0 +1,12 @@
+/**
+ * CSS background for the stage / hybrid wrapper chrome around the scene.
+ * When the slide has a painted background, createScene injects a full-slide
+ * __bg_* shape — a second opaque underlay would show through image alpha or
+ * mask gradient edges. Use white only when the slide has no background paint.
+ */
+export function stageChromeBackground(slide) {
+    const bg = slide?.background;
+    if (!bg || bg.kind === "none")
+        return "#ffffff";
+    return "transparent";
+}