pixi-effects 0.9.0 → 0.11.0

package/dist/{chunk-FNKSXBKB.js → chunk-C6QHKYC5.js}

@@ -1,8 +1,43 @@
 import { suggestName } from './chunk-DKGG7WD4.js';
 import * as PIXI from 'pixi.js';
-import { Rectangle, Container, Graphics, Assets, Texture, Sprite, Text, Filter, GlProgram, defaultFilterVert, GpuProgram, UniformGroup, FillGradient, Color, GraphicsPath } from 'pixi.js';
+import { Rectangle, Container, GraphicsPath, Graphics, Assets, Texture, Sprite, Text, Filter, GlProgram, defaultFilterVert, GpuProgram, UniformGroup, FillGradient, Color } from 'pixi.js';
 import { gsap } from 'gsap';
 
+// src/expr/random.ts
+function mix(h) {
+  h = Math.imul(h ^ h >>> 16, 2246822507);
+  h = Math.imul(h ^ h >>> 13, 3266489909);
+  return (h ^ h >>> 16) >>> 0;
+}
+function fold(n) {
+  if (!Number.isFinite(n)) return 0;
+  const i = Math.floor(n);
+  const f = n - i;
+  return (i | 0) ^ Math.imul(Math.floor(f * 1048576), 2654435761);
+}
+function rand(seed) {
+  return mix(fold(seed) + 2654435769) / 4294967296;
+}
+function random(seed) {
+  let a = fold(seed) + 1831565813 | 0;
+  return () => {
+    a = a + 1831565813 | 0;
+    let t = Math.imul(a ^ a >>> 15, 1 | a);
+    t = t + Math.imul(t ^ t >>> 7, 61 | t) ^ t;
+    return ((t ^ t >>> 14) >>> 0) / 4294967296;
+  };
+}
+function noise(x, seed = 0) {
+  if (!Number.isFinite(x)) return 0;
+  const i = Math.floor(x);
+  const f = x - i;
+  const s = fold(seed) * 668265261;
+  const a = mix((i | 0) + s) / 2147483648 - 1;
+  const b = mix((i + 1 | 0) + s) / 2147483648 - 1;
+  const u = f * f * f * (f * (f * 6 - 15) + 10);
+  return a + (b - a) * u;
+}
+
 // src/expr/Parser.ts
 var FUNCS = {
   min: Math.min,
@@ -15,8 +50,19 @@ var FUNCS = {
   pow: Math.pow,
   sin: Math.sin,
   cos: Math.cos,
-  tan: Math.tan
+  tan: Math.tan,
+  rand: (seed) => rand(seed),
+  noise: (x, seed = 0) => noise(x, seed),
+  lerp: (a, b, t) => a + (b - a) * t,
+  clamp: (x, lo, hi) => Math.min(Math.max(x, lo), hi),
+  smoothstep: (a, b, x) => {
+    const u = Math.min(Math.max((x - a) / (b - a), 0), 1);
+    return u * u * (3 - 2 * u);
+  },
+  mod: (a, b) => (a % b + b) % b,
+  step: (edge, x) => x >= edge ? 1 : 0
 };
+var CONSTS = { PI: Math.PI };
 function isDigit(c) {
   return c >= "0" && c <= "9";
 }
@@ -162,6 +208,7 @@ function evalNode(node, scope) {
     case "num":
       return node.value;
     case "var": {
+      if (node.name in CONSTS) return CONSTS[node.name];
       const v = scope[node.name];
       if (typeof v !== "number") throw new Error(`undefined variable: ${node.name}`);
       return v;
@@ -943,6 +990,12 @@ var Sequence = class {
     this.target = null;
   }
 };
+var NullSequence = class extends Sequence {
+  async build() {
+    this.target = new Container();
+    this.buildFilters();
+  }
+};
 
 // src/space/specKeys.ts
 function collectPropKeys(spec) {
@@ -2073,6 +2126,85 @@ function slice(line, a, b) {
   return out;
 }
 
+// src/sequences/morphPath.ts
+function resample(line, n) {
+  const p = line.closed ? [...line.pts, line.pts[0], line.pts[1]] : line.pts;
+  const cum = [0];
+  for (let i = 2; i < p.length; i += 2) cum.push(cum[cum.length - 1] + Math.hypot(p[i] - p[i - 2], p[i + 1] - p[i - 1]));
+  const total = cum[cum.length - 1];
+  const out = [];
+  if (!(total > 0)) {
+    for (let i = 0; i < n; i++) out.push(p[0], p[1]);
+    return out;
+  }
+  let seg = 1;
+  for (let i = 0; i < n; i++) {
+    const s = line.closed ? i * total / n : n === 1 ? 0 : i * total / (n - 1);
+    while (seg < cum.length - 1 && cum[seg] < s) seg++;
+    const len = cum[seg] - cum[seg - 1];
+    const t = len > 0 ? (s - cum[seg - 1]) / len : 0;
+    const k = seg * 2;
+    out.push(p[k - 2] + (p[k] - p[k - 2]) * t, p[k - 1] + (p[k + 1] - p[k - 1]) * t);
+  }
+  return out;
+}
+var centroid = (pts) => {
+  let x = 0, y = 0;
+  for (let i = 0; i < pts.length; i += 2) {
+    x += pts[i];
+    y += pts[i + 1];
+  }
+  const n = pts.length / 2;
+  return [x / n, y / n];
+};
+function align(a, b) {
+  const n = a.length / 2;
+  let best = b, bestCost = Infinity;
+  for (const reversed of [false, true]) {
+    for (let k = 0; k < n; k++) {
+      let cost = 0;
+      for (let i = 0; i < n && cost < bestCost; i++) {
+        const j = reversed ? ((k - i) % n + n) % n : (k + i) % n;
+        cost += (a[2 * i] - b[2 * j]) ** 2 + (a[2 * i + 1] - b[2 * j + 1]) ** 2;
+      }
+      if (cost < bestCost) {
+        bestCost = cost;
+        const out = [];
+        for (let i = 0; i < n; i++) {
+          const j = reversed ? ((k - i) % n + n) % n : (k + i) % n;
+          out.push(b[2 * j], b[2 * j + 1]);
+        }
+        best = out;
+      }
+    }
+  }
+  return best;
+}
+function buildMorph(from, to, n = 128) {
+  if (from.length === 0 || to.length === 0) return [];
+  const pairs = [];
+  const count = Math.max(from.length, to.length);
+  for (let i = 0; i < count; i++) {
+    const fa = from[i], fb = to[i];
+    const closed = (fa?.closed ?? fb.closed) && (fb?.closed ?? fa.closed);
+    const a = fa ? resample({ pts: fa.pts, closed }, n) : collapsed(resample({ pts: fb.pts, closed }, n));
+    let b = fb ? resample({ pts: fb.pts, closed }, n) : collapsed(a);
+    if (closed && fa && fb) b = align(a, b);
+    pairs.push({ a, b, closed });
+  }
+  return pairs;
+}
+function collapsed(pts) {
+  const [cx, cy] = centroid(pts);
+  const out = [];
+  for (let i = 0; i < pts.length; i += 2) out.push(cx, cy);
+  return out;
+}
+function morphAt(pairs, t) {
+  const u = Math.min(Math.max(t, 0), 1);
+  return pairs.map(({ a, b, closed }) => ({ pts: a.map((v, i) => v + (b[i] - v) * u), closed }));
+}
+
 // src/sequences/Shape.ts
 var STYLE_KEYS = ["fillColor", "fillAlpha", "strokeColor", "strokeAlpha", "strokeWidth"];
 var COLOR_KEYS = /* @__PURE__ */ new Set(["fillColor", "strokeColor"]);
@@ -2084,7 +2216,7 @@ var GEOMETRY_KEYS_BY_SHAPE = {
   arc: ["radius", "innerRadius", "startAngle", "endAngle"],
   line: [...TRIM_KEYS],
   polygon: [...TRIM_KEYS],
-  path: [...TRIM_KEYS]
+  path: [...TRIM_KEYS, "morph"]
 };
 var ANCHORED_SHAPES = /* @__PURE__ */ new Set(["rect", "circle", "ellipse", "arc"]);
 var ShapeSequence = class extends Sequence {
@@ -2127,8 +2259,9 @@ var ShapeSequence = class extends Sequence {
     }
     const gradientSpec = this.spec.fillGradient ?? this.spec.initial?.fillGradient;
     if (gradientSpec) this._state.fillStyle = makeGradientFill(gradientSpec);
-    this._drawGeometry = makeDrawGeometry(this.spec, scope, this._state);
-    this._outline = makeOutline(this.spec, scope, this._state);
+    const morph = this._setupMorph();
+    this._drawGeometry = makeDrawGeometry(this.spec, scope, this._state, morph);
+    this._outline = makeOutline(this.spec, scope, this._state, morph);
     const { trimStart, trimEnd } = this._state;
     this._state.trimStart = 0;
     this._state.trimEnd = 1;
@@ -2157,6 +2290,33 @@ var ShapeSequence = class extends Sequence {
     this._redraw();
     this.buildFilters();
   }
+  /** The prepared morph between `d` and `morphTo`, or null (and a warning when the spec asked for one that cannot work). */
+  _setupMorph() {
+    const who = describeLayer(this.spec);
+    const top = this.spec;
+    const wanted = this.spec.shape === "path" && (this._state.morph !== void 0 || collectPropKeys(this.spec).has("morph"));
+    if (this.spec.shape !== "path") {
+      if ("morphTo" in top) console.warn(`pixi-effects: ${who}: morphTo only works on a path shape (shape: 'path'); ignored`);
+      return null;
+    }
+    if (top.morphTo === void 0) {
+      if (wanted) console.warn(`pixi-effects: ${who}: morph needs morphTo (the outline to morph into); ignored`);
+      return null;
+    }
+    let points2 = 128;
+    if (top.morphPoints !== void 0) {
+      const n = Number(top.morphPoints);
+      if (Number.isInteger(n) && n >= 8 && n <= 2048) points2 = n;
+      else console.warn(`pixi-effects: ${who}: morphPoints must be a whole number from 8 to 2048, got ${String(top.morphPoints)}; using 128`);
+    }
+    const pairs = buildMorph(flattenSvgPath(this.spec.d), flattenSvgPath(String(top.morphTo)), points2);
+    if (pairs.length === 0) {
+      console.warn(`pixi-effects: ${who}: morphTo "${String(top.morphTo)}" (or d) draws nothing, so there is nothing to morph; ignored`);
+      return null;
+    }
+    this._state.morph ??= 0;
+    return { pairs, to: String(top.morphTo) };
+  }
   _fresh = false;
   _outline = null;
   _redraw() {
@@ -2391,7 +2551,7 @@ var STATE_DRAWERS = {
   ellipse: drawEllipseFromState,
   arc: drawArcFromState
 };
-function makeDrawGeometry(spec, scope, state) {
+function makeDrawGeometry(spec, scope, state, morph) {
   const stateDrawer = STATE_DRAWERS[spec.shape];
   if (stateDrawer) return (g) => stateDrawer(g, state);
   switch (spec.shape) {
@@ -2399,13 +2559,30 @@ function makeDrawGeometry(spec, scope, state) {
       return makeLineDraw(spec, scope);
     case "polygon":
       return makePolygonDraw(spec, scope);
-    case "path":
-      return makePathDraw(spec);
+    case "path": {
+      const plain = makePathDraw(spec);
+      if (!morph) return plain;
+      const last = makePathDraw({ ...spec, d: morph.to });
+      return (g) => {
+        const t = state.morph ?? 0;
+        if (t <= 0) plain(g);
+        else if (t >= 1) last(g);
+        else for (const part of morphAt(morph.pairs, t)) drawPolyline(g, part);
+      };
+    }
   }
   return () => {
   };
 }
-function makeOutline(spec, scope, s) {
+function drawPolyline(g, part) {
+  if (part.closed) {
+    g.poly(part.pts, true);
+    return;
+  }
+  g.moveTo(part.pts[0], part.pts[1]);
+  for (let i = 2; i < part.pts.length; i += 2) g.lineTo(part.pts[i], part.pts[i + 1]);
+}
+function makeOutline(spec, scope, s, morph) {
   switch (spec.shape) {
     case "rect":
       return () => {
@@ -2433,6 +2610,7 @@ function makeOutline(spec, scope, s) {
       return () => lines;
     }
     case "path": {
+      if (morph) return () => morphAt(morph.pairs, s.morph ?? 0);
       let lines = null;
       return () => lines ??= flattenSvgPath(spec.d);
     }
@@ -2513,7 +2691,7 @@ function numOrZero(v, scope) {
 var _CompositionSequence = null;
 async function getCompositionSequence() {
   if (!_CompositionSequence) {
-    _CompositionSequence = (await import('./Composition-RJDSQYTV.js')).CompositionSequence;
+    _CompositionSequence = (await import('./Composition-HIISJAX2.js')).CompositionSequence;
   }
   return _CompositionSequence;
 }
@@ -2523,7 +2701,8 @@ var staticTypes = {
   audio: AudioSequence,
   video: VideoSequence,
   shape: ShapeSequence,
-  camera: CameraSequence
+  camera: CameraSequence,
+  null: NullSequence
 };
 var registry2 = {};
 function registerSequenceType(type, ctor) {
@@ -2550,6 +2729,6 @@ async function buildSequenceTree(specs, parent, root) {
   return out;
 }
 
-export { CameraSequence, DEFAULT_FOV, DEG, NEAR, Sequence, buildScope, buildSequenceTree, cameraBasis, collectPropKeys, describeLayer, ensureFilterLibrary, evaluateExpr, homeCamera, homeDistance, lintText, lintTiming, projectLayer, registerSequenceType, resolveAt, summarizeWarnings };
-//# sourceMappingURL=chunk-FNKSXBKB.js.map
-//# sourceMappingURL=chunk-FNKSXBKB.js.map
+export { CameraSequence, DEFAULT_FOV, DEG, NEAR, NullSequence, Sequence, buildScope, buildSequenceTree, cameraBasis, collectPropKeys, describeLayer, ensureFilterLibrary, evaluateExpr, flattenSvgPath, homeCamera, homeDistance, lintText, lintTiming, noise, projectLayer, rand, random, registerSequenceType, resolveAt, summarizeWarnings };
+//# sourceMappingURL=chunk-C6QHKYC5.js.map
+//# sourceMappingURL=chunk-C6QHKYC5.js.map