Needle Engine 3.32.17-alpha

Files changed (8) hide show

plugins/vite/index.js +2 -0
src/engine-components/Component.ts +1 -1
src/engine/engine_gameobject.ts +33 -29
src/engine/xr/NeedleXRController.ts +7 -7
src/engine-components/export/usdz/USDZExporter.ts +8 -4
src/engine-components/export/usdz/extensions/USDZUI.ts +6 -3
src/engine-components/webxr/WebARSessionRoot.ts +9 -205
src/engine-components/webxr/WebXRButtons.ts +38 -26

plugins/vite/index.js CHANGED Viewed

@@ -57,6 +57,8 @@
  */
 export const needlePlugins = async (command, config, userSettings) => {
+    if(!config) config = {}
     // ensure we have user settings initialized with defaults
     userSettings = { ...defaultUserSettings, ...userSettings }
     const array = [

src/engine-components/Component.ts CHANGED Viewed

@@ -453,7 +453,7 @@
     /** Optional callback, you can implement this to only get callbacks for VR or AR sessions if necessary.
-     * @returns true if the mode is supported (if false the mode is not supported by this ciomponent and it will not receive XR callbacks for this mode)
+     * @returns true if the mode is supported (if false the mode is not supported by this component and it will not receive XR callbacks for this mode)
     */
     supportsXR?(mode: XRSessionMode): boolean;
     /** Called before the XR session is requested. Use this callback if you want to modify the session init features */

src/engine/engine_gameobject.ts CHANGED Viewed

@@ -150,70 +150,74 @@
     instance[$isDontDestroy] = value;
 }
+const destroyed_components: Array<IComponent> = [];
+const destroyed_objects: Array<Object3D> = [];
 export function destroy(instance: Object3D | Component, recursive: boolean = true, dispose: boolean = false) {
-    const allComponents: IComponent[] = [];
-    internalDestroy(instance, recursive, dispose, true, allComponents);
-    for (const comp of allComponents) {
+    destroyed_components.length = 0;
+    destroyed_objects.length = 0;
+    internalDestroy(instance, recursive, dispose, true);
+    for (const comp of destroyed_components) {
         comp.gameObject = null!;
         //@ts-ignore
         comp.context = null;
     }
+    // dipose resources and remove references
+    for (const obj of destroyed_objects) {
+        setDestroyed(obj, true);
+        if (dispose) {
+            disposeObjectResources(obj);
+        }
+        // This needs to be called after disposing because it removes the references to resources
+        __internalRemoveReferences(obj);
+    }
+    destroyed_objects.length = 0;
+    destroyed_components.length = 0;
 }
-function internalDestroy(instance: Object3D | Component, recursive: boolean = true, dispose: boolean = false, isRoot: boolean = true, allComponents: IComponent[]) {
+function internalDestroy(instance: Object3D | Component, recursive: boolean = true, dispose: boolean = false, isRoot: boolean = true) {
     if (instance === null || instance === undefined)
         return;
     const comp = instance as Component;
     if (comp.isComponent) {
+        // Handle Component
         if (comp[$isDontDestroy]) return;
-        allComponents.push(comp);
+        destroyed_components.push(comp);
         const go = comp.gameObject;
         comp.__internalDisable();
         comp.__internalDestroy();
         comp.gameObject = go;
         return;
     }
+    // handle Object3D
     if (instance[$isDontDestroy]) return;
     const obj = instance as GameObject;
-    setDestroyed(obj, true);
-    if (dispose) {
-        disposeObjectResources(obj);
-    }
-    // This needs to be called after disposing because it removes the references to resources
-    __internalRemoveReferences(obj);
     if (debug) console.log(obj);
+    destroyed_objects.push(obj);
-    if (recursive && obj.children) {
-        for (const ch of obj.children) {
-            internalDestroy(ch, recursive, dispose, false, allComponents);
-        }
-    }
+    // first disable and call onDestroy on components
     const components = obj.userData.components;
     if (components) {
         let lastLength = components.length;
         for (let i = 0; i < components.length; i++) {
             const comp: Component = components[i];
-            allComponents.push(comp);
-            const go = comp.gameObject;
-            comp.__internalDisable();
-            comp.__internalDestroy();
-            comp.gameObject = go;
-            // if (comp.destroy) {
-            //     if (debug) console.log("destroying", comp);
-            //     comp.destroy();
-            // }
-            // components will  be removed from componentlist in destroy
+            internalDestroy(comp, recursive, dispose, false);
+            // components will be removed from componentlist in destroy
             if (components.length < lastLength) {
                 lastLength = components.length;
                 i--;
             }
         }
     }
+    // then continue in children of the passed in object
+    if (recursive && obj.children) {
+        for (const ch of obj.children) {
+            internalDestroy(ch, recursive, dispose, false);
+        }
+    }
     if (isRoot)
         obj.removeFromParent();
 }

src/engine/xr/NeedleXRController.ts CHANGED Viewed

@@ -84,11 +84,12 @@
     */
     emitEvents = true;
-    // EXPOSE API
-    /**
-     * Is the controller still connected?
-     */
-    get connected() { return this.inputSource.gamepad?.connected ?? false; }
+    /** Is the controller still connected?  */
+    get connected() {
+        return this._connected;
+    }
+    private _connected: boolean = true;
     get isTracking() { return this._isTracking; }
     private _isTracking: boolean = false;
     /** the input source gamepad giving raw access to the gamepad values
@@ -379,6 +380,7 @@
     /** Called when the input source disconnects */
     onDisconnected() {
+        this._connected = false;
         if (debug) console.warn("Controller disconnected", this.index);
         // move all attached objects into the scene
         for (const child of this._object.children) {
@@ -606,8 +608,6 @@
     // we should probably do both but then we need to ignore the primary index in the following function (to not raise an event for the same button twice)
     // and start with index = 1
     private updateInputEvents() {
-        if (!this._layout) return;
         // https://immersive-web.github.io/webxr-gamepads-module/#xr-standard-heading
         if (this.gamepad?.buttons) {
             for (let k = 0; k < this.gamepad.buttons.length; k++) {

src/engine-components/export/usdz/USDZExporter.ts CHANGED Viewed

@@ -383,8 +383,7 @@
         return obj;
     }
+    private static invertForwardMatrix = new Matrix4().makeRotationY(Math.PI);
     private applyWebARSessionRoot() {
         if (!this.objectToExport) return;
@@ -408,9 +407,14 @@
         const scale = 1 / sessionRoot!.arScale;
         if (debug) console.log("AR Session Root scale", scale, target);
         target.matrix.makeScale(scale, scale, scale);
-        if (sessionRoot.invertForward == false) {
-            target.matrix.multiply(new Matrix4().makeRotationY(Math.PI));
+        if (sessionRoot.invertForward) {
+            target.matrix.multiply(USDZExporter.invertForwardMatrix);
         }
+        // TODO we should refactor this and use one common method in WebARSessionRoot to place an object –
+        // basically the inverted effect of WebARSessionRoot.onApplyPose()
+        // TODO why are we not reverting this transformation after the export?
     }

src/engine-components/export/usdz/extensions/USDZUI.ts CHANGED Viewed

@@ -53,7 +53,7 @@
                         childModel.matrix.copy(child.matrix);
                         const childParent = child.parent;
-                        const isText = childParent && typeof childParent["textContent"] === "string" && childParent["textContent"].length;
+                        const isText = !!childParent && typeof childParent["textContent"] === "string" && childParent["textContent"].length > 0;
                         let hierarchyOpacity = opacityMap.get(childParent!) || 1;
                         // TODO CanvasGroup doesn't render something but modifies opacity
@@ -65,8 +65,11 @@
                         if (child instanceof Mesh && isText) {
                             // get shadoDomOwner so we can export Text from the text extension directly
-                            const shadowDomOwner = child[$shadowDomOwner].gameObject;
-                            textExt.exportText(shadowDomOwner, childModel, _context);
+                            const shadowDomOwner = child[$shadowDomOwner];
+                            if (!shadowDomOwner)
+                                console.error("Error when exporting UI: shadow component owner not found. This is likely a bug.", child);
+                            else
+                                textExt.exportText(shadowDomOwner.gameObject, childModel, _context);
                         }
                         if (child instanceof Mesh && !isText)

src/engine-components/webxr/WebARSessionRoot.ts CHANGED Viewed

@@ -270,13 +270,16 @@
     private onPlaceScene = (evt: NEPointerEvent) => {
         if (this._isPlacing == false) return;
-        let reticle = this._reticle[0];
+        let reticle: IGameObject | undefined = this._reticle[0];
         let hit = this._hits[0];
         if (evt.origin instanceof NeedleXRController) {
             // until we can use hit testing for both controllers and have multple reticles we only allow placement with the first controller
-            reticle = this._reticle[evt.origin.index];
-            hit = this._hits[evt.origin.index];
+            const controllerReticle = this._reticle[evt.origin.index];
+            if (controllerReticle) {
+                reticle = controllerReticle;
+                hit = this._hits[evt.origin.index];
+            }
         }
         if (!reticle) {
@@ -315,6 +318,7 @@
     private onRevertSceneChanges() {
         for (const ret of this._reticle) {
+            if (!ret) continue;
             ret.visible = false;
             ret?.removeFromParent();
         }
@@ -368,8 +372,7 @@
             reticle.attach(rigObject);
             reticle.removeFromParent();
-            // move rig now relative tot he reticle
+            // move rig now relative to the reticle
             // apply scale
             rigObject.scale.set(this.arScale, this.arScale, this.arScale);
             rigObject.position.multiplyScalar(this.arScale);
@@ -377,7 +380,7 @@
             rigObject.updateMatrix();
             // if invert forward is disabled we need to invert the forward rotation
             // we want to look into positive Z direction (if invertForward is enabled we look into negative Z direction)
-            if (this.invertForward == false)
+            if (this.invertForward)
                 rigObject.matrix.premultiply(invertForwardMatrix);
             rigObject.matrix.premultiply(this._startOffset);
@@ -386,205 +389,6 @@
             previousParent.add(rigObject);
         }
     }
-    /*
-    webAR: WebAR | null = null;
-    get rig(): Object3D | undefined {
-        return this.webAR?.webxr.Rig;
-    }
-    private readonly _initalMatrix = new Matrix4();
-    private readonly _selectStartFn = this.onSelectStart.bind(this);
-    private readonly _selectEndFn = this.onSelectEnd.bind(this);
-    start() {
-        const xr = GameObject.findObjectOfType(WebXR);
-        if (xr) {
-            xr.Rig.updateMatrix();
-            this._initalMatrix.copy(xr.Rig.matrix);
-        }
-    }
-    private _rig: Object3D | null = null;
-    private _startPose: Matrix4 | null = null;
-    private _placementPose: Matrix4 | null = null;
-    private _isTouching: boolean = false;
-    private _rigStartPose: Matrix4 | undefined | null = null;
-    private _gotFirstHitTestResult: boolean = false;
-    private _anchor: XRAnchor | null = null;
-    onBegin(session: XRSession) {
-        this._placementPose = null;
-        this.gameObject.visible = false;
-        this.gameObject.matrixAutoUpdate = false;
-        this._startPose = this.gameObject.matrix.clone();
-        this._rigStartPose = this.rig?.matrix.clone();
-        this._gotFirstHitTestResult = false;
-        this._anchor = null;
-        session.addEventListener('selectstart', this._selectStartFn);
-        session.addEventListener('selectend', this._selectEndFn);
-        // setTimeout(() => this.gameObject.visible = false, 1000); // TODO test on phone AR and Hololens if this was still needed
-        // console.log(this.rig?.position, this.rig?.quaternion, this.rig?.scale);
-        this.gameObject.visible = false;
-        if (this.rig) {
-            // reset rig to initial pose, this is helping the mix of immersive AR and immersive VR that we now have on quest
-            // where the rig can be moved and scaled by the user in VR mode and we use the rig position when entering
-            // immersive Ar right now to place the user/offset the session
-            this.rig.matrixAutoUpdate = true;
-            this._initalMatrix.decompose(this.rig.position, this.rig.quaternion, this.rig.scale);
-        }
-        // TODO this is duplicate to WebXR events AND engine events, would be better in one place
-        this.dispatchEvent(new CustomEvent('onBeginSession'));
-    }
-    onUpdate(rig: Object3D | null, _session: XRSession, hit: XRHitTestResult | null, pose: XRPose | null | undefined): boolean {
-        if (pose && !this._placementPose) {
-            if (!this._gotFirstHitTestResult) {
-                this._gotFirstHitTestResult = true;
-                this.dispatchEvent(new CustomEvent('canPlaceSession', { detail: { pose: pose } }));
-            }
-            if (this._isTouching) {
-                // callbacks
-                const poseMatrix = new Matrix4().fromArray(pose.transform.matrix).invert();
-                this.dispatchEvent(new CustomEvent('placedSession', { detail: { pose, poseMatrix } }));
-                if (this.webAR) this.webAR.setReticleActive(false);
-                this.placeAt(rig, poseMatrix);
-                if (hit && pose && !isQuest()) // TODO anchors seem to behave differently with an XRRig
-                    this.onCreatePlacementAnchor(hit, pose);
-                return true;
-            }
-        }
-        return false;
-    }
-    private onCreatePlacementAnchor(hit: XRHitTestResult, pose: XRPose) {
-        this._anchor = null;
-        hit?.createAnchor?.call(hit, pose.transform)?.then(anchor => {
-            if (this.context.isInAR)
-                this._anchor = anchor;
-        }).catch(ex => {
-            console.warn("Failed to create anchor", ex);
-        });
-    }
-    private _anchorMatrix: Matrix4 = new Matrix4();
-    onBeforeRender(frame: XRFrame | null): void {
-        if (frame && this._rig) {
-            if (this._anchor) {
-                const referenceSpace = this.context.renderer.xr.getReferenceSpace();
-                if (referenceSpace) {
-                    const pose = frame.getPose(this._anchor.anchorSpace, referenceSpace);
-                    if (pose) {
-                        const poseMatrix = this._anchorMatrix.fromArray(pose.transform.matrix).invert();
-                        this.placeAt(this._rig, poseMatrix);
-                        return;
-                    }
-                }
-            }
-            else if (this._placementPose) {
-                this.placeAt(this._rig, this._placementPose!);
-            }
-        }
-    }
-    private _invertedSessionRootMatrix: Matrix4 = new Matrix4();
-    private _invertForwardMatrix: Matrix4 = new Matrix4().makeRotationY(Math.PI);
-    placeAt(rig: Object3D | null, mat: Matrix4) {
-        if (!this._placementPose) this._placementPose = new Matrix4();
-        this._placementPose.copy(mat);
-        // apply session root offset
-        const invertedSessionRoot = this._invertedSessionRootMatrix.copy(this.gameObject.matrixWorld).invert();
-        this._placementPose.premultiply(invertedSessionRoot);
-        if (rig) {
-            if (this.invertForward) {
-                this._placementPose.premultiply(this._invertForwardMatrix);
-            }
-            if (!this.userInput) this.userInput = new WebXRSessionRootUserInput(this.context);
-            this.userInput.enable();
-            this._rig = rig;
-            this.setScale(this.arScale);
-        }
-        else this._rig = null;
-        this.gameObject.visible = true;
-    }
-    onEnd(rig: Object3D | null, _session: XRSession) {
-        this.userInput?.disable();
-        this.userInput?.reset();
-        this._placementPose = null;
-        this.gameObject.visible = false;
-        this.gameObject.matrixAutoUpdate = false;
-        this._anchor = null;
-        if (this._startPose) {
-            this.gameObject.matrix.copy(this._startPose);
-        }
-        if (rig) {
-            rig.matrixAutoUpdate = true;
-            if (this._rigStartPose) {
-                this._rigStartPose.decompose(rig.position, rig.quaternion, rig.scale);
-                // console.log(rig.position, rig.quaternion, rig.scale);
-            }
-        }
-        InstancingUtil.markDirty(this.gameObject, true);
-        // HACK to fix physics being not in correct place after exiting AR
-        setTimeout(() => {
-            if (!this.gameObject) return;
-            this.gameObject.matrixAutoUpdate = true;
-            this.gameObject.visible = true;
-        }, 100);
-    }
-    private onSelectStart() {
-        this._isTouching = true;
-    }
-    private onSelectEnd() {
-        this._isTouching = false;
-    }
-    private setScale(scale) {
-        const rig = this._rig;
-        if (!rig || !this._placementPose) {
-            return;
-        }
-        // Capture the rig position before the first time we move it during a session
-        if (!this._rigStartPose) {
-            this._rigStartPose = rig.matrix.clone();
-        }
-        // we apply the transform to the rig because we want to move the user's position for easy networking
-        rig.matrixAutoUpdate = false;
-        if (this.arTouchTransform && this.userInput) {
-            this.userInput.applyMatrixTo(this._placementPose);
-            // rig.matrix.premultiply(this.userInput.offset);
-        }
-        rig.matrix.multiplyMatrices(tempMatrix.makeScale(scale, scale, scale), this._placementPose);
-        rig.matrix.decompose(rig.position, rig.quaternion, rig.scale);
-        rig.updateMatrixWorld();
-    }
-    */
 }

src/engine-components/webxr/WebXRButtons.ts CHANGED Viewed

@@ -148,6 +148,7 @@
                 console.warn("No USDZExporter component found in the scene");
             }
         });
+        this.hideElementDuringXRSession(button);
         this.root?.appendChild(button);
         return button;
     }
@@ -173,9 +174,10 @@
         button.addEventListener("click", () => NeedleXRSession.start(mode, init));
         this.updateSessionSupported(button, mode);
         this.listenToXRSessionState(button, mode);
+        this.hideElementDuringXRSession(button);
         this.root?.appendChild(button);
-        if(!this.isSecureConnection) {
+        if (!this.isSecureConnection) {
             button.disabled = true;
             button.title = "WebXR requires a secure connection (HTTPS)";
         }
@@ -207,9 +209,10 @@
         button.addEventListener("click", () => NeedleXRSession.start(mode, init));
         this.updateSessionSupported(button, mode);
         this.listenToXRSessionState(button, mode);
+        this.hideElementDuringXRSession(button);
         this.root?.appendChild(button);
-        if(!this.isSecureConnection) {
+        if (!this.isSecureConnection) {
             button.disabled = true;
             button.title = "WebXR requires a secure connection (HTTPS)";
         }
@@ -238,6 +241,8 @@
             const urlParameter = encodeURIComponent(window.location.href);
             window.open(baseUrl + urlParameter);
         });
+        this.listenToXRSessionState(button);
+        this.hideElementDuringXRSession(button);
         // make sure to hide the button when we have VR support directly on the device
         if (!isMozillaXR()) { // WebXR Viewer can't attach events before session start
             navigator.xr?.addEventListener("devicechange", () => {
@@ -257,6 +262,7 @@
         const wrapper = document.createElement("div");
         wrapper.style.position = "relative";
         wrapper.style.display = "inline-block";
+        this.hideElementDuringXRSession(wrapper);
         const qrCodeContainer = document.createElement("div");
         qrCodeContainer.classList.add("qr-code-container");
@@ -301,35 +307,41 @@
         });
     }
-    private listenToXRSessionState(button: HTMLButtonElement, mode: XRSessionMode) {
-        NeedleXRSession.onSessionRequestStart(args => {
-            if (args.mode === mode) {
-                button.classList.add("this-mode-is-requested");
-                // button["original-text"] = button.innerText;
-                // let modeText = mode === "immersive-vr" ? "VR" : "AR";
-                // button.innerText = "Starting " + modeText + "...";
-            }
-            else {
-                button["was-disabled"] = button.disabled;
-                button.disabled = true;
-                button.classList.add("other-mode-is-requested");
-            }
-        });
-        NeedleXRSession.onSessionRequestEnd(_ => {
-            button.classList.remove("this-mode-is-requested");
-            button.classList.remove("other-mode-is-requested");
-            button.disabled = button["was-disabled"];
-            // button.innerText = button["original-text"];
-        });
+    private hideElementDuringXRSession(element: HTMLElement) {
         NeedleXRSession.onXRSessionStart(_ => {
-            button["previous-display"] = button.style.display;
-            button.style.display = "none";
+            element["previous-display"] = element.style.display;
+            element.style.display = "none";
         });
         NeedleXRSession.onXRSessionEnd(_ => {
-            if (button["previous-display"] != undefined)
-                button.style.display = button["previous-display"];
+            if (element["previous-display"] != undefined)
+                element.style.display = element["previous-display"];
         });
     }
+    private listenToXRSessionState(button: HTMLButtonElement, mode?: XRSessionMode) {
+        if (mode) {
+            NeedleXRSession.onSessionRequestStart(args => {
+                if (args.mode === mode) {
+                    button.classList.add("this-mode-is-requested");
+                    // button["original-text"] = button.innerText;
+                    // let modeText = mode === "immersive-vr" ? "VR" : "AR";
+                    // button.innerText = "Starting " + modeText + "...";
+                }
+                else {
+                    button["was-disabled"] = button.disabled;
+                    button.disabled = true;
+                    button.classList.add("other-mode-is-requested");
+                }
+            });
+            NeedleXRSession.onSessionRequestEnd(_ => {
+                button.classList.remove("this-mode-is-requested");
+                button.classList.remove("other-mode-is-requested");
+                button.disabled = button["was-disabled"];
+                // button.innerText = button["original-text"];
+            });
+        }
+    }
 }
 if (!customElements.get(webXRElementName))