MIDI for Web

History

Browser support for midi has changed greatly over the years. It's always been treated as a sort of cousin Eddie. At this point it looks like HTML5 won't include it. Plugin vendors like DIVX and QuickTime probably won't update to 64-bit drivers, so that effectively kills midi on web pages.

LibTimidity and Midi.js

Our demo of LibTimidity is Here >

​Basically, you just need LibTimidity and a sound bank.
I'm not sure if this needs to run on a public domain or if it can also run on localhost.

For the sound bank, just download the whole GitHub project, but you'll only use the sound banks. I'm not sure of the copyright status of the audio samples.

Possible Current Solution

The Timidity JS library. I initially started looking at Jasmid JS library, but it looks like it can only handle one voice per midi program. A significant limitation, if that's actually the case. Also, the playback is a bit crackly, as if it's heavily dependent on processor power.
Timidity combines with Midi.js. The trick is, you have to create a soundbank (Bank, Sound Bank, Wavetable Synth). This is essentially a buttload of short tiny WAV files, one for each general midi (GM) voice, including a drum set. A Soundfont, for instance. These are structured files. They contain the WAVs, but there are also many other parameters like the loop cue points, for samples that need them.

Find or Create Samples

Plenty of GM compatible soundfonts already available. You'll have to extract the WAV files.

Old Solutions

QuickTime and LiveAudio Syntax

<EMBED SRC="your file.mid (or .aif)" HEIGHT=O AUTOSTART=TRUE LOOP=TRUE>

Attributes

Other attributes that work for midi plugins include:

AUTOSTART=TRUE / FALSE
LOOP=TRUE / FALSE / INTEGER (where "INTEGER" = number of loops)
STARTTIME=1:32 (where "1" is one minute, and "32" is 32 seconds, controls how far into the sound file the playback begins)
ENDTIME=2:45 (where "2" is one minute, and "45" is 32 seconds, controls how far into the sound file the playback ends)
VOLUME=0-100 (sets the sound volume between 0 and 100%)

These attributes can also be used within the <embed src=""></embed> tag for standard embedded sound files that can also be played by the LiveAudio plugin or other midi/sound plugins, eg:

<EMBED SRC="your file.aif" CONTROLS=CONSOLE HEIGHT=15 WIDTH=144 AUTOSTART=TRUE LOOP=3 VOLUME=75>

Specific other attributes for using the Quicktime plugin for midi or sound file play can be found here.

613 reads • Last Modified: Sunday, August 21, 2016