There's another new button in the post editor. This time it's MIDI . The AUDIO BBCodes don't work for MIDI (.mid) files, because they are not really audio files, but rather a stream of inputs to a synthesizer. So I've implemented MIDI playback using the javascript functions kindly provided free-of-charge by https://www.midijs.net/.
For example:
[midi=https://forum.sagittal.org/download/file.php?id=177]Johnston 10 ii Solemn fragment[/midi]
generates this player, with start and stop buttons, and the duration in seconds:
▶️ ⏹️ Johnston 10 ii Solemn fragment, s
This is a fragment from the start of Ben Johnston's String Quartet number 10, 2nd movement: Solemn. You can see and hear more of it here: viewtopic.php?f=14&t=106&p=1814#p1814.
You first need to upload the MIDI file you want to play, as an attachment to your post, e.g. by dragging and dropping it into the post editor. Then you will need to obtain the URL of your uploaded file by clicking on the Attachments tab below the edit pane, then right-clicking on the name of your file and choosing Copy link location or similar.
New [midi=url]...[/midi] BBCode
- Dave Keenan
- Site Admin
- Posts: 2180
- Joined: Tue Sep 01, 2015 2:59 pm
- Location: Brisbane, Queensland, Australia
- Contact:
New [midi=url]...[/midi] BBCode
Last edited by cmloegcmluin on Sat Apr 17, 2021 8:48 am, edited 1 time in total.
Reason: http -> https
Reason: http -> https
- cmloegcmluin
- Site Admin
- Posts: 1704
- Joined: Tue Feb 11, 2020 3:10 pm
- Location: San Francisco, California, USA
- Real Name: Douglas Blumeyer (he/him/his)
- Contact:
Re: New [midi=url]...[/midi] BBCode
Looks great! Thanks Dave.
- Dave Keenan
- Site Admin
- Posts: 2180
- Joined: Tue Sep 01, 2015 2:59 pm
- Location: Brisbane, Queensland, Australia
- Contact:
Re: New [midi=url]...[/midi] BBCode
For those who want to implement this in other forums, here is the pattern, replacement and help line:
[midi={URL}]{TEXT}[/midi]
<script type='text/javascript' src='https://www.midijs.net/lib/midi.js'></script>
<span style="border: 1px solid; border-radius: 2px; padding: 0px 3px 0px 1px; line-height: 1.5;"><a href="#!" onClick="MIDIjs.play('{URL}');"></a> <a href="#!" onClick="MIDIjs.stop();"></a> {TEXT}, <span id="{URL}"></span> s</span>
<script type='text/javascript'>
MIDIjs.get_duration('{URL}', function(seconds) {document.getElementById('{URL}').innerHTML = Math.round(seconds);});
</script>
Embed controls to play a midi file: [midi=https://file.mid]text[/midi]
[midi={URL}]{TEXT}[/midi]
<script type='text/javascript' src='https://www.midijs.net/lib/midi.js'></script>
<span style="border: 1px solid; border-radius: 2px; padding: 0px 3px 0px 1px; line-height: 1.5;"><a href="#!" onClick="MIDIjs.play('{URL}');"></a> <a href="#!" onClick="MIDIjs.stop();"></a> {TEXT}, <span id="{URL}"></span> s</span>
<script type='text/javascript'>
MIDIjs.get_duration('{URL}', function(seconds) {document.getElementById('{URL}').innerHTML = Math.round(seconds);});
</script>
Embed controls to play a midi file: [midi=https://file.mid]text[/midi]