Useful timer bookmarklet for scrum or other meetings

Since I regularly find myself in scrum meetings that run overtime, I started looking for a way to extend our current scrum tool (acunote.com) to show a visible countdown timer during the meeting. I wanted it to give each team member an equal share of time and indicate when their speaking turn is running out. Scrum tools are a dime a dosen and we’ve switched between a few already, so I decided to implement the timer as a generic bookmarklet.

Being a bookmarklet I had to keep it generic for any page, and had to implement an improved ResourceLoader script, which takes an array of scripts and/or CSS resources and loads them dynamically. As mentioned, since I don’t know on which page it will be used, I had to update the loadResources script to first test if the required libraries are already loaded and if not, to fetch them and callback when ready.

For the design I came u with the following requirements:

When clicked, the bookmarklet should show a floating, semi-transparent window with controls to set the total duration for the meeting and the number of turns, each with a name. When it has enough data, it should start the timer and show a progressbar indicating the lapsed time. When a turn is at 75% of its allocated time, the progressbar should turn orange and when at 90% it should turn red.

The result is below … to try it out, drag the link below to your toolbar.