From c555f1eaebff90749bdc543592cfa80a060b29e2 Mon Sep 17 00:00:00 2001 From: cashmere 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. --- apps/web/src/effects/definitions/motion-blur.ts | 67 +++++++++++++++++++++++++ 1 file changed, 67 insertions(+) create mode 100644 apps/web/src/effects/definitions/motion-blur.ts (limited to 'apps/web/src/effects/definitions/motion-blur.ts') diff --git a/apps/web/src/effects/definitions/motion-blur.ts b/apps/web/src/effects/definitions/motion-blur.ts new file mode 100644 index 00000000..b20e6c26 --- /dev/null +++ b/apps/web/src/effects/definitions/motion-blur.ts @@ -0,0 +1,67 @@ +import type { EffectDefinition } from "@/effects/types"; +import { GAUSSIAN_BLUR_SHADER, intensityToSigma } from "./blur"; + +const MAX_SINGLE_PASS_SIGMA = 10; +const MIN_SIGMA = 0.001; + +function parseNumericParam({ + effectParams, + key, +}: { + effectParams: Record; + key: string; +}): number { + const raw = effectParams[key]; + return typeof raw === "number" ? raw : Number.parseFloat(String(raw)); +} + +export const motionBlurEffectDefinition: EffectDefinition = { + type: "motion-blur", + name: "Motion Blur", + keywords: ["motion blur", "smear", "directional", "speed", "streak"], + category: "lens", + params: [ + { + key: "amount", + label: "Amount", + type: "number", + default: 40, + min: 0, + max: 100, + step: 1, + }, + { + key: "angle", + label: "Angle", + type: "number", + default: 0, + min: -180, + max: 180, + step: 1, + }, + ], + renderer: { + passes: [], + buildPasses: ({ effectParams, width }) => { + const sigma = intensityToSigma({ + intensity: parseNumericParam({ effectParams, key: "amount" }), + resolution: width, + reference: 1920, + }); + if (sigma < MIN_SIGMA) return []; + + const angleRad = + (parseNumericParam({ effectParams, key: "angle" }) * Math.PI) / 180; + return [ + { + shader: GAUSSIAN_BLUR_SHADER, + uniforms: { + u_sigma: Math.min(sigma, MAX_SINGLE_PASS_SIGMA), + u_step: Math.max(1, sigma / MAX_SINGLE_PASS_SIGMA), + u_direction: [Math.cos(angleRad), Math.sin(angleRad)], + }, + }, + ]; + }, + }, +}; -- cgit v1.3.1