[SOLVED] Ruffle loading from a path, how do I load from a file input button?

Ruffle loading from a path, how do I load from a file input button?

<!DOCTYPE html>
<html>
<title>emu</title>
<script src="https://unpkg.com/@ruffle-rs/ruffle"></script>
<div id="gameWin"></div>
<input type="file" id="flash" accept="application/x-shockwave-flash">
<button onclick="runSWF()">Click to load the SWF!</button>
<script>
function runSWF() {
// flash emu load
var ruf = window.RufflePlayer.newest();
var plr = ruf.createPlayer();
var cont = document.querySelector("#gameWin");
cont.appendChild(plr);

var file = document.querySelector("#flash")
if (file && file.files[0]) {

plr.load(INPUT FILE NOT FILE PATH); // basically load the file input's file instead of a preset file from a path
} else {
alert("You forgot to input your SWF!!")
}
}
</script>
</html>

Issue explained in comment, load the file DIRECTLY for ruffle instead of a file path, basically to load a file through an <input type="file">, so you can basically load any SWF file that you can grab, instead of loading a preset amount of them, via a directory.

Sorry if this is a poor explanation, I'm not that good with this stuff.

Solution

You are immediately testing if a file is loaded the second the program runs, so the user would never be able to upload a file on time. You need to add an listener for when the user uploads a file, and then load the player with the file.

var file = document.querySelector("#flash")
file.onchange = () => {
    if (file && file.files[0]) {
         plr.load(URL.createObjectURL(file.files[0])); 
    } else {
         alert("You forgot to input your SWF!!")
    }
}