Moving Around Like a Top Down

Suppose we wanted to create a space shooter or a tank shooter, like the first video game programmers ever. Or Pacman, or DigDug or, as we'll see tons of other first-person shooter games that let you walk up down and strafe left and right. It's a movement system as old and good as games themselves. We'll also see that thhese kinds of simplified game boards with circles and grids are perfect for the collision layer of the game, or the map layer and the real game graphics will come later.

Let's add some stuff to our Player to make them capable of this kind of top down movement.

let HERO = {
  vx: 0,
  vy: 0,
  accel: 2,
  radius: 50
  moveSpeed: .3,
  rotationSpeed: .2 * (Math.PI / 180),
  turnDirection: 0,
  walkDirection: 0,
  rotationAngle: (Math.PI / 2),
  x: CANVAS.width / 2,
  y: CANVAS.height / 2

In Sum

We've got a Hero circle and he can now turn like a tank shooter. This could function as the game's map if we added a 3D first person camera. But we want a little more to play with than just an empty screen. We need some walls to collide off of. So let's look at what level data is and how we load different levels for the same hero in the next article.