⌛ Animation Preview Adjustment

The animation preview now more accurately replicates the in-game result of animations by locking interpolation to linear between each 20th of a second (each tick).

Author: SnaveSutit

TODO.md

@@ -79,7 +79,8 @@
         -   [ ] trident
 -   [ ] Change the Collection setting type to allow single-click swapping of items between lists.
 -   [ ] Look into adding a color picker for tintable vanilla items.
--   [ ] Add Variants to the UndoSystem (Blocked by vanilla Blockbench not supporting custom undo actions)
+-   [ ] Add Variants to the UndoSystem (Blocked by vanilla Blockbench not supporting custom undo actions).
+-   [ ] Remove `easingArgs` and `easingMode` from saved keyframes if `easingType` is `linear`.
 
 # Data Pack Compiler
 

src/mods/bonePropertiesMod.ts

@@ -1,5 +1,6 @@
-import { isCurrentFormat as condition } from '../blueprintFormat'
+import { isCurrentFormat as condition, isCurrentFormat } from '../blueprintFormat'
 import { PACKAGE } from '../constants'
+import { roundToNth } from '../util/misc'
 import { type ContextProperty, createBlockbenchMod } from '../util/moddingTools'
 
 createBlockbenchMod(
@@ -19,3 +20,71 @@ createBlockbenchMod(
 		context.configs?.delete()
 	}
 )
+
+createBlockbenchMod(
+	`${PACKAGE.name}:boneInterpolationMod`,
+	{
+		orignalInterpolate: BoneAnimator.prototype.interpolate,
+	},
+	context => {
+		BoneAnimator.prototype.interpolate = function (
+			this: BoneAnimator,
+			channel,
+			allowExpression,
+			axis
+		) {
+			if (!isCurrentFormat()) {
+				return context.orignalInterpolate.call(this, channel, allowExpression, axis)
+			}
+
+			const actualTime = this.animation.time
+			try {
+				Timeline.time = roundToNth(this.animation.time, 20)
+
+				let before: ArrayVector3 | false
+				let after: ArrayVector3 | false
+				let beforeTime: number
+				let afterTime: number
+
+				if (Timeline.time < actualTime) {
+					beforeTime = Timeline.time
+					before = context.orignalInterpolate.call(this, channel, allowExpression, axis)
+					if (!before) return false
+
+					afterTime = roundToNth(Timeline.time + 0.05, 20)
+					Timeline.time = afterTime
+					after = context.orignalInterpolate.call(this, channel, allowExpression, axis)
+					if (!after) return false
+				} else {
+					afterTime = Timeline.time
+					after = context.orignalInterpolate.call(this, channel, allowExpression, axis)
+					if (!after) return false
+
+					beforeTime = roundToNth(Timeline.time - 0.05, 20)
+					Timeline.time = beforeTime
+					before = context.orignalInterpolate.call(this, channel, allowExpression, axis)
+					if (!before) return false
+				}
+				const diff = (actualTime - beforeTime) / (afterTime - beforeTime)
+
+				const result: ArrayVector3 = [
+					Math.lerp(before[0], after[0], diff),
+					Math.lerp(before[1], after[1], diff),
+					Math.lerp(before[2], after[2], diff),
+				]
+				// console.log(diff)
+
+				return result
+
+				// context.orignalInterpolate.call(this, channel, allowExpression, axis)
+			} finally {
+				Timeline.time = actualTime
+			}
+		}
+
+		return context
+	},
+	context => {
+		context.orignalInterpolate = BoneAnimator.prototype.interpolate
+	}
+)

src/mods/keyframeMod.ts

@@ -158,6 +158,7 @@ createBlockbenchMod(
 		): number {
 			if (!isCurrentFormat())
 				return context.originalGetLerp.call(this, other, axis, amount, allowExpression)
+
 			const easing = other.easing || 'linear'
 			let easingFunc = easingFunctions[easing]
 			if (hasArgs(easing)) {

src/systems/animationRenderer.ts

@@ -244,7 +244,7 @@ export function updatePreview(animation: _Animation, time: number) {
 	Animator.resetLastValues()
 	scene.updateMatrixWorld()
 	if (animation.effects) animation.effects.displayFrame()
-	Blockbench.dispatchEvent('display_animation_frame')
+	// Blockbench.dispatchEvent('display_animation_frame')
 }
 
 export function renderAnimation(animation: _Animation, rig: IRenderedRig) {