@needle-tools/engine 5.1.0-alpha.2 → 5.1.0-alpha.4

package/src/engine/xr/NeedleXRSession.ts

@@ -840,15 +840,16 @@ export class NeedleXRSession implements INeedleXRSession {
     get viewerPose(): XRViewerPose | undefined { return this._viewerPose; }
 
 
-    /** @returns `true` if any image is currently being tracked */
-    /** returns true if images are currently being tracked */
+    /** @returns `true` if any image is currently being tracked or emulated */
     get isTrackingImages() {
         if (this.frame && "getImageTrackingResults" in this.frame && typeof this.frame.getImageTrackingResults === "function") {
             try {
                 const trackingResult = this.frame.getImageTrackingResults();
                 for (const result of trackingResult) {
                     const state = result.trackingState;
-                    if (state === "tracked") return true;
+                    if (state === "tracked" || state === "emulated") {
+                        return true;
+                    }
                 }
             }
             catch {
@@ -1053,6 +1054,8 @@ export class NeedleXRSession implements INeedleXRSession {
     private readonly _xr_update_scripts: INeedleXRSessionEventReceiver[] = [];
     /** scripts that are in the scene but inactive (e.g. disabled parent gameObject) */
     private readonly _inactive_scripts: INeedleXRSessionEventReceiver[] = [];
+    /** tracks scripts that have received onEnterXR — prevents spurious onLeaveXR calls */
+    private readonly _scripts_in_xr = new Set<INeedleXRSessionEventReceiver>();
     private readonly _controllerAdded: ControllerChangedEvt[];
     private readonly _controllerRemoved: ControllerChangedEvt[];
     private readonly _originalCameraWorldPosition?: Vector3 | null;
@@ -1163,7 +1166,18 @@ export class NeedleXRSession implements INeedleXRSession {
         // we set the session on the webxr manager at the end because we want to receive inputsource events first
         // e.g. in case there's a bug in the threejs codebase
         this.context.xr = this;
-        this.context.renderer.xr.setSession(this.session).then(this.onRendererSessionSet);
+        this.context.renderer.xr.setSession(this.session).then(this.onRendererSessionSet)
+            .catch(err => {
+                // Workaround for WebXR emulators on localhost: the polyfilled XRSession fails the
+                // native XRWebGLBinding constructor's instanceof check. Retry with layers disabled.
+                // See https://github.com/meta-quest/immersive-web-emulator/issues/80
+                if (isDevEnvironment() && err instanceof TypeError && typeof XRWebGLBinding !== "undefined") {
+                    console.error(`XRWebGLBinding failed (${err.message}).\nSee https://github.com/meta-quest/immersive-web-emulator/issues/80`);
+                }
+                else {
+                    console.error("renderer.xr.setSession failed:", err);
+                }
+            });
         // disable three.js renderer controller autoUpdate (added in ac67b31e3548386f8a93e23a4176554c92bbd0d9)
         if ("controllerAutoUpdate" in this.context.renderer.xr) {
             console.debug("Disabling three.js controllerAutoUpdate");
@@ -1331,8 +1345,10 @@ export class NeedleXRSession implements INeedleXRSession {
         // even if they might already be destroyed e.g. by the WebXR component (it destroys the default controller scripts)
         // they should still receive this callback to be properly cleaned up
         for (const listener of this._xr_scripts) {
+            this._scripts_in_xr.delete(listener);
             listener?.onLeaveXR?.({ xr: this });
         }
+        this._scripts_in_xr.clear();
 
         this.sync?.onExitXR(this);
 
@@ -1399,10 +1415,17 @@ export class NeedleXRSession implements INeedleXRSession {
         }
 
         // make sure the camera is parented to the active rig
-        if (this.rig && this._mainCamera?.gameObject) {
-            const currentParent = this._mainCamera?.gameObject?.parent;
-            if (currentParent !== this.rig.gameObject) {
-                this.rig.gameObject.add(this._mainCamera?.gameObject);
+        // Note: applyCustomForward() inserts _cameraRenderParent between rig and camera,
+        // so the hierarchy is: rig → _cameraRenderParent → camera. We check the effective parent.
+        if (this.rig) {
+            const cameraObject = this._mainCamera?.gameObject ?? this.context.mainCamera;
+            if (cameraObject) {
+                const effectiveParent = cameraObject.parent === this._cameraRenderParent
+                    ? this._cameraRenderParent.parent
+                    : cameraObject.parent;
+                if (effectiveParent !== this.rig.gameObject) {
+                    this.rig.gameObject.add(cameraObject);
+                }
             }
         }
 
@@ -1534,8 +1557,12 @@ export class NeedleXRSession implements INeedleXRSession {
         }
 
         //performance.mark('NeedleXRSession update scripts start');
-        // invoke update on all scripts
-        for (const script of this._xr_update_scripts) {
+        // check all XR scripts for destroyed or inactive state
+        // this must cover _xr_scripts (not just _xr_update_scripts) so that scripts
+        // without onUpdateXR are also detected as inactive when removed from the scene
+        // iterate backwards since markInactive/removeScript modifies the array
+        for (let i = this._xr_scripts.length - 1; i >= 0; i--) {
+            const script = this._xr_scripts[i];
             if (script.destroyed === true) {
                 this._script_to_remove.push(script);
                 continue;
@@ -1544,6 +1571,10 @@ export class NeedleXRSession implements INeedleXRSession {
                 this.markInactive(script);
                 continue;
             }
+        }
+        // invoke update on scripts that have onUpdateXR
+        for (const script of this._xr_update_scripts) {
+            if (script.destroyed || script.activeAndEnabled === false) continue;
             if (script.onUpdateXR) script.onUpdateXR(args);
         }
         //performance.mark('NeedleXRSession update scripts end');
@@ -1666,9 +1697,11 @@ export class NeedleXRSession implements INeedleXRSession {
                 const script = this._inactive_scripts[i];
                 if (script.activeAndEnabled) {
                     this._inactive_scripts.splice(i, 1);
-                    this.addScript(script);
-                    this.invokeCallback_EnterXR(script);
-                    for (const ctrl of this.controllers) this.invokeCallback_ControllerAdded(script, ctrl);
+                    // addScript returns false if already re-added (e.g. via new_scripts_xr processing)
+                    if (this.addScript(script)) {
+                        this.invokeCallback_EnterXR(script);
+                        for (const ctrl of this.controllers) this.invokeCallback_ControllerAdded(script, ctrl);
+                    }
                 }
             }
         }
@@ -1689,6 +1722,7 @@ export class NeedleXRSession implements INeedleXRSession {
     }
 
     private invokeCallback_EnterXR(script: INeedleXRSessionEventReceiver) {
+        this._scripts_in_xr.add(script);
         if (script.onEnterXR) {
             script.onEnterXR({ xr: this });
         }
@@ -1704,6 +1738,7 @@ export class NeedleXRSession implements INeedleXRSession {
         }
     }
     private invokeCallback_LeaveXR(script: INeedleXRSessionEventReceiver) {
+        if (!this._scripts_in_xr.delete(script)) return;
         if (script.onLeaveXR && !script.destroyed) {
             script.onLeaveXR({ xr: this });
         }

package/src/engine/xr/events.ts

@@ -1,5 +1,5 @@
-import { NeedleXRSession } from "./NeedleXRSession.js";
 import type { Context } from "../engine_context.js";
+import { NeedleXRSession } from "./NeedleXRSession.js";
 
 export declare type XRSessionEventArgs = { session: NeedleXRSession };
 

package/src/engine-components/Animation.ts

@@ -447,25 +447,13 @@ export class Animation extends Behaviour implements IAnimationComponent {
 
     private internalOnPlay(action: AnimationAction, options: PlayOptions): Promise<AnimationAction> {
         var existing = this.actions.find(a => a === action);
-        if (existing === action && existing.isRunning() && existing.time < existing.getClip().duration) {
-            const handle = this.tryFindHandle(action);
-            if (existing.paused) {
-                existing.paused = false;
-            }
-            if (handle) return handle.waitForFinish();
-        }
 
-        // Assign defaults
-        if (options.loop === undefined) options.loop = this.loop;
-        if (options.clampWhenFinished === undefined) options.clampWhenFinished = this.clampWhenFinished;
-        if (options.minMaxOffsetNormalized === undefined && this.randomStartTime) options.minMaxOffsetNormalized = this.minMaxOffsetNormalized;
-        if (options.minMaxSpeed === undefined) options.minMaxSpeed = this.minMaxSpeed;
-
-        // Reset currently running animations
+        // Stop other animations before the early-return check so exclusive always applies,
+        // even when the target animation is already running.
         const stopOther = options?.exclusive ?? true;
         if (stopOther) {
             for (const act of this.actions) {
-                if (act != existing) {
+                if (act !== action) {
                     if (options.fadeDuration) {
                         act.fadeOut(options.fadeDuration);
                     }
@@ -475,6 +463,20 @@ export class Animation extends Behaviour implements IAnimationComponent {
                 }
             }
         }
+
+        if (existing === action && existing.isRunning() && existing.time < existing.getClip().duration) {
+            const handle = this.tryFindHandle(action);
+            if (existing.paused) {
+                existing.paused = false;
+            }
+            if (handle) return handle.waitForFinish();
+        }
+
+        // Assign defaults
+        if (options.loop === undefined) options.loop = this.loop;
+        if (options.clampWhenFinished === undefined) options.clampWhenFinished = this.clampWhenFinished;
+        if (options.minMaxOffsetNormalized === undefined && this.randomStartTime) options.minMaxOffsetNormalized = this.minMaxOffsetNormalized;
+        if (options.minMaxSpeed === undefined) options.minMaxSpeed = this.minMaxSpeed;
         if (options?.fadeDuration) {
             action.fadeIn(options.fadeDuration);
         }
@@ -515,10 +517,11 @@ export class Animation extends Behaviour implements IAnimationComponent {
 
         action.paused = false;
         action.play();
+        if (debug) console.log("[Animation] Now Playing", action.getClip().name, action)
+
 
         window.requestAnimationFrame(() => AnimationUtils.testIfRootCanAnimate(action));
 
-        if (debug) console.log("PLAY", action.getClip().name, action)
         const handle = new AnimationHandle(action, this.mixer!, options, _ => {
             this._handles.splice(this._handles.indexOf(handle), 1);
         });

package/src/engine-components/Animator.ts

@@ -89,6 +89,15 @@ export class Animator extends Behaviour implements IAnimationComponent {
         return true;
     }
 
+    /**
+     * The current animator mixer, used for low-level control of animations. Owned by the AnimatorController
+     * @returns The current AnimationMixer, or null if no controller is assigned
+     * @see AnimatorController.mixer
+     */
+    get mixer() {
+        return this._animatorController?.mixer || null;
+    }
+
     /**
      * When enabled, animation will affect the root transform position and rotation
      */
@@ -401,17 +410,15 @@ export class Animator extends Behaviour implements IAnimationComponent {
     initializeRuntimeAnimatorController(force: boolean = false) {
         const shouldRun = (force || this.runtimeAnimatorController !== this._initializeWithRuntimeAnimatorController);
         if (this.runtimeAnimatorController && shouldRun) {
-            const clone = this.runtimeAnimatorController.clone();
-            this._initializeWithRuntimeAnimatorController = clone;
-            if (clone) {
-                console.assert(this.runtimeAnimatorController !== clone);
-                this.runtimeAnimatorController = clone;
-                console.assert(this.runtimeAnimatorController === clone);
-                this.runtimeAnimatorController.bind(this);
-                this.runtimeAnimatorController.setSpeed(this._speed);
-                this.runtimeAnimatorController.normalizedStartOffset = this._normalizedStartOffset;
-            }
-            else console.warn("Could not clone animator controller", this.runtimeAnimatorController);
+            // Create a fresh controller from the (possibly remapped) model.
+            // The constructor deep-clones the model, preserving Object3D refs that
+            // the resolve system has already remapped to cloned objects.
+            const controller = new AnimatorController(this.runtimeAnimatorController.model);
+            this.runtimeAnimatorController = controller;
+            this._initializeWithRuntimeAnimatorController = controller;
+            controller.bind(this);
+            controller.setSpeed(this._speed);
+            controller.normalizedStartOffset = this._normalizedStartOffset;
         }
     }
 

package/src/engine-components/AnimatorController.builder.ts

@@ -0,0 +1,261 @@
+import { AnimationClip } from "three";
+
+import { AnimatorConditionMode, AnimatorControllerParameterType } from "../engine/extensions/NEEDLE_animator_controller_model.js";
+import type { AnimatorControllerModel, Condition, Parameter, State, Transition } from "../engine/extensions/NEEDLE_animator_controller_model.js";
+import { InstantiateIdProvider } from "../engine/engine_networking_instantiate.js";
+import { AnimatorController } from "./AnimatorController.js";
+
+
+/**
+ * Configuration for an animation state in the builder
+ */
+export declare type StateOptions = {
+    /** The animation clip for this state */
+    clip: AnimationClip;
+    /** Whether the animation should loop (default: false) */
+    loop?: boolean;
+    /** Base speed multiplier (default: 1) */
+    speed?: number;
+    /** Name of a float parameter to multiply with speed */
+    speedParameter?: string;
+    /** Normalized cycle offset 0-1 (default: 0) */
+    cycleOffset?: number;
+    /** Name of a float parameter to use as cycle offset */
+    cycleOffsetParameter?: string;
+}
+
+/**
+ * Configuration for a transition in the builder
+ */
+export declare type TransitionOptions = {
+    /** Duration of the crossfade in seconds (default: 0) */
+    duration?: number;
+    /** Normalized exit time 0-1 (default: 1). Only used when hasExitTime is true */
+    exitTime?: number;
+    /** Whether the transition waits for exitTime before transitioning (default: false) */
+    hasExitTime?: boolean;
+    /** Normalized offset into the destination state's animation (default: 0) */
+    offset?: number;
+    /** Whether duration is in seconds (true) or normalized (false) (default: false) */
+    hasFixedDuration?: boolean;
+}
+
+/** String condition modes for the builder, mapped to {@link AnimatorConditionMode} */
+export type ConditionMode = "if" | "ifNot" | "greater" | "less" | "equals" | "notEqual";
+
+function conditionModeToEnum(mode: ConditionMode): AnimatorConditionMode {
+    switch (mode) {
+        case "if": return AnimatorConditionMode.If;
+        case "ifNot": return AnimatorConditionMode.IfNot;
+        case "greater": return AnimatorConditionMode.Greater;
+        case "less": return AnimatorConditionMode.Less;
+        case "equals": return AnimatorConditionMode.Equals;
+        case "notEqual": return AnimatorConditionMode.NotEqual;
+    }
+}
+
+type BuilderTransition = {
+    to: string;
+    options: TransitionOptions;
+    conditions: Array<{ parameter: string; mode: ConditionMode; threshold: number }>;
+};
+
+type BuilderState = {
+    name: string;
+    options: StateOptions;
+    transitions: BuilderTransition[];
+};
+
+/**
+ * A fluent builder for creating {@link AnimatorController} instances from code.
+ *
+ * Use {@link AnimatorController.build} to create a new builder.
+ *
+ * @example
+ * ```ts
+ * const controller = AnimatorController.build("CharacterController")
+ *     .floatParameter("Speed", 0)
+ *     .triggerParameter("Jump")
+ *     .state("Idle", { clip: idleClip, loop: true })
+ *     .state("Walk", { clip: walkClip, loop: true })
+ *     .state("Jump", { clip: jumpClip })
+ *     .transition("Idle", "Walk", { duration: 0.25 })
+ *         .condition("Speed", "greater", 0.1)
+ *     .transition("Walk", "Idle", { duration: 0.25 })
+ *         .condition("Speed", "less", 0.1)
+ *     .transition("*", "Jump", { duration: 0.1 })
+ *         .condition("Jump", "if")
+ *     .transition("Jump", "Idle", { hasExitTime: true, exitTime: 0.9, duration: 0.25 })
+ *     .build();
+ * ```
+ *
+ * @category Animation and Sequencing
+ * @group Utilities
+ */
+export class AnimatorControllerBuilder {
+    private _name: string;
+    private _parameters: Parameter[] = [];
+    private _states: BuilderState[] = [];
+    private _anyStateTransitions: BuilderTransition[] = [];
+    private _defaultStateName: string | null = null;
+    private _lastTransition: BuilderTransition | null = null;
+
+    constructor(name?: string) {
+        this._name = name ?? "AnimatorController";
+    }
+
+    /** Adds a float parameter */
+    floatParameter(name: string, defaultValue: number = 0): this {
+        this._parameters.push({ name, hash: this._parameters.length, type: AnimatorControllerParameterType.Float, value: defaultValue });
+        return this;
+    }
+
+    /** Adds an integer parameter */
+    intParameter(name: string, defaultValue: number = 0): this {
+        this._parameters.push({ name, hash: this._parameters.length, type: AnimatorControllerParameterType.Int, value: defaultValue });
+        return this;
+    }
+
+    /** Adds a boolean parameter */
+    boolParameter(name: string, defaultValue: boolean = false): this {
+        this._parameters.push({ name, hash: this._parameters.length, type: AnimatorControllerParameterType.Bool, value: defaultValue });
+        return this;
+    }
+
+    /** Adds a trigger parameter */
+    triggerParameter(name: string): this {
+        this._parameters.push({ name, hash: this._parameters.length, type: AnimatorControllerParameterType.Trigger, value: false });
+        return this;
+    }
+
+    /**
+     * Adds a state to the controller. The first state added becomes the default state.
+     * @param name - Unique name for the state
+     * @param options - State configuration including clip, loop, speed
+     */
+    state(name: string, options: StateOptions): this {
+        this._states.push({ name, options, transitions: [] });
+        return this;
+    }
+
+    /**
+     * Adds a transition between two states.
+     * Use `"*"` as the source to create a transition from any state.
+     * Chain `.condition()` calls after this to add conditions.
+     * @param from - Source state name, or `"*"` for any-state transition
+     * @param to - Destination state name
+     * @param options - Transition configuration
+     */
+    transition(from: string, to: string, options?: TransitionOptions): this {
+        const t: BuilderTransition = { to, options: options ?? {}, conditions: [] };
+        if (from === "*") {
+            this._anyStateTransitions.push(t);
+        }
+        else {
+            const state = this._states.find(s => s.name === from);
+            if (!state) throw new Error(`AnimatorControllerBuilder: source state "${from}" not found. Add it with .state() first.`);
+            state.transitions.push(t);
+        }
+        this._lastTransition = t;
+        return this;
+    }
+
+    /**
+     * Adds a condition to the most recently added transition.
+     * Multiple conditions on the same transition are AND-ed together.
+     * @param parameter - Name of the parameter to evaluate
+     * @param mode - Condition mode: `"if"`, `"ifNot"`, `"greater"`, `"less"`, `"equals"`, `"notEqual"`
+     * @param threshold - Comparison threshold for numeric conditions (default: 0)
+     */
+    condition(parameter: string, mode: ConditionMode, threshold: number = 0): this {
+        if (!this._lastTransition) throw new Error("AnimatorControllerBuilder: .condition() must be called after .transition()");
+        this._lastTransition.conditions.push({ parameter, mode, threshold });
+        return this;
+    }
+
+    /**
+     * Sets which state is the default/entry state.
+     * If not called, the first added state is used.
+     * @param name - Name of the state
+     */
+    defaultState(name: string): this {
+        this._defaultStateName = name;
+        return this;
+    }
+
+    /**
+     * Builds and returns the {@link AnimatorController}.
+     * Resolves all state name references to indices.
+     */
+    build(): AnimatorController {
+        const stateIndexMap = new Map<string, number>();
+        this._states.forEach((s, i) => stateIndexMap.set(s.name, i));
+
+        let defaultStateIndex = 0;
+        if (this._defaultStateName !== null) {
+            const idx = stateIndexMap.get(this._defaultStateName);
+            if (idx === undefined) throw new Error(`AnimatorControllerBuilder: default state "${this._defaultStateName}" not found`);
+            defaultStateIndex = idx;
+        }
+
+        const resolveTransition = (t: BuilderTransition): Transition => {
+            const destIndex = stateIndexMap.get(t.to);
+            if (destIndex === undefined) throw new Error(`AnimatorControllerBuilder: transition target "${t.to}" not found`);
+            return {
+                exitTime: t.options.exitTime ?? 1,
+                hasExitTime: t.options.hasExitTime ?? false,
+                duration: t.options.duration ?? 0,
+                offset: t.options.offset ?? 0,
+                hasFixedDuration: t.options.hasFixedDuration ?? false,
+                destinationState: destIndex,
+                conditions: t.conditions.map(c => ({
+                    parameter: c.parameter,
+                    mode: conditionModeToEnum(c.mode),
+                    threshold: c.threshold,
+                })),
+            };
+        };
+
+        const states: State[] = this._states.map((s, index) => {
+            const transitions: Transition[] = s.transitions.map(resolveTransition);
+
+            // Replicate any-state transitions onto every state (except self-targeting)
+            for (const anyT of this._anyStateTransitions) {
+                const destIndex = stateIndexMap.get(anyT.to);
+                if (destIndex === index) continue;
+                transitions.push(resolveTransition(anyT));
+            }
+
+            return {
+                name: s.name,
+                hash: index,
+                motion: {
+                    name: s.options.clip.name,
+                    clip: s.options.clip,
+                    isLooping: s.options.loop ?? false,
+                },
+                transitions,
+                behaviours: [],
+                speed: s.options.speed,
+                speedParameter: s.options.speedParameter,
+                cycleOffset: s.options.cycleOffset,
+                cycleOffsetParameter: s.options.cycleOffsetParameter,
+            };
+        });
+
+        const model: AnimatorControllerModel = {
+            name: this._name,
+            guid: new InstantiateIdProvider(Date.now()).generateUUID(),
+            parameters: this._parameters,
+            layers: [{
+                name: "Base Layer",
+                stateMachine: {
+                    defaultState: defaultStateIndex,
+                    states,
+                }
+            }],
+        };
+
+        return new AnimatorController(model);
+    }
+}