const socket = io();
// const socket = io("http://127.0.0.1:5000");

socket.on("connect", () => {
    console.log("Connected...");
    socket.emit("frontend_ready");
});

const logContainer = document.getElementById("log-container");

function appendLog(data) {
    const line = document.createElement("div");
    line.textContent = data.levelname + " : " + data.message;
    logContainer.appendChild(line);
    logContainer.scrollTop = logContainer.scrollHeight;
}

const statusTree = document.getElementById("updater-tree");
let statusTreeData = {};

function renderStatusTable() {
    let html = `
        <table border="1" cellpadding="6">
            <tr>
                <th>Módulo</th>
                <th>Status</th>
            </tr>
    `;
    for (const [module, status] of Object.entries(statusTreeData)) {
        html += `
            <tr>
                <td>${module}</td>
                <td>${status}</td>
            </tr>
        `;
    }
    html += `</table>`;
    statusTree.innerHTML = html;
}

socket.on("status_lib", (data) => {
    console.log("lib status", data);

    statusTreeData[data.lib] = data.status;

    renderStatusTable();
});

socket.on("redirect", (data) => {
    console.log("redirect", data);
    location.replace(data.url);
});

socket.on("restarting", (data) => {
    console.log("restarting", data);
    location.reload()
});

socket.on("log", (data) => {
    appendLog(data);
});

socket.on("error", (data) => {
    appendLog(data);
});