From c555f1eaebff90749bdc543592cfa80a060b29e2 Mon Sep 17 00:00:00 2001
From: cashmere <cashmere@autistici.org>
Date: Sun, 9 Aug 2026 02:37:37 +0200
Subject: feat: lens effects tab, standalone motion effects, clip/asset rename,
 preview popout

- New Lens category in the assets panel: Blur, Motion Blur, Zoom In/Out,
  Pan x4, Shake, Pulse, Spin, Custom Zoom. EffectDefinition gains a
  category field; tabs with an empty category are hidden, and the
  properties-panel 'Open effects' button opens the first non-empty one.
- Motion effects work standalone: dropping them on the timeline creates
  an effect-track element that animates (scale/translate/rotate) every
  track below it, computed purely in the TS frame descriptor - no wasm
  changes, identical in preview and export. supportsStandalone removed.
- Motion Blur: directional gaussian smear (amount + angle) reusing the
  existing WGSL shader with arbitrary u_direction.
- Custom Zoom: start/end scale params (keyframable clip-level).
- MotionOffset gains optional rotate, accumulated clip-level and applied
  to standalone layer quads via rotationDegrees.
- Rename clips (timeline context menu) and media assets (media panel
  context menu) via a shared RenameDialog; asset rename persists through
  storageService with rollback on error.
- Preview pops out into a Document Picture-in-Picture window and docks
  back; button hidden where the API is unsupported.
- Export keeps running when the export popover is closed; only the
  explicit Cancel button aborts.
- Captions and Adjustment tabs removed from the assets panel.
---
 .../renderer/compositor/frame-descriptor.ts        | 40 +++++++++++++++++++---
 .../services/renderer/nodes/effect-layer-node.ts   |  3 +-
 apps/web/src/services/renderer/resolve.ts          | 26 +++++++++++---
 3 files changed, 58 insertions(+), 11 deletions(-)

(limited to 'apps/web/src/services/renderer')

diff --git a/apps/web/src/services/renderer/compositor/frame-descriptor.ts b/apps/web/src/services/renderer/compositor/frame-descriptor.ts
index d5ab88c3..d2bff525 100644
--- a/apps/web/src/services/renderer/compositor/frame-descriptor.ts
+++ b/apps/web/src/services/renderer/compositor/frame-descriptor.ts
@@ -121,13 +121,43 @@ async function collectNode({
 	}
 
 	if (node instanceof EffectLayerNode) {
-		if (!node.resolved || node.resolved.passes.length === 0) {
+		if (!node.resolved) {
 			return;
 		}
-		items.push({
-			type: "sceneEffect",
-			effectPassGroups: [node.resolved.passes],
-		});
+		const { motion, passes } = node.resolved;
+		if (
+			motion &&
+			(motion.scale !== 1 ||
+				motion.translateX !== 0 ||
+				motion.translateY !== 0 ||
+				(motion.rotate ?? 0) !== 0)
+		) {
+			const { width, height } = renderer;
+			for (const item of items) {
+				if (item.type !== "layer") continue;
+				item.transform = {
+					...item.transform,
+					centerX:
+						width / 2 +
+						(item.transform.centerX - width / 2) * motion.scale +
+						motion.translateX * width,
+					centerY:
+						height / 2 +
+						(item.transform.centerY - height / 2) * motion.scale +
+						motion.translateY * height,
+					width: item.transform.width * motion.scale,
+					height: item.transform.height * motion.scale,
+					rotationDegrees:
+						item.transform.rotationDegrees + (motion.rotate ?? 0),
+				};
+			}
+		}
+		if (passes.length > 0) {
+			items.push({
+				type: "sceneEffect",
+				effectPassGroups: [passes],
+			});
+		}
 		return;
 	}
 
diff --git a/apps/web/src/services/renderer/nodes/effect-layer-node.ts b/apps/web/src/services/renderer/nodes/effect-layer-node.ts
index d1b51fa3..791d20ce 100644
--- a/apps/web/src/services/renderer/nodes/effect-layer-node.ts
+++ b/apps/web/src/services/renderer/nodes/effect-layer-node.ts
@@ -1,4 +1,4 @@
-import type { EffectPass } from "@/effects/types";
+import type { EffectPass, MotionOffset } from "@/effects/types";
 import type { ParamValues } from "@/params";
 import { BaseNode } from "./base-node";
 
@@ -11,6 +11,7 @@ export type EffectLayerNodeParams = {
 
 export type ResolvedEffectLayerNodeState = {
 	passes: EffectPass[];
+	motion?: MotionOffset;
 };
 
 export class EffectLayerNode extends BaseNode<
diff --git a/apps/web/src/services/renderer/resolve.ts b/apps/web/src/services/renderer/resolve.ts
index a4c8d303..12f57e30 100644
--- a/apps/web/src/services/renderer/resolve.ts
+++ b/apps/web/src/services/renderer/resolve.ts
@@ -6,8 +6,10 @@ import {
 	intensityToSigma,
 } from "@/effects/definitions/blur";
 import { effectsRegistry, resolveEffectPasses } from "@/effects";
-import { applyMotionEffects } from "@/effects/motion";
+import { applyMotionEffects, sampleEasingBezier } from "@/effects/motion";
 import type { Effect, EffectPass } from "@/effects/types";
+import { BUILTIN_PRESETS } from "@/timeline/components/graph-editor/easing-presets";
+import { clamp } from "@/utils/math";
 import { getSourceTimeAtClipTime } from "@/retime";
 import {
 	DEFAULT_GRAPHIC_SOURCE_SIZE,
@@ -479,11 +481,25 @@ function resolveEffectLayerNode({
 		width: context.renderer.width,
 		height: context.renderer.height,
 	});
-	if (passes.length === 0) {
+
+	const motion = definition.motion?.evaluate({
+		effectParams: node.params.effectParams,
+		progress: sampleEasingBezier({
+			bezier:
+				BUILTIN_PRESETS.find(
+					(entry) => entry.id === node.params.effectParams.easing,
+				)?.value ?? [0.25, 0.1, 0.25, 1],
+			x: clamp({
+				value: (time - node.params.timeOffset) / node.params.duration,
+				min: 0,
+				max: 1,
+			}),
+		}),
+	});
+
+	if (passes.length === 0 && !motion) {
 		return null;
 	}
 
-	return {
-		passes,
-	};
+	return motion ? { passes, motion } : { passes };
 }
-- 
cgit v1.3.1