window.addEventListener('DOMContentLoaded', (event) => {
    // URL of your API
    const apiUrl = '/sensor_data';

    function fetchData() {
        // Fetching data from the API
        fetch(apiUrl)
            .then(response => response.json())
            .then(data => {
                document.getElementById('voltage').textContent = roundToTwo(data.bus_voltage)+ ' V' || 'N/A';
                document.getElementById('current').textContent = roundToTwo(data.current)+ ' mA' || 'N/A';
            })
            .catch(error => {
                console.error("There was an error fetching data from the API", error);
            });
    }

    fetchData();  // fetch immediately on page load
    setInterval(fetchData, 5000); // fetch every 5 seconds
});

window.addEventListener('DOMContentLoaded', (event) => {
    // URL of your API
    const apiUrl = '/telemetry';

    function fetchData() {
        // Fetching data from the API
        fetch(apiUrl)
            .then(response => response.json())
            .then(data => {
                document.getElementById('uptime').textContent = roundToTwo(data.uptime_seconds)+ ' s' || 'N/A';
                document.getElementById('heap').textContent = roundToTwo(data.heap_percent)+ ' %' || 'N/A';
            })
            .catch(error => {
                console.error("There was an error fetching data from the API", error);
            });
    }

    fetchData();  // fetch immediately on page load
    setInterval(fetchData, 5000); // fetch every 5 seconds
});

window.addEventListener('DOMContentLoaded', (event) => {
    // URL of your API
    const apiUrl = '/water_data';

    function fetchData() {
        // Fetching data from the API
        fetch(apiUrl)
            .then(response => response.json())
            .then(data => {
                document.getElementById('level').textContent = roundToTwo(data.water_height)+ ' cm' || 'N/A';
                document.getElementById('liters').textContent = roundToTwo(data.liters)+ ' l' || 'N/A';
                document.getElementById('percentage').textContent = roundToTwo(data.percentage)+ ' %' || 'N/A';
            })
            .catch(error => {
                console.error("There was an error fetching data from the API", error);
            });
    }

    fetchData();  // fetch immediately on page load
    setInterval(fetchData, 5000); // fetch every 5 seconds
});

window.addEventListener('DOMContentLoaded', (event) => {
    const apiUrl = '/network_info';

    function fetchData() {
        fetch(apiUrl)
            .then(response => response.json())
            .then(data => {
                document.getElementById('wifi_ip').textContent = data.wifi.ip || 'N/A';
                document.getElementById('wifi_rssi').textContent = data.wifi.rssi || 'N/A';
                document.getElementById('wifi_link').textContent = data.wifi.link || 'N/A';
                document.getElementById('wifi_ssid').textContent = data.wifi.ssid || 'N/A';
                document.getElementById('eth_link').textContent = data.ethernet.link || 'N/A';
                document.getElementById('eth_ip').textContent = data.ethernet.ip || 'N/A';
                document.getElementById('eth_speed').textContent = data.ethernet.rssi || 'N/A';
            })
            .catch(error => {
                console.error("There was an error fetching data from the API", error);
            });
    }

    fetchData();  // fetch immediately on page load
    setInterval(fetchData, 5000); // fetch every 5 seconds
});

function roundToTwo(num) {
    return Math.round(num*100)/100;
}