reze-engine 0.30.2 → 0.31.2

package/dist/state-machine.js

@@ -0,0 +1,145 @@
+import { easeInOut } from "./math";
+const FPS = 30;
+export class AnimationStateMachine {
+    constructor(model, states, transitions, options) {
+        /** Outgoing state during a crossfade — keeps playing while it fades. */
+        this.fading = null;
+        // Scratch: per-slot entry objects are reused so downstream caches (blend
+        // cursors, clip-event trackers) keyed on entry identity stay warm.
+        this.merged = [];
+        this.inScratch = [{ name: "", time: 0, weight: 1 }];
+        this.outScratch = [{ name: "", time: 0, weight: 1 }];
+        this.model = model;
+        this.states = states;
+        this.transitions = transitions;
+        this.defaultFade = options.defaultFade ?? 0.25;
+        const def = states[options.initial];
+        if (!def)
+            throw new Error(`Unknown initial state "${options.initial}"`);
+        this.current = { name: options.initial, def, time: 0 };
+        def.onEnter?.(null);
+    }
+    get state() {
+        return this.current.name;
+    }
+    /** Seconds the current state has been active. */
+    get stateTime() {
+        return this.current.time;
+    }
+    /** Force a transition now, regardless of the transition table. */
+    go(to, fade) {
+        this.begin(to, fade ?? this.defaultFade);
+    }
+    update(dt) {
+        this.current.time += dt;
+        // Transitions are not interruptible mid-fade (go() still is).
+        if (this.fading === null) {
+            for (const t of this.transitions) {
+                if (t.to === this.current.name)
+                    continue;
+                if (t.from !== "*" && t.from !== this.current.name)
+                    continue;
+                if (!this.transitionReady(t))
+                    continue;
+                this.begin(t.to, t.fade ?? this.defaultFade);
+                break;
+            }
+        }
+        const inEntries = this.produce(this.current, dt, this.inScratch);
+        if (this.fading !== null) {
+            const f = this.fading;
+            f.elapsed += dt;
+            if (f.elapsed >= f.duration) {
+                this.fading = null;
+            }
+            else {
+                f.state.time += dt;
+                const outEntries = this.produce(f.state, dt, this.outScratch);
+                const w = easeInOut(f.elapsed / f.duration);
+                this.apply(outEntries, 1 - w, inEntries, w);
+                return;
+            }
+        }
+        this.apply(inEntries, 1, null, 0);
+    }
+    transitionReady(t) {
+        const def = this.current.def;
+        if (t.exitTime !== undefined) {
+            if (this.current.time < t.exitTime)
+                return false;
+            return t.when ? t.when() : true;
+        }
+        if (t.when)
+            return t.when();
+        // Unconditional, no exitTime: on a non-looping clip state this means
+        // "when the clip is about to end" (start the fade so it lands at the end).
+        if (def.clip && def.loop === false) {
+            const dur = this.clipDuration(def.clip) / (def.speed ?? 1);
+            return this.current.time >= Math.max(0, dur - (t.fade ?? this.defaultFade));
+        }
+        return true;
+    }
+    begin(to, fade) {
+        const def = this.states[to];
+        if (!def)
+            throw new Error(`Unknown state "${to}"`);
+        this.current.def.onExit?.(to);
+        // go() during an existing fade drops the older outgoing state (v1: no
+        // three-way mixes) — the current state becomes the outgoing one.
+        this.fading = fade > 0 ? { state: this.current, elapsed: 0, duration: fade } : null;
+        const from = this.current.name;
+        this.current = { name: to, def, time: 0 };
+        def.onEnter?.(from);
+    }
+    /** This frame's entries for a state: clip states own a one-entry pose;
+     *  delegate states produce their own. Returns null for "no pose". */
+    produce(state, dt, scratch) {
+        const def = state.def;
+        if (def.entries)
+            return def.entries(dt);
+        if (!def.clip)
+            return null;
+        const dur = this.clipDuration(def.clip);
+        let t = state.time * (def.speed ?? 1);
+        if (dur > 0)
+            t = def.loop === false ? Math.min(t, dur) : t % dur;
+        scratch[0].name = def.clip;
+        scratch[0].time = t;
+        scratch[0].weight = 1;
+        return scratch;
+    }
+    /** Merge up to two entry lists scaled by their group weights into the stable
+     *  scratch array and hand it to the model. */
+    apply(a, wa, b, wb) {
+        let n = 0;
+        const put = (src, scale) => {
+            if (src === null || scale <= 0)
+                return;
+            for (const e of src) {
+                if (!(e.weight > 1e-6))
+                    continue;
+                let slot = this.merged[n];
+                if (!slot) {
+                    slot = { name: "", time: 0, weight: 0 };
+                    this.merged[n] = slot;
+                }
+                slot.name = e.name;
+                slot.time = e.time;
+                slot.weight = e.weight * scale;
+                n++;
+            }
+        };
+        // Order: incoming FIRST so slot identities stay stable for a given state
+        // across the fade's start/end (cursor + event caches key on the objects).
+        put(b, wb);
+        put(a, wa);
+        for (let i = n; i < this.merged.length; i++)
+            this.merged[i].weight = 0;
+        if (n > 0)
+            this.model.setBlendPose(this.merged);
+    }
+    clipDuration(name) {
+        const frames = this.model.getClip(name)?.frameCount ?? 0;
+        return frames > 1 ? (frames - 1) / FPS : 0;
+    }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "reze-engine",
-  "version": "0.30.2",
+  "version": "0.31.2",
   "description": "A lightweight WebGPU engine for real-time 3D MMD/PMX model rendering",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",

package/src/camera.ts

@@ -138,8 +138,19 @@ export class Camera {
     if (this.vmdDriven) {
       const eye = this.vmdEye()
       const s = this._quatScratch
-      const t = this._vmdTarget
-      Mat4.lookAtInto(this._viewMat.values, eye.x, eye.y, eye.z, t.x, t.y, t.z, s[4], s[5], s[6])
+      // View = Rᵀ · T(−eye), built straight from the quaternion basis instead of
+      // lookAt(eye, target): same matrix for a normal d<0 shot, but position-baked
+      // tracks store distance = 0 on every frame (eye == target), which degenerates
+      // lookAt's normalize to an all-zero basis. The orientation never depended on
+      // the eye→target line anyway — it IS the euler rotation.
+      const o = this._viewMat.values
+      o[0] = s[0]; o[1] = s[4]; o[2] = s[8]; o[3] = 0
+      o[4] = s[1]; o[5] = s[5]; o[6] = s[9]; o[7] = 0
+      o[8] = s[2]; o[9] = s[6]; o[10] = s[10]; o[11] = 0
+      o[12] = -(s[0] * eye.x + s[1] * eye.y + s[2] * eye.z)
+      o[13] = -(s[4] * eye.x + s[5] * eye.y + s[6] * eye.z)
+      o[14] = -(s[8] * eye.x + s[9] * eye.y + s[10] * eye.z)
+      o[15] = 1
       return this._viewMat
     }
     const eye = this.getPosition()

package/src/engine.ts

@@ -809,6 +809,9 @@ export class Engine {
   // Camera target binding (Babylon/Three style: camera follows model)
   private cameraTargetModel: Model | null = null
   private cameraTargetBoneName = "全ての親"
+  private cameraFollowSmoothing = 0
+  private cameraFollowSeeded = false
+  private readonly cameraFollowPos = new Vec3(0, 0, 0)
   private cameraTargetOffset: Vec3 = new Vec3(0, 0, 0)
 
   private lastFrameTime = performance.now()
@@ -2318,6 +2321,9 @@ export class Engine {
     if (!this.multisampleTexture || this.canvas.width !== width || this.canvas.height !== height) {
       this.canvas.width = width
       this.canvas.height = height
+      // bgResolution() reads the canvas size from the composite uniforms —
+      // refresh on resize or effects aspect-correct against the stale size.
+      if (this.compositeUniformBuffer) this.writeCompositeViewUniforms()
 
       this.multisampleTexture = this.device.createTexture({
         label: "multisample HDR render target",
@@ -2758,7 +2764,7 @@ export class Engine {
   }
 
   /** Souls-style follow cam: orbit center tracks a model bone each frame. Shorthand for setCameraTarget(model, boneName, offset). */
-  setCameraFollow(model: Model | null, boneName?: string, offset?: Vec3): void {
+  setCameraFollow(model: Model | null, boneName?: string, offset?: Vec3, smoothing?: number): void {
     if (model === null) {
       this.cameraTargetModel = null
       return
@@ -2768,6 +2774,10 @@ export class Engine {
     this.cameraTargetOffset.x = offset?.x ?? 0
     this.cameraTargetOffset.y = offset?.y ?? 0
     this.cameraTargetOffset.z = offset?.z ?? 0
+    // Handheld feel: seconds for the camera to close ~63% of the gap to the
+    // bone (exponential, frame-rate independent). 0 = rigid instant follow.
+    this.cameraFollowSmoothing = Math.max(0, smoothing ?? 0)
+    this.cameraFollowSeeded = false
   }
 
   // ── VMD camera track ──
@@ -2792,6 +2802,16 @@ export class Engine {
   /** Turn the loaded camera VMD on/off (falls back to orbit when off). No-op if none loaded. */
   setCameraVmdEnabled(enabled: boolean): void {
     this.camera.setVmdDriven(enabled && this.cameraAnimation !== null)
+    if (!enabled && this.cameraTargetModel) {
+      // Follow resumes with a clean snap to bone + configured offset — one
+      // predictable cut to the scene's framing, no easing from the shot.
+      this.cameraFollowSeeded = false
+    }
+  }
+
+  /** True while the orbit target is riding a model bone (setCameraFollow). */
+  isCameraFollowing(): boolean {
+    return this.cameraTargetModel !== null
   }
 
   /** True while the loaded camera VMD is actively driving the shot. */
@@ -2823,6 +2843,11 @@ export class Engine {
     return first ?? 0
   }
 
+  /** Current orbit eye position (spherical coords resolved to a point). */
+  getCameraPosition(): Vec3 {
+    return this.camera.getPosition()
+  }
+
   getCameraDistance(): number {
     return this.camera.radius
   }
@@ -4682,9 +4707,28 @@ export class Engine {
           py += pos.y
           pz += pos.z
         }
-        this.camera.target.x = px + this.cameraTargetOffset.x
-        this.camera.target.y = py + this.cameraTargetOffset.y
-        this.camera.target.z = pz + this.cameraTargetOffset.z
+        px += this.cameraTargetOffset.x
+        py += this.cameraTargetOffset.y
+        pz += this.cameraTargetOffset.z
+        const tau = this.cameraFollowSmoothing
+        if (tau > 0 && this.cameraFollowSeeded) {
+          // Exponential lag toward the bone: the handheld-camera feel. The
+          // orbit pivot trails the target and eases in, never snapping.
+          const k = 1 - Math.exp(-deltaTime / tau)
+          const f = this.cameraFollowPos
+          f.x += (px - f.x) * k
+          f.y += (py - f.y) * k
+          f.z += (pz - f.z) * k
+          this.camera.target.x = f.x
+          this.camera.target.y = f.y
+          this.camera.target.z = f.z
+        } else {
+          this.cameraFollowPos.setXYZ(px, py, pz)
+          this.cameraFollowSeeded = true
+          this.camera.target.x = px
+          this.camera.target.y = py
+          this.camera.target.z = pz
+        }
       }
     }
 

package/src/index.ts

@@ -52,7 +52,7 @@ export { BODY_GRAPH } from "./graph/presets/body"
 export { STOCKINGS_GRAPH } from "./graph/presets/stockings"
 export { EYE_GRAPH } from "./graph/presets/eye"
 export { FACE_GRAPH } from "./graph/presets/face"
-export { Model } from "./model"
+export { Model, type ClipEventInfo } from "./model"
 export { Vec3, Quat, Mat4, easeInOut, type EulerOrder } from "./math"
 export type {
   AnimationClip,
@@ -71,7 +71,11 @@ export {
   type LocomotionOptions,
   type LocomotionPose,
   type StrafeClipEntry,
+  type TurnClipEntry,
+  type RunTurnClipEntry,
+  type StopClipEntry,
 } from "./locomotion"
+export { AnimationStateMachine, type AnimStateDef, type AnimTransitionDef, type StateMachineOptions } from "./state-machine"
 export {
   FPS,
   bezierInterpolate,