I’m currently adding CSS, so it’s pretty ugly. However, I’d appreciated feedback, and hope someone can break the clock!
http://s.codepen.io/shawngrooms/debug/KNMNxB
This sounds fun! I’ll take a stab and let you know! And I wouldn’t worry too much about the appearance for now. Having a nice clean finished product of course is always nice, but functionality always trumps all I say!
Hmmm… the countdown is getting down to 2 min and then starting over at 3 min (session timer) - keep in mind I did try messing with the session length while it was running so not sure if this has anything to do with it… When I did mine, this was super problematic for me, so I made it so that the timer that was running had to be paused in order to change the length of time on the clock.
Side note: I paused it to write this post, then let it run again, and it got to down to 0 and switched to the break timer, but now it hits 9:00 and keeps restarting at 9:59 (stuck in 1 min loop).
@no-stack-dub-sack I think part of the reason was that I was stilling playing with it after I posted the link. However, I did forget to deactivate the buttons while the time was going. Thanks! I’ll let you know when I fix it!
Sounds good, and no prob! I’ll check it out again then to see if I can break it in any other way
Not that you in any way have to follow this convention, but it worked for me. I still allowed the timer that wasn’t running to be adjusted - e.g. if session is running, you can’t change that, but break can still be adjusted so that if you decided you wanted a 10 min break instead of 5, you can change it while the session is counting down.
Nope, they better get their @$$ back to work!
@SEGrooms same thing is happening - I set the session to 5 min, let it run down, got to the “Relax” timer and it is stuck on a 1 min loop (down to 4:00 back to 4:59). I am using Chrome if that helps at all.
One thing that might help you figure out where bugs are: every time there’s a button push, use console.log() to log which button is pushed. That way, when there’s a bug, you can see what order of button pushes created that bug. Just a thought! I relied on this heavily for things like the tic tac toe app, simon, and calculator.
EDIT: I let it keep going for a bit, went to another tab, came back, and now it says completed. So something happened while I wasn’t looking, but it was still stuck in that loop for a while.
http://s.codepen.io/shawngrooms/debug/KNMNxB I challenge you @no-stack-dub-sack!
@SEGrooms haha, I like this game. Let’s see…
@SEGrooms Ok, ok - I finally figured out what’s happening - I think. Easier to tell since I set it for a shorter amount of time this time. I set the break for 2 min, and the session for 2 min - it’s actually counting down 2 min, and changing when it’s supposed to - BUT - the minute indicator is not decrementing. I thought it was looping over and over, but it’s not, it just showed me 1:59 when it was supposed to show me 0:59… so it went from 1:01 > 1:00 > 1:59 (should have been 0:59). Almost there!
p.s. I like what you did with the options just disappearing when the timer starts! Nice solution. Looking better overall now!
OH! How foolish of me. I believe I’ve only been testing it from 1 min! haha yeah, I removed the temptation from you, so now you don’t feel compelled to adjust the timer, lol. Thank you again for the feedback!
@SEGrooms no prob! I worked through these not long ago and know how tough they can be. Checking this out was actually very useful to me- so thanks to you too! It gave me some good inspiration for something I am working on.
Uh oh, now I noticed that when it switches from Work to Relax, instead of starting the countdown at the given number of Relax minutes, it went to negative countdown:
bahaha! I had to stop yesterday. I’m working on it right now. I think it’ll be an easy fix
Alright @no-stack-dub-sack, checkmate!
http://s.codepen.io/shawngrooms/debug/KNMNxB
Ok - I give up. You win!
Well done.
Now as a bonus tidbit - and this is super tricky/potentially unnecessary depending on your application, so just something to think about going forward when using setInterval()
:
setInterval()
has a tendency to drift/slow down when the tab that it’s running in is not active/minimized/out of focus, especially at smaller intervals like 1000ms (less than that and I believe the interval will pause altogether when the tab is out of focus). So if you have a 10 minute timer running in another tab (decrementing at 1000ms intervals), it will not accurately count 10 minutes, it will actually be closer to 10.5/11. And of course, the effect is exacerbated the greater the amount of time (25 min would prob end up being something closer to 33). So, if you were actually going to implement a production timer that is supposed to say, let you know when your pasta is perfectly al dente, this is something that you would def need to look in to if you were using setInterval()
to measure time (otherwise you’d end up with pretty soggy pasta!).
@no-stack-dub-sack I didn’t know that! I almost used Date.now(), but I figure setInterval would be simpler. I can’t thank you enough @no-stack-dub-sack!!!
@SEGrooms no worries at all. And for the scope of this project - nothing is wrong with setInterval()
at all… just a useful tidbit for future reference.
Good luck and happy coding!