hehe.. I was just a few squares short of recreating drop it like it's hot :D
Show HN: Drum machine in 100 lines of HTML/JS
11–20 of 51 posts
Re: Show HN: Drum machine in 100 lines of HTML/JS
#12I can change color of the boxes. Something animates from left to right. But I can't hear anything. (Android 7, latest Chrome.)
Tried it on my desktop computer now - works just fine, nicely done. Needs more cowbell, though.
Re: Show HN: Drum machine in 100 lines of HTML/JS
#13How peculiar you didn't use the webaudio API for this. I'm working on something similar right now for sun, but with a bank of generated sounds through the oscillator.
Re: Show HN: Drum machine in 100 lines of HTML/JS
#14Nice! A little feature suggestion -- it would be really cool if the current pattern were encoded in a URL so you could link it to friends. :)
Re: Show HN: Drum machine in 100 lines of HTML/JS
#15With a slider to change bpm:
Re: Show HN: Drum machine in 100 lines of HTML/JS
#16Never use setInterval for audio based applications. It's just totally unreliable. WebAudio has nice built in features for high precision timing.
Re: Show HN: Drum machine in 100 lines of HTML/JS
#17With a slider to change bpm: http://www.bambax.com/beatboxer/
Nice, but your slider is blocking interaction with most of the boxes http://i.imgur.com/Ae4uyoJ.png
Re: Show HN: Drum machine in 100 lines of HTML/JS
#18Nice! A little feature suggestion -- it would be really cool if the current pattern were encoded in a URL so you could link it to friends. :)
With pattern encoding and history change:
http://www.bambax.com/beatboxer/index.html#x||||x||||x||||x|...
Re: Show HN: Drum machine in 100 lines of HTML/JS
#19Re: Show HN: Drum machine in 100 lines of HTML/JS
#20Very cool! It'd be great if you could also serialize the notes to the url, so people can share these.
An implementation:
http://www.bambax.com/beatboxer/index.html#x||||x||||x||||x|...
Edit: now also saves bpm value: http://www.bambax.com/beatboxer/#x||||x||||x||||x||||||x||x|...