From eea6d43c82e1fd09d94d73001090dad205b1f1d2 Mon Sep 17 00:00:00 2001
From: Maze Winther <mazewinther@gmail.com>
Date: Sun, 26 Apr 2026 02:50:04 +0200
Subject: fix: model editor time as wasm MediaTime ticks end-to-end

---
 .../timeline/element/keyframes/retime-keyframe.ts         | 15 ++++++++++++---
 .../element/keyframes/upsert-effect-param-keyframe.ts     | 15 ++++++++++++---
 .../timeline/element/keyframes/upsert-keyframe.ts         | 15 ++++++++++++---
 3 files changed, 36 insertions(+), 9 deletions(-)

(limited to 'apps/web/src/commands/timeline/element/keyframes')

diff --git a/apps/web/src/commands/timeline/element/keyframes/retime-keyframe.ts b/apps/web/src/commands/timeline/element/keyframes/retime-keyframe.ts
index ccbdbc5d..9337e02d 100644
--- a/apps/web/src/commands/timeline/element/keyframes/retime-keyframe.ts
+++ b/apps/web/src/commands/timeline/element/keyframes/retime-keyframe.ts
@@ -4,6 +4,12 @@ import { Command, type CommandResult } from "@/commands/base-command";
 import { updateElementInSceneTracks } from "@/timeline";
 import type { AnimationPath } from "@/animation/types";
 import type { SceneTracks } from "@/timeline";
+import {
+	type MediaTime,
+	maxMediaTime,
+	minMediaTime,
+	ZERO_MEDIA_TIME,
+} from "@/wasm";
 
 export class RetimeKeyframeCommand extends Command {
 	private savedState: SceneTracks | null = null;
@@ -11,7 +17,7 @@ export class RetimeKeyframeCommand extends Command {
 	private readonly elementId: string;
 	private readonly propertyPath: AnimationPath;
 	private readonly keyframeId: string;
-	private readonly nextTime: number;
+	private readonly nextTime: MediaTime;
 
 	constructor({
 		trackId,
@@ -24,7 +30,7 @@ export class RetimeKeyframeCommand extends Command {
 		elementId: string;
 		propertyPath: AnimationPath;
 		keyframeId: string;
-		nextTime: number;
+		nextTime: MediaTime;
 	}) {
 		super();
 		this.trackId = trackId;
@@ -47,7 +53,10 @@ export class RetimeKeyframeCommand extends Command {
 					return element;
 				}
 
-				const boundedTime = Math.max(0, Math.min(this.nextTime, element.duration));
+				const boundedTime = maxMediaTime({
+					a: ZERO_MEDIA_TIME,
+					b: minMediaTime({ a: this.nextTime, b: element.duration }),
+				});
 				return {
 					...element,
 					animations: retimeElementKeyframe({
diff --git a/apps/web/src/commands/timeline/element/keyframes/upsert-effect-param-keyframe.ts b/apps/web/src/commands/timeline/element/keyframes/upsert-effect-param-keyframe.ts
index eae8f039..91ddb23d 100644
--- a/apps/web/src/commands/timeline/element/keyframes/upsert-effect-param-keyframe.ts
+++ b/apps/web/src/commands/timeline/element/keyframes/upsert-effect-param-keyframe.ts
@@ -9,6 +9,12 @@ import { updateElementInSceneTracks } from "@/timeline";
 import { isVisualElement } from "@/timeline/element-utils";
 import type { AnimationInterpolation } from "@/animation/types";
 import type { SceneTracks } from "@/timeline";
+import {
+	type MediaTime,
+	maxMediaTime,
+	minMediaTime,
+	ZERO_MEDIA_TIME,
+} from "@/wasm";
 
 export class UpsertEffectParamKeyframeCommand extends Command {
 	private savedState: SceneTracks | null = null;
@@ -16,7 +22,7 @@ export class UpsertEffectParamKeyframeCommand extends Command {
 	private readonly elementId: string;
 	private readonly effectId: string;
 	private readonly paramKey: string;
-	private readonly time: number;
+	private readonly time: MediaTime;
 	private readonly value: number | string | boolean;
 	private readonly interpolation: AnimationInterpolation | undefined;
 	private readonly keyframeId: string | undefined;
@@ -35,7 +41,7 @@ export class UpsertEffectParamKeyframeCommand extends Command {
 		elementId: string;
 		effectId: string;
 		paramKey: string;
-		time: number;
+		time: MediaTime;
 		value: number | string | boolean;
 		interpolation?: AnimationInterpolation;
 		keyframeId?: string;
@@ -61,7 +67,10 @@ export class UpsertEffectParamKeyframeCommand extends Command {
 			elementId: this.elementId,
 			elementPredicate: isVisualElement,
 			update: (element) => {
-				const boundedTime = Math.max(0, Math.min(this.time, element.duration));
+				const boundedTime = maxMediaTime({
+					a: ZERO_MEDIA_TIME,
+					b: minMediaTime({ a: this.time, b: element.duration }),
+				});
 				const propertyPath = buildEffectParamPath({
 					effectId: this.effectId,
 					paramKey: this.paramKey,
diff --git a/apps/web/src/commands/timeline/element/keyframes/upsert-keyframe.ts b/apps/web/src/commands/timeline/element/keyframes/upsert-keyframe.ts
index 30514146..66f0c434 100644
--- a/apps/web/src/commands/timeline/element/keyframes/upsert-keyframe.ts
+++ b/apps/web/src/commands/timeline/element/keyframes/upsert-keyframe.ts
@@ -8,13 +8,19 @@ import type {
 	AnimationInterpolation,
 	AnimationValue,
 } from "@/animation/types";
+import {
+	type MediaTime,
+	maxMediaTime,
+	minMediaTime,
+	ZERO_MEDIA_TIME,
+} from "@/wasm";
 
 export class UpsertKeyframeCommand extends Command {
 	private savedState: SceneTracks | null = null;
 	private readonly trackId: string;
 	private readonly elementId: string;
 	private readonly propertyPath: AnimationPath;
-	private readonly time: number;
+	private readonly time: MediaTime;
 	private readonly value: AnimationValue;
 	private readonly interpolation: AnimationInterpolation | undefined;
 	private readonly keyframeId: string | undefined;
@@ -31,7 +37,7 @@ export class UpsertKeyframeCommand extends Command {
 		trackId: string;
 		elementId: string;
 		propertyPath: AnimationPath;
-		time: number;
+		time: MediaTime;
 		value: AnimationValue;
 		interpolation?: AnimationInterpolation;
 		keyframeId?: string;
@@ -63,7 +69,10 @@ export class UpsertKeyframeCommand extends Command {
 					return element;
 				}
 
-				const boundedTime = Math.max(0, Math.min(this.time, element.duration));
+				const boundedTime = maxMediaTime({
+					a: ZERO_MEDIA_TIME,
+					b: minMediaTime({ a: this.time, b: element.duration }),
+				});
 				return {
 					...element,
 					animations: upsertPathKeyframe({
-- 
cgit v1.3.1