#37 Working Joining and Leaving

Server/public/res/js/node.js

@@ -38,6 +38,48 @@ function addFrequencyInput(system){
     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(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');
+}
+
 function checkInByNodeId(nodeId){
     const Http = new XMLHttpRequest();
     const url='/nodes/'+nodeId;
@@ -46,5 +88,56 @@ function checkInByNodeId(nodeId){
 
     Http.onreadystatechange = (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`);
     }
 }