goofy1337, setInterval лучше заменить на setTimeout.
<div>Минуты: <span id="minutes">10</span></div>
<div>Секунды: <span id="seconds">00</span></div>
<button id="start">Start</button>
<script>
class Timer {
constructor(seconds) {
this.__startValue = 0;
this.__currentValue;
this.__state = false;
this.__listeners = {
count: []
};
this.__startValue = this.__currentValue = seconds;
}
__countdown() {
if (!this.__state || !this.__currentValue)
return this;
this.__currentValue--;
this.__trigger('count');
setTimeout(this.__countdown.bind(this), 1000);
return this;
}
start() {
this.__state = true;
this.__countdown();
return this;
}
stop() {
this.__state = false;
return this;
}
reset() {
this.__currentValue = this.__startValue;
return this;
}
getSeconds() {
return this.__currentValue;
}
onCount(callback) {
this.__listeners.count.push(callback);
return this;
}
__trigger(event) {
if (!this.__listeners[event])
return;
var timer = this,
list = this.__listeners[event];
list.filter(function(callback, i) {
try {
callback(timer);
return true;
} catch (e) {
return false;
}
});
this.__listeners[event] = list;
return this;
}
}
var timer;
start.onclick = () => {
if (!!timer)
return;
timer = (new Timer(
+minutes.textContent.trim()*60 + +seconds.textContent.trim()
)).start().onCount($timer => {
let sec = $timer.getSeconds(),
min = Math.floor(sec / 60);
sec = sec - min * 60;
minutes.textContent = min;
seconds.textContent = sec;
});
};
</script>