MIDI.js (on github) ties together, and builds upon frameworks that bring MIDI generation 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!
// interface to download soundfont, then execute callback;
MIDI.loadPlugin(callback);
// simple example to get started;
MIDI.loadPlugin({
instrument: 1, // or "Acoustic Grand Piano"
callback: function() {
MIDI.noteOn(0, 100, 127, 0); // plays note once loaded
}
});
MIDI.noteOn(channel, note, velocity, delay); MIDI.noteOff(channel, note, delay); MIDI.chordOn(channel, chord, velocity, delay); MIDI.chordOff(channel, chord, delay); MIDI.keyToNote = object; // A0 => 21 MIDI.noteToKey = object; // 21 => A0
MIDI.Player.currentTime = integer; // time we are at now within the song.
MIDI.Player.endTime = integer; // time when song ends.
MIDI.Player.playing = boolean; // are we playing? yes or no.
MIDI.Player.loadFile(file, callback); // load .MIDI from base64 or binary XML request.
MIDI.Player.start(); // start the MIDI track (you can put this in the loadFile callback)
MIDI.Player.resume(); // resume the MIDI track from pause.
MIDI.Player.pause(); // pause the MIDI track.
MIDI.Player.stop(); // stops all audio being played, and resets currentTime to 0.
Callback whenever a note is played;
MIDI.Player.removeListener(); // removes current listener.
MIDI.Player.addListener(function(data) { // set it to your own function!
var now = data.now; // where we are now
var end = data.end; // time when song ends
var channel = data.channel; // channel note is playing on
var message = data.message; // 128 is noteOff, 144 is noteOn
var note = data.note; // the note
var velocity = data.velocity; // the velocity of the note
// then do whatever you want with the information!
});
Smooth animation, interpolates between onMidiEvent calls;
MIDI.Player.clearAnimation(); // clears current animation.
MIDI.Player.setAnimation(function(data) {
var now = data.now; // where we are now
var end = data.end; // time when song ends
var events = data.events; // all the notes currently being processed
// then do what you want with the information!
});Color.Space(0xff0000, "HEX>RGB>HSL");
DOMLoader.script.add(src, callback);
DOMLoader.sendRequest(src, callback);