$(document).ready(function() {
    document.title = "Automatic Announcement System"
    

    const ws = new WebSocket(window.location.pathname + '/ws');


    ws.onopen = () => {
        console.log('WebSocket connection established');
    };
    ws.onmessage = (event) => {
        let rep = JSON.parse(event.data);
        let cmd = rep.reply
        let data = rep.data;
        if (cmd && cmd.length > 0){
            // console.log('Command:', cmd);
            // console.log('Data:', data);
            switch(cmd){
                case "getCPUStatus" :
                    $('#cpustatus').text("CPU Usage: " + data)
                    break;
                case "getMemoryStatus" :
                    $('#ramstatus').text("Memory Usage: " + data)
                    break;
                case "getDiskStatus" :
                    $('#diskstatus').text("Disk Usage: " + data)
                    break;
                case "getNetworkStatus" :
                    $('#networkstatus').text("Network Usage: " + data)
                    break;
            }
        }
    };
    ws.onclose = () => {
        console.log('WebSocket connection closed');
    };
    // ws.onerror = (error) => {
    //     console.error('WebSocket error:', error);
    // };

    /**
     * Send a command to the WebSocket server.
     * @param {String} command command to send
     * @param {String} data data to send
     */
    function sendCommand(command, data){
        if (ws.readyState === WebSocket.OPEN) {
            ws.send(JSON.stringify({ command, data }));
        } else {
            console.error('WebSocket is not open');
        }
    }

    setInterval(()=>{
        $('#datetimetext').text(new Date().toLocaleString());
        sendCommand("getCPUStatus", "")
        sendCommand("getMemoryStatus", "")
        sendCommand("getDiskStatus", "")
        sendCommand("getNetworkStatus", "")
    }, 1000)

    let sidemenu = new bootstrap.Offcanvas('#offcanvas-menu');
    $('#showmenu').click(()=>{
        sidemenu.show();
    })
    $('#soundbanklink').click(()=>{
        sidemenu.hide();
        $('#content').load('soundbank.html');
    })
    $('#messagebanklink').click(()=>{
        sidemenu.hide();
        $('#content').load('messagebank.html');
    })
    $('#languagelink').click(()=>{
        sidemenu.hide();
        $('#content').load('language.html');
    })
    $('#timerlink').click(()=>{
        sidemenu.hide();
        $('#content').load('timer.html');
    })
    $('#loglink').click(()=>{
        sidemenu.hide();
        $('#content').load('log.html');
    })
    $('#settinglink').click(()=>{
        sidemenu.hide();
        $('#content').load('setting.html');
    })
    $('#logoutlink').click(()=>{
        window.location.href = "login.html"
    })
});