Brain Timer

Brain TimerIt seems like every exam I’ve given I scramble to find a clear and easy-to-use clock and countdown timer. (I like to project these in the lecture hall so students can pace themselves (or panic, as appropriate, when time is running short).) So I whipped up one of my own. Displays current time on the left, and the remaining time in a “1h 2m” remaining format. Also sweeps out a decreasing arc of brain as the time decreases.

Feel free to use, adapt, steal as you please.

There are a few things that could use tweaking.

I went the simplest possible route and used a JavaScript setInterval() function.

This is not great for at least the following reasons:

  1. It causes a delay before running the contents of the interval function
  2. It is not the most reliable timer, possibly running over the expected time

That said, (1) I’m mostly going to use it for timing 75 minute chunks, so starting 5 seconds late doesn’t matter much. And, (2) I tested it a few times while doing other things on my computer and it was accurate enough.  Maybe picked up a few seconds over the course of an hour, but not more than a minute.  Perhaps in the future I will switch to a setTimeout() version that calculates time remaining by comparing the target time to the current system time.

Image loading after page loading is a little annoying on something so minimal.  Probably should add an image preloader.

I’d also like to eventually allow you to upload your own image.

On the plus side, I was happy to find out how easy it was to play around with SVG (which I used in making the overlay mask). SVG + JS = Magic. Seriously.

Anyway, as my mother says: “Good enough!”

Leave a Reply

Your email address will not be published. Required fields are marked *