bak

src/lib/interpolate.ts

@@ -56,20 +56,42 @@ export function sortedKeyframes(layer: Layer): Keyframe[] {
   return [...layer.keyframes].sort((a, b) => a.time - b.time)
 }
 
-export function sampleLayer(layer: Layer, time: number): AnimatableProps {
-  const kfs = sortedKeyframes(layer)
-  if (!kfs.length) return { ...layer.base }
-  if (time <= kfs[0].time) return merge(layer.base, kfs[0].props)
-  const last = kfs[kfs.length - 1]
-  if (time >= last.time) return merge(layer.base, last.props)
-  for (let i = 0; i < kfs.length - 1; i++) {
-    const a = kfs[i]
-    const b = kfs[i + 1]
+function sampleKeyframeSet(
+  kfs: Keyframe[] | undefined,
+  base: AnimatableProps,
+  time: number,
+): AnimatableProps {
+  if (!kfs || !kfs.length) return { ...base }
+  const sorted = [...kfs].sort((a, b) => a.time - b.time)
+  if (time <= sorted[0].time) return merge(base, sorted[0].props)
+  const last = sorted[sorted.length - 1]
+  if (time >= last.time) return merge(base, last.props)
+  for (let i = 0; i < sorted.length - 1; i++) {
+    const a = sorted[i]
+    const b = sorted[i + 1]
     if (time >= a.time && time <= b.time) {
       const raw = (time - a.time) / (b.time - a.time)
       const t = easings[b.easing](raw)
-      return lerpProps(merge(layer.base, a.props), merge(layer.base, b.props), t)
+      return lerpProps(merge(base, a.props), merge(base, b.props), t)
     }
   }
-  return { ...layer.base }
+  return { ...base }
+}
+
+export function sampleLayer(layer: Layer, time: number): AnimatableProps {
+  const main = sampleKeyframeSet(layer.keyframes, layer.base, time)
+  if (!layer.separated) return main
+
+  const posSource = layer.positionKeyframes
+  const rotSource = layer.rotationKeyframes
+
+  const pos = posSource ? sampleKeyframeSet(posSource, layer.base, time) : main
+  const rot = rotSource ? sampleKeyframeSet(rotSource, layer.base, time) : main
+
+  return {
+    ...main,
+    x: pos.x,
+    y: pos.y,
+    rotation: rot.rotation,
+  }
 }