This is a simple visual cue for my students. While they are working independently, I can use this to let them know if/when they are getting too loud.

The page starts with all lights off until the up-arrow key is pressed. To increase or decrease alert levels, use the up or down arrow keys.


Add option to play alarm sound when highest level hit. Maybe make option to use different sounds, e.g. ambulance, kleig horn, car alarm, etc.

Using CSS3, set transition property for quick fade. Unfortunately, as of Sep 2013, modern browsers unable to implement.

Eventually add the ability to "skin" by changing color or image of trafficFrame element and/or background image. Possibly use actual photo elements for frame and lights. I also like the idea of a blurred or pixelated, compressed version of current background, which would also make image file smaller. I might be able to make a horizontal bar or half circle reminiscent of my noise level needle display of yore. That would use images for the background, most likely.

Keep looking for way to read microphone!! Would love for this to be completely automatic without resorting to Flash programming.