const channel = document.getElementById("channel");
const status1 = document.getElementById("status");
let button1 = document.getElementById("button1");
const button2 = document.getElementById("button2");
const button3 = document.getElementById("button3");
const button4 = document.getElementById("button4");
let ready = false;
let channelClosedBySelf = false;
let id = "";
let filename = "";
let socket = new WebSocket("wss://" + location.host + "/ws");
initSocket();

function verifySocket() {
    if (!ready) {
        socket = new WebSocket("wss://" + location.host + "/ws");
        initSocket()
    }
}

function initSocket() {
    socket.onopen = function (evt) {
        console.log("Websocket open");
        ready = true;
        if (document.URL.includes("?id=")) {
            channel.value = document.URL.split("=")[1];
            button2Handler()
        }
    }
    socket.onclose = function (evt) {
        console.log("Websocket closed");
        ready = false;
    }
    socket.onerror = function (evt) {
        console.log("Websocket error: " + evt.data);
        ready = false;
    }
    socket.addEventListener("message", (event) => {
        console.log(event.data);
        const response = event.data.split(" ");
        if (response[0] === "Created") {
            channel.value = response[1];
            id = response[1];
            button2.innerText = "Close channel";
            button1.disabled = true;
            button1.innerText = "Create channel";
            button1.title = "You have to close the channel before creating a new one, or join the channel on another device";
            document.getElementById("link").innerHTML = "";
            document.getElementById("link").innerHTML = `<a class="download" onclick="copy()">COPY LINK</a>`;
        } else if (response[0] === "AskPin") {
            let pin = prompt("give pin");
            let askpinmessage = "Pin " + id + " " + pin;
            console.log(askpinmessage);
            socket.send(askpinmessage);
        } else if (response[0] === "AskJoin") {
            askjoininfo = `Enter Pin for other client: ip= ${response[1]}, pin= ${response[2]}`
            console.log(askjoininfo);
            status1.value = askjoininfo;
        } else if (response[0] === "Joined") {
            id = channel.value;
            button2.innerText = "Close channel";
            button2.disabled = false;
            button1.disabled = false;
            status1.value = `${event.data}`;
            button1.innerText = "Open File";
            button1.title = "You have to join the channel on another device before opening a file";
            document.getElementById("filetd").innerHTML = "";
            document.getElementById("filetd").innerHTML = `<input type="file" class="yesbutton" id="button1" onChange="button1Handler()"/>`;
            button1 = document.getElementById("button1");
        } else if (response[0] === "Metadata") {
            status1.value = `${event.data}`;
            filename = event.data.split(":")[2];
            downloadId = event.data.split(":")[3];
            console.log(filename);
            document.getElementById("filetd").innerHTML = "";
            document.getElementById("filetd").innerHTML = `<a class="download" id="button1" onclick="accept();window.open('/download/${downloadId}/${filename}');">DOWNLOAD FILE!</a>`;
            button1 = document.getElementById("button1");
        } else if (response[0] === "Sent") {
            document.getElementById("filetd").innerHTML = "";
            document.getElementById("filetd").innerHTML = `<input type="file" class="yesbutton" id="button1" onChange="button1Handler()"/>`;
            button1 = document.getElementById("button1");
        } else if (response[0] === "Accepted") {
            status1.value = `${event.data}`;
            sendTheFile()
            console.log("streaming file ...");
        } else if (response[0] === "NoChannel") {
            alert("Enter a valid channel id!");
            channel.value = "";
            document.getElementById("filetd").innerHTML = ""
            document.getElementById("filetd").innerHTML = `<button class="yesbutton" id="button1" onclick="button1Handler()">Create channel</button>`;
            button2.innerText = "Join channel";
            button2.disabled = false
            channel.value = "";
            status1.value = "Disconnected";
            document.getElementById("download").innerHTML = "";
            channelClosedBySelf = true;
            button1 = document.getElementById("button1");
        } else if (response[0] === "Closed") {
            if (channelClosedBySelf) {
                document.getElementById("download").innerHTML = "";
                button1 = document.getElementById("button1");
                button1.innerText = "Create channel";
            } else {
                status1.value = `Peer closed connection`;
                document.getElementById("download").innerHTML = "";
                document.getElementById("filetd").innerHTML = ""
                document.getElementById("filetd").innerHTML = `<button class="yesbutton" id="button1" onclick="button1Handler()">Create channel</button>`;
                button1 = document.getElementById("button1");
                button1.disabled = true;
                button1.innerText = "Create channel";
                button1.title = "You have to close the channel before creating a new one, or join the channel on another device";
            }
            channelClosedBySelf = false;
        } else if (response[0] === "Timeout") {
            alert("Connection expired");
        }
    });
}

async function startLoad() {
    channel.value = "";
    status1.value = "Disconnected";
}

function button1Handler() {
    verifySocket()
    if (!ready) {
        alert("socket not ready, refresh page!");
        return;
    }
    if (button1.innerText === "Create channel") {
        button1.disabled = true;
        const idtype = document.getElementById('idtype');
        if (idtype.value == "words") {
            socket.send("createShortID")
        } else {
            socket.send("createID");
        }
    } else {
        const fileInput = document.getElementById('button1');
        const file = fileInput.files[0];
        button1.disabled = true;
        socket.send(`fileMetadata ${id} ${file.size} ${file.type} ${file.name}`);
        console.log(`fileMetadata ${id} ${file.size} ${file.type} ${file.name}`);
    }
}

function button2Handler() {
    verifySocket()
    if (!ready) {
        alert("socket not ready, refresh page!");
        return;
    }
    if (button2.innerText === "Close channel") {
        socket.send("closeId " + id);
        console.log("close channel");
        channel.value = "";
        document.getElementById("filetd").innerHTML = ""
        document.getElementById("filetd").innerHTML = `<button class="yesbutton" id="button1" onclick="button1Handler()">Create channel</button>`;
        button2.innerText = "Join channel";
        channel.value = "";
        status1.value = "Disconnected";
        document.getElementById("download").innerHTML = "";
        channelClosedBySelf = true;
        button1 = document.getElementById("button1");
    } else if (button2.innerText === "Join channel") {
        if (channel.value === "") {
            alert("Enter a valid channel id!");
            return;
        }
        button1.disabled = true;
        button2.disabled = true;
        id = channel.value
        socket.send("joinID " + id);
    } else {
        console.log("Error, you broke my app!")
    }
}

function sendTheFile() {
    const fileInput = document.getElementById('button1');
    const file = fileInput.files[0];
    const reader = file.stream().getReader();
    let blocksSent = 0;
    reader.read().then(function sendBlock({ done, value }) {
        if (done) {
            socket.send(`FileSent ${id}`);
            button1.disabled = false;
            return;
        }
        const header = `FileBlock ${id} ${blocksSent} \n`;
        const h = strToBytes(header);
        const packet = new Uint8Array(h.length + value.byteLength);
        packet.set(new Uint8Array(h), 0);
        packet.set(value, h.length);
        socket.send(packet)
        blocksSent++;
        return reader.read().then(sendBlock);
    })
}

function strToBytes(s) {
    let string = [];
    for (let i = 0; i != s.length; i++) {
        string.push(s.charCodeAt(i));
    }
    return string;
}

function accept() {
    document.getElementById("filetd").innerHTML = "";
    document.getElementById("filetd").innerHTML = `<a class="downloadD" id="button1">DOWNLOAD FILE!</a>`;
    socket.send("FileAccepted " + id);
}

function copy() {
    const text = `https://${location.host}/filestreamer?id=${channel.value}`;

    navigator.clipboard.writeText(text).then(function () {
        console.log('Async: Copying to clipboard was successful!');
    }, function (err) {
        console.error('Async: Could not copy text: ', err);
    });
}