How can I change the WebXR Controller with a Button Click
General My Project: Augmented Reality Jigsaw Puzzle. The Controller is for clicking multiple button on a gui plane. You click a button “Select Board” to select a detected plane by the planeDetector. This is your desk/board for the Puzzle Pieces. Afterwards you can “Start the game” with another button. Now the Puzzle Pieces are attached to the left controller and you grab and drop it on the desk.
So this are the states (Looking + Behaviour) the controller should change:
- Normal Controller + Highlighting Meshes pointed at.
- Normal Controller + Removing all Planes besides one pointed at (out of PlaneDetector Array)
- Controller with a Plane attached to it + Grab and Drop the Plane at the Controller to the Desk/Board (Last Plane in PlaneDetectorArray)
short code example:
longer example
Without the if statements, all three are working. My Code is, in my understanding, not working because the controller can only be initialized once. But how can I change the controller after initializing? I tried different methods outside the Obersable to seize the controller looking and behaviour (like xr.input.controllers.forEach, controller.dispose, ), but nothing fires again after changing a boolean/ clicking a button.
With the documentation I could find onControllerAddedObservable, onMotionControllerInitObservable, onMeshLoadedObservable, onDisposeObservable. But there is no updateObservable like at the planeDetector. Sadly I couldn’t find similar problems about this specific problem anywhere. What am I missing?
Thank you really much for every little advice or idea. For further information feel free to ask and I try to deliver the missing information.
@RaananW Since your the (almost) almighty webxr babylonjs expert, I felt free to add you directly. It would be an honour if you could take a look at the problem