removing camera inputs

[jdeboi]

Hello! I'm just trying to get oriented with declarative/ react-style babylon, and would love some help wrapping my head around how to remove camera inputs.

Normally (imperatively) I'd call camera.inputs.clear(). My first thought (which is probably wayyyy off) was to create a ref and use the ref to access camera inputs. This totally didn't work and is probably very wrong:

const Street = () => {

    const cameraRef = useRef(null);

    useEffect(() => {
        if (cameraRef.current) {
            cameraRef.current.inputs.clear();
        }
    }, [cameraRef.current])

    return (
        <Engine antialias adaptToDeviceRatio canvasId='babylonJS' >
            <Scene>
                <freeCamera ref={cameraRef} position={currentPosition} name="camera1" setTarget={[Vector3.Zero()]} />
            </Scene>
        </Engine>
    )
}

Any thoughts are greatly appreciated!

[brianzinn]

What you have there looks good to me, but what I suspect may be happening is that a default camera behaviour is undoing your useEffect. When a camera is attached it does this:

camera.attachControl(canvas, noPreventDefault);

It sounds like I should add an opt out mechanism like skipAutoAttachControl. Would this work:

<freeCamera name="camera1" skipAutoAttachControl />

edit: When I say attached I mean when the camera is mounted, which may be called after your useEffect has ran.

[jdeboi]

awesome! Ok, did more exploring and discovered that my useEffect() wasn't working rerendering when cameraRef changed (I read this Stack Overflow about responding to ref changes). I made the following changes and it worked!

const Street = () => {

    const [cameraRef, setCameraRef] = useState();

    useEffect(() =>{
        if (cameraRef){
            cameraRef.inputs.clear();
            console.log("clearing camera inputs");
        }
    }, [cameraRef])

    return (
        <Engine antialias adaptToDeviceRatio canvasId='babylonJS' >
            <Scene>
                <freeCamera ref={newRef => setCameraRef(newRef)} />
            </Scene>
        </Engine>
    )
}

So I don't think the skipAutoAttachControl is necessary?

Thanks!

[brianzinn]

OK it's probably not necessary, but I'm happy to add it if you want to skip that code on your side :)