ldap_frontend/src/ssh/ssh.js

let got_keys = false;

async function get_keys() {
    let username = document.getElementById("user").value;
    let password = document.getElementById("pass").value;
    let request = {auth: {user: username, pass: password}};
    try {
        const response = await fetch('https://api.account.skynet.ie/ldap/ssh', {
            method: 'POST',
            body: JSON.stringify(request),
            mode: 'cors',
        });
        if (response.status !== 200) {
            document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failed to fetch</span>";
            return;
        }
        const data = await response.json();
        if (data.result !== "success") {
            document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>Error: ${data.error}</span>`;
            return;
        }
        document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Success: Got keys</span>";
        let keys = data.success;
        document.getElementById('key_table').style.display = "table";
        got_keys = true;
        keys.forEach(key => {
            add_to_table(key);
        });
    } catch (err) {
        document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>Error: ${err}</span>`;
        console.log(err);
    }
}


async function add_key() {
    let username = document.getElementById("user").value;
    let password = document.getElementById("pass").value;
    let key = document.getElementById("key_input").value;
    let request = {auth: {user: username, pass: password}, key: key};
    if (key === "") {
        document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Key cannot be empty</span>";
        return;
    }
    try {
        const response = await fetch('https://api.account.skynet.ie/ldap/ssh/add', {
            method: 'POST',
            body: JSON.stringify(request),
            mode: 'cors',
        });
        if (response.status !== 200) {
            document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failed to fetch</span>";
            return;
        }
        const data = await response.json();
        if (data.result !== "success") {
            document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>Error: ${data.error}</span>`;
            return;
        }
        document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Success: Key added</span>";
        document.getElementById('key_table').style.display = "table";
        add_to_table(request.key);

    } catch (err) {
        document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>Error: ${err}</span>`;
        console.log(err);
    }
}

async function delete_key(row_idx) {
    let table = document.getElementById("key_table");
    let key = table.rows[row_idx].cells[0].innerHTML;
    let username = document.getElementById("user").value;
    let password = document.getElementById("pass").value;
    let request = {auth: {user: username, pass: password}, key: key};
    try {
        const response = await fetch('https://api.account.skynet.ie/ldap/ssh', {
            method: 'DELETE',
            body: JSON.stringify(request),
            mode: 'cors',
        });
        if (response.status !== 200) {
            document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failed to fetch</span>";
            return;
        }
        const data = await response.json();
        if (data.result !== "success") {
            document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>Error: ${data.error}</span>`;
            return;
        }
        table.deleteRow(row_idx);
        document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Success: Key deleted</span>";

    } catch (err) {
        document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>Error: ${err}</span>`;
        console.log(err);
    }
}

function add_to_table(key) {
    let table = document.getElementById("key_table");
    let row = table.insertRow();
    let cell_name = row.insertCell(0);
    let cell_key = row.insertCell(1);

    //Splitting by spaces, first two make the key + type, rest is a comment/name of the key
    let key_split = key.split(' ');
    cell_key.textContent = `${key_split[0]} ${key_split[1]}`;
    //Names for SSH keys can have multiple spaces
    let comment = "";
    for (i = 2; i < key_split.length; i++) {
        comment += " " + key_split[i];
    }
    cell_name.textContent = comment;
    let cell_delete = row.insertCell(2);
    let delete_button = document.createElement("button");
    delete_button.innerHTML = "Delete";

    cell_delete.appendChild(delete_button);
    cell_delete.addEventListener("click", function () {
        delete_key(row.rowIndex);
    });
}

document.addEventListener("DOMContentLoaded", () => {
    document.getElementById("ssh_form").addEventListener("submit", function (event) {
        event.preventDefault();
        if (got_keys) {
            document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Got keys already</span>";
        } else {
            get_keys();
        }
    });
    document.getElementById("add_key_button").addEventListener("click", add_key);
});