Delay zoom playback another 300ms relative to timeline blocks

src/components/video-editor/videoPlayback/zoomAnimation.test.ts

@@ -307,6 +307,13 @@ describe("computeRegionStrength", () => {
 		expect(computeRegionStrength(region, 0)).toBe(0);
 	});
 
+	it("does not start playing 300ms before the timeline block", () => {
+		expect(computeRegionStrength(region, region.startMs - 300)).toBe(0);
+		expect(computeRegionStrength(region, region.startMs + 300)).toBeGreaterThan(0);
+		expect(region.startMs).toBe(2000);
+		expect(region.endMs).toBe(5000);
+	});
+
 	it("returns 0 well after the region", () => {
 		expect(computeRegionStrength(region, 10000)).toBe(0);
 	});
@@ -317,9 +324,7 @@ describe("computeRegionStrength", () => {
 	});
 
 	it("rises smoothly during zoom-in", () => {
-		// Zoom-in transitions from leadInStart .. zoomInEnd
-		// zoomInEnd = startMs + 500, leadInStart = zoomInEnd - 1500 = startMs - 1000
-		// So at startMs the transition is partially done
+		// The entrance ramp is beginning at the timeline block start.
 		const s = computeRegionStrength(region, region.startMs);
 		expect(s).toBeGreaterThan(0);
 		expect(s).toBeLessThan(1);
@@ -381,7 +386,7 @@ describe("findDominantRegion", () => {
 		];
 
 		// During the connected handoff, the next region becomes the spring target.
-		const result = findDominantRegion(regions, 3200, { connectZooms: true });
+		const result = findDominantRegion(regions, 3500, { connectZooms: true });
 		expect(result.strength).toBe(1);
 		expect(result.transition).toBeNull();
 		expect(result.region?.id).toBe("b");
@@ -422,13 +427,13 @@ describe("findDominantRegion", () => {
 		expect(result.region).toBeNull();
 	});
 
-	it("holds the next region's focus between connected-transition end and next start", () => {
+	it("keeps the next region active during the connected transition", () => {
 		const regions: ZoomRegion[] = [
 			{ id: "a", startMs: 1000, endMs: 3000, depth: 2, focus: { cx: 0.2, cy: 0.2 } },
 			{ id: "b", startMs: 4300, endMs: 7000, depth: 3, focus: { cx: 0.7, cy: 0.7 } },
 		];
 
-		// After transition end (3000+200+1000=4200) but before b starts (4300)
+		// During the handoff (3500–4500), before b starts (4300).
 		const result = findDominantRegion(regions, 4250, { connectZooms: true });
 		expect(result.strength).toBe(1);
 		expect(result.region).not.toBeNull();

src/components/video-editor/videoPlayback/zoomRegionUtils.ts

@@ -11,8 +11,8 @@ import { clamp01, easeOutZoom } from "./mathUtils";
 const CHAINED_ZOOM_PAN_GAP_MS = 1350;
 const CONNECTED_ZOOM_PAN_DURATION_MS = 1000;
 const ZOOM_IN_OVERLAP_MS = 1000;
-// Positive offsets delay the animation; this is 300ms later than the previous -100ms offset.
-const ZOOM_ANIMATION_DELAY_MS = 200;
+// Playback offset relative to timeline blocks; positive values delay the animation.
+const ZOOM_ANIMATION_DELAY_MS = 500;
 
 type DominantRegionOptions = {
 	connectZooms?: boolean;