Merge pull request #10158 from RaananW/RaananW/issue9402

[XR] Teleportation mesh observable for target update

dist/preview release/what's new.md

@@ -114,6 +114,7 @@
 - Added initial support for the `sessiongranted` event ([#9860](https://github.com/BabylonJS/Babylon.js/issues/9860)) ([RaananW](https://github.com/RaananW))
 - Remove the warning for input source not found when in (touch)screen mode ([#9938](https://github.com/BabylonJS/Babylon.js/issues/9938)) ([RaananW](https://github.com/RaananW))
 - Fixed an issue with resources disposal when exiting XR ([#10012](https://github.com/BabylonJS/Babylon.js/issues/10012)) ([RaananW](https://github.com/RaananW))
+- Added observable to target mesh position update for teleportation ([#9402](https://github.com/BabylonJS/Babylon.js/issues/9402)) ([RaananW](https://github.com/RaananW))
 - Prevent the XR render target texture from rescaling when using the scene optimizer ([#10135](https://github.com/BabylonJS/Babylon.js/issues/10135)) ([RaananW](https://github.com/RaananW))
 
 ### Gizmos

src/XR/features/WebXRControllerTeleportation.ts

@@ -1,5 +1,5 @@
 import { IWebXRFeature, WebXRFeaturesManager, WebXRFeatureName } from "../webXRFeaturesManager";
-import { Observer } from "../../Misc/observable";
+import { Observable, Observer } from "../../Misc/observable";
 import { WebXRSessionManager } from "../webXRSessionManager";
 import { Nullable } from "../../types";
 import { WebXRInput } from "../webXRInput";
@@ -124,7 +124,7 @@ export interface IWebXRTeleportationOptions {
     /**
      * If provided, this function will be used to generate the ray mesh instead of the lines mesh being used per default
      */
-    generateRayPathMesh?: (points: Vector3[]) => AbstractMesh;
+    generateRayPathMesh?: (points: Vector3[], pickingInfo: PickingInfo) => AbstractMesh;
 }
 
 /**
@@ -159,6 +159,12 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
     private _tmpVector = new Vector3();
     private _tmpQuaternion = new Quaternion();
 
+    /**
+     * Skip the next teleportation. This can be controlled by the user to prevent the user from teleportation
+     * to sections that are not yet "unlocked", but should still show the teleportation mesh.
+     */
+    public skipNextTeleportation = false;
+
     /**
      * The module's name
      */
@@ -201,6 +207,12 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
      */
     public rotationAngle: number = Math.PI / 8;
 
+    /**
+     * This observable will notify when the target mesh position was updated.
+     * The picking info it provides contains the point to which the target mesh will move ()
+     */
+    public onTargetMeshPositionUpdatedObservable: Observable<PickingInfo> = new Observable();
+
     private _rotationEnabled: boolean = true;
 
     /**
@@ -419,7 +431,7 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
                         return;
                     } else if (pick && pick.pickedPoint) {
                         hitPossible = true;
-                        this._setTargetMeshPosition(pick.pickedPoint);
+                        this._setTargetMeshPosition(pick);
                         this._setTargetMeshVisibility(true);
                         this._showParabolicPath(pick);
                     }
@@ -448,7 +460,7 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
                         return;
                     } else if (pick && pick.pickedPoint) {
                         hitPossible = true;
-                        this._setTargetMeshPosition(pick.pickedPoint);
+                        this._setTargetMeshPosition(pick);
                         this._setTargetMeshVisibility(true);
                         this._showParabolicPath(pick);
                     }
@@ -760,8 +772,9 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
         return closestPoint;
     }
 
-    private _setTargetMeshPosition(newPosition: Vector3) {
-        if (!this._options.teleportationTargetMesh) {
+    private _setTargetMeshPosition(pickInfo: PickingInfo) {
+        const newPosition = pickInfo.pickedPoint;
+        if (!this._options.teleportationTargetMesh || !newPosition) {
             return;
         }
         const snapPosition = this._findClosestSnapPointWithRadius(newPosition);
@@ -773,6 +786,7 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
         }
         this._options.teleportationTargetMesh.position.copyFrom(snapPosition || newPosition);
         this._options.teleportationTargetMesh.position.y += 0.01;
+        this.onTargetMeshPositionUpdatedObservable.notifyObservers(pickInfo);
     }
 
     private _setTargetMeshVisibility(visible: boolean) {
@@ -815,7 +829,7 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
         if (!this._options.generateRayPathMesh) {
             this._quadraticBezierCurve = LinesBuilder.CreateLines("teleportation path line", { points: quadraticBezierVectors.getPoints(), instance: this._quadraticBezierCurve as LinesMesh, updatable: true }, sceneToRenderTo);
         } else {
-            this._quadraticBezierCurve = this._options.generateRayPathMesh(quadraticBezierVectors.getPoints());
+            this._quadraticBezierCurve = this._options.generateRayPathMesh(quadraticBezierVectors.getPoints(), pickInfo);
         }
         this._quadraticBezierCurve.isPickable = false;
     }
@@ -830,6 +844,11 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
         if (this.snapPointsOnly && !this._snappedToPoint) {
             return;
         }
+
+        if (this.skipNextTeleportation) {
+            this.skipNextTeleportation = false;
+            return;
+        }
         // do the movement forward here
         if (this._options.teleportationTargetMesh && this._options.teleportationTargetMesh.isVisible) {
             const height = this._options.xrInput.xrCamera.realWorldHeight;