Simple graphical Javascript Timer

A while ago, for a friend’s party I wrote a very simple Javascript Timer.

The other day, my daughter (too young to understand a numeric countdown at the moment) was messing around at dinner (not unusual). I wanted a simple graphical way to explain that after a set amount of time I would take her dinner away to encourage her to eat up.

Slightly to my surprise I couldn’t find anything with Google (my Google-fu is obviously weak). So I extended my little timer so that it shows a green ball for each second remaining. As the time ticks down, the balls turn red.

I was originally going to use a progress bar but this way shows, at a glance, how much total time there was…

I think it’s working pretty well