midi.js - Sequencing in Javascript.

0:00 -0:00
Loading API...

What’s all this hubub?

midi.js ties together, and builds upon frameworks that bring MIDI to the browser. Combine it with jasmid to create a web-radio MIDI stream similar to this demo, or with Three.js, Sparks.js, or GLSL to create Audio/visual experiments. Piano/guitar simulations, Drum machines, MIDI recording, and all kinds of certified funkitude is within your grasps!

Google Chrome is recommended for best listening experience, it’s timing perfection! Firefox and Safari can both perform a bit more like the piano has been drinking, arrr.

Carpe beerum, and commandeer yer own copy!

Basic Examples

  1. MIDI Player
  2. Whitney Music Box

Demos

  1. Color Piano by Michael Deal mudcube
  2. 3D Piano Player w/ Three.js by Borja Morales @reality3d
  3. Simon Says by Daniel Christopher uxmonk
  4. Brite Lite by Daniel Christopher uxmonk
  5. Euphony 3D Piano by Xueqiao Xu @qiao
  6. VexFlow by Mohit Muthanna @11111110b
  7. Spiral Keyboard by Patrick Snels
  8. Whitney Music Box by KrazyDad
  9. Ragamroll by Mani Balasubramanian

Many thanks to the authors of these libraries!

  • <audio>:  HTML5 specs
  • WebAudio API:  W3C proposal by Google
  • WebAudio API Shim
  • WebMIDI API
  • WebMIDI API Shim
  • SoundManager2 by Scott Schiller (Flash fallback)
  • jasmid:  MIDI file byte-code reader, and translats into a Javascript array.