This is really fun, FYI. Social features would be fun.
Show HN: Drum machine in 100 lines of HTML/JS
41–50 of 51 posts
Re: Show HN: Drum machine in 100 lines of HTML/JS
#42I had a go at rewriting this to use requestAnimationFrame, and provide more instruments and some random/clear buttons: https://blog.omgmog.net/beatmaker/ Including whitespace it's 102 lines: https://github.com/omgmog/beatmaker/blob/master/js/index.js An interesting thing, after a short while the browser unloads the page (Chrome on Mac OS) -- probably due to memory usage, which I think this is down to creating a new A…
Well your version doesn't crash shortly after toying around in it unlike OP's so good job!.
Re: Show HN: Drum machine in 100 lines of HTML/JS
#43I thought the drum sounds would be generated using JS, but they are just pre-recorded samples (bass_drum.wav, snare_drum.wav, low_tom.wav, mid_tom.wav, hi hat, cymbal, cowbell, hand clap, hi tom, conga, claves). I'm looking for drum-generated sounds using pure javascript, so I can make changes on them and create new kinds of sounds. I already created some pure JS sounds (e.g. laser sounds, bass effect, white noise, a…
I can't give you 'realistic' drum sounds, but I was working on an approximate recreation of a Roland analog drum machine using only Javascript. I got the sound engine down more or less, but kind of fell off the rails when I moved away from my earlier, crappier sequencer and started using a framework. The sounds should work across browsers when you're manually playing (use the bottom row of your keyboard) but when seq…
Looking at the source, yours appears to be sample based too. I think the GP was interested in an oscillator based sound engine.
Re: Show HN: Drum machine in 100 lines of HTML/JS
#44Cool! It would be cool to have more instruments to create little loops to share with friends.
Re: Show HN: Drum machine in 100 lines of HTML/JS
#45Super fun.
Re: Show HN: Drum machine in 100 lines of HTML/JS
#46I had a go at rewriting this to use requestAnimationFrame, and provide more instruments and some random/clear buttons: https://blog.omgmog.net/beatmaker/ Including whitespace it's 102 lines: https://github.com/omgmog/beatmaker/blob/master/js/index.js An interesting thing, after a short while the browser unloads the page (Chrome on Mac OS) -- probably due to memory usage, which I think this is down to creating a new A…
Really like your changes! I've incorporated your use of requestAnimationFrame and AudioContext back into mine:
https://github.com/siggy/beatboxer/commit/dccff243474b17ca34...
Re: Show HN: Drum machine in 100 lines of HTML/JS
#47Earlier quoted context omitted.
First, it's an enourmous waste of computing resources. Second, it doesn't even work, since the 'setinterval' is unusable for audio timing. Third, what's there to show off? So Javascript got a 'PlayWav' function that you call in not so regular intervals depending on buttonstate. Simple beatbox is simple. Could aswell be 30 lines.
Not sure why this is down voted — the demo literally does not work in my browser (Safari 10) because of the (mis)use of setInterval.
>Safari
Try a better browser first. You might as well be using IE 8. I could write a book about the things that don't work in Safari.
Re: Show HN: Drum machine in 100 lines of HTML/JS
#48Earlier quoted context omitted.
I can't give you 'realistic' drum sounds, but I was working on an approximate recreation of a Roland analog drum machine using only Javascript. I got the sound engine down more or less, but kind of fell off the rails when I moved away from my earlier, crappier sequencer and started using a framework. The sounds should work across browsers when you're manually playing (use the bottom row of your keyboard) but when seq…
Looking at the source, yours appears to be sample based too. I think the GP was interested in an oscillator based sound engine.
These appear to be the synthesized versions:
https://github.com/leviathant/BossDR110/blob/feature/synthes...
To the parent, what did you use as the reference for the synthesis patches and parameters? I wouldn't mind trying something similar in ChucK.
Re: Show HN: Drum machine in 100 lines of HTML/JS
#49Earlier quoted context omitted.
Looking at the source, yours appears to be sample based too. I think the GP was interested in an oscillator based sound engine.
These appear to be the synthesized versions: https://github.com/leviathant/BossDR110/blob/feature/synthes... To the parent, what did you use as the reference for the synthesis patches and parameters? I wouldn't mind trying something similar in ChucK.
My Boss DR-110, a probe, and oscilloscope software - Visual Analyser 2011. You can short the different individual oscillators to ground, and they'll come out the audio & headphone jack.
There's a great breakdown of how the circuitry works at http://www.sdiy.org/richardc64/new_drums/dr110/dr110a1.html - but some of the frequency values there (related to the cymbals) didn't sound right to me - though it's possible I misinterpreted what's going on at that page.
Re: Show HN: Drum machine in 100 lines of HTML/JS
#50Earlier quoted context omitted.
I can't give you 'realistic' drum sounds, but I was working on an approximate recreation of a Roland analog drum machine using only Javascript. I got the sound engine down more or less, but kind of fell off the rails when I moved away from my earlier, crappier sequencer and started using a framework. The sounds should work across browsers when you're manually playing (use the bottom row of your keyboard) but when seq…
Looking at the source, yours appears to be sample based too. I think the GP was interested in an oscillator based sound engine.
I started out with a sample-based version in 2011 or so, but the link I posted uses synthesized sounds, in updates I made last year. Have a closer look at the javascript as referenced in index.html and take a look at dr110_synth.js
This is probably most evident if you play a roll on the snare or the handclap. A free-running LFO on the noise sources for these instruments prevents "machine-gunning" like you get when you roll a sample.