Camera top and bottom lock rotate

Hello, I’m trying to make a first person camera.
For now i can move right & left, but when i UP/DOWN my mouse my world rotate… In unity i can lock this with settings camera
But I dont know how I can lock this in js/ts…

Ty !

Original Post on Discord

by user 191204280198234122

Hey what are you using for rotating the camera? Did you write a script for it?

Hi !
Sorry for late, this is my script :

import { Behaviour, serializeable } from "@needle-tools/engine";
import { setWorldPosition } from "@needle-tools/engine/engine/engine_three_utils";
import { getWorldPosition } from "@needle-tools/engine/engine/engine_three_utils";


export class PlayerControl extends Behaviour {

    @serializeable()
    public speed: number = 1;


    public update() {
        const time = this.context.time.deltaTime / 100;
        const walk = this.speed * time;
        document.body.requestPointerLock();
        
        
        window.onmousemove = (e) => {
            const x = e.movementX;
            const y = e.movementY;
            this.gameObject.rotation.y += x * 0.002;
            this.gameObject.rotation.x += y * 0.002;
            console.log(this.gameObject.rotation.x);
        }

        document.addEventListener("keydown", (event) => {
            // const position = getWorldPosition(this.gameObject);
            if (event.key === "q") {
                // position.z -= walk;
                this.gameObject.translateX(-walk);
            }
            if (event.key === "d") {
                // position.z += walk;
                this.gameObject.translateX(walk);
            }
            if (event.key === "s") {
                // position.x -= walk;
                this.gameObject.translateZ(-walk);
            }
            if (event.key === "z") {
                // position.x += walk;
                this.gameObject.translateZ(walk);
            }
            // setWorldPosition(this.gameObject, position);
        }, true);
    }
    
}

export default PlayerControl;

by user 191204280198234122

So you could just remove this line this.gameObject.rotation.x += y * 0.002 which rotates your camera when moving your mouse up and down.

no i cant rotate with up and down when i remove this line…

by user 191204280198234122

i need to move my mouse in all direction

by user 191204280198234122

not just on left & right

by user 191204280198234122

No idea ? :frowning_with_open_mouth:

by user 191204280198234122

Someone else implemented this previously I just cant remember who it was right now. Can you try doing it with this.context.domElement.requestPointerLock() ?

or this.context.renderer.domElement.requestPointerLock()

Yes, but i have

by user 191204280198234122

        document.body.requestPointerLock();

by user 191204280198234122

in update function

by user 191204280198234122

And its not working?

It disable pointer

by user 191204280198234122

and its work

by user 191204280198234122

I can make u video if you want ?

by user 191204280198234122

Yes please

sorry for long time i dont have see answer!

by user 191204280198234122

wait, video is too big for discord, i upload online

by user 191204280198234122