The Freakin' Sequencer

Information for use

Click in a box to enable/disable the instrument in that row for that beat, or use one of the keyboard shortcuts (see below).

The top row reflects which beat is currently active.

The second through fifth rows are a kick, snare, hihat and wood block.

Press space to start or stop the sequencer.

Press z to use the kick drum, x to use the snare drum, n to use the hihat or m to use the wood block.

Right click anywhere on the page, select view source and start hacking!

Information about the implementation

This is using only HTML and Javascript, there is no flash or any kind of plugin magic going on.

I'm using a simple wrapper around the <audio> tag, SoundManager, to play the same sample more than once at a time and to cut down the number of tags needed to do so.

All the timing is controlled by the Loop object via callbacks that trigger Pad objects to feed Track objects to SoundManager. Right now it's very inefficient and will most likely be completely rewritten. In saying that though, if this level of functionality can be achieved with such a naiive approach, some careful optimisations should yield quite satisfactory results.

Information about the author

This was written by deoxxa after work on the 16 of September, 2011.

Source code is, of course, available on GitHub.