I need to add rotate option for keyboard "A" & "D" AND "Left arrow " & "Right arrow" keys

var FirstPersonMovement = pc.createScript('firstPersonMovement');

FirstPersonMovement.attributes.add('camera', {

    type: 'entity',

    description: 'Optional, assign a camera entity, otherwise one is created'

});

FirstPersonMovement.attributes.add('power', {

    type: 'number',

    default: 2500,

    description: 'Adjusts the speed of player movement'

});

FirstPersonMovement.attributes.add('lookSpeed', {

    type: 'number',

    default: 0.25,

    description: 'Adjusts the sensitivity of looking'

});

// initialize code called once per entity

FirstPersonMovement.prototype.initialize = function() {

    this.force = new pc.Vec3();

    this.eulers = new pc.Vec3();

    var app = this.app;

    // Listen for mouse move events

    app.mouse.on("mousemove", this._onMouseMove, this);

    // when the mouse is clicked hide the cursor

    app.mouse.on("mousedown", function () {

        // app.mouse.enablePointerLock();

    }, this);

    // Check for required components

    if (!this.entity.collision) {

        console.error("First Person Movement script needs to have a 'collision' component");

    }

    if (!this.entity.rigidbody || this.entity.rigidbody.type !== pc.BODYTYPE_DYNAMIC) {

        console.error("First Person Movement script needs to have a DYNAMIC 'rigidbody' component");

    }

};

// update code called every frame

FirstPersonMovement.prototype.update = function(dt) {

    // If a camera isn't assigned from the Editor, create one

    if (!this.camera) {

        this._createCamera();

    }

    var force = this.force;

    var app = this.app;

    // Get camera directions to determine movement directions

    var forward = this.camera.forward;

    var right = this.camera.right;

    // movement

    var x = 0;

    var z = 0;

    // Use W-A-S-D keys to move player

    // Check for key presses

    if (app.keyboard.isPressed(pc.KEY_A) || app.keyboard.isPressed(pc.KEY_LEFT)) {

        x -= right.x;

        z -= right.z;

    }

    if (app.keyboard.isPressed(pc.KEY_D) || app.keyboard.isPressed(pc.KEY_RIGHT)) {

        x += right.x;

        z += right.z;

    }

    if (app.keyboard.isPressed(pc.KEY_W) || app.keyboard.isPressed(pc.KEY_UP)) {

        x += forward.x;

        z += forward.z;

    }

    if (app.keyboard.isPressed(pc.KEY_S) || app.keyboard.isPressed(pc.KEY_DOWN)) {

        x -= forward.x;

        z -= forward.z;

    }

       

    // if (app.keyboard.isPressed(pc.KEY_SPACE)) {

    //     this.app.root.findByName("booktitle").element.text = 'None';

    //     this.app.root.findByName("bookcontent").element.text = '';  

    // }

    // use direction from keypresses to apply a force to the character

    if (x !== 0 && z !== 0) {

        force.set(x, 0, z).normalize().scale(this.power);

        this.entity.rigidbody.applyForce(force);

    }

    // update camera angle from mouse events

    this.camera.setLocalEulerAngles(this.eulers.y, this.eulers.x, 0);

};

// FirstPersonMovement.prototype._onMouseMove = function (e) {

//     // If pointer is disabled

//     // If the left mouse button is down update the camera from mouse movement

//     if (pc.Mouse.isPointerLocked() || e.buttons[0]) {

//         this.eulers.x -= this.lookSpeed * e.dx;

//         this.eulers.y -= this.lookSpeed * e.dy;

//     }

// };

FirstPersonMovement.prototype._createCamera = function () {

    // If user hasn't assigned a camera, create a new one

    this.camera = new pc.Entity();

    this.camera.setName("First Person Camera");

    this.camera.addComponent("camera");

    this.entity.addChild(this.camera);

    this.camera.translateLocal(0, 0.5, 0);

};

Hello @meta_core ,

To rotate your entity you can use this.entity.rotate(), which is outlined in the docs. Simply call the method within your already existing checks for A/D/Left Arrow/Right Arrow keypresses. Let me know if you need further help!

1 Like

thank you so much for your help. it works fine. but there is another problem. forward and backward (W, S & UP ARROW, DOWN ARROW ) movement positions come to the started position, so I need to update the camera at the live position with the rotation.

(the simple idea of this code is the person can rotate using left & right arrow keys and A & D keys.

W, S, and UP ARROW AND DOWN ARROW keys use to move forward and backward. )

*.user can rotate and move forward and backward at the same time.

could you help me with this?

var FirstPersonMovement = pc.createScript('firstPersonMovement');

FirstPersonMovement.attributes.add('camera', {

    type: 'entity',

    description: 'Optional, assign a camera entity, otherwise one is created'

});

FirstPersonMovement.attributes.add('power', {

    type: 'number',

    default: 2500,

    description: 'Adjusts the speed of player movement'

});

FirstPersonMovement.attributes.add('lookSpeed', {

    type: 'number',

    default: 0.25,

    description: 'Adjusts the sensitivity of looking'

});

// initialize code called once per entity

FirstPersonMovement.prototype.initialize = function() {

    this.force = new pc.Vec3();

    this.eulers = new pc.Vec3();

    var app = this.app;

    // Listen for mouse move events

    app.mouse.on("mousemove", this._onMouseMove, this);

    // when the mouse is clicked hide the cursor

    app.mouse.on("mousedown", function () {

        // app.mouse.enablePointerLock();

    }, this);

    // Check for required components

    if (!this.entity.collision) {

        console.error("First Person Movement script needs to have a 'collision' component");

    }

    if (!this.entity.rigidbody || this.entity.rigidbody.type !== pc.BODYTYPE_DYNAMIC) {

        console.error("First Person Movement script needs to have a DYNAMIC 'rigidbody' component");

    }

};

// update code called every frame

FirstPersonMovement.prototype.update = function(dt) {

    // If a camera isn't assigned from the Editor, create one

    if (!this.camera) {

        this._createCamera();

    }

    var force = this.force;

    var app = this.app;

    // Get camera directions to determine movement directions

    var forward = this.camera.forward;

    var right = this.camera.right;

    // movement

    var x = 0;

    var z = 0;

 
   

    // Use W-A-S-D keys to move player

    // Check for key presses

    if (app.keyboard.isPressed(pc.KEY_A) || app.keyboard.isPressed(pc.KEY_LEFT)) {

        x -= right.x;

        z -= right.z;

       

    }

    if (app.keyboard.isPressed(pc.KEY_D) || app.keyboard.isPressed(pc.KEY_RIGHT)) {

        x += right.x;

        z += right.z;

   

    }

    if (app.keyboard.isPressed(pc.KEY_W) || app.keyboard.isPressed(pc.KEY_UP)) {

 

        x += forward.x;

        z += forward.z;

       

    }

    if (app.keyboard.isPressed(pc.KEY_S) || app.keyboard.isPressed(pc.KEY_DOWN)) {

   

        x -= forward.x;

        z -= forward.z;

       

    }

       

    // if (app.keyboard.isPressed(pc.KEY_SPACE)) {

    //     this.app.root.findByName("booktitle").element.text = 'None';

    //     this.app.root.findByName("bookcontent").element.text = '';  

    // }

    // use direction from keypresses to apply a force to the character

    if (x !== 0 && z !== 0) {

        force.set(x, 0, z).normalize().scale(this.power);

        this.entity.rigidbody.applyForce(force);

    }

    // update camera angle from mouse events

    this.camera.setLocalEulerAngles(this.eulers.y, this.eulers.x, 0);

};

// FirstPersonMovement.prototype._onMouseMove = function (e) {

//     // If pointer is disabled

//     // If the left mouse button is down update the camera from mouse movement

//     if (pc.Mouse.isPointerLocked() || e.buttons[0]) {

//         this.eulers.x -= this.lookSpeed * e.dx;

//         this.eulers.y -= this.lookSpeed * e.dy;

//     }

// };

FirstPersonMovement.prototype._createCamera = function () {

    // If user hasn't assigned a camera, create a new one

    this.camera = new pc.Entity();

    this.camera.setName("First Person Camera");

    this.camera.addComponent("camera");

    this.entity.addChild(this.camera);

    this.camera.translateLocal(0, 0.5, 0);

};

Hey @meta_core,

I’m not quite sure I understand your question, but if you wish to move your character, you should use this.entity.translateLocal(this.speed, 0, 0);

Replace speed in the above line by whatever variable you are using for speed. This will move the character forward in its local axis (It will move the character toward its front).

Here’s the documentation for this function.

Hey @meta_core,

I hadn’t realised the first time but you are using physics to move your character, so instead of using translateLocal, I would use ‘applyForce’ instead. It works similarly, but instead of simply moving the character, it adds force in the direction you specify.

If that doesn’t work for you, you can try rigidbody.teleport(x, y, z) too. It is similar to setPosition. Here is the docs for teleport.

I am sorry, please check my project and help me to solve this problem

this is my project. https://playcanv.as/p/8d953da6/

I need to add rotate for the left arrow key & right arrow key. ( now it is moving left & right, I do not want this, I need to rotate using the left & right arrow keys)

I want to do this, At the same time, the first person can rotate and move. once the user rotates, the position should be updated and he can walk using the up and down arrow keys. left and right use to rotate not to move.

Hey @meta_core,

If you wish to rotate your character with a dynamic rigidbody, try using rigidbody.applyTorque to rotate it. It should look like this:

if (app.keyboard.isPressed(pc.KEY_A) || app.keyboard.isPressed(pc.KEY_LEFT)) {
    // this.entity.rotate(0, this.rotationSpeed * -1 * dt, 0); // If you're using a Kinematic rigidbody
    this.entity.rigidbody.applyTorque(0, this.rotationSpeed * -1 * dt, 0); // If you're using a Dynamic rigidbody (Your case)
}

    if (app.keyboard.isPressed(pc.KEY_D) || app.keyboard.isPressed(pc.KEY_RIGHT)) {
    // this.entity.rotate(0, this.rotationSpeed * dt, 0); // If you're using a Kinematic rigidbody
    this.entity.rigidbody.applyTorque(0, this.rotationSpeed * dt, 0); // If you're using a Dynamic rigidbody (Your case)
}