window.onload = () => {
    const evtSource = new EventSource("/events");
    const data = document.getElementById("data");
    const last_update = document.getElementById("last_update");
    evtSource.addEventListener("change", event => {
        console.log(event);

        last_update.innerText = `last update at ${new Date(+event.data * 1000)}`;

        const newElement = document.createElement("li");
        const eventList = document.getElementById("list");
        newElement.textContent = `change at ${+event.data}`;
        eventList.appendChild(newElement);

        fetch("/data").then(res => res.json().then(res => data.innerText = JSON.stringify(res, null, 1)));
    });

    evtSource.addEventListener("ping", event => {
        console.log(event);

        last_update.innerText = `last update at ${new Date(+event.data * 1000)}`;

        const newElement = document.createElement("li");
        const eventList = document.getElementById("list");
        newElement.textContent = `ping at ${+event.data}`;
        eventList.appendChild(newElement);
    });
};