TR 808 Drum Machine in HTML5, CSS, and Javascript
Authors: John McCain, Audrey Evans, Hari Ramanan, and Alan Wang
For Prof. Gibbons' EECS 448 class
This drum machine is modeled after the Roland TR808, the classic drum machine that has profoundly effected popular music since it's introduction in the early 1980s.
Sounds are samples of a real TR808 with knobs at several positions (with resolution of 5 samples per knob). The samples were made by Michael Fischer & Hyperreal.
The MyBufferLoader.js file is based off of BufferLoader.js from HTML5Rocks.com.
Resources used include JQuery, FontAwesome icons, and jsdoc.
You can access the drum machine here.
Documentation for this project can be accessed here.
##Known Bugs
| Bug | Details |
|---|---|
| Responsive Formatting | Responsive formatting displays incorrectly for certain screen sizes |
| Mobile Timing | Timing for beats can be inaccurate on certain browsers, particularly on mobile (this is due to constraints placed on the frequency of scheduled callbacks in some browsers) |
| Knob Turning | Knobs seem to wobble slightly when being turned |
| Browser Support | The drum machine doesn't work in some older browsers due to the newer technologies used (like vh/vw css units & the Web Audio API) |
| Clipping | Volumes set to high levels can cause the drum machine to clip |
| Sticky Knobs | Mouseup event sometimes doesn't register, causing the knob to continue to rotate until another click event happens (difficult to replicate) |
| Interrupted/Slow Connection | A slow or unreliable connection will cause the drum machine to fail to load |