Olá, estou terminando esse jogo mas não sei como fazer o contador do placar adicionar mais um ponto ao placar, não 7 ou 8 de uma vez. Como eu arrumo isso?
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="stylesheet" href="style_mario.css">
<title>Super Mario - StartSe</title>
</head>
<body>
<div class="game">
<div id= "score"></div>
<img class="clouds-gamer" src="./images/clouds-gamer.png"/>
<img class="super-mario" src="./images/super-mario.gif"/>
<img class="pipe-game" src="./images/pipe-game.png"/>
</div>
<audio src="./sons/mario_death.mp3" id="mario_death"></audio>
<audio src="./sons/mario_coin.mp3" id="mario_coin"></audio>
<script src="main_mario.js"></script>
</body>
</html>
JavaScript:
const mario = document.querySelector(".super-mario");
const pipe = document.querySelector(".pipe-game");
let placar = setInterval(updated);
let pontuacao = 0;
function updated(){
var pontos = document.getElementById('score');
pontos.innerHTML = "score: " + pontuacao++;
clearInterval(placar);
}
function tocaMarioDeath(){
document.querySelector("#mario_death").play();
};
function tocaMarioCoin(){
document.querySelector("#mario_coin").play();
};
const jump = () => {
mario.classList.add("jump-mario");
setTimeout(() =>{
mario.classList.remove("jump-mario");
}, 500);
};
const loopGame = setInterval(() => {
const pipePosition = pipe.offsetLeft;
const marioPosition = +window
.getComputedStyle(mario)
.bottom.replace("px", "")
if(pipePosition <= 120 && pipePosition > 0 && marioPosition < 80){
pipe.style.animation = "none";
pipe.style.left =`${pipePosition}px`;
mario.style.animation = "none";
mario.style.bottom = `${marioPosition}px`;
mario.src = "./images/mario-game-over.png";
mario.style.width = "75px";
mario.style.marginLeft = "45px";
tocaMarioDeath();
clearInterval(loopGame);
}else if(pipePosition <= 0 && marioPosition >= 0){
tocaMarioCoin();
updated();
};
}, 10);
document.addEventListener("keydown", jump);
link to the page: