Hey guys. First, codepen! http://codepen.io/torgian/pen/qqjvXo
I’m sticking with using native javascript, so no libraries involved. Yes, basically hard mode for me, but I wanted to get better at using native javascript before relying too much on libraries like jQuery and such.
My biggest hurdle came with a timing problem. Essentially, whenever I clicked the “start” button, it would work as advertised, but if I clicked it to stop, then quickly clicked it again to start the clock, sometimes the previous cycle didn’t finish, so it would essentially be counting “double” seconds.
A friend of mine suggested using Moment.js to help. I studied that for a bit, read around, and then rewrote the timing portion of my program to be more concise, using Date objects, and finally got it working right.
Total hours spent on this project: about 15 or so. I also did some stuff with animation and such, but left that out. I’m using the pomodoro clock as a test bed for animation timings and stuff like that now.
I know it’s not the most accurate clock, but for this use, I think it’s fine. Once I started reading about Javascript’s timing issues and stuff, I found it to be a deep deep rabbit hole.
Anyways, please take a look at my code! Suggest improvements! I know it’s kind of messy…