@needle-tools/engine 2.35.2-pre → 2.35.4-pre

package/src/engine/extensions/NEEDLE_deferred_texture.ts

@@ -7,7 +7,7 @@ import { getParam, getPath } from "../engine_utils";
 
 export const EXTENSION_NAME = "NEEDLE_deferred_texture";
 
-const debug = getParam("debugdeferredtextures")
+const debug = getParam("debugprogressive");
 
 declare type DeferredTextureModel = {
     uri: string;
@@ -15,9 +15,30 @@ declare type DeferredTextureModel = {
     usage?: string,
 }
 
+const debug_toggle_maps: Map<Material, { [key: string]: { original: Texture, lod0: Texture } }> = new Map();
+let show_lod0 = false;
+if (debug) {
+    window.addEventListener("keyup", evt => {
+        if (evt.key === "p") {
+            debug_toggle_maps.forEach((map, material) => {
+                Object.entries(map).forEach(([key, value]) => {
+                    if (show_lod0) {
+                        material[key] = value.lod0;
+                    } else {
+                        material[key] = value.original;
+                    }
+                    material.needsUpdate = true;
+                });
+            });
+            show_lod0 = !show_lod0;
+        }
+    });
+}
+
 export class NEEDLE_deferred_texture implements GLTFLoaderPlugin {
 
-    static assignTextureLOD(context: Context, source : SourceIdentifier | undefined, material: Material, level: number = 0) {
+
+    static assignTextureLOD(context: Context, source: SourceIdentifier | undefined, material: Material, level: number = 0) {
         if (!material) return;
         for (const slot of Object.keys(material)) {
             const val = material[slot];
@@ -32,6 +53,18 @@ export class NEEDLE_deferred_texture implements GLTFLoaderPlugin {
                         material[slot] = t;
                         material.needsUpdate = true;
 
+                        if (debug) {
+                            let debug_map = debug_toggle_maps.get(material);
+                            if (!debug_map) {
+                                debug_map = {};
+                                debug_toggle_maps.set(material, debug_map);
+                            }
+                            let entry = debug_map[slot];
+                            if (!entry) {
+                                entry = debug_map[slot] = { original: val, lod0: t };
+                            }
+                            entry.lod0 = t;
+                        }
                     }
                 });
             }
@@ -93,7 +126,7 @@ export class NEEDLE_deferred_texture implements GLTFLoaderPlugin {
     private static cache = new Map<string, DeferredTextureModel>();
     private static resolved: { [key: string]: Texture } = {};
 
-    private static async getOrLoadTexture(context: Context, source : SourceIdentifier | undefined, material: Material, slot: string, current: Texture, _level: number): Promise<Texture | null> {
+    private static async getOrLoadTexture(context: Context, source: SourceIdentifier | undefined, material: Material, slot: string, current: Texture, _level: number): Promise<Texture | null> {
 
         const key = current.uuid;
         const ext: DeferredTextureModel | undefined = NEEDLE_deferred_texture.cache.get(key);// || current.userData.deferred;

package/src/engine-components/Component.ts

@@ -113,6 +113,7 @@ abstract class GameObject extends THREE.Object3D implements THREE.Object3D, IGam
 
     public static invoke(go: THREE.Object3D | null | undefined, functionName: string, children: boolean = false, ...args: any) {
         if (!go) return;
+
         // console.log(go);
         this.foreachComponent(go, c => {
             const fn = c[functionName];
@@ -382,6 +383,8 @@ class Component implements IComponent, EventTarget {
         // console.trace("INTERNAL ENABLE");
         this.__didEnable = true;
         this.onEnable();
+        // if we do this after processing the callback
+        this.__isEnabled = true;
         return true;
     }
 
@@ -391,6 +394,8 @@ class Component implements IComponent, EventTarget {
         this._collisionExitRoutine = undefined;
         this.onDisable();
         this._collisions?.clear();
+        // if we do this after processing the callback
+        this.__isEnabled = false;
     }
 
     __internalDestroy() {
@@ -415,7 +420,10 @@ class Component implements IComponent, EventTarget {
         }
 
         // need to check here because codegen is calling this before everything is setup
-        if (!this.__didAwake) return;
+        if (!this.__didAwake) {
+            this.__isEnabled = val;
+            return;
+        }
         if (val) {
             this.__internalEnable();
         } else {

package/src/engine-components/DragControls.ts

@@ -13,6 +13,7 @@ import { getWorldPosition, getWorldQuaternion, setWorldPosition } from "../engin
 import { KeyCode } from "../engine/engine_input";
 import { nameofFactory } from "../engine/engine_utils";
 import { InstancingUtil } from "../engine/engine_instancing";
+import { OrbitControls } from "./OrbitControls";
 
 const debug = false;
 
@@ -43,7 +44,7 @@ export class DragControls extends Interactable implements IPointerDownHandler, I
     // public targets: THREE.Object3D[] | null = null;
 
     // private controls: Control | null = null;
-    // private orbit: OrbitControls | null = null;
+    private orbit: OrbitControls | null = null;
 
     private selectStartEventListener: ((controls: DragControls, args: SelectArgs) => void)[] = [];
     private selectEndEventListener: Array<Function> = [];
@@ -70,7 +71,7 @@ export class DragControls extends Interactable implements IPointerDownHandler, I
 
 
     start() {
-        // this.orbit = GameObject.findObjectOfType(OrbitControls, this.context);
+        this.orbit = GameObject.findObjectOfType(OrbitControls, this.context);
     }
 
     private static lastHovered: THREE.Object3D;
@@ -148,8 +149,11 @@ export class DragControls extends Interactable implements IPointerDownHandler, I
             this.onUpdateDrag();
         }
 
-        if (this._isDragging && !this._dragHelper?.hasSelected) {
-            this.onDragEnd(null);
+
+        if (this._isDragging) {
+            if (this._dragHelper?.hasSelected === false) {
+                this.onDragEnd(null);
+            }
         }
     }
 
@@ -197,7 +201,7 @@ export class DragControls extends Interactable implements IPointerDownHandler, I
         object = args.attached;
         this._isDragging = true;
         this._dragHelper.setSelected(object, this.context);
-        // if (this.orbit) this.orbit.enabled = false;
+        if (this.orbit) this.orbit.enabled = false;
 
         const sync = GameObject.getComponentInChildren(object, SyncedTransform);
         if (debug)
@@ -239,7 +243,7 @@ export class DragControls extends Interactable implements IPointerDownHandler, I
         if (debug)
             console.log("DRAG END", selected, selected?.visible)
         this._dragHelper.setSelected(null, this.context);
-        // if (this.orbit) this.orbit.enabled = true;
+        if (this.orbit) this.orbit.enabled = true;
         if (evt?.object) {
             const sync = GameObject.getComponentInChildren(evt.object, SyncedTransform);
             if (sync) {
@@ -316,7 +320,6 @@ class DragHelper {
     }
 
     setSelected(newSelected: THREE.Object3D | null, context: Context) {
-
         if (this._selected && context) {
             for (const rb of this._rbs) {
                 rb.wakeUp();
@@ -343,7 +346,6 @@ class DragHelper {
             this._groundMarker.removeFromParent();
         }
 
-
         if (this._selected) {
             if (!context) {
                 console.error("DragHelper: no context");

package/src/engine-components/Renderer.ts

@@ -17,8 +17,8 @@ export { InstancingUtil } from "../engine/engine_instancing";
 const suppressInstancing = getParam("noInstancing");
 const debugLightmap = getParam("debuglightmaps") ? true : false;
 const debugInstancing = getParam("debuginstancing");
-const debugProgressiveLoading = getParam("debugprogressiveload");
-const suppressProgressiveLoading = getParam("noprogressiveload");
+const debugProgressiveLoading = getParam("debugprogressive");
+const suppressProgressiveLoading = getParam("noprogressive");
 
 export class FieldWithDefault {
     public path: string | null = null;
@@ -133,7 +133,7 @@ export class Renderer extends Behaviour implements IRenderer {
     // private _materialProperties: Array<MaterialProperties> | undefined = undefined;
     private _lightmaps?: RendererLightmap[];
 
-    get mesh(): Mesh | undefined {
+    get sharedMesh(): Mesh | undefined {
         if (this.gameObject.type === "Mesh") {
             return this.gameObject as unknown as Mesh
         }
@@ -143,10 +143,20 @@ export class Renderer extends Behaviour implements IRenderer {
         return undefined;
     }
 
+    get sharedMaterial(): THREE.Material {
+        return this.sharedMaterials[0];
+    }
+
+    set sharedMaterial(mat: THREE.Material) {
+        this.sharedMaterials[0] = mat;
+    }
+
+    /**@deprecated please use sharedMaterial */
     get material(): THREE.Material {
         return this.sharedMaterials[0];
     }
 
+    /**@deprecated please use sharedMaterial */
     set material(mat: THREE.Material) {
         this.sharedMaterials[0] = mat;
     }

package/src/engine-components/ScreenCapture.ts

@@ -31,6 +31,12 @@ function disposeStream(str: MediaStream | null | undefined) {
         cap.stop();
 }
 
+declare type ScreenCaptureOptions = {
+    device?: ScreenCaptureDevice,
+    deviceId?: string,
+    constraints?: MediaTrackConstraints,
+}
+
 export class ScreenCapture extends Behaviour implements IPointerClickHandler {
 
     onPointerClick() {
@@ -82,7 +88,8 @@ export class ScreenCapture extends Behaviour implements IPointerClickHandler {
     private _currentMode: ScreenCaptureMode = ScreenCaptureMode.Idle;
 
     awake() {
-        console.log(this);
+        if (debug)
+            console.log(this);
         AudioSource.registerWaitForAllowAudio(() => {
             if (this.videoPlayer && this._currentStream && this._currentMode === ScreenCaptureMode.Receiving) {
                 this.videoPlayer.setVideo(this._currentStream);
@@ -105,12 +112,16 @@ export class ScreenCapture extends Behaviour implements IPointerClickHandler {
         this._net.addEventListener(PeerEvent.ReceiveVideo, this.onReceiveVideo.bind(this));
     }
 
-    async share() {
+    async share(opts?: ScreenCaptureOptions) {
+
+        if (opts?.device)
+            this.device = opts.device;
+
         this._requestOpen = true;
         try {
             if (this.videoPlayer) {
 
-                const settings: MediaTrackConstraints = {
+                const settings: MediaTrackConstraints = opts?.constraints ?? {
                     echoCancellation: true,
                     autoGainControl: false,
                 };
@@ -122,7 +133,7 @@ export class ScreenCapture extends Behaviour implements IPointerClickHandler {
                 switch (this.device) {
                     // Capture a connected camera
                     case ScreenCaptureDevice.Camera:
-                        this.tryShareUserCamera(displayMediaOptions);
+                        this.tryShareUserCamera(displayMediaOptions, opts);
                         break;
 
                     // capture any screen, will show a popup
@@ -197,7 +208,7 @@ export class ScreenCapture extends Behaviour implements IPointerClickHandler {
 
 
 
-    private async tryShareUserCamera(opts: DisplayMediaStreamConstraints) {
+    private async tryShareUserCamera(opts: DisplayMediaStreamConstraints, options?: ScreenCaptureOptions) {
 
         // let newWindow = open('', 'example', 'width=300,height=300');
         // if (window) {
@@ -212,6 +223,10 @@ export class ScreenCapture extends Behaviour implements IPointerClickHandler {
                 if (!this._requestOpen) break;
                 if (dev.kind !== "videoinput") continue;
                 const id = dev.deviceId;
+                if (options?.deviceId !== undefined) {
+                    if (id !== options.deviceId)
+                        continue;
+                }
                 if (opts.video !== false) {
                     if (typeof opts.video === "undefined" || typeof opts.video === "boolean") {
                         opts.video = {};

package/src/engine-components/WebXR.ts

@@ -13,11 +13,11 @@ import { ControllerType, WebXRController } from "./WebXRController";
 import { WebARSessionRoot } from "./WebARSessionRoot";
 import { getWorldPosition, getWorldQuaternion, setWorldPosition, setWorldQuaternion } from "../engine/engine_three_utils";
 import { XRRig } from "./WebXRRig";
-import { EngineElement } from "../engine/engine_element";
 import { AssetReference } from "../engine/engine_addressables";
 import { serializeable } from "../engine/engine_serialization_decorator";
 import { WebXRSync } from "./WebXRSync";
 import { XRSessionMode } from "../engine/engine_setup";
+import { INeedleEngineComponent } from "../engine/engine_types";
 
 
 export async function detectARSupport() {
@@ -210,7 +210,7 @@ export class WebXR extends Behaviour {
         }
 
         // VR support
-        if (this.createVRButton && this.enableVR && (browserSupportsXR || !this.enableAR)) {
+        if (this.createVRButton && this.enableVR) {
             vrButton = WebXR.createVRButton(this);
             this._vrButton = vrButton;
             buttonsContainer.appendChild(vrButton);
@@ -477,16 +477,17 @@ export class WebAR {
         this._webxr = webxr;
     }
 
-    private arDomOverlay: EngineElement | null = null;
-    private arOverlayElement: HTMLElement | null = null;
+    private arDomOverlay: HTMLElement | null = null;
+    private arOverlayElement: INeedleEngineComponent | HTMLElement | null = null;
     private noHitTestAvailable: boolean = false;
     private didPlaceARSessionRoot: boolean = false;
 
     getAROverlayContainer(): HTMLElement | null {
-        this.arDomOverlay = this.webxr.context.domElement as EngineElement;
+        this.arDomOverlay = this.webxr.context.domElement as HTMLElement;
         // for react cases we dont have an Engine Element
-        if (this.arDomOverlay.getAROverlayContainer)
-            this.arOverlayElement = this.arDomOverlay.getAROverlayContainer();
+        const element : any = this.arDomOverlay;
+        if (element.getAROverlayContainer)
+            this.arOverlayElement = element.getAROverlayContainer();
         else this.arOverlayElement = this.arDomOverlay;
         return this.arOverlayElement;
     }
@@ -548,13 +549,14 @@ export class WebAR {
         else console.warn("No WebARSessionRoot found in scene")
 
         if (this.arDomOverlay && this.arOverlayElement) {
-            this.arDomOverlay.onEnterAR(session, this.arOverlayElement);
+            const el = this.arOverlayElement as INeedleEngineComponent;
+            el.onEnterAR?.call(el, session, this.arOverlayElement);
         }
 
         this.context.mainCameraComponent?.applyClearFlagsIfIsActiveCamera();
     }
 
-    onEnd(_session: THREE.XRSession) {
+    onEnd(session: THREE.XRSession) {
         if (this._previousParent) {
             console.log("ADD", this._previousParent);
             GameObject.addComponent(this._previousParent as GameObject, this.webxr);
@@ -565,9 +567,13 @@ export class WebAR {
         context.scene.background = this.previousBackground;
         context.scene.environment = this.previousEnvironment;
         if (this.sessionRoot) {
-            this.sessionRoot.onEnd(this.webxr.Rig, _session);
+            this.sessionRoot.onEnd(this.webxr.Rig, session);
+        }
+        if (this.arDomOverlay) 
+        {
+            const el = this.arOverlayElement as INeedleEngineComponent;
+            el.onExitAR?.call(el, session);
         }
-        if (this.arDomOverlay) this.arDomOverlay.onExitAR(_session);
 
         this.context.mainCameraComponent?.applyClearFlagsIfIsActiveCamera();
     }

package/src/engine-components/js-extensions/ExtensionUtils.ts

@@ -1,19 +1,32 @@
+import { Object3D } from "three";
+import { Constructor } from "../../engine/engine_types";
 
-const handlers : Map<any, ApplyPrototypeExtension> = new Map();
+const handlers: Map<any, ApplyPrototypeExtension> = new Map();
 
-export function applyPrototypeExtensions(obj : any){
-    if(!obj) return;
-    const prototype = obj.prototype;
-    if(!prototype) return;
+export function applyPrototypeExtensions<T>(obj: any, prototype : Constructor<T>) {
+    if (!obj) return;
+    // const prototype = Object.getPrototypeOf(obj);
+    // console.log("TEST", prototype)
+    if (!prototype) {
+        console.warn("No prototype found", obj, obj.prototype, obj.constructor);
+        return;
+    }
     let handler = handlers.get(prototype);
-    if(!handler){
-        handler = createPrototypeExtensionHandler(prototype);
-        handlers.set(prototype, handler);
+    if (handler) {
+        // console.log("OK", prototype);
+        handler.apply(obj);
     }
-    handler.apply(obj);
+    // applyPrototypeExtensions(prototype);
+}
+
+export function registerPrototypeExtensions<T>(type: Constructor<T>) {
+    console.log("Register", type.prototype.constructor.name);
+    const handler = createPrototypeExtensionHandler(type.prototype);
+    handlers.set(type, handler);
 }
 
-function createPrototypeExtensionHandler(prototype: any) { 
+
+function createPrototypeExtensionHandler(prototype: any) {
     return new ApplyPrototypeExtension(prototype);
 }
 
@@ -31,9 +44,11 @@ class ApplyPrototypeExtension implements IApplyPrototypeExtension {
         this.$symbol = Symbol("prototype-extension");
         // used to decorate cloned object3D objects with the same added components defined above
         this.extensions = Object.keys(prototype);
+        // console.log(this.extensions);
         this.descriptors = new Array<PropertyDescriptor | undefined>();
         for (let i = 0; i < this.extensions.length; i++) {
             const key = this.extensions[i];
+            // console.log(key);
             const descriptor = Object.getOwnPropertyDescriptor(prototype, key);
             if (descriptor) {
                 this.descriptors.push(descriptor);
@@ -41,7 +56,7 @@ class ApplyPrototypeExtension implements IApplyPrototypeExtension {
         }
     }
 
-    apply(object: object): void {
+    apply(object: Object3D): void {
 
         if (object[this.$symbol]) return;
         object[this.$symbol] = true;
@@ -58,7 +73,7 @@ class ApplyPrototypeExtension implements IApplyPrototypeExtension {
                 //         continue;
                 //     }
                 // }
-                // console.trace("DEFINE", object.name, key);
+                // console.warn("DEFINE", object, key);
                 Object.defineProperty(object, key, desc);
             }
         }

package/src/engine-components/js-extensions/Object3D.ts

@@ -1,4 +1,4 @@
-import { applyPrototypeExtensions } from "./ExtensionUtils";
+import { applyPrototypeExtensions, registerPrototypeExtensions } from "./ExtensionUtils";
 import { Object3D } from "three";
 import { Constructor, ConstructorConcrete, IComponent } from "../../engine/engine_types"
 import { IComponent as Component } from "../../engine/engine_types";
@@ -6,24 +6,12 @@ import { addNewComponentInstance, getComponent, getComponentInChildren, getCompo
 
 // used to decorate cloned object3D objects with the same added components defined above
 export function apply(object: Object3D) {
-    if (object && object.isObject3D === true)
-        applyPrototypeExtensions(object);
+    if (object && object.isObject3D === true) {
+        applyPrototypeExtensions(object, Object3D);
+    }
 }
 
 
-// this is a fix to allow gameObject active animation be applied to a three object
-if (!Object.getOwnPropertyDescriptor(Object3D.prototype, "activeSelf")) {
-    Object.defineProperty(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;
-        }
-    });
-}
-
 
 // do we still need this?
 Object3D.prototype["SetActive"] = function (active: boolean) {
@@ -65,3 +53,22 @@ Object3D.prototype["getComponentInParent"] = function <T extends IComponent>(typ
 Object3D.prototype["getComponentsInParent"] = function <T>(type: Constructor<T>, arr?: []) {
     return getComponentsInParent(this, type, arr);
 }
+
+// this is a fix to allow gameObject active animation be applied to a three object
+if (!Object.getOwnPropertyDescriptor(Object3D.prototype, "activeSelf")) {
+    Object.defineProperty(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;
+        }
+    });
+}
+
+
+
+
+// do this after adding the component extensions
+registerPrototypeExtensions(Object3D);

package/src/engine-components/js-extensions/Vector.ts

@@ -1,17 +1,19 @@
-import { applyPrototypeExtensions } from "./ExtensionUtils";
+import { applyPrototypeExtensions, registerPrototypeExtensions } from "./ExtensionUtils";
 import { Mathf } from "../../engine/engine_math";
 import { Vector3 } from "three";
 
 export function apply(object: Vector3) {
     if (object && object.isVector3 === true) {
-        console.log(object);
-        applyPrototypeExtensions(object);
+        applyPrototypeExtensions(object, Vector3);
     }
 }
 
+
 Vector3.prototype["slerp"] = function (end: Vector3, t: number) {
     const len1 = this.length();
     const len2 = end.length();
     const targetLen = Mathf.lerp(len1, len2, t);
     return this.lerp(end, t).normalize().multiplyScalar(targetLen);
-}
+}
+
+registerPrototypeExtensions(Vector3);