camera.onCollide > new Scene() > activeCamera.attachControl Not Working?


I want to build a changing world event (with come back to previous world) when a camera collide a mesh…
So far so good… but i lost keyboard event… i need some help…

camera.onCollide = function (collidedMesh){
// I fist check colide Id etc…
BABYLON.SceneLoader.LoadAsync (“root”,“file.babylon”, engine).then(function (scene){
scene.executeWhenReady(function (){
scene.activeCamera.attachControl(canvas, true);
worlds.currentWorld.scene = scene;
worlds.currentWorld.isReady = true;
// then i swith my world scene
engine.runRenderLoop(function () {
if (worlds.currentWorld && worlds.currentWorld.isReady) {

So, it’s working fine but i lost the keyboard event for my freeCam… (still have mouse event) What is strange is that if i refresh the Dom, Clicking outside the page or navigating in the bowser inspector that work again…
Any suggestion ???

you can see the result here : Neverneverland

would they not still be attached to the previous scene ?

try detachControl from the previous scene first?

Hope that helps, if not a playground would make troubleshooting easier.

already tryied…not working at all …

        BABYLON.SceneLoader.LoadAsync("worlds/waterscene/scene/", "scene.babylon", worlds.engine).then(function (scene)
            scene.executeWhenReady(function ()
                scene.activeCamera.attachControl(worlds.canvas, true);
                worlds.currentWorld.scene = scene;
                worlds.currentWorld.isReady = true;


It looks like the focus is not the canvas anymore after loading the second scene so keyboard events are not going through. Actually clicking outside the browser then in makes it works again. I wonder if the loading screen is not capturing inputs somehow.

Could you try forcing the focus on the canvas after load ?

How do do so ?


No that’s not working… ;(
I build this PG example to show you :

then, same but more andvanced PG :

Is that the prob ?

[Violation] Added non-passive event listener to a scroll-blocking ‘wheel’ event. Consider marking event handler as ‘passive’ to make the page more responsive. See Passive event listeners - Chrome Platform Status

passive event listener is not an issue here.

You need to also go out of focus before creating the new scene with canvas.blur()

YES that Work ;)))) Thanks a lot ;))))
But, well now i need the clean the engine of the unused scene,
Actually the engine.scenes is populated by all the scene histories… (not very clean :wink:
So, i try to use scene.dispose() but it make it crash… is there a proper way or location to to this cleaning ?

Hahahaha… that work in that case :wink:

Well thank for all you time & suport !
Check in some time :wink:

1 Like

You can not dispose while it is being rendered (oncollide happens during rendering).

You can nevertheless on the next tick (setTimeout(0)) or Promise.resolve.then :slight_smile: