const labelEl = document.getElementById("label");

const selectedLabel = new URLSearchParams(location.search).get("l");
const labelLatestFollower   = "latest-follower"
const labelLatestSubscriber = "latest-subscriber"
const labelLatestCheer      = "latest-cheer"
const allowedLabels = [
    labelLatestFollower,
    labelLatestSubscriber,
    labelLatestCheer,
]

/**
 * @param {string} selectedLabel
 */
async function sync() {
    if (selectedLabel == null) {
        const exampleUrl = 
            location.pathname +
            "?l=" +
            labelLatestFollower;

        labelEl.innerHTML =
            "Needs label to listen to, " +
            `such as <a href="${exampleUrl}">${labelLatestFollower}</a>`;
        console.error("Needs label to listen to, such as " + exampleUrl);
        return;
    }

    let eventSource;
    try {
        eventSource = new EventSource("/twitch/sse?l=" + selectedLabel);
    } catch (err) {
        console.error("Failed to connect to event source", err);
        return;
    }

    eventSource.addEventListener("error", () => {
        eventSource.close();
        console.error("Connection lost, or an error has occurred.");
        console.log("Attempting to reconnect...");

        setTimeout(() => {
            sync();
        }, 1000);
    });

    eventSource.addEventListener("update", event => {
        console.log(event.data);
        labelEl.innerText = event.data;
    });

    eventSource.addEventListener("open", () => {
        console.log("Connected.");
    });
}

sync();