I've been working on FreeCodeCamp Front End development project 25 + 5 Clock. I'm trying to click the play button and make it countdown. I know it enters my countdown function but when logging it, I think it is only calling once. So I think my setInterval might be wrong but I've also struggled with using setState on all projects. They have only taught using this.setState and this has often caused problems because the state is not what I expect it to be (like it's not immediate). I'm not ready to dive into the concepts of DidMount, WillMount, etc so I'd like to stay in the boundaries of using setState if that is where my problem is. Below is a link to my codepen
handleCountDown(pause){
let timer;
if(pause){
clearInterveral(timer)
} else {
if(this.state.minutesLeft === '' && this.state.secondsLeft === ''){
if(this.state.session){
timer = setInterval(this.countdown(Number(this.state.sessionLength), 0), 1000)
} else {
timer = setInterval(this.countdown(Number(this.state.breakLength), 0), 1000)
}
} else {
timer = setInterval(this.countdown(Number(this.state.minutesLeft), Number(this.state.secondsLeft)), 1000)
}
}}
countdown(min, sec){
const second = 1000;
const minutes = second * 60;
const countDate = (new Date().getTime()) + (second * sec) + (minutes * min);//target time
const now = new Date().getTime();
const gap = countDate - now;
const textMinute = Math.floor(gap / minutes);
const textSecond = Math.floor((gap % minutes)/ second);
if(textSecond === 0){
textSecond = '00'
}
this.setState({
minutesLeft:textMinute.toString(),
secondsLeft:textSecond.toString()
})}