@needle-tools/engine 2.29.0-pre → 2.30.0-pre

package/src/engine-components/WebXRController.ts

@@ -13,6 +13,9 @@ import * as utils from "../engine/engine_three_utils"
 import { Interactable, UsageMarker } from "./Interactable";
 import { InstancingUtil } from "./Renderer";
 import { Rigidbody } from "./RigidBody";
+import { getParam } from "../engine/engine_utils";
+
+const debug = getParam("debugwebxrcontroller");
 
 export enum ControllerType {
     PhysicalDevice = 0,
@@ -103,10 +106,10 @@ export class WebXRController extends Behaviour {
                 // this is a workaround to fix that temporarely
                 // see https://github.com/needle-tools/needle-tiny-playground/issues/123
                 const jnts = ctrl.hand["joints"];
-                if(jnts){
-                    for(const key of Object.keys(jnts)){
+                if (jnts) {
+                    for (const key of Object.keys(jnts)) {
                         const joint = jnts[key];
-                        if(joint.parent) continue;
+                        if (joint.parent) continue;
                         ctrl.hand.add(joint);
                     }
                 }
@@ -189,7 +192,7 @@ export class WebXRController extends Behaviour {
     private _useSmoothing: boolean = true;
 
     awake(): void {
-        if(!this.controller){
+        if (!this.controller) {
             console.warn("Missing Controller!!!", this);
             return;
         }
@@ -251,7 +254,8 @@ export class WebXRController extends Behaviour {
         this.raycastLine?.add(this._raycastHitPoint);
         this._raycastHitPoint.visible = false;
         this.hand.add(this.handPointerModel);
-        console.log("ADDED TO RIG", this.webXR.Rig);
+        if (debug)
+            console.log("ADDED TO RIG", this.webXR.Rig);
 
         // // console.log("enable", this.index, this.controllerGrip.uuid)
     }
@@ -427,7 +431,8 @@ export class WebXRController extends Behaviour {
                 this.movementVector.applyQuaternion(this.webXR.TransformOrientation);
                 this.movementVector.y = 0;
                 this.movementVector.applyQuaternion(this.worldRot);
-                rig.position.add(this.movementVector.multiplyScalar(speedFactor * this.context.time.deltaTime));
+                this.movementVector.multiplyScalar(speedFactor * this.context.time.deltaTime);
+                rig.position.add(this.movementVector);
 
                 if (this.isUsingHands)
                     this.runTeleport(rig, buttons);
@@ -472,7 +477,7 @@ export class WebXRController extends Behaviour {
         }
         else this._pinchStartTime = undefined;
 
-        let doTeleport = teleport > .5;
+        let doTeleport = teleport > .5 && this.webXR.IsInVR;
         let isInMiniatureMode = this.webXR.Rig ? this.webXR.Rig?.scale?.x < .999 : false;
         let newRigScale: number | null = null;
 
@@ -482,7 +487,7 @@ export class WebXRController extends Behaviour {
                 // button[4] seems to be the A button if it exists. On hololens it's randomly pressed though for hands
                 // see https://www.w3.org/TR/webxr-gamepads-module-1/#xr-standard-gamepad-mapping
                 if (i === 4) {
-                    if (btn.pressed && !this.didChangeScale) {
+                    if (btn.pressed && !this.didChangeScale && this.webXR.IsInVR) {
                         this.didChangeScale = true;
                         const rig = this.webXR.Rig;
                         if (rig) {
@@ -583,7 +588,7 @@ export class WebXRController extends Behaviour {
     }
 
     private selectStartCallback: Function | null = null;
-    private lastSelectStartObject : THREE.Object3D | null = null;;
+    private lastSelectStartObject: THREE.Object3D | null = null;;
 
     private onHandleSelectStart() {
         this.selectStartCallback = null;
@@ -611,7 +616,8 @@ export class WebXRController extends Behaviour {
             for (const intersection of intersections) {
                 const object = intersection.object;
                 if (!this.testIsVisible(object)) {
-                    console.log("not visible");
+                    if (debug)
+                        console.log("not visible");
                     continue;
                 }
                 this.lastSelectStartObject = object;
@@ -622,7 +628,7 @@ export class WebXRController extends Behaviour {
                         sub(this, args);
                     }
                 }
-                if (args.grab !== object)
+                if (args.grab !== object && debug)
                     console.log("Grabbed object changed", "original", object, "new", args.grab);
                 if (args.grab) {
                     this.grabbed = AttachedObject.TryTake(this, args.grab, intersection, closeGrab);
@@ -630,8 +636,7 @@ export class WebXRController extends Behaviour {
                 break;
             }
         }
-        else 
-        {
+        else {
             const subs = WebXRController.eventSubs[ControllerEvents.SelectStart];
             const args = { selected: null, grab: null };
             if (subs && subs.length > 0) {
@@ -761,7 +766,8 @@ export class AttachedObject {
     public static TryTake(controller: WebXRController, candidate: THREE.Object3D, intersection: THREE.Intersection, closeGrab: boolean): AttachedObject | null {
         const interactable = GameObject.getComponentInParent(candidate, Interactable);
         if (!interactable) {
-            console.warn("Prevented taking object that is not interactable", candidate);
+            if (debug)
+                console.warn("Prevented taking object that is not interactable", candidate);
             return null;
         }
 

package/src/engine-components/ui/CanvasGroup.ts

@@ -16,6 +16,8 @@ export class CanvasGroup extends Behaviour implements ICanvasGroup {
         this.markDirty();
     }
 
+    get isCanvasGroup() { return true; }
+
     private _alpha: number = 1;
 
     @serializeable()

package/src/engine-components/ui/EventSystem.ts

@@ -9,9 +9,8 @@ import { PointerEventData } from "./PointerEvents";
 import { Raycaster } from "./Raycaster";
 import { InputEvents, KeyCode } from "../../engine/engine_input";
 import { Object3D } from "three";
-import { ICanvasGroup } from "./Interfaces";
+import { ICanvasGroup, IGraphic } from "./Interfaces";
 import { getParam } from "../../engine/engine_utils";
-import { off } from "process";
 
 const debug = getParam("debugeventsystem");
 
@@ -135,7 +134,7 @@ export class EventSystem extends Behaviour {
     private objectsHoveredLastFrame: THREE.Object3D[] = [];
     // todo: these should be listed by input source (e.g. per controller, mouse, touch)
     private raisedPointerDownEvents: any[] = [];
-    private _didMove : boolean = false;
+    private _didMove: boolean = false;
 
     onBeforeUpdate() {
         this.objectsHoveredThisFrame.length = 0;
@@ -147,9 +146,9 @@ export class EventSystem extends Behaviour {
             // console.log("alt pressed");
             return;
         }
-        if(!this._didMove){
+        if (!this._didMove) {
             const pos = this.context.input.getPointerPositionRC(0);
-            if(pos && pos.x === 0 && pos.y === 0) return;
+            if (pos && pos.x === 0 && pos.y === 0) return;
             this._didMove = true;
         }
 
@@ -166,10 +165,10 @@ export class EventSystem extends Behaviour {
         // handle orbit control before handling input events
         // this is just so button events that modify OrbitControls.enabled work
         let orbitControlComponent: OrbitControls | null = null;
-        let previousOrbitControlState : boolean | null = null;
+        let previousOrbitControlState: boolean | null = null;
         if (this.context.input.mouseDown && this.currentActiveMeshUIComponents.length > 0 && this.context.mainCameraComponent) {
             orbitControlComponent = GameObject.getComponent(this.context.mainCameraComponent.gameObject, OrbitControls) ?? null;
-            if(orbitControlComponent){
+            if (orbitControlComponent) {
                 previousOrbitControlState = orbitControlComponent.enabled;
                 orbitControlComponent.enabled = false;
             }
@@ -274,16 +273,16 @@ export class EventSystem extends Behaviour {
         this._noDepthTestingResults.length = 0;
         for (let i = 0; i < hits.length; i++) {
             const hit = hits[i];
-            const object = hit.object as THREE.Mesh;   
-            if(object.material){
-                if(object.material["depthTest"] === false){
+            const object = hit.object as THREE.Mesh;
+            if (object.material) {
+                if (object.material["depthTest"] === false) {
                     this._noDepthTestingResults.push(hit);
                     continue;
                 }
             }
             this._sortingBuffer.push(hit);
         }
-        for(const obj of this._sortingBuffer){
+        for (const obj of this._sortingBuffer) {
             this._noDepthTestingResults.push(obj);
         }
         return this._noDepthTestingResults;
@@ -294,7 +293,7 @@ export class EventSystem extends Behaviour {
 
         if (!this.testIsVisible(object)) {
             if (args.isClicked && debug)
-                console.log("not allowed", object);        
+                console.log("not allowed", object);
             return false;
         }
 
@@ -314,10 +313,17 @@ export class EventSystem extends Behaviour {
                 const actualGo = parent.shadowComponentOwner.gameObject;
                 if (actualGo) {
                     canvasGroup = this.tryFindCanvasGroup(actualGo);
-                    if (canvasGroup?.blocksRaycasts === false) return false;
-                    if (canvasGroup?.interactable === false) {
-                        return true;
+                    if (canvasGroup?.isCanvasGroup === true) {
+                        if (canvasGroup.blocksRaycasts === false) return false;
+                        if (canvasGroup.interactable === false) return true;
                     }
+                    // handle Graphic Raycast target
+                    const graphic = GameObject.foreachComponent(actualGo, c => {
+                        if (typeof (c as unknown as IGraphic).raycastTarget === "boolean") return c;
+                        return undefined;
+                    }, false);
+                    if (graphic?.raycastTarget === false) return false;
+
                     const handled = this.handleMeshUIIntersection(object, pressedOrClicked);
                     if (!clicked && handled) {
                         // return true;

package/src/engine-components/ui/Graphic.ts

@@ -10,6 +10,8 @@ import { onChange, scheduleAction } from "./Utils"
 
 export class Graphic extends BaseUIComponent implements IGraphic {
 
+    get isGraphic() { return true; }
+
     @serializeable(RGBAColor)
     get color(): RGBAColor {
         if (!this._color) this._color = new RGBAColor(1, 1, 1, 1);
@@ -132,6 +134,7 @@ export class Graphic extends BaseUIComponent implements IGraphic {
     }
 
     protected onAfterAddedToScene(): void {
+        super.onAfterAddedToScene();
         if (this.shadowComponent) {
             //@ts-ignore
             this.shadowComponent.offset = this.shadowComponent.position.z;

package/src/engine-components/ui/Interfaces.ts

@@ -1,8 +1,10 @@
 export interface ICanvasGroup {
+    get isCanvasGroup() : boolean;
     blocksRaycasts: boolean;
     interactable: boolean;
 }
 
 export interface IGraphic {
+    get isGraphic() : boolean;
     raycastTarget: boolean;
 }