search

cifkao / html-midi-player

🎹 Play and display MIDI files on the web
https://cifkao.github.io/html-midi-player/
BSD 2-Clause "Simplified" License
630 stars 56 forks source link

Changing programmatically src does not load the midi file #57

Closed francoisschwarzentruber closed 1 year ago

francoisschwarzentruber commented 1 year ago

Very nice player! However when I do: midiPlayer.src = "https://magenta.github.io/magenta-js/music/demos/melody.mid"; it does not change the file of the player :(. Should I run a function to load the file?

francoisschwarzentruber commented 1 year ago

The issue is solved, except that it may maybe require some explanations in the documentation.

The problem was very weird: using a midi-player DOM element is not like a div, span etc. With "midiPlayer" I do not get the DOM element, but a weird object. It works with document.getElementById("midiPlayer"):

document.getElementById("midiPlayer").src = "https://magenta.github.io/magenta-js/music/demos/melody.mid";

Maybe explain that point in the documentation (README.md)?

cifkao commented 1 year ago

I guess the "weird object" that you get with midiPlayer is (coincidentally) the JavaScript module itself.

AFAIK directly accessing elements by using their ID as a JavaScript identifier is generally discouraged exactly because of collisions like this, and getElementById is the way to go. So I'm not sure this merits a special mention in the documentation.