Timer is BUGGED

Hey, I am trying to build a Pomodoro clock. When I click in the "start" button everything works perfectly and the times begin from 25:00min until 00:00. And when I click in the "paused" button, it pauses as expected. BUT, if I click multiple times in the start/paused button, it starts behavior strangely, like the timer start and stop rapidly or skips over parts of the countdown altogether, mostly in the seconds... How can I solve it? https://codepen.io/ssstephanyyy/pen/vYVydRz
14 Replies
~MARSMAN~
~MARSMAN~β€’2y ago
I think you will need a debounce / throttle function. So the timer doesn't have to reset too fast multiple times because of continues clicking, which is causing the weird numbers.
Sste
Ssteβ€’2y ago
@therealmarsman can you show me how can I do it please?
~MARSMAN~
~MARSMAN~β€’2y ago
Yes one second
Sste
Ssteβ€’2y ago
Ok
~MARSMAN~
~MARSMAN~β€’2y ago
Sorry for the delay 😬 Got busy, but also.. There were couple of things in your code that needed more than just a debounce . I made a CodePen and also there's explanation inside it.
~MARSMAN~
~MARSMAN~β€’2y ago
See lines: 1 ( the debounce function) 28 50 ( where I applied the debounce on the event listener) 60 ( i changed the logic a bit there for whenever the user clicks on the button ) 70 Also i added lines 85-86
Sste
Ssteβ€’2y ago
As a beginner, it's been hard to understand your code, mostly the debounce functionπŸ˜… @therealmarsman is there another way to resolve my problem?
~MARSMAN~
~MARSMAN~β€’2y ago
You can ignore the debounce function for now See the other things i added.. I'll try to explain more in a few, just busy cleaning the house it's holiday tomorrow hehe
Sste
Ssteβ€’2y ago
Thanks
Queequeg
Queequegβ€’2y ago
I think you are creating multiple intervals; each time you start your timer, you create a new interval, but don't clear the currently running one. This means the more you start/pause, the more confused the count down will appear. Try clearing the interval before you create a new one. This will ensure that you only have one.
Queequeg
Queequegβ€’2y ago
Queequeg
Queequegβ€’2y ago
If you clear the interval before each start, you have to make sure you keep the currentTime up to date and only use startTime when resetting the currentTIme. I also reset the startButton label on reset. πŸ™‚ You are definitely getting stronger with JavaScript.
Sste
Ssteβ€’2y ago
Thanks so much πŸ˜ŠπŸ‘
Want results from more Discord servers?
Add your server