PhotoshopDesign

At the recent Web Directions JavaScript libraries panel, I was in charge of representing the hard-working non-library hacker. (Of which there exist approximately two in the wild.) And when it came to the final exercise -- the one with the aim of blowing people's minds -- there was but one thing I could do: make a drum machine. Without libraries. Without Flash.

I'm fully aware that there's much better ways of working with sound on the Web, but I' m also fully aware that I like making useless toys. The result of these two realisations? JS-909.

I mainly post this because a few people have asked about it; I pretty much only wrote it for performance on stage. I don't guarantee it'll work in X browser on X platform. If it does work, I don't guarantee that it will work particularly well.

I do guarantee that if I'm running it on my computer, on a stage, through a loud speaker system with plenty of bass, in front of a couple hundred people, it kinda makes me feel like a rockstar.

Controlling sound in the browser from JavaScript probably relies on the Quicktime plugin (I don't know, I couldn't test on anything that didn't have Quicktime). But in my tests it does work in IE6, Firefox 3 and Safari 3.

Note added 2008-11-18: There is no standard browser protocol for accessi ng sound controls (i.e. stopping, rewinding, playing) on an embedded player. So, to make it easy I used Quicktime's JavaScript interface to control its playing of the sounds in the drum machine.

It might be possible to control sound through other players using different ActiveX controls (or other plugin architectures), but it wasn't really my intent to have a cross-browser solution and Quicktime's controls are the only documented ones I could find.