Chronomètre SpeedCubing en JS

Question

Une minuterie intégrée dans le bloc de code. À l'heure actuelle, la minuterie démarre/s'arrête via le bouton, mais j'en ai besoin pour fonctionner lorsque le bouton espace est relâché, et j'ai besoin qu'elle s'arrête lorsque le bouton espace est enfoncé. J'essaie de résoudre ce problème depuis environ deux jours maintenant et je n'arrive pas à trouver de solution. Chaque fois que j'essaie d'arrêter le chronomètre, lorsque je relâche le bouton espace, le chronomètre redémarre.

let startDate;
let timeoutID = 0;
let time;
let started = false;
let timerRunOut = false;

function start(){
    if(!started){
        startDate = new Date();
        startTimer();
        started = true;
    }
}
function stop(){
    if(started){
        clearTimeout(timeoutID);
        started = false;
    }
}

function startTimer () {
    let current = new Date();
    time = (current - startDate);

    let timeMS = time;

    let ms = timeMS % 1000;
    timeMS = (timeMS - ms) / 1000;
    let seconds = timeMS % 60;
    timeMS = (timeMS - seconds) / 60;
    let mins = timeMS % 60;

    if(seconds < 10){
        document.getElementById("seconds").innerText = "0" + seconds;
    }else{
        document.getElementById("seconds").innerText = seconds;
    }

    if(mins > 0 && mins < 10){
        document.getElementById("minutes").innerText = "0" + mins + ":";
    }else if(mins > 0){
        document.getElementById("minutes").innerText = mins + ":";
    }else{
        document.getElementById("minutes").innerText = "";
    }

    if(ms < 10){
        document.getElementById("tens").innerText = "00" + ms;
    }
    else if(ms < 100){
        document.getElementById("tens").innerText = "0" + ms;
    }else{
        document.getElementById("tens").innerText = ms;
    }

    timeoutID = setTimeout(startTimer, 0);
}

J'ai essayé d'ajouter des écouteurs d'événements et d'ajouter des conditions mais rien ne fonctionne, lorsque le minuteur s'arrête, il redémarre toujours lorsque je relâche le bouton espace.

Answer 1

J'ai trouvé la solution et je dois remercier un peu Andre qui m'a aidé à comprendre cela.

let spaceUp = 0;
function startHandler(event){
    if(event.code === "Space" && spaceUp < 1){
       start();
       spaceUp ++;
       document.addEventListener("keydown", stopHandler);
       document.removeEventListener("keyup", startHandler);
    
    }else if(spaceUp == 1){
        spaceUp = 0;
    }
    document.getElementById("timer").style.color = "black";
}
function stopHandler(event){
    if(event.code === "Space"){
        stop();
        document.removeEventListener("keydown", stopHandler);
        document.getElementById("timer").style.color = "red";
        document.addEventListener("keyup", startHandler);
    }
}

document.addEventListener("keyup", startHandler);

document.addEventListener("keydown", function(e){
    if(e.code === "Space" && !started){
        document.getElementById("timer").style.color = "green";
     }
})