let wss = "ws://" + window.location.hostname + ":3001"  // Build socketio endpoint from window.location
const socket = io(wss);                                 // Connect to socketio server

// ######################################################################################################################################################
// Websockets event handler
// ######################################################################################################################################################

// 'connect' feuert bei jeder Verbindung, auch nach einem Reconnect. Da der Pi das WLAN
// selbst aufspannt, sind kurze Abbrueche normal: danach werden Timer und Spielstand neu
// geholt, damit die Anzeige nicht auf einem veralteten Stand haengen bleibt.
socket.on('connect', () => {
    console.log("Verbunden");
    initialUpdate();
});

socket.on('timerDurationLeft', (message) => {
    console.log(message)                                            // Log durationLeft in client console
    document.getElementById("durationLeft").innerHTML = message;    // Display durationLeft in corresponding html Element
});

socket.on('timerEnded', (message) => {
    document.getElementById("durationLeft").innerHTML = "ENDE";     // Display "STOP" in same html element as the duration
});

socket.on('refresh', (message) => {
    document.location.reload()                                      // Reload page on received 'refresh' messagen
});

// ######################################################################################################################################################
// General functions
// ######################################################################################################################################################

// Holt JSON von einem Endpunkt. Liefert null statt zu werfen, wenn der Server nicht
// erreichbar ist oder mit einem Fehler antwortet.
async function fetchJson(url) {
    try {
        const response = await fetch(url);
        if(!response.ok) {
            console.error("Anfrage fehlgeschlagen:", url, response.status);
            return null;
        }
        return await response.json();
    } catch (err) {
        console.error("Server nicht erreichbar:", url, err);
        return null;
    }
}

// Update DOM timer elements from passed values
function updateTimerFrontend(values) {
    document.getElementById("durationLeft").innerHTML = values.print;   // Display durationLeft as prettyfied string
}

// Initial update gets called whenever page has been loaded
async function initialUpdate() {
    timerGetValues();                                           // Request new values for timer
}

// ######################################################################################################################################################
// Timerfunctions
// ######################################################################################################################################################

// Request important timer values
async function timerGetValues() {
    const data = await fetchJson("/admin/timerGetValues");      // Call API Endpoint /admin/timerGetValues
    if(data) updateTimerFrontend(data);                         // Update admin frontend
}