@needle-tools/engine 4.8.9 → 4.9.0-alpha.1

package/src/engine/engine_three_utils.ts

@@ -1,6 +1,7 @@
 import { AnimationAction, Box3, Box3Helper, Camera, Color, DepthTexture, Euler, GridHelper, Layers, Material, Mesh, MeshStandardMaterial, Object3D, OrthographicCamera, PerspectiveCamera, PlaneGeometry, Quaternion, Scene, ShadowMaterial, Texture, Uniform, Vector2Like, Vector3, WebGLRenderTarget } from "three";
 import { ShaderMaterial, WebGLRenderer } from "three";
 import { GroundedSkybox } from "three/examples/jsm/objects/GroundedSkybox.js";
+import { rendererReference } from "three/src/nodes/TSL.js";
 
 import { useForAutoFit } from "./engine_camera.js";
 import { Mathf } from "./engine_math.js"
@@ -587,8 +588,10 @@ export class Graphics {
         renderer.state.buffers.depth.setMask(depthWrite);
 
         renderer.setClearColor(new Color(0, 0, 0), 0);
-        // renderer.setSize(target.width, target.height);
-        renderer.setPixelRatio(window.devicePixelRatio);
+        if (renderer.pixelRatio !== window.devicePixelRatio) {
+            if (renderer.xr.isPresenting === false)
+                renderer.setPixelRatio(window.devicePixelRatio);
+        }
         renderer.setRenderTarget(target);
         renderer.clear();
         renderer.render(this.scene, this.perspectiveCam);

package/src/engine/xr/NeedleXRController.ts

@@ -398,8 +398,8 @@ export class NeedleXRController implements IPointerHitEventReceiver {
 C:${this.connected ? "x" : "-"} T:${this.isTracking ? "x" : "-"} Hand:${this.inputSource.hand ? "x" : "-"} Pen: ${this._isMxInk ? "x" : "-"}`;
         if (this.inputSource.hand) debugStr += `\nPinch: ${this.getGesture("pinch")?.value.toFixed(3)}`;
         debugStr += "\n" + profileStr;
-        debugStr += "\n" + (this.inputSource.targetRaySpace ? `Ray: x` : "Ray: -") + 
-            (this.inputSource.gripSpace ? " Grip: x" : " Grip: -") + 
+        debugStr += "\n" + (this.inputSource.targetRaySpace ? `Ray: x` : "Ray: -") +
+            (this.inputSource.gripSpace ? " Grip: x" : " Grip: -") +
             (this.inputSource.gamepad ? ` Gamepad: ${this.inputSource.gamepad.mapping}` : " Gamepad: -");
         if (this.inputSource.gamepad) {
             const gp = this.inputSource.gamepad;
@@ -415,7 +415,7 @@ C:${this.connected ? "x" : "-"} T:${this.isTracking ? "x" : "-"} Hand:${this.inp
         this._handJointPoses.clear();
         this._hand_wristDotUp = undefined;
 
-        if (!this.xr.referenceSpace) {
+        if (!this.xr.referenceSpace || !this.inputSource.gamepad?.connected) {
             this._isTracking = false;
             return;
         }
@@ -460,7 +460,7 @@ C:${this.connected ? "x" : "-"} T:${this.isTracking ? "x" : "-"} Hand:${this.inp
 
         // update controller object parent – needs to be parented to the rig, which
         // implicitly is the same object as the camera parent.
-        if (this.xr.context.mainCamera?.parent) { 
+        if (this.xr.context.mainCamera?.parent) {
             if (this._object.parent !== this.xr.context.mainCamera?.parent)
                 this.xr.context.mainCamera.parent.add(this._object);
             if (this._gripSpaceObject !== undefined && this._gripSpaceObject?.parent !== this.xr.context.mainCamera?.parent)
@@ -594,6 +594,24 @@ C:${this.connected ? "x" : "-"} T:${this.isTracking ? "x" : "-"} Hand:${this.inp
                     return this.getGesture("pinch");
                 }
                 return this.toNeedleGamepadButton(0, key);
+
+            case "xr-standard-trigger":
+                if (this.inputSource.gamepad) {
+                    return this.toNeedleGamepadButton(0, key);
+                }
+                break;
+
+            case "xr-standard-squeeze":
+                if (this.inputSource.gamepad) {
+                    return this.toNeedleGamepadButton(1, key);
+                }
+                break;
+
+            case "xr-standard-thumbstick":
+                if (this.inputSource.gamepad) {
+                    return this.toNeedleGamepadButton(3, key);
+                }
+                break;
         }
 
 
@@ -694,12 +712,18 @@ C:${this.connected ? "x" : "-"} T:${this.isTracking ? "x" : "-"} Hand:${this.inp
     getStick(key: StickName | "primary"): Vec3 {
         if (!this._layout) return { x: 0, y: 0, z: 0 };
 
+        // Hands dont have thumbsicks
+        if (this.isHand) {
+            return { x: 0, y: 0, z: 0 };
+        }
+
         if (key === "primary") {
-            const x = this.inputSource.gamepad?.axes[0] || 0;
-            const y = this.inputSource.gamepad?.axes[1] || 0;
-            // the primary thumbstick is button 3 (see gamepads module explainer)
-            const z = this.inputSource.gamepad?.buttons[3]?.value || 0;
-            return { x, y, z }
+            if (this._layout.components["xr-standard-thumbstick"]) key = "xr-standard-thumbstick";
+            // const x = this.inputSource.gamepad?.axes[0] || 0;
+            // const y = this.inputSource.gamepad?.axes[1] || 0;
+            // // the primary thumbstick is button 3 (see gamepads module explainer)
+            // const z = this.inputSource.gamepad?.buttons[3]?.value || 0;
+            // return { x, y, z }
         }
 
         const componentModel = this._layout?.components[key];
@@ -709,12 +733,12 @@ C:${this.connected ? "x" : "-"} T:${this.isTracking ? "x" : "-"} Hand:${this.inp
                     if (this.inputSource.gamepad) {
                         const xIndex = componentModel.gamepadIndices!.xAxis!;
                         const yIndex = componentModel.gamepadIndices!.yAxis!;
-                        let x = this.inputSource.gamepad?.axes[xIndex];
-                        let y = this.inputSource.gamepad?.axes[yIndex];
+                        let x = this.inputSource.gamepad.axes[xIndex] || 0;
+                        let y = this.inputSource.gamepad.axes[yIndex] || 0;
                         x *= -1;
                         y *= -1;
                         const buttonIndex = componentModel.gamepadIndices!.button!;
-                        const z = this.inputSource.gamepad?.buttons[buttonIndex]?.value;
+                        const z = this.inputSource.gamepad?.buttons[buttonIndex]?.value || 0;
                         return { x, y, z }
                     }
             }
@@ -731,13 +755,13 @@ C:${this.connected ? "x" : "-"} T:${this.isTracking ? "x" : "-"} Hand:${this.inp
     private initialize() {
         // WORKAROUND for hand controllers that don't have a select event
         this._hasSelectEvent = this.profiles.includes("generic-hand-select") || this.profiles.some(p => p.startsWith("generic-trigger"));
-       
+
         // Used to determine special layout for Quest controllers, e.g. last button is menu button
         this._isMetaQuestTouchController = this.profiles.includes("meta-quest-touch-plus") || this.profiles.includes("oculus-touch-v3");
 
         // Proper profile starting with v69 and browser 35.1
         this._isMxInk = this.profiles.includes("logitech-mx-ink")
-        
+
         if (!this._layout) {
             // Ignore transient-pointer since we likely don't want to spawn a controller visual just for a temporary pointer.
             // TODO we should check how this is actually handled on Quest Browser when the transient-pointer flag is on.
@@ -953,7 +977,7 @@ C:${this.connected ? "x" : "-"} T:${this.isTracking ? "x" : "-"} Hand:${this.inp
                 if (menuButtonState) {
                     if (menuButtonState.isDown) {
                         const menu = this.context.menu;
-                        if (menu.spatialMenuIsVisible) 
+                        if (menu.spatialMenuIsVisible)
                             menu.setSpatialMenuVisible(false);
                         else
                             this.context.menu.setSpatialMenuVisible(true);

package/src/engine/xr/NeedleXRSession.ts

@@ -530,7 +530,7 @@ export class NeedleXRSession implements INeedleXRSession {
             listener({ mode, init });
         }
         if (debug) showBalloonMessage("Requesting " + mode + " session (" + Date.now() + ")");
-        this._currentSessionRequest = navigator.xr?.requestSession(mode, init);
+        this._currentSessionRequest = navigator?.xr?.requestSession(mode, init);
         this._currentSessionRequestMode = mode;
         /**@type {XRSystem} */
         const newSession = await (this._currentSessionRequest)?.catch(e => {
@@ -1053,10 +1053,13 @@ export class NeedleXRSession implements INeedleXRSession {
 
     /** Disconnects the controller, invokes events and notifies previou controller (if any) */
     private disconnectInputSource(inputSource: XRInputSource) {
-        const handleRemove = (oldController: NeedleXRController, _array: Array<NeedleXRController>, i: number) => {
+        const handleRemove = (oldController: NeedleXRController, array: Array<NeedleXRController>) => {
             if (oldController.inputSource === inputSource) {
                 if (debug) console.log("Disconnecting controller", oldController.index);
-                this.controllers.splice(i, 1);
+
+                const index = array.indexOf(oldController);
+                if(index >= 0) array.splice(index, 1);
+
                 this.invokeControllerEvent(oldController, this._controllerRemoved, "removed");
                 const args: NeedleXRControllerEventArgs = {
                     xr: this,
@@ -1069,13 +1072,15 @@ export class NeedleXRSession implements INeedleXRSession {
                 oldController.onDisconnected();
             }
         }
-        for (let i = this.controllers.length - 1; i >= 0; i--) {
-            const oldController = this.controllers[i];
-            handleRemove(oldController, this.controllers, i);
+        const copy = [...this.controllers];
+        for (let i = copy.length - 1; i >= 0; i--) {
+            const oldController = copy[i];
+            handleRemove(oldController, this.controllers);
         }
-        for (let i = this._newControllers.length - 1; i >= 0; i--) {
-            const oldController = this._newControllers[i];
-            handleRemove(oldController, this._newControllers, i);
+        const copyNew = [...this._newControllers];
+        for (let i = copyNew.length - 1; i >= 0; i--) {
+            const oldController = copyNew[i];
+            handleRemove(oldController, this._newControllers);
         }
     }
 
@@ -1130,8 +1135,8 @@ export class NeedleXRSession implements INeedleXRSession {
         for (let i = 0; i < copy.length; i++) {
             this.disconnectInputSource(copy[i].inputSource);
         }
-        this._newControllers.length = 0;
         this.controllers.length = 0;
+        this._newControllers.length = 0;
 
         // we want to call leave XR for *all* scripts that are still registered
         // even if they might already be destroyed e.g. by the WebXR component (it destroys the default controller scripts)
@@ -1318,8 +1323,6 @@ export class NeedleXRSession implements INeedleXRSession {
                         continue;
                     }
                     this.invokeCallback_ControllerAdded(script, controller);
-                    // if (script.onXRControllerAdded) 
-                    //     script.onXRControllerAdded({ xr: this, controller, change: "added" });
                 }
             }
             this.controllers.sort((a, b) => a.index - b.index);
@@ -1558,9 +1561,10 @@ export class NeedleXRSession implements INeedleXRSession {
                 const rigWorldScale = getWorldScale(this.rig.gameObject);
                 minNearPlane *= rigWorldScale.x;
             }
-            if (this._camera instanceof PerspectiveCamera && this._camera.near > minNearPlane) {
+            if (this._camera instanceof PerspectiveCamera && Math.abs(this._camera.near - minNearPlane) > .0001) {
                 this.originalCameraNearPlane = this._camera.near;
                 this._camera.near = minNearPlane;
+                if(debug) console.debug(`Setting camera near plane to ${minNearPlane} (was ${this.originalCameraNearPlane}) to account for XR rendering scale`);
             }
         }
     }
@@ -1572,6 +1576,7 @@ export class NeedleXRSession implements INeedleXRSession {
 
         if (this._camera instanceof PerspectiveCamera && this.originalCameraNearPlane != undefined) {
             this._camera.near = this.originalCameraNearPlane;
+            this.originalCameraNearPlane = undefined;
         }
     }
 

package/src/engine-components/RendererLightmap.ts

@@ -127,6 +127,7 @@ export class RendererLightmap {
             if (material["NEEDLE:lightmap-material-version"] == undefined) {
                 if (debug) console.warn("Cloning material for lightmap " + material.name);
                 const mat: Material = material.clone();
+                if(!mat.name?.includes("(lightmap)")) mat.name = material.name + " (lightmap)";
                 material = mat;
                 material.onBeforeCompile = this.onBeforeCompile;
             }
@@ -147,7 +148,7 @@ export class RendererLightmap {
             return;
         }
 
-        if (debug) console.log("Assigning lightmap", material.name, material.version);
+        if (debug) console.log("Assigning lightmap", material.name, material.version, material);
 
         // assign the lightmap
         material.lightMap = this.lightmapTexture;

package/src/engine-components/api.ts

@@ -55,6 +55,7 @@ export { DragMode } from "./DragControls.js";
 export type { DropListenerNetworkEventArguments, DropListenerOnDropArguments } from "./DropListener.js";
 export { type FitCameraOptions } from "./OrbitControls.js";
 export * from "./particlesystem/api.js"
+export * from "./splines/index.js";
 
 // for correct type resolution in JSDoc
 import type { PhysicsMaterial } from "../engine/engine_physics.types.js";

package/src/engine-components/codegen/components.ts

@@ -150,6 +150,9 @@ export { SmoothFollow } from "../SmoothFollow.js";
 export { SpatialTriggerReceiver } from "../SpatialTrigger.js";
 export { SpatialTrigger } from "../SpatialTrigger.js";
 export { SpectatorCamera } from "../SpectatorCamera.js";
+export { SplineData } from "../splines/Spline.js";
+export { SplineContainer } from "../splines/Spline.js";
+export { SplineWalker } from "../splines/SplineWalker.js";
 export { Sprite } from "../SpriteRenderer.js";
 export { SpriteSheet } from "../SpriteRenderer.js";
 export { SpriteData } from "../SpriteRenderer.js";

package/src/engine-components/splines/Spline.ts

@@ -0,0 +1,284 @@
+
+import { BufferGeometry, CatmullRomCurve3, CubicBezierCurve3, Curve, Line, LineBasicMaterial,LineCurve3, Object3D, Quaternion, Vector3 } from "three";
+
+import { Mathf } from "../../engine/engine_math.js";
+import { serializeable } from "../../engine/engine_serialization.js";
+import { getParam } from "../../engine/engine_utils.js";
+import { Behaviour } from "../Component.js";
+
+const debug = getParam("debugsplines");
+
+export class SplineData {
+    @serializeable(Vector3)
+    position: Vector3 = new Vector3();
+
+    @serializeable(Quaternion)
+    rotation: Quaternion = new Quaternion();
+
+    @serializeable(Vector3)
+    tangentIn: Vector3 = new Vector3();
+
+    @serializeable(Vector3)
+    tangentOut: Vector3 = new Vector3();
+}
+
+// enum SplineTypeEnum {
+//     CatmullRom = 0,
+//     Bezier = 1,
+//     Linear = 2
+// }
+// type SplineType = "CatmullRom" | "Bezier" | "Linear";
+
+
+//@dont-generate-component
+/**
+ * Holds spline data and generates a spline curve. Use with SplineWalker to move objects along the spline or call getPointAt to sample points on the spline.
+ * The spline is defined by an array of knots (SplineData) which define position, rotation and tangents.  
+ * 
+ * You can create a SplineContainer from an array of points using the static method 'createFromPoints'.
+ */
+export class SplineContainer extends Behaviour {
+
+    /**
+     * Adds a knot to the end of the spline.
+     */
+    addKnot(knot: SplineData | { position: Vector3 }): SplineContainer {
+        if (knot instanceof SplineData) {
+            this.spline.push(knot);
+            this._isDirty = true;
+        }
+        else {
+            const k = new SplineData();
+            k.position.copy(knot.position);
+            this.spline.push(k);
+            this._isDirty = true;
+        }
+        return this;
+    }
+
+    /**
+     * Removes a knot by index or by reference.
+     */
+    removeKnot(index: number | SplineData): SplineContainer {
+        if (typeof index === "number") {
+            this.spline.splice(index, 1);
+            this._isDirty = true;
+        } else {
+            const i = this.spline.indexOf(index);
+            if (i !== -1) {
+                this.spline.splice(i, 1);
+                this._isDirty = true;
+            }
+        }
+        return this;
+    }
+
+    /**
+     * Gets a point on the spline in world space.
+     */
+    getPointAt(t: number, target?: Vector3): Vector3 {
+        if (!this.curve) return new Vector3();
+        const pos = this.curve.getPointAt(Mathf.clamp01(t), target);
+        const worldMatrix = this.gameObject.matrixWorld ?? undefined;
+        if (worldMatrix) {
+            pos.applyMatrix4(worldMatrix);
+        }
+        return pos;
+    }
+
+    /**
+     * Marks the spline as dirty, causing it to be rebuilt on the next update.
+     */
+    markDirty() {
+        this._isDirty = true;
+    }
+
+    /**
+     * Gets the tangent vector on the spline in world space.
+     */
+    getTangentAt(t: number, target?: Vector3): Vector3 {
+        if (!this.curve) return target ?? new Vector3();
+        const wr = this.gameObject.worldQuaternion;
+        return this.curve.getTangentAt(Mathf.clamp01(t), target).applyQuaternion(wr);
+    }
+
+    @serializeable()
+    set closed(value: boolean) {
+        this._closed = value;
+        this._isDirty = true;
+    }
+    get closed() { return this._closed; }
+    private _closed: boolean = false;
+
+
+    /** Spline data. Call 'markDirty' if modified */
+    @serializeable(SplineData)
+    spline: SplineData[] = [];
+
+    /** Enable to render the spline curve for debugging */
+    set debug(debug: boolean) {
+        if (debug && !this._builtCurve) this.buildCurve();
+        if (!this._debugLine) return;
+        this._debugLine.visible = debug;
+    }
+
+    /** Gets the spline curve generated from the 'spline' data */
+    get curve(): Curve<Vector3> | null {
+        return this._curve;
+    }
+
+    get isDirty() { return this._isDirty; }
+
+    private _isDirty: boolean = false;
+
+    private _curve: Curve<Vector3> | null = null;
+    private _builtCurve: boolean = false;
+    private _debugLine: Object3D | null = null;
+
+    /** @internal */
+    awake() {
+        if (debug) {
+            console.log(`[Spline] ${this.name}`, this);
+            this.buildCurve();
+        }
+    }
+
+    /** @internal */
+    update() {
+        if (this._isDirty) {
+            this.buildCurve(true);
+        }
+        if (this._debugLine && this._debugLine.parent !== this.gameObject) this.gameObject.add(this._debugLine);
+    }
+
+    private buildCurve(force: boolean = false) {
+        if (this._builtCurve && !force) return;
+        this._builtCurve = true;
+
+        if (!this.spline) {
+            console.error("[Spline] Can not build curve, no spline data", this.name);
+            return;
+        }
+        this._isDirty = false;
+        this._curve = createCatmullRomCurve(this.spline, this.closed);
+        this.buildDebugCurve();
+        // TODO: Unity supports spline interpolation type per knot which we don't support right now. Additionally EditType is deprecated. For simplicity we're just supporting CatmullRom for now.
+        // switch (this.editType) {
+        //     case SplineType.CatmullRom:
+        //         this.createCatmullRomCurve();
+        //         break;
+        //     case SplineType.Bezier:
+        //         console.warn("Bezier spline not implemented yet", this.name);
+        //         this.createCatmullRomCurve();
+        //         // this.createBezierCurve();
+        //         break;
+        //     case SplineType.Linear:
+        //         this.createLinearCurve();
+        //         break;
+        // }
+    }
+
+    private buildDebugCurve() {
+        if (debug && this.spline && this._curve) {
+            this._debugLine?.removeFromParent();
+            this._debugLine = null;
+
+            const material = new LineBasicMaterial({
+                color: 0x6600ff,
+            });
+            const res = this.spline.length * 10;
+            const splinePoints = this._curve.getPoints(res);
+            const geometry = new BufferGeometry().setFromPoints(splinePoints);
+            this._debugLine = new Line(geometry, material);
+            this.gameObject?.add(this._debugLine);
+        }
+    }
+}
+
+
+function createCatmullRomCurve(data: SplineData[], closed: boolean): CatmullRomCurve3 {
+    const points = data.map(knot => new Vector3(-knot.position.x, knot.position.y, knot.position.z));
+    if (points.length === 1) points.push(points[0]);
+    const averageTension = data.reduce((acc, knot) => acc + Math.abs(knot.tangentOut.x) + Math.abs(knot.tangentOut.y) + Math.abs(knot.tangentOut.z), 0) / data.length;
+    const tension = Mathf.remap(averageTension, 0, 0.3, 0, .5);
+    return new CatmullRomCurve3(points, closed, "catmullrom", tension);
+}
+
+function createLinearCurve(data: SplineData[], closed: boolean): LineCurve3 | null {
+    if (!data || data.length < 2) return null;
+    const points = data.map(knot => new Vector3(-knot.position.x, knot.position.y, knot.position.z));
+    if (closed) points.push(points[0]);
+    return new LineCurve3(points.at(0), points.at(1));
+}
+
+
+// function createBezierCurve(data: SplineData[], closed: boolean): CubicBezierCurve3 | null {
+//     if (!data || data.length < 2) return null;
+
+//     for (let k = 0; k < data.length; k++) {
+//         const k0 = data[k];
+//         let nextIndex = k + 1;
+//         if (nextIndex >= data.length) {
+//             if (!closed) break;
+//             nextIndex = 0;
+//         }
+//         const k1 = data[nextIndex];
+//         // points
+//         const p0 = new Vector3(-k0.position.x, k0.position.y, k0.position.z);
+//         const p1 = new Vector3(-k1.position.x, k1.position.y, k1.position.z);
+//         // tangents
+//         const t0 = new Vector3(-k0.tangentOut.x, k0.tangentOut.y, k0.tangentOut.z);
+//         const t1 = new Vector3(-k1.tangentIn.x, k1.tangentIn.y, k1.tangentIn.z);
+//         // rotations
+//         // const q0 = k0.rotation;// new Quaternion(k0.rotation.value.x, k0.rotation.value.y, k0.rotation.value.z, k0.rotation.value.w);
+//         // const q1 = k1.rotation;// new Quaternion(k1.rotation.value.x, k1.rotation.value.y, k1.rotation.value.z, k1.rotation.value.w);
+//         // const a = new Vector3(0,1,0);
+//         // const angle = Math.PI*.5;
+//         // t0.sub(p0).applyQuaternion(q0).add(p0);
+//         // t1.sub(p1).applyQuaternion(q1).add(p1);
+//         t0.add(p0);
+//         // t0.applyQuaternion(q0);
+//         t1.add(p1);
+//         const curve = new CubicBezierCurve3(p0, t0, t1, p1);
+//         return curve;
+//     }
+//     return null;
+// }
+
+// class SplineCurve {
+
+//     private spline: Spline;
+
+//     constructor(spline: Spline) {
+//         this.spline = spline;
+//     }
+
+//     getPoints(num: number): Vector3[] {
+//         const points: Vector3[] = [];
+//         const samplePerKnot = num / this.spline.length;
+//         for (let k = 1; k < this.spline.length; k++) {
+//             const cur = this.spline[k];
+//             const prev = this.spline[k - 1];
+
+//             for (let i = 0; i < samplePerKnot; i++) {
+//                 const t = i / (samplePerKnot - 1);
+//                 console.log(CurveUtils);
+//                 const x = this.interpolate(-prev.Position.x, -cur.Position.x, -prev.tangentOut.x, -cur.TangentIn.x, t);
+//                 const y = this.interpolate(prev.Position.y, cur.Position.y, prev.tangentOut.y, cur.TangentIn.y, t);
+//                 const z = this.interpolate(prev.Position.z, cur.Position.z, prev.tangentOut.z, cur.TangentIn.z, t);
+//                 points.push(new Vector3(x, y, z));
+//             }
+//         }
+
+//         return points;
+//     }
+
+//     interpolate(p0, p1, p2, p3, t) {
+
+//         var v0 = (p2 - p0) * 0.5;
+//         var v1 = (p3 - p1) * 0.5;
+//         var t2 = t * t;
+//         var t3 = t * t2;
+//         return (2 * p1 - 2 * p2 + v0 + v1) * t3 + (- 3 * p1 + 3 * p2 - 2 * v0 - v1) * t2 + v0 * t + p1;
+//     }
+// }

package/src/engine-components/splines/SplineUtils.ts

@@ -0,0 +1,32 @@
+import { Vector3 } from "three";
+
+import { Mathf } from "../../engine/engine_math.js";
+import { SplineContainer, SplineData } from "./Spline.js";
+
+
+export namespace SplineUtils {
+
+    /**
+     * Creates a SplineContainer from an array of points.
+     * @param positions The positions of the knots.
+     * @param closed Whether the spline is closed (the last knot connects to the first).
+     * @param tension The tension of the spline. 0 is no tension, 1 is high tension (straight lines between knots). Default is 0.75.
+     * @return The created SplineContainer component - add it to an Object3D to use it.
+     */
+    export function createFromPoints(positions: Vector3[], closed: boolean = false, tension: number = .75): SplineContainer {
+        const spline = new SplineContainer();
+        const tangentFactor = 1 - Mathf.clamp(tension, 0, 1);
+        positions.forEach((pos, index) => {
+            const tangent = new Vector3();
+            if (index < positions.length - 1) tangent.subVectors(positions[index + 1], pos).normalize().multiplyScalar(tangentFactor);
+            else if (closed && positions.length > 1) tangent.subVectors(positions[0], pos).normalize().multiplyScalar(tangentFactor);
+            const knot = new SplineData();
+            knot.position.copy(pos);
+            knot.tangentIn.copy(tangent);
+            knot.tangentOut.copy(tangent);
+            spline.addKnot(knot);
+        });
+        spline.closed = closed;
+        return spline;
+    }
+}