[SOLVED] How to stop touch event propagation?

I have a model viewer like the Model Viewer startup project.
It detects touches on the whole screen to control the model orbiting using some orbit-script.

On top of this I have a ui. It has a ui-script to detect the touch on a special items on the ui.
If it detects the touch inside that item the touch should not propagate to the orbit-script.

So I made sure the ui-script is loaded before the orbit-script.
The touch is correctly detected and the check if the touch is at the special item also works well.
Then I try to stop the propagation using:

event.stopPropagation();
event.stopImmediatePropagation();

But the orbit-script still gets the touch events!

I’m a little confused because in the Model Viewer project in the touch handling function I see this call:

event.event.preventDefault();

So should I also use a double event.event?

event.event.stopPropagation();
event.event.stopImmediatePropagation();

which I off course tried out, but didn’t work.

So what could be wrong?

I assume you are using the orbit script from the tutorials? If so, I don’t think it allows pausing its execution. You could edit the script to add a method or some event that would stop it from updating the camera position/rotation. Another option is to simply disable the script, when you don’t want it to affect the camera and then enabling again to resume.

I have no problem that it controls the camera. But it should not process touch events that are ‘used’ by the overlaying gui.

You are probably confusing the PlayCanvas touch events with browser touch events. Once the browser event reached the canvas where your app is, then PlayCanvas creates own touch event (it places the original one from the browser under .event property, so that is what you see there as event.event).

If you are using HTML gui on top of your app canvas, then you should create some script that catches it and stops the propagation to prevent it from reaching the canvas. Then the game will not hear it.

If you are using an ingame gui, then there is no such thing as stop propagation. The event already reached the canvas and it is now up to you to process it the way your application expects. For example, if your menu is opened, you can send some event that would pause something or unsubscribe from input events. Once the menu is closed, you can subscribe back or resume.

Okay thanks. That clarifies a lot!