Workshop › Bomberman-style Arena › Step 11 of 42

Slide towards a target

What we are doing

A player on a grid should not jump from tile to tile but slide. moveTo takes one small step towards the target tile; when it is closer than a step, it snaps onto the tile and drops the target.

```js
const SPEED = 0.1 // tiles per frame

// Step a mover towards its target tile, and drop the target once it is there.
function moveTo(m, speed) {
  const dx = m.target.c - m.x
  const dy = m.target.r - m.y
  if (Math.abs(dx) <= speed && Math.abs(dy) <= speed) {
    m.x = m.target.c
    m.y = m.target.r
    m.target = null
    return
  }
  m.x += Math.sign(dx) * speed
  m.y += Math.sign(dy) * speed
}
```

What it means

dx, dy is how far the target is, in tiles.
If both are within one step, the mover is put exactly on the target, the target is dropped and return leaves.
Otherwise Math.sign (1, -1 or 0) moves it one speed towards the target on each axis. At 0.1 a tile takes 10 frames.

Your turn

Under TOP write SPEED.
Above the keydown listener write the comment and moveTo.

Skills: Game states

← Keys being held Walk →

All steps