[SOLVED]Pomodoro Clock - Stopping timer from outside it's function

1

I’m working on the Pomodoro Clock project and am having trouble programming a button to stop & reset the countdown.

Code for countdown timer:

    $("#timer").html(minutes + ":0" + seconds);

    function countdown() {
        var countdownInterval = setInterval(function () {
            if (seconds > 0) {
                seconds--;
                //ADDS ZERO FOR VISUAL APPEARANCE IF LESS THAN 10 SECONDS
                if (seconds > 9) {
                    $("#timer").html(minutes + ":" + seconds);
                }
                else {
                    $("#timer").html(minutes + ":0" + seconds);
                }
            }
            else {
                //IF SECONDS ARE 0 && MINUTES 0 IT ENDS COUNTDOWN
                if (minutes === 0) {
                    clearInterval(countdown);
                    
                }
                else {
                    minutes--;
                    seconds = 59;
                    $("#timer").html(minutes + ":" + seconds);
                }
            }
        }, 1000);
    }

So this works fine on it’s own and stops itself appropriately when the time runs out. Next I want a stop both stops the countdown and restores default values. I have:

    $("#stop").click(function () {
        clearInterval(countdown);
        minutes = 25;
        rest = 5;
    });

It doesn’t seem to stop my countdown. I have a feeling it’s because the setInterval is set locally to it’s function? If so how can I program a button outside of the function to be able to access/stop it?

2

I declared the variable outside the function, then was able to fix my problem. Sometimes typing something out is helpful enough!

1 Like