// Elements
const droneName = document.getElementById("name");
const address = document.getElementById("address");
const container = document.getElementById("container");
const upstream = document.getElementById("upstream");
const ssid = document.getElementById("ssid");
const camera = document.getElementById("camera");
const devices = document.getElementById("devices");

// Load page + drone settings
document.onload = initPage();

// Function to initialize the page
function initPage() {
    // Populate table with drone name, drone IP address, and drone docker containers that are running
    // Name corresponds to host computer's name, IP address is host computer's address 
    // and docker containers are all those displayed by docker container ls
    const command1 = "hostname"
    const command2 = "hostname -I"
    const command3 = "docker container ls"
    const command4 = "ping google.com -c 1"
    const command5 = "iwgetid -r"
    const command6 = "ls /dev/video*"

    // Command for listing all Connected Devices
    const devices_command = "lsusb"

    cockpit.spawn(["bash", "-c", command1])
        .then((data) => {
            droneName.innerHTML = data.split(" ")[0];
        })
        .catch((error) => console.log(error));

    cockpit.spawn(["bash", "-c", command2])
    .then((data) => {
        address.innerHTML = data.split(" ")[0];
    })
    .catch((error) => console.log(error));

    cockpit.spawn(["bash", "-c", command3])
    .then((data) => {
        const datalist = data.split("\n");
        if (datalist[1].split(" ")[0] == ""){
            container.className = "p-3 mb-2 bg-danger text-white";
            container.innerHTML += "Error: No Docker Containers to Display";
        } else {
            for (let i = 0; i < datalist.length - 2; i++) {
                container.innerHTML += datalist[i + 1].split(" ")[0];
                container.innerHTML += "<br>";
            }
            container.innerHTML += datalist[datalist.length - 1].split(" ")[0];
        }
    })
    .catch((error) => console.log(error));

    cockpit.spawn(["bash", "-c", command4])
    .then((data) => {
        const datalist = data.split(" ");
        if (datalist[0] == "ping:"){
            upstream.innerHTML = "Connection LIMITED - No upstream";
        } else if (datalist[0] == "PING") {
            upstream.innerHTML = "Connection OK";
        } else {
            upstream.innerHTML = "Connection DOWN";
        }
    })
    .catch((error) => console.log(error));

    cockpit.spawn(["bash", "-c", command5])
    .then((data) => {
        if (data.length == 0) {
            ssid.innerHTML = "None";
        } else {
            ssid.innerHTML = data
        }
    })
    .catch((error) => console.log(error));

    cockpit.spawn(["bash", "-c", command6])
    .then((data) => {
        if (data.length == 0) {
            camera.innerHTML = "No Camera Devices Detected";
        }
        else {
            const datalist = data.replaceAll("\n", "<br>");
            camera.innerHTML += datalist;
        }
    })
    .catch((error) => console.log(error));

    cockpit.spawn(["bash", "-c", devices_command])
    .then((data) => {
        const datalist = data.split("\n");
        if (data.length == 0) {
            devices.innerHTML = "No devices detected";
        }
        for (let i = 0; i < datalist.length - 1; i++) {
            const name = datalist[i].split(" ");
            for (let j = 6; j < name.length; j++) {
                devices.innerHTML += name[j] + " ";
            }
            devices.innerHTML += "<br>";
            devices.innerHTML += "/dev/bus/usb/" + name[1] + "/" + name[3].replace(":", "");
            if (i != datalist.length - 2) {
                devices.innerHTML += "<br><br>";
            }
        }
    })
    .catch((error) => console.log(error));
}