@glissade/lottie 0.54.0 → 0.55.0-pre.1

package/dist/index.js

@@ -1,5 +1,6 @@
 import { Circle, Group, ImageNode, Path, Rect, Text, breakLines, createScene, meshRasterSize, rasterizeMesh } from "@glissade/scene";
 import { compileTimeline, cubicBezier, formatColor, parseColor, sampleTrack, track } from "@glissade/core";
+import { Camera, cameraLayerMatrix } from "@glissade/scene/motion";
 import "@glissade/core/expr";
 //#region src/spec.ts
 var LottieImportError = class extends Error {
@@ -1729,6 +1730,8 @@ function exportLottie(mod, opts) {
 		fr,
 		ip: 0,
 		op,
+		w: opts.width,
+		h: opts.height,
 		warn,
 		layers: [],
 		ind: 0,
@@ -1790,6 +1793,11 @@ function walkChildren(ctx, children, parentInd, byNode, opacity) {
 		}
 		const myInd = ++ctx.ind;
 		const tracks = (node.id !== void 0 ? byNode.get(node.id) : void 0) ?? EMPTY_TRACKS;
+		if (node instanceof Camera) {
+			ctx.layers.push(buildNullLayer(ctx, node, myInd, parentInd, tracks));
+			buildCameraLayers(ctx, node, myInd, byNode, childOpacity(node, tracks, opacity));
+			continue;
+		}
 		ctx.layers.push(kind === "group" ? buildNullLayer(ctx, node, myInd, parentInd, tracks) : kind === "text" ? buildTextLayer(ctx, node, myInd, parentInd, tracks, opacity) : buildShapeLayer(ctx, node, kind, myInd, parentInd, tracks, opacity));
 		if (node instanceof Group) walkChildren(ctx, node.children, myInd, byNode, childOpacity(node, tracks, opacity));
 	}
@@ -2025,6 +2033,160 @@ function buildNullLayer(ctx, node, ind, parentInd, tracks) {
 		...parentInd !== void 0 ? { parent: parentInd } : {}
 	};
 }
+/**
+* Decompose a per-layer inverse-camera-pose 2x3 into Lottie ks channels. The pose
+* is `T(screenCenter)·scale(zoom)·rotate(roll)·T(−effectiveCenter)` — an affine
+* with UNIFORM scale + rotation + translation, i.e. exactly `fromTRS(p, r, [s,s])`
+* — so it inverts to `p = [e,f]`, `s = |(a,b)|`, `r = atan2(b,a)` (the anchor stays
+* [0,0], the camera looks at the world, not a boxed node).
+*/
+function decomposePose(m) {
+	const scale = Math.hypot(m[0], m[1]);
+	const r = Math.atan2(m[1], m[0]) * 180 / Math.PI;
+	return {
+		p: [m[4], m[5]],
+		s: [scale * 100, scale * 100],
+		r
+	};
+}
+/** Static camera ks: one constant matrix → constant p/s/r (no keyframes). */
+function buildStaticCameraKs(m) {
+	const d = decomposePose(m);
+	return {
+		a: {
+			a: 0,
+			k: [0, 0]
+		},
+		p: {
+			a: 0,
+			k: d.p
+		},
+		s: {
+			a: 0,
+			k: d.s
+		},
+		r: {
+			a: 0,
+			k: d.r
+		},
+		o: {
+			a: 0,
+			k: 100
+		}
+	};
+}
+/** Dense-sample one decomposed channel across [f0,f1], then decimate + anchor —
+*  the identical discipline sampleComponentVec / combineOpacity use. */
+function sampleChannel(ctx, f0, f1, sampleAt) {
+	const out = [];
+	for (let f = f0; f <= f1; f++) {
+		const frame = {
+			t: f,
+			s: sampleAt(f)
+		};
+		if (f < f1) {
+			frame.o = {
+				x: 0,
+				y: 0
+			};
+			frame.i = {
+				x: 1,
+				y: 1
+			};
+		}
+		out.push(frame);
+	}
+	return anchorSampledSpan(decimateLinearKeys(out), f0, f1, ctx.ip, ctx.op, sampleAt);
+}
+/** Animated camera ks: sample the pose per-frame across the cam-track span and
+*  decompose into p / s / r keyframe channels (a static [0,0] anchor, o 100). */
+function buildAnimatedCameraKs(ctx, poseAt, camTracks) {
+	const [f0, f1] = frameSpan(ctx, camTracks);
+	const at = (frame) => decomposePose(poseAt(frame / ctx.fr));
+	return {
+		a: {
+			a: 0,
+			k: [0, 0]
+		},
+		p: {
+			a: 1,
+			k: sampleChannel(ctx, f0, f1, (f) => at(f).p)
+		},
+		s: {
+			a: 1,
+			k: sampleChannel(ctx, f0, f1, (f) => at(f).s)
+		},
+		r: {
+			a: 1,
+			k: sampleChannel(ctx, f0, f1, (f) => [at(f).r])
+		},
+		o: {
+			a: 0,
+			k: 100
+		}
+	};
+}
+/**
+* Emit the Camera's depth layers as pose sub-nulls under the camera null. Each
+* layer gets its own `cameraLayerMatrix` (depth-scaled pan = parallax) sampled at
+* the export frame grid — STATIC (no cam/* tracks) → constant ks; ANIMATED → ks
+* keyframes. The layer's content parents to its sub-null, so the pose composes onto
+* every descendant exactly as Camera.draw applies it at render. A whole-frame shake
+* is render-only (a closed-form jitter, not a track) → an honest warn, never a
+* silent drop.
+*/
+function buildCameraLayers(ctx, cam, camInd, byNode, opacity) {
+	const camTracks = (cam.id !== void 0 ? byNode.get(cam.id) : void 0) ?? EMPTY_TRACKS;
+	const zoomTr = camTracks.get("zoom");
+	const rollTr = camTracks.get("roll");
+	const centerTr = camTracks.get("center");
+	const centerXTr = camTracks.get("center.x");
+	const centerYTr = camTracks.get("center.y");
+	const poseTracks = [
+		zoomTr,
+		rollTr,
+		centerTr,
+		centerXTr,
+		centerYTr
+	];
+	const animated = poseTracks.some((t) => t !== void 0);
+	const size = {
+		w: ctx.w,
+		h: ctx.h
+	};
+	if (cam.shakeSpec) ctx.warn(`${describe(cam)}: whole-frame camera shake is render-only — NOT exported to Lottie (it is a closed-form jitter, not a keyframe track)`);
+	const zoomAt = (t) => zoomTr ? sampleTrack(zoomTr, t) : cam.zoom();
+	const rollAt = (t) => rollTr ? sampleTrack(rollTr, t) : cam.roll();
+	const centerAt = (t) => {
+		const base = cam.center();
+		let cx = base[0];
+		let cy = base[1];
+		if (centerTr) {
+			const v = sampleTrack(centerTr, t);
+			cx = v[0];
+			cy = v[1];
+		}
+		if (centerXTr) cx = sampleTrack(centerXTr, t);
+		if (centerYTr) cy = sampleTrack(centerYTr, t);
+		return [cx, cy];
+	};
+	for (let i = cam.layers.length - 1; i >= 0; i--) {
+		const layer = cam.layers[i];
+		const subInd = ++ctx.ind;
+		const poseAt = (t) => cameraLayerMatrix(size, centerAt(t), zoomAt(t), rollAt(t), layer.depth);
+		const ks = animated ? buildAnimatedCameraKs(ctx, poseAt, poseTracks) : buildStaticCameraKs(poseAt(0));
+		ctx.layers.push({
+			ty: 3,
+			nm: `${cam.id ?? "cam"}-layer${i}`,
+			ind: subInd,
+			ip: ctx.ip,
+			op: ctx.op,
+			ks,
+			parent: camInd
+		});
+		walkChildren(ctx, [layer.content], subInd, byNode, opacity);
+	}
+}
 function buildShapeLayer(ctx, node, kind, ind, parentInd, tracks, opacity) {
 	const shapes = [buildGeometry(ctx, node, kind, tracks)];
 	const stroke = buildStroke(ctx, node, tracks);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@glissade/lottie",
-  "version": "0.54.0",
+  "version": "0.55.0-pre.1",
   "description": "glissade Lottie import (S1 MVP): pure .json (Lottie/bodymovin) → node specs + a v1 Timeline. Fail-fast feature audit; no DOM/Node dependencies.",
   "license": "Apache-2.0",
   "engines": {
@@ -18,11 +18,11 @@
     "dist"
   ],
   "dependencies": {
-    "@glissade/core": "0.54.0",
-    "@glissade/scene": "0.54.0"
+    "@glissade/core": "0.55.0-pre.1",
+    "@glissade/scene": "0.55.0-pre.1"
   },
   "devDependencies": {
-    "@glissade/backend-skia": "0.54.0"
+    "@glissade/backend-skia": "0.55.0-pre.1"
   },
   "repository": {
     "type": "git",