Hey,
So I’m bit stuck, the idea is to have one timer replace the other one back and forth. I only manage to have the break replace the session one time and from then on the timer gets reseted only for the break.
I’;m not really sure how to chain the two together.
Any suggestions would be awesome.
here is my .js code:
function modSessionTime( val ) {
var s = document.getElementById('session-length').innerHTML
var int = parseInt(s, 10) + val
if (int < 0) {
int = 0
}
document.getElementById('session-length').innerHTML = int
document.getElementById('time-here').innerHTML = int
return int
}
// -------------------------------------------------------------------------
function modBreakTime( val ) {
var t = document.getElementById('break-length').innerHTML
var int = parseInt(t, 10) + val
if (int < 0 ) {
int = 0
}
document.getElementById('break-length').innerHTML = int
return int
}
// -------------------------------------------------------------------------
function startTimer(duration, display) {
var timer = duration, minutes, seconds
var clock = setInterval(function () {
minutes = parseInt(timer / 60, 10);
seconds = parseInt(timer % 60, 10);
minutes = minutes < 10 ? "0" + minutes : minutes
seconds = seconds < 10 ? "0" + seconds : seconds
// Assing text content as a property for display
display.textContent = minutes + ":" + seconds
// This section moves the clock downward if the timer is above 0
if (--timer < 0) {
timer = duration
}
// This section stop the interval (timer) when the clock reaches 0
// Useful for swtching between timers (only switches once!!!):
if (timer == 0) {
clearInterval(clock)
var duration = (document.getElementById('break-length').innerHTML)*60
startTimer(duration, display)
clearInterval(clock)
}
function stop () {
clearInterval(clock)
}
document.getElementById('stop').onclick = function() {
stop()
document.getElementById('time-here').innerHTML = document.getElementById('session-length').innerHTML
// console.log(typeof document.getElementById('time-here').innerHTML)
}
}, 1000)
}
// -------------------------------------------------------------------------
function start () {
var duration = (document.getElementById('time-here').innerHTML)*60
var display = document.querySelector('#time-here')
startTimer(duration, display)
}
document.getElementById('start').onclick = function() {
start()
}
// -------------------------------------------------------------------------
// Button functionality using modSessionTIme BreakSessionTime
document.getElementById('session-plus').onclick = function() {
var val = 1
modSessionTime(val)
}
document.getElementById('session-minus').onclick = function() {
var val = -1
modSessionTime(val)
}
document.getElementById('break-plus').onclick = function() {
var val = 1
modBreakTime(val)
}
document.getElementById('break-minus').onclick = function() {
var val = -1
modBreakTime(val)
}
I apologize the pomodoro is ugly at this point