Animation Game Piece Intake [AARD-1973] (#1216)

Author: PepperLola

fission/src/mirabuf/EjectableSceneObject.ts

@@ -21,6 +21,21 @@ class EjectableSceneObject extends SceneObject {
     private _deltaTransformation?: THREE.Matrix4
     private _ejectVelocity?: number
 
+    // Animation state
+    private _animationStartTime = 0
+    private _animationDuration = EjectableSceneObject._defaultAnimationDuration
+    private _startTranslation?: THREE.Vector3
+    private _startRotation?: THREE.Quaternion
+
+    private static _defaultAnimationDuration = 0.5
+
+    public static setAnimationDuration(duration: number) {
+        EjectableSceneObject._defaultAnimationDuration = duration
+    }
+    public static getAnimationDuration() {
+        return EjectableSceneObject._defaultAnimationDuration
+    }
+
     public get gamePieceBodyId() {
         return this._gamePieceBodyId
     }
@@ -49,15 +64,24 @@ class EjectableSceneObject extends SceneObject {
             )
             this._ejectVelocity = this._parentAssembly.ejectorPreferences.ejectorVelocity
 
+            // Record start transform at the game piece center of mass
+            const gpBody = World.physicsSystem.getBody(this._gamePieceBodyId)
+            this._startTranslation = new THREE.Vector3(0, 0, 0)
+            this._startRotation = new THREE.Quaternion(0, 0, 0, 1)
+            convertJoltMat44ToThreeMatrix4(gpBody.GetCenterOfMassTransform()).decompose(
+                this._startTranslation,
+                this._startRotation,
+                new THREE.Vector3(1, 1, 1)
+            )
+
+            this._animationDuration = EjectableSceneObject._defaultAnimationDuration
+            this._animationStartTime = performance.now()
+
             World.physicsSystem.disablePhysicsForBody(this._gamePieceBodyId)
 
-            // Checks if the gamepiece comes from a zone for persistent point score updates
-            // because gamepieces removed by intake are not detected in the collision listener
+            // Remove from any scoring zones
             const zones = [...World.sceneRenderer.sceneObjects.entries()]
-                .filter(x => {
-                    const y = x[1] instanceof ScoringZoneSceneObject
-                    return y
-                })
+                .filter(x => x[1] instanceof ScoringZoneSceneObject)
                 .map(x => x[1]) as ScoringZoneSceneObject[]
 
             zones.forEach(x => {
@@ -69,26 +93,51 @@ class EjectableSceneObject extends SceneObject {
     }
 
     public update(): void {
+        const now = performance.now()
+        const elapsed = (now - this._animationStartTime) / 1000
+        const tRaw = elapsed / this._animationDuration
+        const t = Math.min(tRaw, 1)
+
+        // ease-in curve for gradual acceleration
+        const easedT = t * t
+
         if (this._parentBodyId && this._deltaTransformation && this._gamePieceBodyId) {
             if (!World.physicsSystem.isBodyAdded(this._gamePieceBodyId)) {
                 this._gamePieceBodyId = undefined
                 return
             }
 
-            // I had a think and free wrote this matrix math on a whim. It worked first try and I honestly can't quite remember how it works... -Hunter
             const gpBody = World.physicsSystem.getBody(this._gamePieceBodyId)
             const posToCOM = convertJoltMat44ToThreeMatrix4(gpBody.GetCenterOfMassTransform()).premultiply(
                 convertJoltMat44ToThreeMatrix4(gpBody.GetWorldTransform()).invert()
             )
 
             const body = World.physicsSystem.getBody(this._parentBodyId)
-            const bodyTransform = posToCOM
-                .invert()
-                .premultiply(
-                    this._deltaTransformation
-                        .clone()
-                        .premultiply(convertJoltMat44ToThreeMatrix4(body.GetWorldTransform()))
-                )
+            let desiredPosition = new THREE.Vector3(0, 0, 0)
+            let desiredRotation = new THREE.Quaternion(0, 0, 0, 1)
+
+            // Compute target world transform
+            const desiredTransform = this._deltaTransformation
+                .clone()
+                .premultiply(convertJoltMat44ToThreeMatrix4(body.GetWorldTransform()))
+
+            desiredTransform.decompose(desiredPosition, desiredRotation, new THREE.Vector3(1, 1, 1))
+
+            if (t < 1 && this._startTranslation && this._startRotation) {
+                // gradual acceleration via easedT
+                desiredPosition = new THREE.Vector3().lerpVectors(this._startTranslation, desiredPosition, easedT)
+                desiredRotation = new THREE.Quaternion().copy(this._startRotation).slerp(desiredRotation, easedT)
+            }
+            // } else if (t >= 1) {
+            //     // snap instantly and re-enable physics
+            //     World.physicsSystem.enablePhysicsForBody(this._gamePieceBodyId)
+            // }
+
+            // apply the transform
+            desiredTransform.identity().compose(desiredPosition, desiredRotation, new THREE.Vector3(1, 1, 1))
+
+            const bodyTransform = posToCOM.clone().invert().premultiply(desiredTransform)
+
             const position = new THREE.Vector3(0, 0, 0)
             const rotation = new THREE.Quaternion(0, 0, 0, 1)
             bodyTransform.decompose(position, rotation, new THREE.Vector3(1, 1, 1))

fission/src/systems/preferences/PreferenceTypes.ts

@@ -92,6 +92,7 @@ export type IntakePreferences = {
     parentNode: string | undefined
     showZoneAlways: boolean
     maxPieces: number
+    animationDuration: number
 }
 
 export type EjectorPreferences = {
@@ -181,6 +182,7 @@ export function defaultRobotPreferences(): RobotPreferences {
             parentNode: undefined,
             showZoneAlways: false,
             maxPieces: 1,
+            animationDuration: 0.5,
         },
         ejector: {
             deltaTransformation: [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1],

fission/src/test/PreferencesSystem.test.ts

@@ -123,6 +123,7 @@ describe("Preference System Robot/Field", () => {
                 parentNode: undefined,
                 showZoneAlways: true,
                 maxPieces: 3,
+                animationDuration: 0.5,
             },
             ejector: {
                 deltaTransformation: [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1],
@@ -142,6 +143,7 @@ describe("Preference System Robot/Field", () => {
                 parentNode: undefined,
                 showZoneAlways: false,
                 maxPieces: 1,
+                animationDuration: 0.5,
             },
             ejector: {
                 deltaTransformation: [1, 0, 0, 0, 1, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1],

fission/src/test/mirabuf/MirabufSceneObject.test.ts

@@ -188,6 +188,7 @@ describe("MirabufSceneObject", () => {
             zoneDiameter: 1,
             showZoneAlways: false,
             maxPieces: 0,
+            animationDuration: 0.5,
         })
         expect(instance.setEjectable(bodyId)).toBe(false)
     })
@@ -205,6 +206,7 @@ describe("MirabufSceneObject", () => {
             zoneDiameter: 1,
             showZoneAlways: false,
             maxPieces: 2,
+            animationDuration: 0.5,
         })
         setPrivate(instance, "_ejectables", [])
         const bodyId = mockBodyId()

fission/src/ui/panels/configuring/assembly-config/interfaces/ConfigureGamepiecePickupInterface.tsx

@@ -23,10 +23,14 @@ import { PAUSE_REF_ASSEMBLY_CONFIG } from "@/systems/physics/PhysicsSystem"
 import { Box } from "@mui/material"
 import { Switch } from "@mui/base/Switch"
 import Label, { LabelSize } from "@/ui/components/Label"
+import EjectableSceneObject from "@/mirabuf/EjectableSceneObject"
 
 // slider constants
 const MIN_ZONE_SIZE = 0.1
 const MAX_ZONE_SIZE = 1.0
+const MIN_ANIMATION_DURATION = 0.1
+const MAX_ANIMATION_DURATION = 2.0
+const ANIMATION_DURATION_STEP = 0.05
 
 /**
  * Saves ejector configuration to selected robot.
@@ -57,7 +61,8 @@ function save(
     selectedRobot: MirabufSceneObject,
     selectedNode?: RigidNodeId,
     showZoneAlways?: boolean,
-    maxPieces?: number
+    maxPieces?: number,
+    animationDuration?: number
 ) {
     if (!selectedRobot?.intakePreferences || !gizmo) {
         return
@@ -88,6 +93,7 @@ function save(
     }
 
     selectedRobot.intakePreferences.maxPieces = maxPieces!
+    selectedRobot.intakePreferences.animationDuration = animationDuration!
 
     PreferencesSystem.savePreferences()
 }
@@ -106,15 +112,18 @@ const ConfigureGamepiecePickupInterface: React.FC<ConfigPickupProps> = ({ select
     const [zoneSize, setZoneSize] = useState<number>((MIN_ZONE_SIZE + MAX_ZONE_SIZE) / 2.0)
     const [showZoneAlways, setShowZoneAlways] = useState<boolean>(false)
     const [maxPieces, setMaxPieces] = useState<number>(selectedRobot.intakePreferences?.maxPieces || 1)
+    const [animationDuration, setAnimationDuration] = useState<number>(
+        selectedRobot.intakePreferences?.animationDuration || 0.5
+    )
 
     const gizmoRef = useRef<GizmoSceneObject | undefined>(undefined)
 
     const saveEvent = useCallback(() => {
         if (gizmoRef.current && selectedRobot) {
-            save(zoneSize, gizmoRef.current, selectedRobot, selectedNode, showZoneAlways, maxPieces)
+            save(zoneSize, gizmoRef.current, selectedRobot, selectedNode, showZoneAlways, maxPieces, animationDuration)
             selectedRobot.updateIntakeSensor()
         }
-    }, [selectedRobot, selectedNode, zoneSize, showZoneAlways, maxPieces])
+    }, [selectedRobot, selectedNode, zoneSize, showZoneAlways, maxPieces, animationDuration])
 
     useEffect(() => {
         ConfigurationSavedEvent.listen(saveEvent)
@@ -197,9 +206,11 @@ const ConfigureGamepiecePickupInterface: React.FC<ConfigPickupProps> = ({ select
             setSelectedNode(selectedRobot.intakePreferences.parentNode)
             setMaxPieces(selectedRobot.intakePreferences.maxPieces)
             setShowZoneAlways(selectedRobot.intakePreferences.showZoneAlways ?? false)
+            setAnimationDuration(selectedRobot.intakePreferences.animationDuration ?? 0.5)
         } else {
             setSelectedNode(undefined)
             setShowZoneAlways(false)
+            setAnimationDuration(0.5)
         }
     }, [selectedRobot])
 
@@ -252,12 +263,22 @@ const ConfigureGamepiecePickupInterface: React.FC<ConfigPickupProps> = ({ select
                 min={MIN_ZONE_SIZE}
                 max={MAX_ZONE_SIZE}
                 value={zoneSize}
-                label="Zone Size"
-                format={{ minimumFractionDigits: 2, maximumFractionDigits: 2 }}
-                onChange={(_, vel: number | number[]) => {
-                    setZoneSize(vel as number)
-                }}
+                onChange={(_, v) => setZoneSize(typeof v === "number" ? v : v[0])}
                 step={0.01}
+                label="Intake Zone Diameter (m)"
+            />
+            <Slider
+                min={MIN_ANIMATION_DURATION}
+                max={MAX_ANIMATION_DURATION}
+                value={animationDuration ?? 0.5}
+                onChange={(_, v) => {
+                    const val = typeof v === "number" ? v : v[0]
+                    setAnimationDuration(val)
+                    EjectableSceneObject.setAnimationDuration(val)
+                }}
+                step={ANIMATION_DURATION_STEP}
+                label="Intake Animation Duration (s)"
+                format={{ maximumFractionDigits: 2 }}
             />
 
             {/* Slider for adjusting max pieces the robot can intake */}
@@ -342,6 +363,7 @@ const ConfigureGamepiecePickupInterface: React.FC<ConfigPickupProps> = ({ select
                     setZoneSize(0.5)
                     setSelectedNode(selectedRobot?.rootNodeId)
                     setMaxPieces(selectedRobot.intakePreferences?.maxPieces ?? 1)
+                    setAnimationDuration(0.5)
                 }}
             />
         </>

fission/src/util/debug/DebugPrint.ts

@@ -39,6 +39,10 @@ export function threeVector3ToString(v: THREE.Vector3, units: number = 3) {
     return `(${v.x.toFixed(units)}, ${v.y.toFixed(units)}, ${v.z.toFixed(units)})`
 }
 
+export function threeQuaternionToString(v: THREE.Quaternion, units: number = 3) {
+    return `(${v.x.toFixed(units)}, ${v.y.toFixed(units)}, ${v.z.toFixed(units)}, ${v.w.toFixed(units)})`
+}
+
 export function joltVec3ToString(v: Jolt.Vec3 | Jolt.RVec3, units: number = 3) {
     return `(${v.GetX().toFixed(units)}, ${v.GetY().toFixed(units)}, ${v.GetZ().toFixed(units)})`
 }