[SOLVED] Wasd not moving camera

https://playcanvas.com/editor/scene/1300323
I followed a tutorial on how to use the WASD keys to move an entity, and I tried doing that with the camera but it’s not working.

Hi @MoonAlien822,

Your script has a number of issues:

  1. this.Entity should be this.entity (JS is case sensitive!)

  2. You have put a prototype method inside the CamScript.prototype.update method. That is problematic and basically not much useful even though it doesn’t through an error.

Here is an updated version of the script:

var CamScript = pc.createScript('camScript');

// initialize code called once per entity
CamScript.prototype.initialize = function () {};

// update code called every frame
CamScript.prototype.update = function (dt) {
  // get which keys are pressed
  var keyboard = this.app.keyboard;
  var left = keyboard.isPressed(pc.KEY_LEFT);
  var right = keyboard.isPressed(pc.KEY_RIGHT);
  var up = keyboard.isPressed(pc.KEY_UP);
  var down = keyboard.isPressed(pc.KEY_DOWN);

  // move this entity based on which keys are pressed
  // dt is the time in seconds since the last frame and stands for 'delta time'
  if (left) {
    this.Entity.translate(-dt, 0, 0);
  }
  if (right) {
    this.Entity.translate(dt, 0, 0);
  }
  if (up) {
    this.Entity.translate(0, 0, -dt);
  }
  if (down) {
    this.Entity.translate(0, 0, dt);
  }
};

Edit: If it doesn’t work, try adding a speed to increase the amount it travels on each keypress.

how do I do this? sorry, I’ve never worked with pure javascript before

So a simple way is to add a local variable:

var speed = 10;
  if (left) {
    this.entity.translate(-dt * speed, 0, 0);
  }
  if (right) {
    this.entity.translate(dt * speed, 0, 0);
  }
  if (up) {
    this.entity.translate(0, 0, -dt * speed);
  }
  if (down) {
    this.entity.translate(0, 0, dt * speed);
  }

Observe how it’s being multiplied with dt to increase the units the entity moves on each update.

Experiment with different values for speed.

var CamScript = pc.createScript('camScript');

// initialize code called once per entity

CamScript.prototype.initialize = function () {};

// update code called every frame

CamScript.prototype.update = function (dt) {

  // get which keys are pressed

  var keyboard = this.app.keyboard;

  var left = keyboard.isPressed(pc.KEY_LEFT);

  var right = keyboard.isPressed(pc.KEY_RIGHT);

  var up = keyboard.isPressed(pc.KEY_UP);

  var down = keyboard.isPressed(pc.KEY_DOWN);

  // move this entity based on which keys are pressed

  // dt is the time in seconds since the last frame and stands for 'delta time'

 var speed = 50;

  if (left) {

    this.entity.translate(-dt * speed, 0, 0);

  }

  if (right) {

    this.entity.translate(dt * speed, 0, 0);

  }

  if (up) {

    this.entity.translate(0, 0, -dt * speed);

  }

  if (down) {

    this.entity.translate(0, 0, dt * speed);

  }

};

doesn’t work either.

It works, but you need first to save your code. Your cam.script.js script is basically empty.

Observe the orange color on the filename, it indicates there are pending changes to be saved:

image

Select File → Save File.

Or press Ctrl/Cmd and S on your keyboard.


I have saved it now and still can’t move, does it take a while to work?

I’ve forked your project, saved the file, and it works:

https://playcanvas.com/project/864121/overview/idk

this one does not work for me either, maybe I’m using a non-compatible browser?

What are you seeing?

Here is me moving the camera with the keyboard arrows:


I can see the first frame but pressing keys doesn’t do anything.

Not sure what’s wrong, try clicking on this frame with your mouse, just in case the window doesn’t have focus.

nope doesn’t change it, I’ll switch browsers and I’ll let you know if it works.

1 Like

It didn’t change anything, still the same result.

nevermind, I’m just stupid. the arrow keys are in the code and I kept pressing WASD :man_facepalming:

1 Like

to change the keys to WASD do I need to put the actual letter or the keycode?

The keycode, check how this tutorial does WASD input:

https://developer.playcanvas.com/en/tutorials/first-person-movement/

I take it this will take more time than just copying all the code in there?

I think you need to follow and study the code to get the answer about the keycodes you were looking for.

Definitely don’t copy / paste code that you don’t really understand.

Here is an example on how to check for left with the A key:

var left = keyboard.isPressed(pc.KEY_A);
1 Like

It’s working now

1 Like