const video_formats = ["webm", "mp4"];
const audio_formats = ["mp3", "flac", "opus", "ogg", "m4a"];

(() => {
    document.getElementById("view").addEventListener("click", e => {
        e.target.firstChild.remove();
        e.target.style.display = "none";
    });

    const file_links = Array.from(document.getElementsByTagName('tr')).slice(2).filter((e) => e.lastChild.innerHTML != "DIR").map(v => v.firstChild.firstChild);

    file_links.forEach(f => f.addEventListener('click', e => {
        if (video_formats.some(ext => e.target.pathname.endsWith(ext))) {
            e.preventDefault();
            const video = document.createElement("video");
            video.autoplay = true;
            video.controls = true;
            video.src = e.target.pathname;
            document.getElementById("view").appendChild(video);
            document.getElementById("view").style.display = "flex";
        } else if (audio_formats.some(ext => e.target.pathname.endsWith(ext))) {
            e.preventDefault();
            const audio = document.createElement("audio");
            audio.autoplay = true;
            audio.controls = true;
            audio.src = e.target.pathname;
            document.getElementById("view").appendChild(audio);
            document.getElementById("view").style.display = "flex";
        }
    }));
})();