I'm following this tutorial on making a fighting game in html canvas using javascript, but i would like to change a few things, there's just one part i can't figure out, and thats how to freeze the players when the timer hits zero. Does anybody have any ideas?
let timer = 10
let timerId
function decreaseTimer(){
if(timer > 0) {
timerId = setTimeout(decreaseTimer, 1000)
timer--
document.querySelector('#timer').innerHTML = timer
}
if(timer === 0){
determineWinner({player, enemy, timerId})
// freeze player
}
}
Movement is defined as player.velocity.x/y respectively
Also using keydown like this:
window.addEventListener ('keydown', (event) => {
switch (event.key) {
case 'd':
keys.d.pressed = true
player.lastKey = 'd'
break
case 'a':
keys.a.pressed = true
player.lastKey = 'a'
break
case 'w':
keys.w.pressed = true
player.velocity.y = -10
break
case ' ':
player.attack()
break
case 'ArrowRight':
keys.ArrowRight.pressed = true
enemy.lastKey = 'ArrowRight'
break
case 'ArrowLeft':
keys.ArrowLeft.pressed = true
enemy.lastKey = 'ArrowLeft'
break
case 'ArrowUp':
enemy.velocity.y = -10
break
case 'Enter':
enemy.attack()
}
})
window.addEventListener ('keyup', (event) => {
switch (event.key) {
case 'd':
keys.d.pressed = false
break
case 'a':
keys.a.pressed = false
break
case 'w':
keys.w.pressed = false
break
case 'ArrowRight':
keys.ArrowRight.pressed = false
break
case 'ArrowLeft':
keys.ArrowLeft.pressed = false
break
case 'ArrowUp':
keys.ArrowUp.pressed = false
break
}
})
There are a multiple ways of 'freezing the player'. Some of them are better depending on how you pause / play the game.
timer > 0