Looking for help with Pomodoro Clock setInterval pausing

Looking for help with Pomodoro Clock setInterval pausing
0

#1

Here’s my JS code so far:

var setTime = 25 * 1000 * 60;
var started = false;

function countdown() {
  var seconds = Math.floor( (setTime/1000) % 60 );
  var minutes = Math.floor( (setTime/1000/60) % 60 );
  var formattedNumber = ("0" + seconds).slice(-2);
  document.getElementById("clock").innerHTML = minutes + ":" + formattedNumber;
  if(setTime > 0) {
    setTime -= 1000;
  }
}

$(".start_button").click(function() {
  var counter = setInterval(countdown, 1000);
  console.log("Started is: " + started);
  if(!started) {
    console.log("Entered if statement 1");
    started = true;
    $(".start_button").html = "Stop";
  }
  else {
    console.log("Entered else statement");
    window.clearInterval(counter);
    $(".start_button").html = "Start";
    started = false;
  }
});

My problem is I’m trying to use some form of clearInterval to pause the countdown but it doesn’t, and if I continue pressing the button with class “start_button” it compounds the setInterval function and makes it countdown faster. The console.log() statements show that it does get into the if and else statements as intended when the button is pressed. I did mess with window. prefix on some of the different components but it didn’t fix it and TBH I’m kind of sketchy about how it would help/hurt functionally.


#2

Nevermind, I realized I’m creating an interval every click and only removing an interval every second click. I made counter a global variable for now and now it works as intended.