// Elements
const drone = document.getElementById("drone");

const drones = [
    ["1", "mu1"], ["2", "mu2"], ["3", "mu3"],
    ["4", "mu4"], ["5", "mu5"], ["6", "mu6"]
]

// Load initial settings
document.onload = initPage();

document.getElementById("save").addEventListener("click", saveSettings);

// Function to initialize the page
function initPage() {
    // TODO: Replace /home/spiri/services with some root level path
    // Search for drones files in the services directory and populate the dropdown with directory names
    const currentDrone = getValueByKey(content, "common", "drone");

    addDropDown(drone, drones, currentDrone);
}

function handleSelect(account) {
    var drone1Table = "<table><tr><td>Drone1</td></tr></table>";
    var drone2Table = "<table><tr><td>Drone2</td></tr></table>";
    var drone3Table = "<table><tr><td>Drone3/td></tr></table>";
    var drone4Table = "<table><tr><td>Drone4</td></tr></table>";
    var drone5Table = "<table><tr><td>Drone5</td></tr></table>";
    switch(account)
    {
        case "Drone1":
        document.getElementById("myTableContainer").innerHTML = drone1Table
        break;
        case "Drone2":
        document.getElementById("myTableContainer").innerHTML = drone2Table
        break;
        case "Drone3":
        document.getElementById("myTableContainer").innerHTML = drone3Table
        break;
        case "Drone4":
        document.getElementById("myTableContainer").innerHTML = drone4Table
        break;
        case "Drone5":
        document.getElementById("myTableContainer").innerHTML = drone5Table
        break;
    }
}

// Save configuration values to the configuration file
function saveSettings() {

    try {
        cockpit.file(confLocation)
            .read()
            .then((content) => {
                // WiFi & Temperature Configuration
                content = setValueByKey(content, "[common]", "drone_channel", drone_channel.value);
                
                cockpit.file(confLocation, { superuser: "try" }).replace(content)
                    .then(() => {
                        displayDroneTable();
                        displaySuccess("table updated successfully.");
                    })
                    .catch((error) => {
                        displayFail("Failed to update table: " + error.message);
                    });
            })
            .catch(error => {
                displayFail("Failed to update table: " + error.message);
            });
    } catch (e) {
        console.error("Error during update operation:", e);
        failureReadFile(e);
    }
}


// Restart drone service
function displayDroneTable() {
    upaate table
}

function addDropDown(box, pairs, defaultValue) {
    try {
        for(let i = 0; i < pairs.length; i++){
            if (pairs[i].length == 0 || pairs[i][0] === "" || pairs[i][1] === "") continue;
            const option = document.createElement("option");
            option.value = pairs[i][0];
            option.text = pairs[i][1];
            box.add(option);
            if (defaultValue === option.value) {
                box.value = option.value;
            }
        }
    }
    catch(e) {
        displayFail(e)
    }
}