@needle-tools/engine 2.31.1-pre → 2.33.0-pre

package/src/engine/engine_setup.ts

@@ -222,11 +222,13 @@ export class Context {
 		this.lightmaps = new LightDataRegistry(this);
 		this.players = new PlayerViewManager(this);
 
-		window.addEventListener('resize', this.updateSize.bind(this));
+		window.addEventListener('resize', () => this._sizeChanged = true );
 		const ro = new ResizeObserver(_ => this._sizeChanged = true);
 		ro.observe(this.domElement);
 	}
 
+	// private _requestSizeUpdate : boolean = false;
+
 	private updateSize() {
 		if (!this.isManagedExternally && !this.renderer.xr.isPresenting) {
 			this._sizeChanged = false;
@@ -237,8 +239,11 @@ export class Context {
 			this.updateAspect(camera);
 			this.renderer.setSize(width, height);
 			this.renderer.setPixelRatio(window.devicePixelRatio);
-			this.renderer.domElement.style.width = this.domWidth + "px";
-			this.renderer.domElement.style.height = this.domHeight + "px";
+			// avoid setting pixel values here since this can cause pingpong updates
+			// e.g. when system scale is set to 125%
+			// https://github.com/needle-tools/needle-engine-support/issues/69
+			this.renderer.domElement.style.width = "100%";
+			this.renderer.domElement.style.height = "100%";
 			if (this.composer) {
 				this.composer.setSize(width, height);
 				this.composer.setPixelRatio(window.devicePixelRatio);

package/src/engine/extensions/NEEDLE_components.ts

@@ -5,6 +5,7 @@ import { writeBuiltinComponentData } from "../engine_gltf_builtin_components";
 import { debugExtension } from "../engine_default_parameters";
 import { builtinComponentKeyName } from "../engine_constants";
 import { resolveReferences } from "./extension_utils";
+import { apply } from "../../engine-components/js-extensions/Object3D";
 
 export const debug = debugExtension
 const componentsArrayExportKey = "$___Export_Components";
@@ -185,6 +186,8 @@ export class NEEDLE_components implements GLTFLoaderPlugin {
                     continue;
                 }
 
+                apply(obj);
+
                 loadComponents.push(this.createComponents(obj, data));
             }
         }

package/src/engine/extensions/NEEDLE_techniques_webgl.ts

@@ -62,6 +62,12 @@ export class CustomShader extends RawShaderMaterial {
     private identifier: SourceIdentifier;
     private onBeforeRenderSceneCallback = this.onBeforeRenderScene.bind(this);
 
+    clone() {
+        const clone = super.clone();
+        createUniformProperties(clone);
+        return clone;
+    }
+
     constructor(identifier: SourceIdentifier, ...args) {
         super(...args);
 
@@ -179,12 +185,12 @@ export class CustomShader extends RawShaderMaterial {
                     CustomShader.viewProjection.copy(camera.projectionMatrix).multiply(camera.matrixWorldInverse);
                     ToUnityMatrixArray(CustomShader.viewProjection, CustomShader._viewProjectionValues)
                 }
-    
+
                 if (CustomShader.viewMatrix && this.uniforms[this._viewMatrixName]) {
                     CustomShader.viewMatrix.copy(camera.matrixWorldInverse);
                     ToUnityMatrixArray(CustomShader.viewMatrix, CustomShader._viewMatrixValues)
                 }
-    
+
                 if (this.uniforms[CustomShader._worldSpaceCameraPosName]) {
                     CustomShader._worldSpaceCameraPos.setFromMatrixPosition(camera.matrixWorld);
                 }
@@ -475,8 +481,34 @@ export class NEEDLE_techniques_webgl implements GLTFLoaderPlugin {
             }
             if (debug)
                 console.log(material.uuid, uniforms);
+
+
+            createUniformProperties(material);
+
             resolve(material);
         });
     }
 
 }
+
+
+// when animating custom material properties (uniforms) the path resolver tries to access them via material._MyProperty. 
+// That doesnt exist by default for custom properties
+// We could re-write the path in the khr path resolver but that would require it to know beforehand
+// if the material uses as custom shader or not
+// this way all properties of custom shaders are also accessible via material._MyProperty
+function createUniformProperties(material: CustomShader) {
+    if (material.uniforms) {
+        for (const key in material.uniforms) {
+            if (!Object.getOwnPropertyDescriptor(material, key)) {
+                Object.defineProperty(material, key, {
+                    get: () => material.uniforms[key].value,
+                    set: (value) => {
+                        material.uniforms[key].value = value
+                        material.needsUpdate = true;
+                    }
+                });
+            }
+        }
+    }
+}

package/src/engine-components/Collider.ts

@@ -54,9 +54,9 @@ export class SphereCollider extends Collider {
 export class BoxCollider extends Collider {
 
     @serializeable(Vector3)
-    size!: THREE.Vector3;
+    size: THREE.Vector3 = new Vector3(1, 1, 1);
     @serializeable(Vector3)
-    center!: THREE.Vector3;
+    center: THREE.Vector3 = new Vector3(0, 0, 0);
 
     onEnable() {
         super.onEnable();

package/src/engine-components/Component.ts

@@ -10,6 +10,7 @@ import { Object3D } from "three";
 import { InstantiateIdProvider, syncDestroy, syncInstantiate } from "../engine/engine_networking_instantiate";
 import { SourceIdentifier } from "../engine/engine_gltf";
 import { Collision } from "../engine/engine_physics";
+import * as Object3DExtensions from "./js-extensions/Object3D";
 
 export interface UIDProvider {
     seed: number;
@@ -70,18 +71,17 @@ declare class NewGameObjectReferenceInfo {
     clone: THREE.Object3D;
 }
 
-THREE.Object3D.prototype["SetActive"] = function (active: boolean) {
-    this.visible = active;
-}
-
 
 abstract class GameObject extends THREE.Object3D implements THREE.Object3D {
 
     guid: string | undefined;
 
-    public static setActive(go: THREE.Object3D, active: boolean) {
+    public static setActive(go: THREE.Object3D, active: boolean, processStart: boolean = true) {
         if (!go) return;
         go.visible = active;
+        main.updateActiveInHierarchyWithoutEventCall(go);
+        if (active && processStart)
+            main.processStart(Context.Current, go);
     }
 
     public static isActiveSelf(go: THREE.Object3D): boolean {
@@ -214,6 +214,7 @@ abstract class GameObject extends THREE.Object3D implements THREE.Object3D {
         instance.children = [];
         let clone: THREE.Object3D | GameObject;
         clone = instance.clone(false);
+        Object3DExtensions.apply(clone);
         instance.userData = userData;
         instance.children = children;
 
@@ -681,65 +682,6 @@ abstract class GameObject extends THREE.Object3D implements THREE.Object3D {
 }
 
 
-// this is a fix to allow gameObject active animation be applied to a three object
-Object.defineProperty(THREE.Object3D.prototype, "activeSelf", {
-    get: function () {
-        return this.visible;
-    },
-    set: function (val: boolean | number) {
-        const state = typeof val === "number" ? val > 0.5 : val;
-        this.visible = state;
-    }
-});
-
-
-THREE.Object3D.prototype["addNewComponent"] = function <T extends Behaviour>(type: ConstructorConcrete<T>) {
-    return GameObject.addNewComponent(this, type);
-}
-
-THREE.Object3D.prototype["removeComponent"] = function (inst: Component) {
-    return GameObject.removeComponent(inst);
-}
-
-THREE.Object3D.prototype["getOrAddComponent"] = function <T>(typeName: Constructor<T> | null): T {
-    return GameObject.getOrAddComponent(this, typeName);
-}
-
-THREE.Object3D.prototype["getComponent"] = function <T>(type: Constructor<T>) {
-    return GameObject.getComponent(this, type);
-}
-
-THREE.Object3D.prototype["getComponents"] = function <T>(type: Constructor<T>, arr?: []) {
-    return GameObject.getComponents(this, type, arr);
-}
-
-THREE.Object3D.prototype["getComponentInChildren"] = function <T>(type: Constructor<T>) {
-    return GameObject.getComponentInChildren(this, type);
-}
-
-THREE.Object3D.prototype["getComponentsInChildren"] = function <T>(type: Constructor<T>, arr?: []) {
-    return GameObject.getComponentsInChildren(this, type, arr);
-}
-
-THREE.Object3D.prototype["getComponentInParent"] = function <T>(type: Constructor<T>) {
-    return GameObject.getComponentInParent(this, type);
-}
-
-THREE.Object3D.prototype["getComponentsInParent"] = function <T>(type: Constructor<T>, arr?: []) {
-    return GameObject.getComponentsInParent(this, type, arr);
-}
-
-// function patch_THREEObject3D() {
-//     const props = Object.getOwnPropertyNames(GameObject.prototype);
-//     for (const propName in props) {
-//         const prop = props[propName];
-//         if (prop === "constructor") continue;
-//         const fn = GameObject.prototype[prop];
-//         THREE.Object3D.prototype[prop] = fn;
-//     }
-// }
-// patch_THREEObject3D();
-
 
 class Component implements EventTarget {
 
@@ -838,8 +780,13 @@ class Component implements EventTarget {
 
     onCollisionEnter?(col: Collision);
     onCollisionExit?(col: Collision);
+    onCollisionExitRaw?(col: Collision);
     onCollisionStay?(col: Collision);
 
+    onTriggerEnter?(col: Collision);
+    onTriggerStay?(col: Collision);
+    onTriggerExit?(col: Collision);
+
     startCoroutine(routine: Generator, evt: FrameEvent = FrameEvent.Update): Generator {
         return this.context.registerCoroutineUpdate(this, routine, evt);
     }
@@ -900,6 +847,7 @@ class Component implements EventTarget {
         this.__didEnable = false;
         this._collisionExitRoutine = undefined;
         this.onDisable();
+        this._collisions?.clear();
     }
 
     constructor() {
@@ -907,55 +855,115 @@ class Component implements EventTarget {
     }
 
     private _collisionExitRoutine: any;
-    private _collisions: Map<Object3D, { col: Collision, frame: number }> | null = null;
+    private _collisions: Map<Object3D, { col: Collision, frame: number, exitFrame?: number }> | null = null;
+
+    private _triggerExitRoutine: any;
+    private _triggerCollisions: Map<Object3D, { col: Collision, frame: number, exitFrame?: number }> | null = null;
+
+    get collisionsCount() { return this._collisions?.size ?? 0; }
 
     private __internalResetsCachedPhysicsData() {
         this._collisionExitRoutine = null;
         this._collisions = null;
+        this._triggerExitRoutine = null;
+        this._triggerCollisions = null;
     }
 
-    __internalHandleCollision(col: Collision) {
-        if (this.onCollisionEnter || this.onCollisionExit || this.onCollisionStay) {
-            const otherObject = col.gameObject;
-            if (!this._collisions) this._collisions = new Map();
-            if (this._collisions.has(otherObject)) {
-                const cur = this._collisions.get(otherObject)!;
-                cur.frame = this.context.time.frameCount;
-                cur.col = col;
+    __internalHandleCollision(col: Collision, isTriggerCollision: boolean) {
+        if (isTriggerCollision) {
+            if (!this.onTriggerEnter && !this.onTriggerStay && !this.onTriggerExit) return;
+        }
+        else {
+            if (!this.onCollisionEnter && !this.onCollisionStay && !this.onCollisionExit) return;
+        }
+
+        const otherObject = col.gameObject;
+
+        // lazily create the maps
+        if (isTriggerCollision && !this._triggerCollisions) this._triggerCollisions = new Map();
+        else if (!this._collisions) this._collisions = new Map();
+
+        // select the correct map
+        const collection = isTriggerCollision ? this._triggerCollisions! : this._collisions!;
+
+        if (collection.has(otherObject)) {
+            const cur = collection.get(otherObject)!;
+            // console.log("STAY", this.name, this.context.time.frameCount)
+            // cur.exitFrame = undefined;
+            cur.frame = this.context.time.frameCount;
+            cur.col = col;
+            if (isTriggerCollision)
+                this.onTriggerStay?.(col);
+            else
                 this.onCollisionStay?.call(this, col);
-            }
-            else {
-                const entry = { col, frame: this.context.time.frameCount };
-                this._collisions.set(otherObject, entry);
+        }
+        else {
+            // console.log("START", this.name);
+            const entry = { col, frame: this.context.time.frameCount };
+            collection.set(otherObject, entry);
+            if (isTriggerCollision)
+                this.onTriggerEnter?.(col);
+            else
                 this.onCollisionEnter?.call(this, col);
-            }
         }
     }
 
-    sendExitCollisionEvent(obj : Object3D) {
-        if(!this._collisions) return;
-        const col = this._collisions.get(obj);
-        if(!col) return;
-        this.onCollisionExit?.call(this, col.col);
-        this._collisions.delete(obj);
-    }
-
-    private __waitForCollisionExit() {
-        if (this._collisionExitRoutine) return;
-        // const self = this;
-        // function* routine() {
-        //     while (self._collisions && self._collisions.size > 0) {
-        //         for (let ob of self._collisions.keys()) {
-        //             const entry = self._collisions!.get(ob)!;
-        //             if (self.context.time.frameCount - entry.frame > 1) {
-        //                 self._collisions!.delete(ob);
-        //                 self.onCollisionExit?.call(self, entry.col);
-        //             }
-        //         }
-        //         yield;
-        //     }
-        // }
-        // this._collisionExitRoutine = this.startCoroutine(routine(), FrameEvent.EarlyUpdate);
+    __internalHandleExitCollisionEvent(obj: Object3D, isTriggerCollision: boolean) {
+        if (isTriggerCollision) {
+            if (!this._triggerCollisions) return;
+        }
+        else {
+            if (!this._collisions) return;
+        }
+
+        const collection = isTriggerCollision ? this._triggerCollisions! : this._collisions!;
+
+        const collision = collection.get(obj);
+        if (!collision) return;
+        collision.exitFrame = this.context.time.frameCount;
+        // console.log("EXIT col", this.name, this.context.time.frameCount);
+        // if (this.onCollisionExit !== undefined)
+        this.__waitForCollisionExit(isTriggerCollision);
+        if (!isTriggerCollision)
+            this.onCollisionExitRaw?.call(this, collision.col);
+        // this._collisions.delete(obj);
+    }
+
+    private __waitForCollisionExit(isTriggerCollision: boolean) {
+        const routine = isTriggerCollision ? this._triggerExitRoutine : this._collisionExitRoutine;
+        if (routine) return;
+
+        const collection = isTriggerCollision ? this._triggerCollisions! : this._collisions!;
+        const self = this;
+        const frames = 10;
+        function* delayedExitRoutine() {
+            while (collection && collection.size > 0) {
+                for (let other of collection.keys()) {
+                    const entry = collection!.get(other)!;
+                    if (entry.frame !== undefined && self.context.time.frameCount - entry.frame >= frames) {
+                        // console.log("EXIT real", self.name, entry.col.gameObject.name, collection);
+                        collection!.delete(other);
+                        if (isTriggerCollision)
+                            self.onTriggerExit?.(entry.col);
+                        else
+                            self.onCollisionExit?.call(self, entry.col);
+                    }
+                }
+                for (let i = 0; i < frames; i++)
+                    yield;
+            }
+            if (isTriggerCollision)
+                self._triggerExitRoutine = undefined;
+            else
+                self._collisionExitRoutine = null;
+            // console.log("DONE", self.name);
+        }
+
+        const newRoutine = this.startCoroutine(delayedExitRoutine(), FrameEvent.OnAfterRender);
+        if (isTriggerCollision)
+            this._triggerExitRoutine = newRoutine;
+        else
+            this._collisionExitRoutine = newRoutine
     }
 
 
@@ -1046,7 +1054,7 @@ class Component implements EventTarget {
     private static _forward: THREE.Vector3 = new THREE.Vector3(0, 0, 1);
     public get forward(): THREE.Vector3 {
 
-        return Component._forward.set(0, 0, 1).applyQuaternion(this.worldQuaternion);
+        return Component._forward.set(0, 0, -1).applyQuaternion(this.worldQuaternion);
     }
 
 

package/src/engine-components/RigidBody.ts

@@ -5,6 +5,7 @@ import * as THREE from 'three'
 import { getWorldPosition } from "../engine/engine_three_utils";
 import { serializeable } from "../engine/engine_serialization_decorator";
 import { Watch } from "../engine/engine_utils";
+import { Vector3 } from "three";
 
 export class Rigidbody extends Behaviour {
 
@@ -51,7 +52,7 @@ export class Rigidbody extends Behaviour {
     private _dirty: boolean = false;
 
     private _positionWatch?: Watch;
-    // private _matrixWatch?: Watch;
+    private _matrixWatch?: Watch;
     private _setMatrix: THREE.Matrix4;
 
     constructor() {
@@ -64,11 +65,13 @@ export class Rigidbody extends Behaviour {
         this.currentVelocity = new THREE.Vector3();
         this._smoothedVelocity = new THREE.Vector3();
         this.lastWorldPosition = getWorldPosition(this.gameObject).clone();
+        this._matrixWatch = undefined;
+        this._positionWatch = undefined;
     }
 
-    start() {
-        this.setBodyFromGameObject();
-    }
+    // start() {
+    //     this.setBodyFromGameObject();
+    // }
 
     onEnable() {
         if (this._body) {
@@ -88,22 +91,13 @@ export class Rigidbody extends Behaviour {
         this._positionWatch.subscribeWrite(_ => {
             if (!this.context.physics.isUpdating && !this._ignoreChange) {
                 this._dirty = true;
+                this._setMatrix.copy(this.gameObject.matrix);
                 this._setMatrix.setPosition(this.gameObject.position);
             }
         })
-
-        // this._matrixWatch = onChange(this.gameObject.matrix, "elements", (newValue, oldValue) => {
-        //     if (newValue !== oldValue) {
-        //         if (!this.context.physics.isUpdating && !this._ignoreChange) {
-        //             this.dirty = true;
-        //             this._setMatrix.copy(this.gameObject.matrix);
-        //         }
-        //     }
-        // });
     }
 
     onDisable(): void {
-        // this._matrixWatch?.u();
         if (this._body)
             this.context.physics.removeBody(this.gameObject, this._body, false);
     }
@@ -113,27 +107,23 @@ export class Rigidbody extends Behaviour {
             this.context.physics.removeBody(this.gameObject, this._body);
     }
 
-    earlyUpdate() {
+    onBeforeRender() {
+        this._ignoreChange = true;
+        this.updateVelocity();
+
         if (this._dirty) {
-            this._ignoreChange = true;
             this._dirty = false;
-            //     // console.log("RESET");
             this._setMatrix.decompose(this.gameObject.position, this.gameObject.quaternion, this.gameObject.scale);
             this.setBodyFromGameObject();
-            this._ignoreChange = false;
         }
-    }
-    onBeforeRender() {
-        this._ignoreChange = true;
-        this.updateVelocity();
-        // this._ignoreChange = true;
-        // this._setMatrix.decompose(this.gameObject.position, this.gameObject.quaternion, this.gameObject.scale);
-        // this.setBodyFromGameObject();
+
         this._ignoreChange = false;
     }
 
     initialize() {
-        if (this._body) return;
+        if (this._body) {
+            return;
+        }
         const options = new BodyOptions();
         options.drag = this.drag;
         options.angularDrag = this.angularDrag;
@@ -149,8 +139,14 @@ export class Rigidbody extends Behaviour {
         this.body?.wakeUp();
     }
 
-    public applyForce(vec: THREE.Vector3, rel: THREE.Vector3 | undefined) {
-        this.body?.applyForce(new CANNON.Vec3(vec.x, vec.y, vec.z), rel ? new CANNON.Vec3(rel.x, rel.y, rel.z) : undefined);
+    public applyForce(vec: THREE.Vector3, rel?: THREE.Vector3) {
+        const force = new CANNON.Vec3(vec.x, vec.y, vec.z);
+        force.scale(1 / this.context.time.deltaTime, force);
+        this.body?.applyForce(force, rel ? new CANNON.Vec3(rel.x, rel.y, rel.z) : undefined);
+    }
+
+    public setForce(x: number, y: number, z: number) {
+        this.body?.force.set(x, y, z);
     }
 
     public getVelocity(): THREE.Vector3 {
@@ -159,13 +155,39 @@ export class Rigidbody extends Behaviour {
         return Rigidbody.tempPosition.set(0, 0, 0);
     }
 
-    public setVelocity(x: number, y: number, z: number) {
+    public setVelocity(x: number | Vector3, y: number, z: number) {
         if (!this.body) return;
+        if (x instanceof Vector3) {
+            const vec = x;
+            x = vec.x;
+            y = vec.y;
+            z = vec.z;
+        }
         this.body.velocity.x = x / this.context.time.deltaTime;
         this.body.velocity.y = y / this.context.time.deltaTime;
         this.body.velocity.z = z / this.context.time.deltaTime;
     }
 
+    public getTorque(): THREE.Vector3 {
+        if (this.body)
+            return Rigidbody.tempPosition.set(this.body?.torque.x, this.body?.torque.y, this.body?.torque.z);
+        return Rigidbody.tempPosition.set(0, 0, 0);
+    }
+
+    public setTorque(x: number | Vector3, y: number, z: number) {
+        if (!this.body) return;
+        if (x instanceof Vector3) {
+            const vec = x;
+            x = vec.x;
+            y = vec.y;
+            z = vec.z;
+        }
+        this.body.torque.x = x / this.context.time.deltaTime;
+        this.body.torque.y = y / this.context.time.deltaTime;
+        this.body.torque.z = z / this.context.time.deltaTime;
+
+    }
+
     public get smoothedVelocity() { return this._smoothedVelocity; }
 
     public setAngularVelocity(x: number, y: number, z: number) {