Issue with camera attach, detach in 5.0.0

In my app I have a use case where in “on pointer down” I do, “camera.detachControl()” (as I do not want the camera to interfere) and do things like drag etc.
Then at the end, “on pointer up” I reattach control using “camera.attachControl(…)”.
Works fine in previous versions
In 5.0.0 after pointerup, camera remain unresponsive. So if you try rotating the camera by pressing mouse left button and dragging, it does not respond.
But if you click once and try again it works.


click once and then try to rotate camera. it will not work
click again and try to rotate it will work

change version to an older version say 4.2
click once and then try to rotate camera. it will work

I don’t know what changed, and maybe that’s important to figure out.

But if looking only for a solution, then I suspect this is due to global event handlers being problematic. I believe the BJS team generally recommends using the observables instead. Here’s an alternative with observables that doesn’t have the problem:

    scene.onPointerObservable.add(pointerInfo => {
        if (pointerInfo.type === BABYLON.PointerEventTypes.POINTERDOWN) {
            if (firstTime) {
                console.log("pointer down, detaching control");
        else if (pointerInfo.type === BABYLON.PointerEventTypes.POINTERUP) {
            if (firstTime) {
                console.log("pointer up, attaching control");
                camera.attachControl(canvas, true);

That does solve my problem and I will use your solution instead.
Thanks for the link to the discussion too.
Though the discussion was about using “scene.onPointerUp”, instead of “window.onPointerUp”, which is what I was using, I do get the concern.

As far my issue with window.onPointerUp I will let the BJS team decide if it is worth researching.

Thanks again

Spoken too soon I guess :slight_smile:
Couple of issues with onPointerObservable.

  1. I am doing canvas.onpointerdown too and there is no canvas.onPointerObservable

  2. I am also interested in pickingInfo.
    Unfortunately the pickingInfo provided by onPointerObservable only picks mesh which are enabled, visible and have isPickable set to true. Now with scene.pick() I can provide my own predicate which can handle meshes which are disabled, invisible or have isPickable set to false.
    So if I use onPointerObservable I will have to discard the pickingInfo provided by it and make a separate scene.pick() call. Which means I end up doing picking twice and thus might incur some performance cost.
    Or is there a way to set a predicate with scene.onPointerObservable ?

Well it seems there is a scene.pointerDownPredicate
So if I
set scene.pointerDownPredicate
and then do
scene.onPointerObservable .add()
then it works.
Problem with scene.pointerDownPredicate is that, setting it will override the previous value.

Looks like lots of hoops to go thru to use onPointerObservable.
canvas.addEventListener(“pointerdown”, …) with scene.pick() seems more and more appropriate and performant.

Now only if BJS team can fix this issue with pointerdown :slight_smile:

@PolygonalSun would be great if you could have a quick look ?

I can take a look at the unresponsiveness issue after reattaching.

1 Like

Okay, so I’ve found the issue. The reason for the unresponsive click was due to a value for the active mouse button not being set back to a non-button value before the controls were detached. This PR should fix that issue.


Yep that fixed the issue! :slight_smile:
Will test again when this is released.
Thanks a bunch.