MIDI.js - Sequencing in Javascript | Hacker News Reader

MIDI.js - Sequencing in Javascript

mudcu.be

87 pointsGuiA25 comments

Since tim cook removed midi support in mt lion, I've been looking for ways to get the midis that play on my professional homepage to work again. I tried this one and it's cool, but as far as I was able to use it, it was limited to just one instrument.

>midis that played on my professional homepage

We're partying like it's 1995 again!

You should actually check it out; even the title marquees.

For the lazy: http://bitfission.com/

1995 might be a bit generous; fun!

<blink>tim cook personally removed midi support in mt lion</blink>

That's some very tasty jpeg compression you got here.

ps: the github stat troll made me chuckle. https://github.com/will

Nice! I did the same thing for my homepage: http://www.matthewratzloff.com

I created a soundless MIDI file just so it would load the control. :-)

I see a lot of jokes about the mid-90s, Geocities, & by extension the Crescendo plugin, but that comes from a misunderstanding of what MIDI is. It's a set of instructions, not a sound format. The awful music you might associate with MIDI was your crappy soundcard interpreting note instructions. When you send those MIDI instructions to a more capable device, the results can be much better.

Where this is exciting is not in that you can embed background music in a web page without the bandwidth required of compressed audio, so much as that it is a step toward further opening up the realm of building interfaces for professional musical instruments (and not so professional musical instruments).

Anecdote time: In the late 90s, I'd bought a Roland drum machine that I felt had a really horrible programming interface, and I wanted to put my budding programming skills to use and build a nice visual interface that emulated the more intuitive devices from the 80s - and I had no idea where to start.

Fast forward to a couple of years ago, and in the heat of the "HTML5 can do anything Flash does" debate, I decided to try emulating one of my drum machines using only HTML5 & CSS - http://bitrotten.com/dr110/ - because while I felt it was impossible to do something like http://www.audiotool.com/ in HTML/JS/CSS, I wanted to put my money where my mouth was. (Result: Javascript timing is horrrrrible, audio handling is a work in progress, playback is inconsistent between browsers... Flash still wins by a very long mile on this front) But aside from the audio, I felt I could actually do a decent job of building out an interface.

I guess the point I'm getting at is that in the coming years, not only will audio improve, but with the ability to output MIDI, a very accessible set of free tools (as in, a text editor, and a web browser) means that fewer people will experience the frustration I had over 15 years ago when I wanted to roll-my-own interface for external music hardware.

Having said that, I think that solid timing will prove to be a formidable foe, particularly in a realm where you still have holdouts from the DIN SYNC era who say MIDI isn't responsive enough.

I've recently used this library to make an ear trainer app (http://www.earbuilder.com). It's pretty easy to use and the creator responds really quickly - the only issue I have at the moment is playing sounds simultaneously within Chrome.

This is really cool! I had some trouble with the harmonic setting at first (in Chrome), but after refreshing the page it seems to work fine. It's crazy how much harder it got once that setting went on.

Thanks - chords in Chrome has been an issue a few people are having. I'm still looking for an answer. :D

Sounds absolutely terrible on Firefox 18.0.2/Linux... I think it's sad MIDI isn't in the Web Audio API, the code for 95% of this is written already, just not accessible. The web really needs to reinvent everything in JavaScript I guess.

Yup; crackles abound. I pulled it up in Chromium 24.0.1312.70 to see if the sound was any better, and (most of) the crackles are gone. When > 4 notes play you still get a bit of crackle, but it's far, far better.

It's sad that everything HAS to be re-invented, but I am frequently excited to see what can be done with ES5. I'm eager to see what ES6 brings us.

Wow @ http://mudcu.be/midi-js/js/MusicTheory.Synesthesia.js. That's super interesting.

Looks like it came from here: http://rhythmiclight.com/archives/ideas/colorscales.html

One of the most disappointing things about my time at Berklee was that I never met anyone with Synesthesia.

The examples are pretty impressive. Would be a great way to learn piano with a bit more work.

https://github.com/qiao/euphony and http://mudcu.be/piano/

And Simon Says: http://labs.uxmonk.com/simon-says/

This is fantastic! A Javascript library that can transport you back to 1996 Geocities! Seriously, it is nice to start seeing sound tools for Javascript. Javascript, CSS, and HTML5 were to be the great Flash Slayers, but the things that Flash are "good" at, Video and Sound, seem the be last on the list of items to be implemented.

I'm seeing an indefinite "Loading: Soundfont..." spinner. Looking at the console, it looks like a few assets take a long time to download and then fail before finishing. Could it be your server is serving assets itself and killing the connection after ~10s?

This page really needs to show the title and composer of the song it's playing.

Holy shit, this is really really awesome! I have so many awesome ideas in my head right now. Thank you!!! :D

Very nice, and the soundfont sounds a lot better than the stuff that comes with most operating systems

Dosent work . Shows Loading Soundfont indefinitely ..

I don't hear anything on Chrome for Android.

also: http://www.multiplayerpiano.com/

still loading ... after 10 minutes.

same here

Reply on news.ycombinator.com