February 16, 2013

Countdown Timer

Filed under: Technical — Tags: , — James Bunton @ 1:06 am

I was looking around online for a simple, good looking, web-based countdown timer. The best I could find were using Flash, ugh. So I did what any self-respecting software developer would do and wrote one myself! :)

It’s all Web 2.0 and shiny. I used some new (to me) techniques for the first time which made things interesting. All the on-screen elements are hidden and shown using CSS only. All event handlers are bound once on startup. As the application changes state I add/remove CSS classes from the body element, this triggers hide/show of various elements and automatically activates and deactivates other event handlers. This is much less error prone than managing all this state explicitly in my code as I’ve done in the past.

Try it out here:

Or grab the source code:
git clone https://delx.au/git/countdown-timer

1 comment

Jono says:

Awesome! I have had similar woes in the past. May also grab the code to see how it all fits together :)

Comments are closed.