Embedded MidiFile player
This script uses midicube's player (MIDI.js's successor) (and their HTML, etc.) to make it easy to add a MIDI player
for any file or base64 data.
(in order to make m21.css as light as possible, since around v0.16 the midiPlayer has its own CSS file)
The script looks something like this:
<div id="putMeHere">
<link rel="stylesheet" href="../css/m21.css">
<link rel="stylesheet" href="../css/midiPlayer.css">
<script src="../releases/music21.debug.js"></script>
<script>
const mp = new music21.miditools.MidiPlayer();
const domEl = document.querySelector('#putMeHere');
mp.addPlayer(domEl);
mp.base64Load('data:audio/midi;base64,TVRoZAAAAAYAAAABAYBNVHJrAAAu3QD/UQMH0zQA/wM...');
</script>
Notice that multiple MidiPlayers can coexist on the same page, as demonstrated with the two
players below.