Workshop › Bomberman-style Arena › Step 10 of 42
Which way does the player want to go? We keep the arrow keys being held in a list: a key goes on the end when it is pressed and leaves when it is let go. The last one is in charge, as players expect.
```js
const DIRS = { ArrowUp: [-1, 0], ArrowDown: [1, 0], ArrowLeft: [0, -1], ArrowRight: [0, 1] }
let held // arrow keys being held, the last one pressed at the end
held = []
document.addEventListener('keydown', (event) => {
if (DIRS[event.key]) {
event.preventDefault()
if (!held.includes(event.key)) held.push(event.key)
}
})
document.addEventListener('keyup', (event) => {
held = held.filter((k) => k !== event.key)
})
```DIRS maps each arrow key to [rows, columns] to move: up is one row less. DIRS[event.key] looks a key up and is
undefined for other keys.keydown adds the key if it is not in the list yet (a held key repeats keydown); preventDefault stops the page
from scrolling.keyup keeps every key except the one let go.ENEMY_STARTS write DIRS.let player write let held; in reset, under the player line, write held = [].function drawCircle( write the two listeners.Skills: Keyboard and mouse input
← The player Slide towards a target →