index.js

if (/android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(navigator.userAgent))
    alert("This is not designed for mobile, it may look weird and perform badly");

const player = document.getElementById("player");
const upload = document.getElementById("upload");
const url = document.getElementById("url");

const title = document.title; 
const title2 = document.getElementById("np2");

let audio;
let an;
let src;

upload.addEventListener("change", function () {
    const file = upload.files[0];
    if (file) {
        player.src = URL.createObjectURL(file);
        title2.innerHTML = `Starting...`;
        player.addEventListener("canplaythrough", function () {
            adj(player);
            player.play();
            document.getElementById("plps").innerHTML = "Pause";
        }, { once: true });
        console.log(`Loading ${file.name}`);
    }
});

url.addEventListener("change", function () {
    const link = url.value.trim();
    if (link) {
        title2.innerHTML = `Starting...`;
        player.src = link;
        player.addEventListener("canplaythrough", function () {
            adj(player);
            player.play();
            document.getElementById("plps").innerHTML = "Pause";
        }, { once: true });
        console.log(`Loading ${link}`);
    }
});

function adj(vid) {
    const ar = vid.videoWidth / vid.videoHeight;
    vid.width = ar > 1 ? 650 : 370;
}

function loop() {
    player.loop = !player.loop;
    document.getElementById("loop").innerHTML = player.loop ? "Loop ON" : "Loop OFF";
}

function plps() {
    if (player.paused) {
        player.play();
        document.getElementById("plps").innerHTML = "Pause";
    } else {
        player.pause();
        document.getElementById("plps").innerHTML = "Resume";
    }
}

player.addEventListener("play", function () {
    title2.innerHTML = `Playing`;
    document.getElementById("plps").innerHTML = "Pause";
});

player.addEventListener("pause", function () {
    title2.innerHTML = `Stopped`;
    document.getElementById("plps").innerHTML = "Resume";
});

player.addEventListener("ended", function () {
    title.innerHTML = "player";
    title2.innerHTML = "Finished";
    document.getElementById("plps").innerHTML = "Resume";
});

player.addEventListener("error", function () {
    title.innerHTML = "player";
    title2.innerHTML = "Failed";
    document.getElementById("plps").innerHTML = "Resume";
});

function stop() {
    player.pause();
    player.currentTime = 0;
    if (audio) {
        audio.close();
        audio = null;
        an = null;
        src = null;
    }
    console.log(`Stop`);
}

function rwd() {
    player.currentTime -= 10;
}

function fwd() {
    player.currentTime += 10;
}

function desync() {
    rwd(); fwd();
}

function fix() {
    console.log("Attempting to fix video/audio desync...");
    rwd();
    fwd();
}

const time = document.getElementById("time");
player.addEventListener("timeupdate", function () {
    time.innerHTML = `${ft(player.currentTime)} / ${ft(player.duration)}`;
    index.max = player.duration;
    index.value = player.currentTime;
    idx.innerHTML = Math.floor(player.currentTime);
});

function ft(t) {
    const m = Math.floor(t / 60);
    const s = Math.floor(t % 60);
    return `${m}:${s < 10 ? "0" : ""}${s}`;
}

const speed = document.getElementById("speed");
const spd = document.getElementById("spd");
speed.addEventListener("input", function () {
    player.playbackRate = speed.value;
    spd.innerHTML = speed.value;
});

const vol = document.getElementById("volume");
const v = document.getElementById("vol");
vol.addEventListener("input", function () {
    player.volume = vol.value;
    v.innerHTML = vol.value;
});

const index = document.getElementById("index");
const idx = document.getElementById("idx");
index.addEventListener("input", function () {
    player.currentTime = index.value;
});

function dayandnight() {
    const boo = document.body;

    boo.style.backgroundColor = boo.style.backgroundColor === 'black' ? 'white' : 'black';
    boo.style.color = boo.style.color === 'white' ? 'black' : 'white';

    document.getElementById("sex").innerHTML = 
    boo.style.backgroundColor === 'black' ? 'Light' : 'Dark'; 
}