/**
 * Remove a frequency input from the DOM
 * 
 * @param {string} system The system name to add the frequency to
 * @param {string} inputId [OPTIONAL] The ID of input, this can be anything unique to this input. If this is not provided the number of frequencies will be used as the ID
 */
function addFrequencyInput(system, inputId = null){
    if (!inputId) inputId = $(`[id^="${system}_systemFreqRow_"]`).length; 
    // Create new input
    var icon = document.createElement('i');
    icon.classList.add('bi');
    icon.classList.add('bi-x-circle');
    icon.classList.add('text-black');

    var remove = document.createElement('a');
    remove.classList.add('align-middle');
    remove.classList.add('float-left');
    remove.href = '#'
    remove.onclick = () => {removeFrequencyInput(`${system}_systemFreqRow_${inputId}`)}
    remove.appendChild(icon);

    var childColRemoveIcon = document.createElement('div');
    childColRemoveIcon.classList.add('col-2');
    childColRemoveIcon.appendChild(remove);

    var input = document.createElement('input');
    input.classList.add('form-control');
    input.id = `${system}_systemFreq_${inputId}`;
    input.type = 'text';

    var childColInput = document.createElement('div');
    childColInput.classList.add('col-10');
    childColInput.appendChild(input);
    
    var childRow = document.createElement('div');
    childRow.classList.add("row");
    childRow.classList.add("px-1");
    childRow.appendChild(childColInput);
    childRow.appendChild(childColRemoveIcon);

    var colParent = document.createElement('div');
    colParent.classList.add("col-md-6");
    colParent.classList.add("mb-1");
    colParent.id = `${system}_systemFreqRow_${inputId}`
    colParent.appendChild(childRow);

    document.getElementById(`frequencyRow_${system.replaceAll(" ", "_")}`).appendChild(colParent);
}

function createToast(notificationMessage){
    const toastTitle = document.createElement('strong');
    toastTitle.classList.add('me-auto');
    toastTitle.appendChild(document.createTextNode("Server Notification"));

    const toastTime = document.createElement('small');
    toastTime.appendChild(document.createTextNode(new Date(Date.now()).toLocaleString()));

    const toastClose = document.createElement('button');
    toastClose.type = 'button';
    toastClose.classList.add('btn-close');
    toastClose.ariaLabel = 'Close';
    toastClose.setAttribute('data-bs-dismiss', 'toast');

    const toastHeader = document.createElement('div');
    toastHeader.classList.add('toast-header');
    toastHeader.appendChild(toastTitle);
    toastHeader.appendChild(toastTime);
    toastHeader.appendChild(toastClose);


    const toastMessage = document.createElement('p');
    toastMessage.classList.add("px-2");
    toastMessage.appendChild(document.createTextNode(notificationMessage));

    const toastBody = document.createElement('div');
    toastBody.classList.add('toast-body');
    toastBody.appendChild(toastMessage);

    const wrapperDiv = document.createElement('div');
    wrapperDiv.classList.add('toast');
    wrapperDiv.role ='alert';
    wrapperDiv.ariaLive = 'assertive';
    wrapperDiv.ariaAtomic = true;
    wrapperDiv.appendChild(toastHeader);
    wrapperDiv.appendChild(toastMessage);

    document.getElementById("toastZone").appendChild(wrapperDiv);
    
    $('.toast').toast('show');
    return $('.toast');
}

function sendNodeHeartbeat(nodeId){
    const Http = new XMLHttpRequest();
    const url='/nodes/nodeCheckIn/'+nodeId;
    Http.open("GET", url);
    Http.send();

    Http.onloadend = (e) => {
    console.log(Http.responseText)
    createToast(Http.responseText);
    }
}

function joinServer(){
    const preset = document.getElementById("selectRadioPreset").value;
    const nodeId = document.getElementById("nodeId").value;
    const clientId = document.getElementById("inputDiscordClientId").value;
    const channelId = document.getElementById("inputDiscordChannelId").value;

    const reqBody = {
        'preset': preset,
        'nodeId': nodeId,
        'clientId': clientId,
        'channelId': channelId
    };

    console.log(reqBody);

    const Http = new XMLHttpRequest();
    const url='/admin/join';
    Http.open("POST", url);
    Http.setRequestHeader("Content-Type", "application/json");
    Http.send(JSON.stringify(reqBody));

    Http.onloadend = (e) => {
        const responseObject = JSON.parse(Http.responseText)
        console.log(Http.status);
        console.log(responseObject);
        createToast(`${responseObject.name} will join shortly`);
        $("#joinModal").modal('toggle');
    }
}

function leaveServer(){
    const nodeId = document.getElementById("nodeId").value;
    const reqBody = {
        'nodeId': nodeId
    };

    const Http = new XMLHttpRequest();
    const url='/admin/leave';
    Http.open("POST", url);
    Http.setRequestHeader("Content-Type", "application/json");
    Http.send(JSON.stringify(reqBody));

    Http.onloadend = (e) => {
        const responseObject = JSON.parse(Http.responseText)
        console.log(Http.status);
        console.log(responseObject);
        createToast(`${responseObject} is leaving`);
        setTimeout(() => {}, 45000);
    }
}

function saveNodeDetails() {
    const nodeId = document.getElementById("nodeId").value;
    const nodeName = document.getElementById("inputNodeName").value;
    const nodeIp = document.getElementById("inputNodeIp").value;
    const nodePort = document.getElementById("inputOrgName").value;
    const nodeLocation = document.getElementById("inputNodeLocation").value;

    const reqBody = {
        'id': nodeId,
        'name': nodeName,
        'ip': nodeIp,
        'port': nodePort,
        'location': nodeLocation
    }

    console.log("Request Body: ", reqBody);

    const Http = new XMLHttpRequest();
    const url='/nodes/'+nodeId;
    Http.open("PUT", url);
    Http.setRequestHeader("Content-Type", "application/json");
    Http.send(JSON.stringify(reqBody));

    Http.onloadend = (e) => {
        const responseObject = JSON.parse(Http.responseText);
        console.log(Http.status);
        console.log(responseObject);
        createToast(`Node Updated!`);
    }
}

function addNewSystem(systemName) {
    const nodeId = document.getElementById("nodeId").value;
    const systemMode = document.getElementById(`${systemName}_systemMode`).value;
    const inputSystemFreqs = $(`[id^="${systemName}_systemFreq_"]`);
    let systemFreqs = [];
    for (const inputFreq of inputSystemFreqs){        
        systemFreqs.push(inputFreq.value);
    }

    const reqBody = {
        'systemName': systemName,
        'mode': systemMode,
        'frequencies': systemFreqs
    }

    console.log("Request Body: ", reqBody);
    const Http = new XMLHttpRequest();
    const url='/nodes/'+nodeId+"/systems";
    Http.open("POST", url);
    Http.setRequestHeader("Content-Type", "application/json");
    Http.send(JSON.stringify(reqBody));

    Http.onloadend = (e) => {
        const responseObject = JSON.parse(Http.responseText)
        console.log(Http.status);
        console.log(responseObject);
        createToast(`${systemName} Added!`);
        location.reload();
    }
}

function updateSystem(systemName) {
    const nodeId = document.getElementById("nodeId").value;
    const systemMode = document.getElementById(`${systemName}_systemMode`).value;
    const inputSystemFreqs = $(`[id^="${systemName}_systemFreq_"]`);    
    let systemFreqs = [];
    for (const inputFreq of inputSystemFreqs){        
        systemFreqs.push(inputFreq.value);
    }

    const reqBody = {
        'systemName': systemName,
        'mode': systemMode,
        'frequencies': systemFreqs
    }

    console.log("Request Body: ", reqBody);
    const Http = new XMLHttpRequest();
    const url='/nodes/'+nodeId+"/systems";
    Http.open("PUT", url);
    Http.setRequestHeader("Content-Type", "application/json");
    Http.send(JSON.stringify(reqBody));

    Http.onloadend = (e) => {
        const responseObject = JSON.parse(Http.responseText)
        console.log(Http.status);
        console.log(responseObject);
        createToast(`${systemName} Updated!`);
        location.reload();
    }
}

function requestNodeUpdate() {

}

function removeFrequencyInput(elementId) {
    const element = document.getElementById(elementId);
    element.remove();
}