From e6332dffc9c59ca233ba696f12f50c185e583cb4 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 15 Jul 2023 17:58:12 -0400
Subject: [PATCH 01/57] Update join command to accept a specific node ID

---
 Server/commands/join.js | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/Server/commands/join.js b/Server/commands/join.js
index 6dab9a7..e7f59b3 100644
--- a/Server/commands/join.js
+++ b/Server/commands/join.js
@@ -1,7 +1,7 @@
 // Modules
 const { SlashCommandBuilder } = require('discord.js');
 const { DebugBuilder } = require("../utilities/debugBuilder");
-const { getMembersInRole, getAllClientIds, filterAutocompleteValues } = require("../utilities/utils");
+const { getMembersInRole, getAllClientIds, filterAutocompleteValues, getKeyByArrayValue } = require("../utilities/utils");
 const { requestOptions, sendHttpRequest } = require("../utilities/httpRequests");
 const { getOnlineNodes, updateNodeInfo, addNodeConnection, getConnectionByNodeId, getAllConnections } = require("../utilities/mysqlHandler");
 
@@ -14,15 +14,16 @@ const log = new DebugBuilder("server", "join");
  * @param {*} presetName The preset name to listen to on the client
  * @param {*} channelId The channel ID to join the bot to 
  * @param {*} connections EITHER A collection of clients that are currently connected OR a single discord client ID (NOT dev portal ID) that should be used to join the server with
+ * @param {number} nodeId [OPTIONAL] The node ID to join with (will join with another node if given node is not available)
  * @returns 
  */
-async function joinServerWrapper(presetName, channelId, connections) {
+async function joinServerWrapper(presetName, channelId, connections, nodeId = 0) {
 	// Get nodes online
 	var onlineNodes = await new Promise((recordResolve, recordReject) => {
 		getOnlineNodes((nodeRows) => {
 			recordResolve(nodeRows);
 		});
-	});	
+	});		
 
 	// Check which nodes have the selected preset
 	onlineNodes = onlineNodes.filter(node => node.presets.includes(presetName));
@@ -63,7 +64,10 @@ async function joinServerWrapper(presetName, channelId, connections) {
 		selectedClientId = availableClientIds[0];
 	}
 
-	const selectedNode = nodesCurrentlyAvailable[0];
+	let selectedNode;
+	if (nodeId > 0) selectedNode = getKeyByArrayValue(nodesCurrentlyAvailable, nodeId);
+	
+	if (!selectedNode) selectedNode = nodesCurrentlyAvailable[0];
 	
 	const reqOptions = new requestOptions("/bot/join", "POST", selectedNode.ip, selectedNode.port);	
 	const postObject = {

From c38bca414441c69f81f83b4431d4d1ca4ad07a54 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 15 Jul 2023 17:58:35 -0400
Subject: [PATCH 02/57] Add jsDoc to leaveServerWrapper

---
 Server/commands/leave.js | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/Server/commands/leave.js b/Server/commands/leave.js
index c5ad0b2..e65de07 100644
--- a/Server/commands/leave.js
+++ b/Server/commands/leave.js
@@ -8,6 +8,11 @@ const { checkNodeConnectionByClientId, removeNodeConnectionByNodeId, getAllConne
 // Global Vars
 const log = new DebugBuilder("server", "leave");
 
+/**
+ * 
+ * @param {*} clientIdObject The client ID object for the node to leave the server. Either 'clientId'||'name' can be set.
+ * @returns 
+ */
 async function leaveServerWrapper(clientIdObject) {
 	if (!clientIdObject.clientId || !clientIdObject.name) return log.ERROR("Tried to leave server without client ID and/or Name");
 

From c35d3f3fa76420b28b414ccf15edb74bc26b138a Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 15 Jul 2023 18:14:40 -0400
Subject: [PATCH 03/57] Update adminController to use join/leave command
 wrappers

---
 Server/controllers/adminController.js | 90 ++++++++-------------------
 1 file changed, 27 insertions(+), 63 deletions(-)

diff --git a/Server/controllers/adminController.js b/Server/controllers/adminController.js
index 46b6b8c..fdef282 100644
--- a/Server/controllers/adminController.js
+++ b/Server/controllers/adminController.js
@@ -7,6 +7,9 @@ const log = new DebugBuilder("server", "adminController");
 const mysqlHandler = require("../utilities/mysqlHandler");
 const utils = require("../utilities/utils");
 const requests = require("../utilities/httpRequests");
+const { leaveServerWrapper } = require("../commands/leave");
+const { joinServerWrapper } = require("../commands/join");
+
 
 /** Get the presets of all online nodes, can be used for functions
  * 
@@ -15,27 +18,10 @@ const requests = require("../utilities/httpRequests");
  */
 async function getPresetsOfOnlineNodes(callback) {
     mysqlHandler.getOnlineNodes((onlineNodes) => {
-        let systems = {};
-        onlineNodes.forEach(onlineNode => {
-            systems[onlineNode.id] = utils.BufferToJson(onlineNode.nearbySystems);                        
-        });                
-
-        return callback(systems);
+        return callback(onlineNodes);
     });
 }
 
-async function requestNodeListenToPreset(preset, nodeId, callback) {
-    mysqlHandler.getNodeInfoFromId(nodeId, (nodeObject) =>{
-        reqOptions = new requests.requestOptions("/bot/join", "POST", nodeObject.ip, nodeObject.port);
-        requests.sendHttpRequest(reqOptions, JSON.stringify({
-            "channelID": process.env.DEFAULT_VOICE_CHANNEL_ID,
-            "presetName": preset
-        }), (responseObject) => {
-            return callback(responseObject)
-        });
-    })    
-}
-
 async function getNodeBotStatus(nodeId, callback) {
     mysqlHandler.getNodeInfoFromId(nodeId, (nodeObject) =>{
         reqOptions = new requests.requestOptions("/bot/status", "GET", nodeObject.ip, nodeObject.port, undefined, 5);
@@ -51,24 +37,6 @@ async function getNodeBotStatus(nodeId, callback) {
     });
 }
 
-async function requestNodeLeaveServer(nodeId, callback) {
-    getNodeBotStatus(nodeId, (responseObject) => {
-        if (responseObject === false) {
-            // Bot is joined     
-            mysqlHandler.getNodeInfoFromId(nodeId, (nodeObject) =>{           
-                reqOptions = new requests.requestOptions("/bot/leave", "POST", nodeObject.ip, nodeObject.port);
-                requests.sendHttpRequest(reqOptions, JSON.stringify({}), (responseObject) => {
-                    return callback(responseObject);
-                });
-            });
-        }
-        else {
-            // Bot is free
-            return callback(false);
-        }
-    })
-}
-
 
 /** Return to requests for the presets of all online nodes, cannot be used in functions  
  * 
@@ -87,43 +55,39 @@ exports.getAvailablePresets = async (req, res) => {
  * 
  * @param {*} req Express request parameter
  * @var {*} req.body.preset The preset to join (REQ)
- * @var {*} req.body.nodeId The specific node to join (OPT/REQ if more than one node has the preset) 
+ * @var {*} req.body.nodeId The specific node to join (OPT/REQ if more than one node has the preset)
+ * @var {*} req.body.clientId The ID of the client that we want to join with
+ * @var {*} req.body.channelId The channel Id of the discord channel to join
  * @param {*} res Express response parameter
  */
 exports.joinPreset = async (req, res) => {
-    if (!req.body.preset) return res.status(400).json("No preset specified");    
-    await getPresetsOfOnlineNodes((systems) => {
-        const systemsWithSelectedPreset = Object.values(systems).filter(nodePresets => nodePresets.includes(req.body.preset)).length
-        if (!systemsWithSelectedPreset) return res.status(400).json("No system online with that preset");
-        if (systemsWithSelectedPreset > 1) {
-            if (!req.body.nodeId) return res.status(175).json("Multiple locations with the selected channel, please specify a nodeID (nodeId)")
-            requestNodeListenToPreset(req.body.preset, req.body.nodeId, (responseObject) => {
-                if (responseObject === false) return res.status(400).json("Timeout reached");
-                return res.sendStatus(responseObject.statusCode);
-            });          
-        } 
-        else {   
-            let nodeId;
-            if (!req.body.nodeId) nodeId = utils.getKeyByArrayValue(systems, req.body.preset);
-            else nodeId = req.body.nodeId;
-            requestNodeListenToPreset(req.body.preset, nodeId, (responseObject) => {
-                if (responseObject === false) return res.status(400).json("Timeout reached");
-                return res.sendStatus(responseObject.statusCode);
-            });                        
-        }
-    });
+    if (!req.body.preset) return res.status(400).json("No preset specified");
+    if (!req.body.nodeId) return res.status(400).json("No node ID specified");
+    if (!req.body.clientId) return res.status(400).json("No client ID specified");
+    if (!req.body.channelId) return res.status(400).json("No channel ID specified");
+
+    const preset = req.body.preset;
+    const nodeId = req.body.nodeId;
+    const clientId = req.body.clientId;
+    const channelId = req.body.channelId;
+
+    const joinedClient = await joinServerWrapper(preset, channelId, clientId, nodeId);
+    if (!joinedClient) return res.send(400).json("No joined client");
+    return res.send(200).json(joinedClient);
 }
 
 /** Request a node to join the server listening to a specific preset
  * 
  * @param {*} req Express request parameter
  * @param {*} res Express response parameter
+ * @var {*} req.body.clientId The ID of the client to disconnect
  */
 exports.leaveServer = async (req, res) => {
-    if (!req.body.nodeId) return res.status(400).json("No nodeID specified");
+    if (!req.body.clientId) return res.status(400).json("No clientID specified");
 
-    requestNodeLeaveServer(req.body.nodeId, (responseObject) => {
-        if (responseObject === false) return res.status(400).json("Bot not joined to server");
-        return res.sendStatus(responseObject.statusCode);
-    });
+    const clientId = req.body.clientId;
+
+    await leaveServerWrapper(clientId)
+
+    return res.send(200);
 }
\ No newline at end of file

From 5d6d86fa470602229957572ad6f081d0f17ee3fa Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 15 Jul 2023 18:14:53 -0400
Subject: [PATCH 04/57] Update jsDoc in nodeController

---
 Server/controllers/nodesController.js | 42 +++++++++++++++++++++++----
 1 file changed, 37 insertions(+), 5 deletions(-)

diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index 9c9d274..45d26e8 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -7,13 +7,14 @@ const utils = require("../utilities/utils");
 const { sendHttpRequest, requestOptions } = require("../utilities/httpRequests.js");
 const { nodeObject } = require("../utilities/recordHelper.js");
 const { joinServerWrapper } = require("../commands/join");
+const { leaveServerWrapper } = require("../commands/leave");
 
 const refreshInterval = process.env.NODE_MONITOR_REFRESH_INTERVAL ?? 1200000;
 
 /**
  * 
- * @param {*} req 
- * @param {*} res 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
  */
 exports.listAllNodes = async (req, res) => {
     getAllNodes((allNodes) => {
@@ -23,7 +24,11 @@ exports.listAllNodes = async (req, res) => {
     });
 }
 
-// Add a new node to the storage
+/**
+ *  Add a new node to the storage
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ */ 
 exports.newNode = async (req, res) => {
     if (!req.body.name) return res.status(400).json("No name specified for new node");
 
@@ -53,7 +58,11 @@ exports.newNode = async (req, res) => {
     }
 }
 
-// Get the known info for the node specified
+/** Get the known info for the node specified
+ * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ */ 
 exports.getNodeInfo = async (req, res) => {
     if (!req.query.id) return res.status(400).json("No id specified");
     getNodeInfoFromId(req.query.id, (nodeInfo) => {
@@ -61,7 +70,11 @@ exports.getNodeInfo = async (req, res) => {
     })
 }
 
-// Updates the information received from the client based on ID
+/** Updates the information received from the client based on ID
+ * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ */
 exports.nodeCheckIn = async  (req, res) => {
     if (!req.body.id) return res.status(400).json("No id specified");
     getNodeInfoFromId(req.body.id, (nodeInfo) => {
@@ -126,6 +139,8 @@ exports.nodeCheckIn = async  (req, res) => {
 /**
  * Request the node to join the specified server/channel and listen to the specified resource
  * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
  * @param req.body.clientId The client ID to join discord with (NOT dev portal ID, right click user -> Copy ID)
  * @param req.body.channelId The Channel ID to join in Discord
  * @param req.body.presetName The preset name to listen to in Discord
@@ -135,6 +150,17 @@ exports.requestNodeJoinServer = async (req, res) => {
     await joinServerWrapper(req.body.presetName, req.body.channelId, req.body.clientId);
 }
 
+/**
+ * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ * @param {*} req.body.clientId The client ID to request to leave the server 
+ */
+exports.requestNodeLeaveServer = async (req, res) => {
+    if (!req.body.ClientId) return res.status(400).json("Missing client ID in request");
+    await leaveServerWrapper({clientId: req.body.ClientId});
+}
+
 /**
  * The node monitor service, this will periodically check in on the online nodes to make sure they are still online
  */
@@ -143,6 +169,9 @@ exports.nodeMonitorService = class nodeMonitorService {
         this.log = new DebugBuilder("server", "nodeMonitorService");
     }
 
+    /**
+     * Start the node monitor service in the background
+     */
     async start(){
 	    // Wait for the a portion of the refresh period before checking in with the nodes, so the rest of the bot can start
         await new Promise(resolve => setTimeout(resolve, refreshInterval/10));
@@ -161,6 +190,9 @@ exports.nodeMonitorService = class nodeMonitorService {
         }        
     }
 
+    /**
+     * Check in with all online nodes and mark any nodes that are actually offline
+     */
     async checkInWithOnlineNodes(){
         getOnlineNodes((nodes) => {
             this.log.DEBUG("Online Nodes: ", nodes);

From 6b37a480610d20148832d143019db9e74a6dc498 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 15 Jul 2023 18:15:17 -0400
Subject: [PATCH 05/57] Update jsDoc in utils

---
 Server/utilities/utils.js | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/Server/utilities/utils.js b/Server/utilities/utils.js
index 2acef73..06aa75b 100644
--- a/Server/utilities/utils.js
+++ b/Server/utilities/utils.js
@@ -119,7 +119,12 @@ exports.getClientObjectByClientID = (clientId) => {
     return undefined
 }
 
-
+/**
+ * Wrapper to filter auto complete 
+ * 
+ * @param {*} interaction 
+ * @param {*} options 
+ */
 exports.filterAutocompleteValues = async (interaction, options) => {
     // Get the command used
     const command = interaction.command;

From 2e22fa66a614556478f69598ea37bad4bbada461 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 15 Jul 2023 18:16:42 -0400
Subject: [PATCH 06/57] Initial bones for #37

---
 Server/public/res/css/main.css       | 142 ++++++++++++++++++++++++++
 Server/public/res/js/controller.js   |   3 +
 Server/routes/index.js               |  27 ++++-
 Server/views/controller.ejs          |  11 ++
 Server/views/index.ejs               | 144 +++++++++++++++++++++++++--
 Server/views/node.ejs                |  41 ++++++++
 Server/views/partials/bodyEnd.ejs    |  11 ++
 Server/views/partials/head.ejs       |   9 ++
 Server/views/partials/htmlFooter.ejs |   1 +
 Server/views/partials/htmlHead.ejs   |   6 ++
 Server/views/partials/navbar.ejs     |  40 ++++++++
 Server/views/partials/nodeCard.ejs   |  57 +++++++++++
 Server/views/partials/sidebar.ejs    |  83 +++++++++++++++
 13 files changed, 561 insertions(+), 14 deletions(-)
 create mode 100644 Server/public/res/css/main.css
 create mode 100644 Server/public/res/js/controller.js
 create mode 100644 Server/views/controller.ejs
 create mode 100644 Server/views/node.ejs
 create mode 100644 Server/views/partials/bodyEnd.ejs
 create mode 100644 Server/views/partials/head.ejs
 create mode 100644 Server/views/partials/htmlFooter.ejs
 create mode 100644 Server/views/partials/htmlHead.ejs
 create mode 100644 Server/views/partials/navbar.ejs
 create mode 100644 Server/views/partials/nodeCard.ejs
 create mode 100644 Server/views/partials/sidebar.ejs

diff --git a/Server/public/res/css/main.css b/Server/public/res/css/main.css
new file mode 100644
index 0000000..d057e2a
--- /dev/null
+++ b/Server/public/res/css/main.css
@@ -0,0 +1,142 @@
+.node-card {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    min-width: 0;
+    word-wrap: break-word;
+    background-color: #fff;
+    background-clip: border-box;
+    border: 1px solid #eff0f2;
+    border-radius: 1rem;
+    margin-bottom: 24px;
+    box-shadow: 0 2px 3px #e4e8f0;
+}
+
+.avatar-md {
+    height: 4rem;
+    width: 4rem;
+}
+
+.rounded-circle {
+    border-radius: 50% !important;
+}
+
+.img-thumbnail {
+    padding: 0.25rem;
+    background-color: #f1f3f7;
+    border: 1px solid #eff0f2;
+    border-radius: 0.75rem;
+}
+
+.avatar-title {
+    align-items: center;
+    background-color: #3b76e1;
+    color: #fff;
+    display: flex;
+    font-weight: 500;
+    height: 100%;
+    justify-content: center;
+    width: 100%;
+}
+
+.bg-soft-primary {
+    background-color: rgba(59, 118, 225, .25) !important;
+}
+
+a {
+    text-decoration: none !important;
+}
+
+.badge-soft-danger {
+    color: #f56e6e !important;
+    background-color: rgba(245, 110, 110, .1);
+}
+
+.badge-soft-success {
+    color: #63ad6f !important;
+    background-color: rgba(99, 173, 111, .1);
+}
+
+.mb-0 {
+    margin-bottom: 0 !important;
+}
+
+.badge {
+    display: inline-block;
+    padding: 0.25em 0.6em;
+    font-size: 75%;
+    font-weight: 500;
+    line-height: 1;
+    color: #fff;
+    text-align: center;
+    white-space: nowrap;
+    vertical-align: baseline;
+    border-radius: 0.75rem;
+}
+
+/* Info Card Section */
+.info-card {
+    background-color: #fff;
+    border-radius: 10px;
+    border: none;
+    position: relative;
+    margin-bottom: 30px;
+    box-shadow: 0 0.46875rem 2.1875rem rgba(90, 97, 105, 0.1), 0 0.9375rem 1.40625rem rgba(90, 97, 105, 0.1), 0 0.25rem 0.53125rem rgba(90, 97, 105, 0.12), 0 0.125rem 0.1875rem rgba(90, 97, 105, 0.1);
+}
+
+.info-card .card-statistic .card-icon-large .bi {
+    font-size: 110px;
+}
+
+.info-card .card-statistic .card-icon {
+    text-align: center;
+    line-height: 50px;
+    margin-left: 15px;
+    color: #000;
+    position: absolute;
+    right: -5px;
+    top: 20px;
+    opacity: 0.1;
+}
+
+/* Info Card Background Colors */
+
+.l-bg-cherry {
+    background: linear-gradient(to right, #493240, #f09) !important;
+    color: #fff;
+}
+
+.l-bg-blue-dark {
+    background: linear-gradient(to right, #373b44, #4286f4) !important;
+    color: #fff;
+}
+
+.l-bg-green-dark {
+    background: linear-gradient(to right, #0a504a, #38ef7d) !important;
+    color: #fff;
+}
+
+.l-bg-orange-dark {
+    background: linear-gradient(to right, #a86008, #ffba56) !important;
+    color: #fff;
+}
+
+.l-bg-cyan {
+    background: linear-gradient(135deg, #289cf5, #84c0ec) !important;
+    color: #fff;
+}
+
+.l-bg-green {
+    background: linear-gradient(135deg, #23bdb8 0%, #43e794 100%) !important;
+    color: #fff;
+}
+
+.l-bg-orange {
+    background: linear-gradient(to right, #f9900e, #ffba56) !important;
+    color: #fff;
+}
+
+/* Global Section */
+.sidebar-container {
+    min-height: 94.2vh;
+}
\ No newline at end of file
diff --git a/Server/public/res/js/controller.js b/Server/public/res/js/controller.js
new file mode 100644
index 0000000..04c0fd9
--- /dev/null
+++ b/Server/public/res/js/controller.js
@@ -0,0 +1,3 @@
+function sendNodeHeartbeat(nodeId) {
+    console.log(nodeId);
+}
\ No newline at end of file
diff --git a/Server/routes/index.js b/Server/routes/index.js
index a188406..1f43b2a 100644
--- a/Server/routes/index.js
+++ b/Server/routes/index.js
@@ -1,11 +1,12 @@
-const libCore = require("../libCore");
 var express = require('express');
 var router = express.Router();
 
+const { getAllNodes, getNodeInfoFromId } = require("../utilities/mysqlHandler");
+
 /* GET home page. */
 router.get('/', (req, res) => {
-  var sources = libCore.getSources();
-  //res.render('index', { "sources": sources });
+  //var sources = libCore.getSources();
+  return res.render('index');
 
   var htmlOutput = "";
 
@@ -28,4 +29,24 @@ router.get('/', (req, res) => {
 	res.send(htmlOutput);
 });
 
+/* GET node controller page. */
+router.get('/controller', async (req, res) => {
+	var nodes = await new Promise((recordResolve, recordReject) => {
+		getAllNodes((nodeRows) => {
+			recordResolve(nodeRows);
+		});
+	});	
+
+	//var sources = libCore.getSources();
+	return res.render('controller', {'nodes' : nodes});
+});
+
+/* GET individual node page. */
+router.get('/node/:id', async (req, res) => {
+	var node = await getNodeInfoFromId(req.params.id);
+
+	//var sources = libCore.getSources();
+	return res.render('node', {'node' : node});
+});
+
 module.exports = router;
diff --git a/Server/views/controller.ejs b/Server/views/controller.ejs
new file mode 100644
index 0000000..28099a9
--- /dev/null
+++ b/Server/views/controller.ejs
@@ -0,0 +1,11 @@
+<%- include('partials/htmlHead.ejs') %>
+    <div class="container">
+        <div class="row row-cols-1 row-cols-md-2 row-cols-xl-4">
+            <% for(const node of nodes) {%>
+                <%- include('partials/nodeCard.ejs', {'node': node}) %>
+            <% } %>
+        </div>
+    </div>
+<%- include('partials/bodyEnd.ejs') %>
+<script src="/res/js/controller.js"></script>
+<%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/index.ejs b/Server/views/index.ejs
index 7b7a1d6..b6524a3 100644
--- a/Server/views/index.ejs
+++ b/Server/views/index.ejs
@@ -1,11 +1,133 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <title><%= title %></title>
-    <link rel='stylesheet' href='/stylesheets/style.css' />
-  </head>
-  <body>
-    <h1><%= title %></h1>
-    <p>Welcome to <%= title %></p>
-  </body>
-</html>
+<%- include('partials/htmlHead.ejs') %>
+    <div class="container">
+        <div class="row row-cols-1 row-cols-md-2 row-cols-xl-4">
+            <div class="col-xl-3 col-lg-6">
+                <div class="info-card l-bg-cherry">
+                    <div class="card-statistic p-4">
+                        <div class="card-icon card-icon-large"><i class="bi bi-cart"></i></div>
+                        <div class="mb-4">
+                            <h5 class="card-title mb-0">New Orders</h5>
+                        </div>
+                        <div class="row align-items-center mb-2 d-flex">
+                            <div class="col-8">
+                                <h2 class="d-flex align-items-center mb-0">
+                                    3,243
+                                </h2>
+                            </div>
+                            <div class="col-4 text-right">
+                                <span>12.5% <i class="fa fa-arrow-up"></i></span>
+                            </div>
+                        </div>
+                        <div class="progress mt-1 " data-height="8" style="height: 8px;">
+                            <div class="progress-bar l-bg-cyan" role="progressbar" data-width="25%" aria-valuenow="25"
+                                aria-valuemin="0" aria-valuemax="100" style="width: 25%;"></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-xl-3 col-lg-6">
+                <div class="info-card l-bg-blue-dark">
+                    <div class="card-statistic p-4">
+                        <div class="card-icon card-icon-large"><i class="bi bi-cart"></i></div>
+                        <div class="mb-4">
+                            <h5 class="card-title mb-0">New Orders</h5>
+                        </div>
+                        <div class="row align-items-center mb-2 d-flex">
+                            <div class="col-8">
+                                <h2 class="d-flex align-items-center mb-0">
+                                    3,243
+                                </h2>
+                            </div>
+                            <div class="col-4 text-right">
+                                <span>12.5% <i class="fa fa-arrow-up"></i></span>
+                            </div>
+                        </div>
+                        <div class="progress mt-1 " data-height="8" style="height: 8px;">
+                            <div class="progress-bar l-bg-cyan" role="progressbar" data-width="25%" aria-valuenow="25"
+                                aria-valuemin="0" aria-valuemax="100" style="width: 25%;"></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-xl-3 col-sm-6">
+                <div class="card node-card">
+                    <div class="card-body">
+                        <div class="dropdown float-end">
+                            <a class="text-muted dropdown-toggle font-size-16" href="#" role="button"
+                                data-bs-toggle="dropdown" aria-haspopup="true"><i
+                                    class="bx bx-dots-horizontal-rounded"></i></a>
+                            <div class="dropdown-menu dropdown-menu-end"><a class="dropdown-item" href="#">Edit</a><a
+                                    class="dropdown-item" href="#">Action</a><a class="dropdown-item"
+                                    href="#">Remove</a></div>
+                        </div>
+                        <div class="d-flex align-items-center">
+                            <div><img src="https://bootdey.com/img/Content/avatar/avatar1.png" alt=""
+                                    class="avatar-md rounded-circle img-thumbnail" /></div>
+                            <div class="flex-1 ms-3">
+                                <h5 class="font-size-16 mb-1"><a href="#" class="text-dark">Phyllis Gatlin</a></h5>
+                                <span class="badge badge-soft-success mb-0">Full Stack Developer</span>
+                            </div>
+                        </div>
+                        <div class="mt-3 pt-1">
+                            <p class="text-muted mb-0"><i
+                                    class="mdi mdi-phone font-size-15 align-middle pe-2 text-primary"></i> 070 2860 5375
+                            </p>
+                            <p class="text-muted mb-0 mt-2"><i
+                                    class="mdi mdi-email font-size-15 align-middle pe-2 text-primary"></i>
+                                PhyllisGatlin@spy.com</p>
+                            <p class="text-muted mb-0 mt-2"><i
+                                    class="mdi mdi-google-maps font-size-15 align-middle pe-2 text-primary"></i> 52
+                                Ilchester MYBSTER 9WX</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-xl-3 col-sm-6">
+                <div class="card node-card">
+                    <div class="card-body">
+                        <div class="dropdown float-end">
+                            <a class="text-muted dropdown-toggle font-size-16" href="#" role="button"
+                                data-bs-toggle="dropdown" aria-haspopup="true"><i
+                                    class="bx bx-dots-horizontal-rounded"></i></a>
+                            <div class="dropdown-menu dropdown-menu-end"><a class="dropdown-item" href="#">Edit</a><a
+                                    class="dropdown-item" href="#">Action</a><a class="dropdown-item"
+                                    href="#">Remove</a></div>
+                        </div>
+                        <div class="d-flex align-items-center">
+                            <div><img src="https://bootdey.com/img/Content/avatar/avatar5.png" alt=""
+                                    class="avatar-md rounded-circle img-thumbnail" /></div>
+                            <div class="flex-1 ms-3">
+                                <h5 class="font-size-16 mb-1"><a href="#" class="text-dark">Diana Owens</a></h5>
+                                <span class="badge badge-soft-danger mb-0">UI/UX Designer</span>
+                            </div>
+                        </div>
+                        <div class="mt-3 pt-1">
+                            <p class="text-muted mb-0"><i
+                                    class="mdi mdi-phone font-size-15 align-middle pe-2 text-primary"></i> 087 6321 3235
+                            </p>
+                            <p class="text-muted mb-0 mt-2"><i
+                                    class="mdi mdi-email font-size-15 align-middle pe-2 text-primary"></i>
+                                DianaOwens@spy.com</p>
+                            <p class="text-muted mb-0 mt-2"><i
+                                    class="mdi mdi-google-maps font-size-15 align-middle pe-2 text-primary"></i> 52
+                                Ilchester MYBSTER 9WX</p>
+                        </div>
+                        <div class="d-flex gap-2 pt-4">
+                            <button type="button" class="btn btn-soft-primary btn-sm w-50"><i
+                                    class="bx bx-user me-1"></i> Profile</button>
+                            <button type="button" class="btn btn-primary btn-sm w-50"><i
+                                    class="bx bx-message-square-dots me-1"></i> Contact</button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+
+        </div>
+    </div>
+<%- include('partials/bodyEnd.ejs') %>
+
+<%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
new file mode 100644
index 0000000..941e326
--- /dev/null
+++ b/Server/views/node.ejs
@@ -0,0 +1,41 @@
+<%- include('partials/htmlHead.ejs') %>
+<div class="card mb-4">
+    <div class="card-header">
+        Account Details
+        <% if(node.online){%> <span class="badge badge-soft-success mb-0">Online</span>
+        <% } else {%> <span class="badge badge-soft-danger mb-0">Offline</span>
+        <% } %>
+    </div>
+    <div class="card-body">
+        <form>
+            <div class="mb-3">
+                <label class="small mb-1" for="nodeId">Node ID (this is the assigned Node ID and cannot be changed)</label>
+                <input class="form-control" id="nodeId" type="text" value="<%=node.id%>" disabled>
+            </div>
+            <div class="row gx-3 mb-3">
+                <div class="col-md-12">
+                    <label class="small mb-1" for="inputNodeName">Node Name</label>
+                    <input class="form-control" id="inputNodeName" type="text" value="<%=node.name%>">
+                </div>                
+            </div>
+            <div class="row gx-3 mb-3">
+                <div class="col-md-4">
+                    <label class="small mb-1" for="inputNodeIp">Node IP Address (that the server can contact)</label>
+                    <input class="form-control" id="inputNodeIp" type="text" value="<%=node.ip%>">
+                </div>
+                <div class="col-md-2">
+                    <label class="small mb-1" for="inputOrgName">Node Port (with the API)</label>
+                    <input class="form-control" id="inputOrgName" type="number" value="<%=node.port%>">
+                </div>
+            </div>
+            <div class="mb-3">
+                <label class="small mb-1" for="inputNodeLocation">Node Location (physical location)</label>
+                <input class="form-control" id="inputNodeLocation" type="location" value="<%=node.location%>">
+            </div>            
+            <!-- Save changes button-->
+            <button class="btn btn-primary" type="button">Save changes</button>
+        </form>
+    </div>
+</div>
+<%- include('partials/bodyEnd.ejs') %>
+<%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/bodyEnd.ejs b/Server/views/partials/bodyEnd.ejs
new file mode 100644
index 0000000..2a347cf
--- /dev/null
+++ b/Server/views/partials/bodyEnd.ejs
@@ -0,0 +1,11 @@
+</div>
+</div>
+</div>
+
+</body>
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"
+    integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz"
+    crossorigin="anonymous"></script>
+
+<script src="https://code.jquery.com/jquery-3.7.0.slim.min.js"
+    integrity="sha256-tG5mcZUtJsZvyKAxYLVXrmjKBVLd6VpVccqz/r4ypFE=" crossorigin="anonymous"></script>
\ No newline at end of file
diff --git a/Server/views/partials/head.ejs b/Server/views/partials/head.ejs
new file mode 100644
index 0000000..3429389
--- /dev/null
+++ b/Server/views/partials/head.ejs
@@ -0,0 +1,9 @@
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Bootstrap demo</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"
+        integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css">
+    <link rel="stylesheet" href="/res/css/main.css">
+</head>
\ No newline at end of file
diff --git a/Server/views/partials/htmlFooter.ejs b/Server/views/partials/htmlFooter.ejs
new file mode 100644
index 0000000..62d09b8
--- /dev/null
+++ b/Server/views/partials/htmlFooter.ejs
@@ -0,0 +1 @@
+</html>
\ No newline at end of file
diff --git a/Server/views/partials/htmlHead.ejs b/Server/views/partials/htmlHead.ejs
new file mode 100644
index 0000000..5a3ef3b
--- /dev/null
+++ b/Server/views/partials/htmlHead.ejs
@@ -0,0 +1,6 @@
+<!doctype html>
+<html lang="en" data-bs-theme="auto">
+    <%- include('head.ejs') %>
+    <body>
+        <%- include('navbar.ejs') %>
+        <%- include('sidebar.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/navbar.ejs b/Server/views/partials/navbar.ejs
new file mode 100644
index 0000000..ccac10e
--- /dev/null
+++ b/Server/views/partials/navbar.ejs
@@ -0,0 +1,40 @@
+<nav class="navbar navbar-expand-lg bg-body-tertiary" data-bs-theme="dark">
+    <div class="container-fluid">
+        <a class="navbar-brand" href="#">Navbar</a>
+        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
+            aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+            <span class="navbar-toggler-icon"></span>
+        </button>
+        <div class="collapse navbar-collapse" id="navbarSupportedContent">
+            <ul class="navbar-nav me-auto mb-2 mb-lg-0">
+                <li class="nav-item">
+                    <a class="nav-link active" aria-current="page" href="#">Home</a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link" href="#">Link</a>
+                </li>
+                <li class="nav-item dropdown">
+                    <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
+                        aria-expanded="false">
+                        Dropdown
+                    </a>
+                    <ul class="dropdown-menu">
+                        <li><a class="dropdown-item" href="#">Action</a></li>
+                        <li><a class="dropdown-item" href="#">Another action</a></li>
+                        <li>
+                            <hr class="dropdown-divider">
+                        </li>
+                        <li><a class="dropdown-item" href="#">Something else here</a></li>
+                    </ul>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link disabled">Disabled</a>
+                </li>
+            </ul>
+            <form class="d-flex" role="search">
+                <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
+                <button class="btn btn-outline-success" type="submit">Search</button>
+            </form>
+        </div>
+    </div>
+</nav>
\ No newline at end of file
diff --git a/Server/views/partials/nodeCard.ejs b/Server/views/partials/nodeCard.ejs
new file mode 100644
index 0000000..b676560
--- /dev/null
+++ b/Server/views/partials/nodeCard.ejs
@@ -0,0 +1,57 @@
+<div class="col-xl-3 col-sm-6">
+    <div class="card node-card">
+        <div class="card-body">
+            <div class="dropdown float-end">
+                <a class="text-muted dropdown-toggle font-size-16" href="#" role="button" data-bs-toggle="dropdown"
+                    aria-haspopup="true">
+                    <i class="bx bx-dots-horizontal-rounded"></i>
+                </a>
+                <div class="dropdown-menu dropdown-menu-end">
+                    <a class="dropdown-item node-action" href="/node/<%=node.id%>" >Edit</a>
+                    <a class="dropdown-item node-action" href="#" onclick="sendNodeHeartbeat('<%=node.id%>')">Send Heartbeat</a>
+                </div>
+            </div>
+            <div class="d-flex align-items-center">
+                <div>
+                    <img src="https://bootdey.com/img/Content/avatar/avatar1.png" alt=""
+                        class="avatar-md rounded-circle img-thumbnail" />
+                </div>
+                <div class="flex-1 ms-3">
+                    <h5 class="font-size-16 mb-1"><a href="/node/<%=node.id%>" class="text-dark">
+                            <%= node.name %>
+                        </a></h5>
+                    <% if(node.online){%> <span class="badge badge-soft-success mb-0">Online</span>
+                        <% } else {%> <span class="badge badge-soft-danger mb-0">Offline</span>
+                            <% } %>
+                </div>
+            </div>
+            <div class="mt-3 pt-1">
+                <p class="text-muted mb-0">
+                    <i class="bi bi-geo font-size-15 align-middle pe-2 text-primary"></i>
+                    <%= node.location %>
+                </p>
+                <p class="text-muted mb-0">
+                    <i class="bi bi-phone font-size-15 align-middle pe-2 text-primary"></i>
+                    <a href="#" target="_blank">
+                        <%= node.ip %>:<%= node.port %>
+                    </a>
+                </p>
+                <p class="text-muted mb-0">
+                <div class="dropdown">
+                    <i class="bi bi-broadcast-pin font-size-15 align-middle pe-2 text-primary"></i>
+                    <a class="dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
+                        Nearby Systems
+                    </a>
+                    <ul class="dropdown-menu">
+                        <% for(const system in node.nearbySystems){ %>
+                            <li>
+                                <%= system %>
+                            </li>
+                            <% } %>
+                    </ul>
+                </div>
+                </p>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/Server/views/partials/sidebar.ejs b/Server/views/partials/sidebar.ejs
new file mode 100644
index 0000000..8eb5815
--- /dev/null
+++ b/Server/views/partials/sidebar.ejs
@@ -0,0 +1,83 @@
+<div class="container-fluid">
+    <div class="row flex-nowrap">
+        <div class="col-auto col-md-3 col-xl-2 px-sm-2 px-0 bg-dark">
+            <div class="d-flex flex-column align-items-center align-items-sm-start px-3 pt-2 text-white sidebar-container">
+                <ul class="nav nav-pills flex-column mb-sm-auto mb-0 align-items-center align-items-sm-start" id="menu">
+                    <li class="nav-item">
+                        <a href="#" class="nav-link align-middle px-0">
+                            <i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Home</span>
+                        </a>
+                    </li>
+                    <li>
+                        <a href="#submenu1" data-bs-toggle="collapse" class="nav-link px-0 align-middle">
+                            <i class="fs-4 bi-speedometer2"></i> <span class="ms-1 d-none d-sm-inline">Dashboard</span>
+                        </a>
+                        <ul class="collapse nav flex-column ms-1" id="submenu1" data-bs-parent="#menu">
+                            <li class="w-100">
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 1 </a>
+                            </li>
+                            <li>
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 2 </a>
+                            </li>
+                        </ul>
+                    </li>
+                    <li>
+                        <a href="#" class="nav-link px-0 align-middle">
+                            <i class="fs-4 bi-table"></i> <span class="ms-1 d-none d-sm-inline">Orders</span></a>
+                    </li>
+                    <li>
+                        <a href="#submenu2" data-bs-toggle="collapse" class="nav-link px-0 align-middle ">
+                            <i class="fs-4 bi-bootstrap"></i> <span class="ms-1 d-none d-sm-inline">Bootstrap</span></a>
+                        <ul class="collapse nav flex-column ms-1" id="submenu2" data-bs-parent="#menu">
+                            <li class="w-100">
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 1</a>
+                            </li>
+                            <li>
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 2</a>
+                            </li>
+                        </ul>
+                    </li>
+                    <li>
+                        <a href="#submenu3" data-bs-toggle="collapse" class="nav-link px-0 align-middle">
+                            <i class="fs-4 bi-grid"></i> <span class="ms-1 d-none d-sm-inline">Products</span> </a>
+                        <ul class="collapse nav flex-column ms-1" id="submenu3" data-bs-parent="#menu">
+                            <li class="w-100">
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 1</a>
+                            </li>
+                            <li>
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 2</a>
+                            </li>
+                            <li>
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 3</a>
+                            </li>
+                            <li>
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 4</a>
+                            </li>
+                        </ul>
+                    </li>
+                    <li>
+                        <a href="#" class="nav-link px-0 align-middle">
+                            <i class="fs-4 bi-people"></i> <span class="ms-1 d-none d-sm-inline">Customers</span> </a>
+                    </li>
+                </ul>
+                <hr>
+                <div class="dropdown pb-4 fixed-bottom px-3">
+                    <a href="#" class="d-flex align-items-center text-white text-decoration-none dropdown-toggle"
+                        id="dropdownUser1" data-bs-toggle="dropdown" aria-expanded="false">
+                        <img src="https://github.com/mdo.png" alt="hugenerd" width="30" height="30"
+                            class="rounded-circle">
+                        <span class="d-none d-sm-inline mx-1">loser</span>
+                    </a>
+                    <ul class="dropdown-menu dropdown-menu-dark text-small shadow">
+                        <li><a class="dropdown-item" href="#">New project...</a></li>
+                        <li><a class="dropdown-item" href="#">Settings</a></li>
+                        <li><a class="dropdown-item" href="#">Profile</a></li>
+                        <li>
+                            <hr class="dropdown-divider">
+                        </li>
+                        <li><a class="dropdown-item" href="#">Sign out</a></li>
+                    </ul>
+                </div>
+            </div>
+        </div>
+        <div class="col py-3">
\ No newline at end of file

From e522326576e1cb3164c186fc5adcb35e9818de7a Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 15 Jul 2023 23:30:41 -0400
Subject: [PATCH 07/57] Additional changes for #37

- Updating side bar
- Updating nav bar
- Adding node details page
- Adding controller page
- Updating routes
---
 Server/controllers/nodesController.js       | 144 ++++++++--------
 Server/public/res/css/main.css              |  36 +++-
 Server/public/res/js/node.js                |  50 ++++++
 Server/routes/nodes.js                      |   5 +-
 Server/utilities/recordHelper.js            |   3 +-
 Server/views/node.ejs                       | 179 ++++++++++++++++----
 Server/views/partials/bodyEnd.ejs           |   5 +-
 Server/views/partials/modifySystemModal.ejs |  54 ++++++
 Server/views/partials/navbar.ejs            |   4 +-
 Server/views/partials/sidebar.ejs           |  59 +------
 10 files changed, 376 insertions(+), 163 deletions(-)
 create mode 100644 Server/public/res/js/node.js
 create mode 100644 Server/views/partials/modifySystemModal.ejs

diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index 45d26e8..c1999ed 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -2,15 +2,61 @@
 const { DebugBuilder } = require("../utilities/debugBuilder.js");
 const log = new DebugBuilder("server", "nodesController");
 // Utilities
-const {getAllNodes, addNewNode, updateNodeInfo, getNodeInfoFromId, getOnlineNodes } = require("../utilities/mysqlHandler");
+const { getAllNodes, addNewNode, updateNodeInfo, getNodeInfoFromId, getOnlineNodes } = require("../utilities/mysqlHandler");
 const utils = require("../utilities/utils");
 const { sendHttpRequest, requestOptions } = require("../utilities/httpRequests.js");
 const { nodeObject } = require("../utilities/recordHelper.js");
-const { joinServerWrapper } = require("../commands/join");
-const { leaveServerWrapper } = require("../commands/leave");
 
 const refreshInterval = process.env.NODE_MONITOR_REFRESH_INTERVAL ?? 1200000;
 
+/**
+ * Check in with a singular node, mark it offline if it's offline and 
+ * 
+ * @param {*} node The node Object to check in with
+ */
+async function checkInWithNode(node) {
+    const reqOptions = new requestOptions("/client/requestCheckIn", "GET", node.ip, node.port)
+    sendHttpRequest(reqOptions, "", (responseObj) => {
+        if (responseObj) {
+            log.DEBUG("Response from: ", node.name, responseObj);
+            const onlineNode = new nodeObject({ _online: false, _id: node.id });
+            log.DEBUG("Node update object: ", onlineNode);
+            updateNodeInfo(onlineNode, (sqlResponse) => {
+                if (!sqlResponse) this.log.ERROR("No response from SQL object");
+
+                log.DEBUG("Updated node: ", sqlResponse);
+                return true
+            })            
+        }
+        else {
+            log.DEBUG("No response from node, assuming it's offline");
+            const offlineNode = new nodeObject({ _online: false, _id: node.id });
+            log.DEBUG("Offline node update object: ", offlineNode);
+            updateNodeInfo(offlineNode, (sqlResponse) => {
+                if (!sqlResponse) this.log.ERROR("No response from SQL object");
+
+                log.DEBUG("Updated offline node: ", sqlResponse);
+                return false
+            })
+        }
+    })
+}
+exports.checkInWithNode = checkInWithNode;
+
+/**
+ * Check in with all online nodes and mark any nodes that are actually offline
+*/
+async function checkInWithOnlineNodes() {
+    getOnlineNodes((nodes) => {
+        log.DEBUG("Online Nodes: ", nodes);
+        for (const node of nodes) {
+            checkInWithNode(node);
+        }
+        return;
+    });
+}
+exports.checkInWithOnlineNodes = checkInWithOnlineNodes;
+
 /**
  * 
  * @param {*} req Default express req from router
@@ -28,7 +74,7 @@ exports.listAllNodes = async (req, res) => {
  *  Add a new node to the storage
  * @param {*} req Default express req from router
  * @param {*} res Defualt express res from router
- */ 
+ */
 exports.newNode = async (req, res) => {
     if (!req.body.name) return res.status(400).json("No name specified for new node");
 
@@ -45,7 +91,7 @@ exports.newNode = async (req, res) => {
 
         addNewNode(newNode, (newNodeObject) => {
             // Send back a success if the user has been added and the ID for the client to keep track of
-            res.status(202).json({"nodeId": newNodeObject.id});
+            res.status(202).json({ "nodeId": newNodeObject.id });
         })
     }
     catch (err) {
@@ -62,7 +108,7 @@ exports.newNode = async (req, res) => {
  * 
  * @param {*} req Default express req from router
  * @param {*} res Defualt express res from router
- */ 
+ */
 exports.getNodeInfo = async (req, res) => {
     if (!req.query.id) return res.status(400).json("No id specified");
     getNodeInfoFromId(req.query.id, (nodeInfo) => {
@@ -75,7 +121,7 @@ exports.getNodeInfo = async (req, res) => {
  * @param {*} req Default express req from router
  * @param {*} res Defualt express res from router
  */
-exports.nodeCheckIn = async  (req, res) => {
+exports.nodeCheckIn = async (req, res) => {
     if (!req.body.id) return res.status(400).json("No id specified");
     getNodeInfoFromId(req.body.id, (nodeInfo) => {
         let checkInObject = {};
@@ -87,7 +133,7 @@ exports.nodeCheckIn = async  (req, res) => {
         if (req.body.name && req.body.name != nodeInfo.name) {
             checkInObject._name = req.body.name;
             isObjectUpdated = true;
-        } 
+        }
 
         if (req.body.ip && req.body.ip != nodeInfo.ip) {
             checkInObject._ip = req.body.ip;
@@ -115,9 +161,9 @@ exports.nodeCheckIn = async  (req, res) => {
         }
 
         // If no changes are made tell the client
-        if (!isObjectUpdated) return res.status(200).json("No keys updated");        
+        if (!isObjectUpdated) return res.status(200).json("No keys updated");
 
-        log.INFO("Updating the following keys for ID: ", req.body.id, checkInObject);        
+        log.INFO("Updating the following keys for ID: ", req.body.id, checkInObject);
 
         checkInObject._id = req.body.id;
         checkInObject = new nodeObject(checkInObject);
@@ -125,40 +171,28 @@ exports.nodeCheckIn = async  (req, res) => {
         if (!nodeInfo) {
             log.WARN("No existing node found with this ID, adding node: ", checkInObject);
             addNewNode(checkInObject, (newNode) => {
-                return res.status(201).json({"updatedKeys": newNode});
+                return res.status(201).json({ "updatedKeys": newNode });
             });
         }
-        else {            
+        else {
             updateNodeInfo(checkInObject, () => {
-                return res.status(202).json({"updatedKeys": checkInObject});
+                return res.status(202).json({ "updatedKeys": checkInObject });
             });
-        }        
+        }
     });
 }
 
 /**
- * Request the node to join the specified server/channel and listen to the specified resource
+ * Requests a specific node to check in with the server, if it's online
  * 
  * @param {*} req Default express req from router
  * @param {*} res Defualt express res from router
- * @param req.body.clientId The client ID to join discord with (NOT dev portal ID, right click user -> Copy ID)
- * @param req.body.channelId The Channel ID to join in Discord
- * @param req.body.presetName The preset name to listen to in Discord
  */
-exports.requestNodeJoinServer = async (req, res) => {
-    if (!req.body.clientId || !req.body.channelId || !req.body.presetName) return res.status(400).json("Missing information in request, requires clientId, channelId, presetName");
-    await joinServerWrapper(req.body.presetName, req.body.channelId, req.body.clientId);
-}
-
-/**
- * 
- * @param {*} req Default express req from router
- * @param {*} res Defualt express res from router
- * @param {*} req.body.clientId The client ID to request to leave the server 
- */
-exports.requestNodeLeaveServer = async (req, res) => {
-    if (!req.body.ClientId) return res.status(400).json("Missing client ID in request");
-    await leaveServerWrapper({clientId: req.body.ClientId});
+exports.requestNodeCheckIn = async (req, res) => {
+    if (!req.params.nodeId) return res.status(400).json("No Node ID supplied in request");
+    const node = await getNodeInfoFromId(req.params.nodeId);
+    if (!node) return res.status(400).json("No Node with the ID given");
+    checkInWithNode(node);
 }
 
 /**
@@ -172,49 +206,21 @@ exports.nodeMonitorService = class nodeMonitorService {
     /**
      * Start the node monitor service in the background
      */
-    async start(){
-	    // Wait for the a portion of the refresh period before checking in with the nodes, so the rest of the bot can start
-        await new Promise(resolve => setTimeout(resolve, refreshInterval/10));
+    async start() {
+        // Wait for the a portion of the refresh period before checking in with the nodes, so the rest of the bot can start
+        await new Promise(resolve => setTimeout(resolve, refreshInterval / 10));
 
         log.INFO("Starting Node Monitor Service");
         // Check in before starting the infinite loop
-        await this.checkInWithOnlineNodes();
-        
-        
-        while(true){
+        await checkInWithOnlineNodes();
+
+
+        while (true) {
             // Wait for the refresh interval, then wait for the posts to return, then wait a quarter of the refresh interval to make sure everything is cleared up
             await new Promise(resolve => setTimeout(resolve, refreshInterval));
-            await this.checkInWithOnlineNodes();
+            await checkInWithOnlineNodes();
             await new Promise(resolve => setTimeout(resolve, refreshInterval / 4));
             continue;
-        }        
-    }
-
-    /**
-     * Check in with all online nodes and mark any nodes that are actually offline
-     */
-    async checkInWithOnlineNodes(){
-        getOnlineNodes((nodes) => {
-            this.log.DEBUG("Online Nodes: ", nodes);
-            for (const node of nodes) {
-                const reqOptions = new requestOptions("/client/requestCheckIn", "GET", node.ip, node.port)
-                sendHttpRequest(reqOptions, "", (responseObj) => {
-                    if (responseObj) {
-                        this.log.DEBUG("Response from: ", node.name, responseObj);
-                    }
-                    else {
-                        this.log.DEBUG("No response from node, assuming it's offline");
-                        const offlineNode = new nodeObject({ _online: 0, _id: node.id });
-                        this.log.DEBUG("Offline node update object: ", offlineNode);
-                        updateNodeInfo(offlineNode, (sqlResponse) => {
-                            if (!sqlResponse) this.log.ERROR("No response from SQL object");
-
-                            this.log.DEBUG("Updated offline node: ", sqlResponse);
-                        })
-                    }
-                })
-            }
-            return;
-        });
+        }
     }
 }
diff --git a/Server/public/res/css/main.css b/Server/public/res/css/main.css
index d057e2a..6384148 100644
--- a/Server/public/res/css/main.css
+++ b/Server/public/res/css/main.css
@@ -139,4 +139,38 @@ a {
 /* Global Section */
 .sidebar-container {
     min-height: 94.2vh;
-}
\ No newline at end of file
+}
+
+/* User table section */
+
+.label {
+    border-radius: 3px;
+    font-size: 1.1em;
+    font-weight: 600;
+}
+
+.user-list tbody td .user-subhead {
+    font-size: 1em;
+    font-style: italic;
+}
+
+.table thead tr th {
+    text-transform: uppercase;
+    font-size: 0.875em;
+}
+
+.table thead tr th {
+    border-bottom: 2px solid #e7ebee;
+}
+
+.table tbody tr td:first-child {
+    font-size: 1.125em;
+    font-weight: 300;
+}
+
+.table tbody tr td {
+    font-size: 0.875em;
+    vertical-align: middle;
+    border-top: 1px solid #e7ebee;
+    padding: 12px 8px;
+}
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
new file mode 100644
index 0000000..a1530f4
--- /dev/null
+++ b/Server/public/res/js/node.js
@@ -0,0 +1,50 @@
+function addFrequencyInput(system){
+    // 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.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 = 'nodeFreq';
+    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.appendChild(childRow);
+
+    document.getElementById(`frequencyRow_${system.replaceAll(" ", "_")}`).appendChild(colParent);
+}
+
+function checkInByNodeId(nodeId){
+    const Http = new XMLHttpRequest();
+    const url='/nodes/'+nodeId;
+    Http.open("GET", url);
+    Http.send();
+
+    Http.onreadystatechange = (e) => {
+    console.log(Http.responseText)
+    }
+}
\ No newline at end of file
diff --git a/Server/routes/nodes.js b/Server/routes/nodes.js
index b90e8db..773bc45 100644
--- a/Server/routes/nodes.js
+++ b/Server/routes/nodes.js
@@ -28,8 +28,7 @@ router.get('/nodeInfo', nodesController.getNodeInfo);
 // Client checkin with the server to update information
 router.post('/nodeCheckIn', nodesController.nodeCheckIn);
 
-// TODO Need to authenticate this request
-// Request a particular client to join a particular channel listening to a particular preset
-router.post('/joinServer', nodesController.requestNodeJoinServer);
+// Request a node to check in with the server
+router.get('/:nodeId', nodesController.requestNodeCheckIn);
 
 module.exports = router;
diff --git a/Server/utilities/recordHelper.js b/Server/utilities/recordHelper.js
index 5464374..eb26ae3 100644
--- a/Server/utilities/recordHelper.js
+++ b/Server/utilities/recordHelper.js
@@ -118,8 +118,7 @@ class nodeObject {
         this.ip = _ip;
         this.port = _port;
         this.location = _location;        
-        this.nearbySystems = _nearbySystems;
-        if (this.nearbySystems) this.presets = Object.keys(_nearbySystems);
+        this.nearbySystems = _nearbySystems;        
         this.online = _online;
     }
 }
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
index 941e326..05cd447 100644
--- a/Server/views/node.ejs
+++ b/Server/views/node.ejs
@@ -1,41 +1,154 @@
 <%- include('partials/htmlHead.ejs') %>
-<div class="card mb-4">
-    <div class="card-header">
-        Account Details
-        <% if(node.online){%> <span class="badge badge-soft-success mb-0">Online</span>
-        <% } else {%> <span class="badge badge-soft-danger mb-0">Offline</span>
-        <% } %>
+    <div class="container">
+        <div class="card mb-4">
+            <div class="card-header">
+                <p>
+                    <span class="fs-2 fw-semibold">
+                        Node Details
+                    </span>                                    
+                </p>                
+            </div>
+            <div class="card-body">
+                <form>
+                    <div class="row gx-3 mb-3">
+                        <div class="">
+                            
+                        </div>
+                        <div class="col-md-6">
+                            <label class="small mb-1" for="nodeId">Node ID (this is the assigned Node ID and cannot be
+                                changed)</label>
+                            <input class="form-control" id="nodeId" type="text" value="<%=node.id%>" disabled></input>
+                        </div>                        
+                        <div class="col-md-6">                            
+                            <label class="small mb-1" for="nodeStatus">Online Status:</label>
+                            <% if(node.online){%> <span class="badge badge-soft-success mb-0 align-middle fs-6" id="nodeStatus">Online</span>
+                            <% } else {%> <span class="badge badge-soft-danger mb-0 align-middle fs-6">Offline</span>
+                            <% } %>
+                            <hr>
+                            <!-- Join Server button-->
+                            <a type="button" class="btn btn-info <% if(!node.online) { %>disabled<% } %>" href="/join/<%=node.id%>">Join Server</a>
+                            <!-- Leave Server button  -->
+                            <a type="button" class="btn btn-danger <% if(!node.online) { %>disabled<% } %>" href="/leave/<%=node.id%>">Leave Server</a>
+                            <!-- Checkin with client button  -->
+                            <a type="button" class="btn btn-secondary" href="#" onclick="checkInByNodeId('<%=node.id%>')">Check-in with Node</a>
+                        </div>
+                    </div>
+
+                    <div class="row gx-3 mb-3">
+                        <div class="col-md-12">
+                            <label class="small mb-1" for="inputNodeName">Node Name:</label>
+                            <input class="form-control" id="inputNodeName" type="text" value="<%=node.name%>"></input>
+                        </div>
+                    </div>
+                    <div class="row gx-3 mb-3">
+                        <div class="col-md-4">
+                            <label class="small mb-1" for="inputNodeIp">Node IP Address (that the server can
+                                contact):</label>
+                            <input class="form-control" id="inputNodeIp" type="text" value="<%=node.ip%>"></input>
+                        </div>
+                        <div class="col-md-2">
+                            <label class="small mb-1" for="inputOrgName">Node Port (with the API):</label>
+                            <input class="form-control" id="inputOrgName" type="number" value="<%=node.port%>"></input>
+                        </div>
+                    </div>
+                    <div class="mb-3">
+                        <label class="small mb-1" for="inputNodeLocation">Node Location (physical location):</label>
+                        <input class="form-control" id="inputNodeLocation" type="location" value="<%=node.location%>"></input>
+                    </div>
+                    <h4>
+                        Nearby Systems
+                    </h4>
+                    <hr>
+                    <div class="row">
+                        <div class="col-lg-12">
+                            <div class="main-box no-header clearfix">
+                                <div class="main-box-body clearfix">
+                                    <div class="table-responsive">
+                                        <table class="table user-list <% if(!node.online) { %>disabled<% } %>">
+                                            <thead>
+                                                <tr>
+                                                    <th><span>System Name</span></th>
+                                                    <th><span>Frequencies</span></th>
+                                                    <th><span>Protocol</span></th>
+                                                    <th>&nbsp;</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <% for(const system in node.nearbySystems){ %>
+                                                    <tr>
+                                                        <td>
+                                                            <%= system %>
+                                                        </td>
+                                                        <td>
+                                                            <% if(node.nearbySystems[system].frequencies.length> 1) { %>
+                                                                <ul>
+                                                                    <% for(const frequency of
+                                                                        node.nearbySystems[system].frequencies) { %>
+                                                                        <li>
+                                                                            <%=frequency%> MHz
+                                                                        </li>
+                                                                        <% } %>
+                                                                </ul>
+                                                                <% } else { const
+                                                                    frequency=node.nearbySystems[system].frequencies[0]
+                                                                    %>
+                                                                    <%=frequency%> MHz
+                                                                        <% } %>
+                                                        </td>
+                                                        <td>
+                                                            <span class="label label-default text-uppercase">
+                                                                <%= node.nearbySystems[system].mode %>
+                                                            </span>
+                                                        </td>
+                                                        <td>
+                                                            <a href="#" class="table-link text-info label"
+                                                                data-bs-toggle="modal"
+                                                                data-bs-target="#updateSystemModal_<%=system.replaceAll(" ", "_")%>">
+                                                                <i class="bi bi-pencil"></i>
+                                                            </a>
+                                                            <a href="#" class="table-link text-danger label">
+                                                                <i class="bi bi-trash"></i>
+                                                            </a>
+                                                        </td>
+                                                    </tr>
+                                                    <% // Update system modal %>        
+                                                    <%- include("partials/modifySystemModal.ejs", {'system': system, 'frequencies': node.nearbySystems[system].frequencies}) %>
+                                                    <% } %>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <!-- Save changes button-->
+                    <button class="btn btn-primary <% if(!node.online) { %>disabled<% } %>" type="button">Save changes</button>
+                    <!-- Button trigger modal -->
+                    <button type="button" class="btn btn-primary float-right <% if(!node.online) { %>disabled<% } %>" data-bs-toggle="modal"
+                        data-bs-target="#newSystemModal">Add New System</button>
+                </form>
+            </div>
+        </div>
     </div>
-    <div class="card-body">
-        <form>
-            <div class="mb-3">
-                <label class="small mb-1" for="nodeId">Node ID (this is the assigned Node ID and cannot be changed)</label>
-                <input class="form-control" id="nodeId" type="text" value="<%=node.id%>" disabled>
-            </div>
-            <div class="row gx-3 mb-3">
-                <div class="col-md-12">
-                    <label class="small mb-1" for="inputNodeName">Node Name</label>
-                    <input class="form-control" id="inputNodeName" type="text" value="<%=node.name%>">
-                </div>                
-            </div>
-            <div class="row gx-3 mb-3">
-                <div class="col-md-4">
-                    <label class="small mb-1" for="inputNodeIp">Node IP Address (that the server can contact)</label>
-                    <input class="form-control" id="inputNodeIp" type="text" value="<%=node.ip%>">
+
+    <% // new System Modal %>
+    <div class="modal fade" id="newSystemModal" tabindex="-1" aria-labelledby="newSystemModal" aria-hidden="true">
+        <div class="modal-dialog modal-dialog-centered">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <h1 class="modal-title fs-5" id="newSystemModal">Add a New System</h1>
+                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                 </div>
-                <div class="col-md-2">
-                    <label class="small mb-1" for="inputOrgName">Node Port (with the API)</label>
-                    <input class="form-control" id="inputOrgName" type="number" value="<%=node.port%>">
+                <div class="modal-body">
+                    ...
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+                    <button type="button" class="btn btn-primary">Save changes</button>
                 </div>
             </div>
-            <div class="mb-3">
-                <label class="small mb-1" for="inputNodeLocation">Node Location (physical location)</label>
-                <input class="form-control" id="inputNodeLocation" type="location" value="<%=node.location%>">
-            </div>            
-            <!-- Save changes button-->
-            <button class="btn btn-primary" type="button">Save changes</button>
-        </form>
+        </div>
     </div>
-</div>
 <%- include('partials/bodyEnd.ejs') %>
+<script src="/res/js/node.js"></script>
 <%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/bodyEnd.ejs b/Server/views/partials/bodyEnd.ejs
index 2a347cf..992066b 100644
--- a/Server/views/partials/bodyEnd.ejs
+++ b/Server/views/partials/bodyEnd.ejs
@@ -7,5 +7,6 @@
     integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz"
     crossorigin="anonymous"></script>
 
-<script src="https://code.jquery.com/jquery-3.7.0.slim.min.js"
-    integrity="sha256-tG5mcZUtJsZvyKAxYLVXrmjKBVLd6VpVccqz/r4ypFE=" crossorigin="anonymous"></script>
\ No newline at end of file
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"
+    integrity="sha512-3gJwYpMe3QewGELv8k/BX9vcqhryRdzRMxVfq6ngyWXwo03GFEzjsUm8Q7RZcHPHksttq7/GFoxjCVUjkjvPdw=="
+    crossorigin="anonymous" referrerpolicy="no-referrer"></script>
\ No newline at end of file
diff --git a/Server/views/partials/modifySystemModal.ejs b/Server/views/partials/modifySystemModal.ejs
new file mode 100644
index 0000000..d24e83f
--- /dev/null
+++ b/Server/views/partials/modifySystemModal.ejs
@@ -0,0 +1,54 @@
+<div class="modal fade" id="updateSystemModal_<%=system.replaceAll(" ", "_")%>" tabindex="-1" aria-labelledby="updateSystemModal_<%=system.replaceAll(" ", "_")%>"
+    aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h1 class="modal-title fs-5" id="updateSystemModal_<%=system.replaceAll(" ", "_")%>">Update <%=system%></h1>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <div class="card mb-4">
+                    <div class="card-body">
+                        <form>
+                            <div class="row gx-3 mb-3" id="frequencyRow_<%=system.replaceAll(" ", "_")%>">
+                                <label class="small mb-1 fs-6" for="nodeFreq">Frequencies</label>
+                                <% for(const frequency of frequencies) { %>
+                                <div class="col-md-6 mb-1">
+                                    <div class="row px-1">
+                                        <div class="col-10">
+                                            <input class="form-control" id="nodeFreq" type="text" value="<%= frequency %>"></input>
+                                        </div>
+                                        <div class="col-2">
+                                            <a class="align-middle float-left" href="#"><i class="bi bi-x-circle text-black"></i></a>
+                                        </div>
+                                    </div>                                                                                        
+                                </div>
+                                <% } %>                                                                                    
+                            </div>
+                            <button type="button" class="btn btn-info text-white" onclick="addFrequencyInput('<%=system%>')">Add Frequency</button>
+                            <hr>                                                                    
+                            <div class="row gx-3 mb-3">
+                                <div class="col-md-6">
+                                    <label class="small mb-1 fs-6" for="modeSelect">Mode</label>
+                                    <br>
+                                    <select class="custom-select" id="modeSelect">
+                                        <option value="<%= node.nearbySystems[system].mode %>" selected><span class="text-uppercase"><%= node.nearbySystems[system].mode %></span></option>
+                                        <% if(node.nearbySystems[system].mode == "p25") { %>                                                                                                
+                                            <option value="nbfm">NBFM</option>
+                                        <% } else if (node.nearbySystems[system].mode == "nbfm") { %>
+                                            <option value="p25">P25</option>
+                                        <% } %>
+                                    </select>
+                                </div>
+                            </div>
+                        </form>
+                    </div>
+                </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+                <button type="button" class="btn btn-primary">Save changes</button>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/Server/views/partials/navbar.ejs b/Server/views/partials/navbar.ejs
index ccac10e..169185f 100644
--- a/Server/views/partials/navbar.ejs
+++ b/Server/views/partials/navbar.ejs
@@ -1,12 +1,13 @@
 <nav class="navbar navbar-expand-lg bg-body-tertiary" data-bs-theme="dark">
     <div class="container-fluid">
-        <a class="navbar-brand" href="#">Navbar</a>
+        <a class="navbar-brand" href="#">Node Master</a>
         <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
             aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
             <span class="navbar-toggler-icon"></span>
         </button>
         <div class="collapse navbar-collapse" id="navbarSupportedContent">
             <ul class="navbar-nav me-auto mb-2 mb-lg-0">
+                <% /*
                 <li class="nav-item">
                     <a class="nav-link active" aria-current="page" href="#">Home</a>
                 </li>
@@ -30,6 +31,7 @@
                 <li class="nav-item">
                     <a class="nav-link disabled">Disabled</a>
                 </li>
+                */%>
             </ul>
             <form class="d-flex" role="search">
                 <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
diff --git a/Server/views/partials/sidebar.ejs b/Server/views/partials/sidebar.ejs
index 8eb5815..4b2840e 100644
--- a/Server/views/partials/sidebar.ejs
+++ b/Server/views/partials/sidebar.ejs
@@ -3,64 +3,18 @@
         <div class="col-auto col-md-3 col-xl-2 px-sm-2 px-0 bg-dark">
             <div class="d-flex flex-column align-items-center align-items-sm-start px-3 pt-2 text-white sidebar-container">
                 <ul class="nav nav-pills flex-column mb-sm-auto mb-0 align-items-center align-items-sm-start" id="menu">
-                    <li class="nav-item">
-                        <a href="#" class="nav-link align-middle px-0">
-                            <i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Home</span>
-                        </a>
-                    </li>
                     <li>
-                        <a href="#submenu1" data-bs-toggle="collapse" class="nav-link px-0 align-middle">
+                        <a href="/" class="nav-link px-0 align-middle">
                             <i class="fs-4 bi-speedometer2"></i> <span class="ms-1 d-none d-sm-inline">Dashboard</span>
-                        </a>
-                        <ul class="collapse nav flex-column ms-1" id="submenu1" data-bs-parent="#menu">
-                            <li class="w-100">
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 1 </a>
-                            </li>
-                            <li>
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 2 </a>
-                            </li>
-                        </ul>
-                    </li>
+                        </a>                        
+                    </li>                                        
                     <li>
-                        <a href="#" class="nav-link px-0 align-middle">
-                            <i class="fs-4 bi-table"></i> <span class="ms-1 d-none d-sm-inline">Orders</span></a>
-                    </li>
-                    <li>
-                        <a href="#submenu2" data-bs-toggle="collapse" class="nav-link px-0 align-middle ">
-                            <i class="fs-4 bi-bootstrap"></i> <span class="ms-1 d-none d-sm-inline">Bootstrap</span></a>
-                        <ul class="collapse nav flex-column ms-1" id="submenu2" data-bs-parent="#menu">
-                            <li class="w-100">
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 1</a>
-                            </li>
-                            <li>
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 2</a>
-                            </li>
-                        </ul>
-                    </li>
-                    <li>
-                        <a href="#submenu3" data-bs-toggle="collapse" class="nav-link px-0 align-middle">
-                            <i class="fs-4 bi-grid"></i> <span class="ms-1 d-none d-sm-inline">Products</span> </a>
-                        <ul class="collapse nav flex-column ms-1" id="submenu3" data-bs-parent="#menu">
-                            <li class="w-100">
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 1</a>
-                            </li>
-                            <li>
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 2</a>
-                            </li>
-                            <li>
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 3</a>
-                            </li>
-                            <li>
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 4</a>
-                            </li>
-                        </ul>
-                    </li>
-                    <li>
-                        <a href="#" class="nav-link px-0 align-middle">
-                            <i class="fs-4 bi-people"></i> <span class="ms-1 d-none d-sm-inline">Customers</span> </a>
+                        <a href="/controller" class="nav-link px-0 align-middle">
+                            <i class="fs-4 bi-grid"></i> <span class="ms-1 d-none d-sm-inline">Controller</span> </a>                        
                     </li>
                 </ul>
                 <hr>
+                <% /*
                 <div class="dropdown pb-4 fixed-bottom px-3">
                     <a href="#" class="d-flex align-items-center text-white text-decoration-none dropdown-toggle"
                         id="dropdownUser1" data-bs-toggle="dropdown" aria-expanded="false">
@@ -78,6 +32,7 @@
                         <li><a class="dropdown-item" href="#">Sign out</a></li>
                     </ul>
                 </div>
+                */%>
             </div>
         </div>
         <div class="col py-3">
\ No newline at end of file

From fc743cbb4614ca2313c29e0e65107c9c355139ee Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 01:43:13 -0400
Subject: [PATCH 08/57] #37 Working Joining and Leaving

---
 Server/commands/join.js               |  91 +---------------
 Server/commands/leave.js              |  34 +-----
 Server/controllers/adminController.js | 151 +++++++++++++++++++++++---
 Server/controllers/nodesController.js |   3 +-
 Server/public/res/js/node.js          |  93 ++++++++++++++++
 Server/utilities/recordHelper.js      |   3 +-
 Server/views/node.ejs                 |   7 +-
 Server/views/partials/htmlHead.ejs    |   1 +
 Server/views/partials/joinModal.ejs   |  44 ++++++++
 9 files changed, 285 insertions(+), 142 deletions(-)
 create mode 100644 Server/views/partials/joinModal.ejs

diff --git a/Server/commands/join.js b/Server/commands/join.js
index e7f59b3..d608d39 100644
--- a/Server/commands/join.js
+++ b/Server/commands/join.js
@@ -1,98 +1,13 @@
 // Modules
 const { SlashCommandBuilder } = require('discord.js');
 const { DebugBuilder } = require("../utilities/debugBuilder");
-const { getMembersInRole, getAllClientIds, filterAutocompleteValues, getKeyByArrayValue } = require("../utilities/utils");
-const { requestOptions, sendHttpRequest } = require("../utilities/httpRequests");
-const { getOnlineNodes, updateNodeInfo, addNodeConnection, getConnectionByNodeId, getAllConnections } = require("../utilities/mysqlHandler");
+const { filterAutocompleteValues } = require("../utilities/utils");
+const { getOnlineNodes, getAllConnections } = require("../utilities/mysqlHandler");
+const { joinServerWrapper } = require("../controllers/adminController");
 
 // Global Vars
 const log = new DebugBuilder("server", "join");
 
-/**
- * * This wrapper will check if there is an available node with the requested preset and if so checks for an available client ID to join with
- * 
- * @param {*} presetName The preset name to listen to on the client
- * @param {*} channelId The channel ID to join the bot to 
- * @param {*} connections EITHER A collection of clients that are currently connected OR a single discord client ID (NOT dev portal ID) that should be used to join the server with
- * @param {number} nodeId [OPTIONAL] The node ID to join with (will join with another node if given node is not available)
- * @returns 
- */
-async function joinServerWrapper(presetName, channelId, connections, nodeId = 0) {
-	// Get nodes online
-	var onlineNodes = await new Promise((recordResolve, recordReject) => {
-		getOnlineNodes((nodeRows) => {
-			recordResolve(nodeRows);
-		});
-	});		
-
-	// Check which nodes have the selected preset
-	onlineNodes = onlineNodes.filter(node => node.presets.includes(presetName));
-	log.DEBUG("Filtered Online Nodes: ", onlineNodes);
-
-	// Check if any nodes with this preset are available
-	var nodesCurrentlyAvailable = [];
-	for (const node of onlineNodes) {
-		const currentConnection = await getConnectionByNodeId(node.id);
-		log.DEBUG("Checking to see if there is a connection for Node: ", node, currentConnection);
-		if(!currentConnection) nodesCurrentlyAvailable.push(node);		
-	}
-	log.DEBUG("Nodes Currently Available: ", nodesCurrentlyAvailable);
-
-	// If not, let the user know	
-	if (!nodesCurrentlyAvailable.length > 0) return Error("All nodes with this channel are unavailable, consider swapping one of the currently joined bots.");
-
-	// If so, join with the first node
-	var availableClientIds = await getAllClientIds();
-	log.DEBUG("All clients: ", Object.keys(availableClientIds));
-
-	var selectedClientId;
-	if (typeof connections === 'string') {
-		for (const availableClientId of availableClientIds) {
-			if (availableClientId.discordId != connections ) selectedClientId = availableClientId;
-		}		
-	}
-	else {
-		log.DEBUG("Open connections: ", connections);
-		for (const connection of connections) {
-			log.DEBUG("Used Client ID: ", connection);
-			availableClientIds = availableClientIds.filter(cid => cid.discordId != connection.clientObject.discordId);			
-		}
-
-		log.DEBUG("Available Client IDs: ", availableClientIds);
-
-		if (!Object.keys(availableClientIds).length > 0) return log.ERROR("All client ID have been used, consider swapping one of the curretly joined bots or adding more Client IDs to the pool.")	
-		selectedClientId = availableClientIds[0];
-	}
-
-	let selectedNode;
-	if (nodeId > 0) selectedNode = getKeyByArrayValue(nodesCurrentlyAvailable, nodeId);
-	
-	if (!selectedNode) selectedNode = nodesCurrentlyAvailable[0];
-	
-	const reqOptions = new requestOptions("/bot/join", "POST", selectedNode.ip, selectedNode.port);	
-	const postObject = {
-		"channelId": channelId,
-		"clientId": selectedClientId.clientId,
-		"presetName": presetName
-	};
-	log.INFO("Post Object: ", postObject);
-	sendHttpRequest(reqOptions, JSON.stringify(postObject), async (responseObj) => {
-		log.VERBOSE("Response Object from node ", selectedNode, responseObj);
-		if (!responseObj || !responseObj.statusCode == 200) return false;		
-		// Node has connected to discord
-		// Updating node Object in DB
-		const updatedNode = await updateNodeInfo(selectedNode);
-		log.DEBUG("Updated Node: ", updatedNode);
-
-		// Adding a new node connection
-		const nodeConnection = await addNodeConnection(selectedNode, selectedClientId);
-		log.DEBUG("Node Connection: ", nodeConnection);
-	});	
-
-	return selectedClientId;
-}
-exports.joinServerWrapper = joinServerWrapper;
-
 module.exports = {
 	data: new SlashCommandBuilder()
 		.setName('join')
diff --git a/Server/commands/leave.js b/Server/commands/leave.js
index e65de07..760c5b0 100644
--- a/Server/commands/leave.js
+++ b/Server/commands/leave.js
@@ -2,41 +2,12 @@
 const { SlashCommandBuilder } = require('discord.js');
 const { DebugBuilder } = require("../utilities/debugBuilder");
 const { getAllClientIds, getKeyByArrayValue, filterAutocompleteValues } = require("../utilities/utils");
-const { requestOptions, sendHttpRequest } = require("../utilities/httpRequests");
-const { checkNodeConnectionByClientId, removeNodeConnectionByNodeId, getAllConnections } = require('../utilities/mysqlHandler');
+const { getAllConnections } = require('../utilities/mysqlHandler');
+const { leaveServerWrapper } = require('../controllers/adminController');
 
 // Global Vars
 const log = new DebugBuilder("server", "leave");
 
-/**
- * 
- * @param {*} clientIdObject The client ID object for the node to leave the server. Either 'clientId'||'name' can be set.
- * @returns 
- */
-async function leaveServerWrapper(clientIdObject) {
-	if (!clientIdObject.clientId || !clientIdObject.name) return log.ERROR("Tried to leave server without client ID and/or Name");
-
-	const node = await checkNodeConnectionByClientId(clientIdObject);
-	
-	reqOptions = new requestOptions("/bot/leave", "POST", node.ip, node.port);
-
-	const responseObj = await new Promise((recordResolve, recordReject) => {
-		sendHttpRequest(reqOptions, JSON.stringify({}), async (responseObj) => {
-			recordResolve(responseObj);
-		});
-	});	
-
-	log.VERBOSE("Response Object from node ", node, responseObj);
-	if (!responseObj || !responseObj.statusCode == 202) return false;		
-	// Node has disconnected from discor
-	// Removing the node connection from the DB
-	const removedConnection = removeNodeConnectionByNodeId(node.id);
-	log.DEBUG("Removed Node Connection: ", removedConnection);
-
-	return;
-}
-exports.leaveServerWrapper = leaveServerWrapper;
-
 module.exports = {
 	data: new SlashCommandBuilder()
 		.setName('leave')
@@ -64,7 +35,6 @@ module.exports = {
 			log.DEBUG("Client names: ", clinetIds);
 			const clientDiscordId = getKeyByArrayValue(clinetIds, {'name': botName});
 			log.DEBUG("Selected bot: ", clinetIds[clientDiscordId]);
-			// Need to create a table in DB to keep track of what bots have what IDs or an endpoint on the clients to return what ID they are running with
 			await leaveServerWrapper(clinetIds[clientDiscordId]);
 			
 			await interaction.editReply(`**${clinetIds[clientDiscordId].name}** has been disconnected`);  // This will reply to the initial interaction
diff --git a/Server/controllers/adminController.js b/Server/controllers/adminController.js
index fdef282..bc699b2 100644
--- a/Server/controllers/adminController.js
+++ b/Server/controllers/adminController.js
@@ -4,12 +4,9 @@ require('dotenv').config();
 const { DebugBuilder } = require("../utilities/debugBuilder.js");
 const log = new DebugBuilder("server", "adminController");
 // Utilities
-const mysqlHandler = require("../utilities/mysqlHandler");
-const utils = require("../utilities/utils");
-const requests = require("../utilities/httpRequests");
-const { leaveServerWrapper } = require("../commands/leave");
-const { joinServerWrapper } = require("../commands/join");
-
+const { getAllClientIds } = require("../utilities/utils");
+const { getOnlineNodes, updateNodeInfo, addNodeConnection, getConnectionByNodeId, getNodeInfoFromId, checkNodeConnectionByClientId, removeNodeConnectionByNodeId } = require("../utilities/mysqlHandler");
+const { requestOptions, sendHttpRequest } = require("../utilities/httpRequests");
 
 /** Get the presets of all online nodes, can be used for functions
  * 
@@ -17,15 +14,15 @@ const { joinServerWrapper } = require("../commands/join");
  * @returns {*} A list of the systems online
  */
 async function getPresetsOfOnlineNodes(callback) {
-    mysqlHandler.getOnlineNodes((onlineNodes) => {
+    getOnlineNodes((onlineNodes) => {
         return callback(onlineNodes);
     });
 }
 
 async function getNodeBotStatus(nodeId, callback) {
-    mysqlHandler.getNodeInfoFromId(nodeId, (nodeObject) =>{
-        reqOptions = new requests.requestOptions("/bot/status", "GET", nodeObject.ip, nodeObject.port, undefined, 5);
-        requests.sendHttpRequest(reqOptions, JSON.stringify({}), (responseObject) => {
+    getNodeInfoFromId(nodeId, (nodeObject) =>{
+        reqOptions = new requestOptions("/bot/status", "GET", nodeObject.ip, nodeObject.port, undefined, 5);
+        sendHttpRequest(reqOptions, JSON.stringify({}), (responseObject) => {
             if (responseObject === false) {
                 // Bot is joined                
             }
@@ -73,21 +70,141 @@ exports.joinPreset = async (req, res) => {
 
     const joinedClient = await joinServerWrapper(preset, channelId, clientId, nodeId);
     if (!joinedClient) return res.send(400).json("No joined client");
-    return res.send(200).json(joinedClient);
+    return res.status(200).json(joinedClient);
 }
 
 /** Request a node to join the server listening to a specific preset
  * 
  * @param {*} req Express request parameter
  * @param {*} res Express response parameter
- * @var {*} req.body.clientId The ID of the client to disconnect
+ * @var {*} req.body.nodeId The ID of the node to disconnect
  */
 exports.leaveServer = async (req, res) => {
-    if (!req.body.clientId) return res.status(400).json("No clientID specified");
+    if (!req.body.nodeId) return res.status(400).json("No node ID specified");
 
-    const clientId = req.body.clientId;
+    const nodeId = req.body.nodeId;
+    const currentConnection = await getConnectionByNodeId(nodeId);
+    log.DEBUG("Current Connection for node: ", currentConnection);
 
-    await leaveServerWrapper(clientId)
+    await leaveServerWrapper(currentConnection.clientObject)
 
-    return res.send(200);
-}
\ No newline at end of file
+    return res.status(200).json(currentConnection.clientObject.name);
+}
+
+/**
+ * * This wrapper will check if there is an available node with the requested preset and if so checks for an available client ID to join with
+ * 
+ * @param {*} presetName The preset name to listen to on the client
+ * @param {*} channelId The channel ID to join the bot to 
+ * @param {*} connections EITHER A collection of clients that are currently connected OR a single discord client ID (NOT dev portal ID) that should be used to join the server with
+ * @param {number} nodeId [OPTIONAL] The node ID to join with (will join with another node if given node is not available)
+ * @returns 
+ */
+async function joinServerWrapper(presetName, channelId, connections, nodeId = 0) {
+	// Get nodes online
+	var onlineNodes = await new Promise((recordResolve, recordReject) => {
+		getOnlineNodes((nodeRows) => {
+			recordResolve(nodeRows);
+		});
+	});		
+
+	// Check which nodes have the selected preset
+	onlineNodes = onlineNodes.filter(node => node.presets.includes(presetName));
+	log.DEBUG("Filtered Online Nodes: ", onlineNodes);
+
+	// Check if any nodes with this preset are available
+	var nodesCurrentlyAvailable = [];
+	for (const node of onlineNodes) {
+		const currentConnection = await getConnectionByNodeId(node.id);
+		log.DEBUG("Checking to see if there is a connection for Node: ", node, currentConnection);
+		if(!currentConnection) nodesCurrentlyAvailable.push(node);		
+	}
+	log.DEBUG("Nodes Currently Available: ", nodesCurrentlyAvailable);
+
+	// If not, let the user know	
+	if (!nodesCurrentlyAvailable.length > 0) return Error("All nodes with this channel are unavailable, consider swapping one of the currently joined bots.");
+
+	// If so, join with the first node
+	var availableClientIds = await getAllClientIds();
+	log.DEBUG("All clients: ", Object.keys(availableClientIds));
+
+	var selectedClientId;
+	if (typeof connections === 'string') {
+		for (const availableClientId of availableClientIds) {
+			if (availableClientId.discordId != connections ) selectedClientId = availableClientId;
+		}		
+	}
+	else {
+		log.DEBUG("Open connections: ", connections);
+		for (const connection of connections) {
+			log.DEBUG("Used Client ID: ", connection);
+			availableClientIds = availableClientIds.filter(cid => cid.discordId != connection.clientObject.discordId);			
+		}
+
+		log.DEBUG("Available Client IDs: ", availableClientIds);
+
+		if (!Object.keys(availableClientIds).length > 0) return log.ERROR("All client ID have been used, consider swapping one of the curretly joined bots or adding more Client IDs to the pool.")	
+		selectedClientId = availableClientIds[0];
+	}
+
+	let selectedNode;
+	if (nodeId > 0) {
+        for(const availableNode of nodesCurrentlyAvailable){
+            if (availableNode.id == nodeId) selectedNode = availableNode;
+        }        
+    }
+	
+	if (!selectedNode) selectedNode = nodesCurrentlyAvailable[0];
+	
+	const reqOptions = new requestOptions("/bot/join", "POST", selectedNode.ip, selectedNode.port);	
+	const postObject = {
+		"channelId": channelId,
+		"clientId": selectedClientId.clientId,
+		"presetName": presetName
+	};
+	log.INFO("Post Object: ", postObject);
+	sendHttpRequest(reqOptions, JSON.stringify(postObject), async (responseObj) => {
+		log.VERBOSE("Response Object from node ", selectedNode, responseObj);
+		if (!responseObj || !responseObj.statusCode == 200) return false;		
+		// Node has connected to discord
+		// Updating node Object in DB
+		const updatedNode = await updateNodeInfo(selectedNode);
+		log.DEBUG("Updated Node: ", updatedNode);
+
+		// Adding a new node connection
+		const nodeConnection = await addNodeConnection(selectedNode, selectedClientId);
+		log.DEBUG("Node Connection: ", nodeConnection);
+	});	
+
+	return selectedClientId;
+}
+exports.joinServerWrapper = joinServerWrapper;
+
+/**
+ * 
+ * @param {*} clientIdObject The client ID object for the node to leave the server. Either 'clientId'||'name' can be set.
+ * @returns 
+ */
+async function leaveServerWrapper(clientIdObject) {
+	if (!clientIdObject.clientId || !clientIdObject.name) return log.ERROR("Tried to leave server without client ID and/or Name");
+
+	const node = await checkNodeConnectionByClientId(clientIdObject);
+	
+	reqOptions = new requestOptions("/bot/leave", "POST", node.ip, node.port);
+
+	const responseObj = await new Promise((recordResolve, recordReject) => {
+		sendHttpRequest(reqOptions, JSON.stringify({}), async (responseObj) => {
+			recordResolve(responseObj);
+		});
+	});	
+
+	log.VERBOSE("Response Object from node ", node, responseObj);
+	if (!responseObj || !responseObj.statusCode == 202) return false;		
+	// Node has disconnected from discor
+	// Removing the node connection from the DB
+	const removedConnection = removeNodeConnectionByNodeId(node.id);
+	log.DEBUG("Removed Node Connection: ", removedConnection);
+
+	return;
+}
+exports.leaveServerWrapper = leaveServerWrapper;
\ No newline at end of file
diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index c1999ed..fa7b622 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -192,7 +192,8 @@ exports.requestNodeCheckIn = async (req, res) => {
     if (!req.params.nodeId) return res.status(400).json("No Node ID supplied in request");
     const node = await getNodeInfoFromId(req.params.nodeId);
     if (!node) return res.status(400).json("No Node with the ID given");
-    checkInWithNode(node);
+    await checkInWithNode(node);
+    res.sendStatus(200);
 }
 
 /**
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index a1530f4..41b4a4a 100644
--- a/Server/public/res/js/node.js
+++ b/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`);
     }
 }
\ No newline at end of file
diff --git a/Server/utilities/recordHelper.js b/Server/utilities/recordHelper.js
index eb26ae3..2b68db3 100644
--- a/Server/utilities/recordHelper.js
+++ b/Server/utilities/recordHelper.js
@@ -118,7 +118,8 @@ class nodeObject {
         this.ip = _ip;
         this.port = _port;
         this.location = _location;        
-        this.nearbySystems = _nearbySystems;        
+        this.nearbySystems = _nearbySystems;
+        if (this.nearbySystems) this.presets = Object.keys(_nearbySystems);       
         this.online = _online;
     }
 }
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
index 05cd447..2a1bb49 100644
--- a/Server/views/node.ejs
+++ b/Server/views/node.ejs
@@ -9,7 +9,7 @@
                 </p>                
             </div>
             <div class="card-body">
-                <form>
+                <form>                    
                     <div class="row gx-3 mb-3">
                         <div class="">
                             
@@ -26,9 +26,9 @@
                             <% } %>
                             <hr>
                             <!-- Join Server button-->
-                            <a type="button" class="btn btn-info <% if(!node.online) { %>disabled<% } %>" href="/join/<%=node.id%>">Join Server</a>
+                            <a type="button" class="btn btn-info <% if(!node.online) { %>disabled<% } %>" data-bs-toggle="modal" data-bs-target="#joinModal" href="#">Join Server</a>
                             <!-- Leave Server button  -->
-                            <a type="button" class="btn btn-danger <% if(!node.online) { %>disabled<% } %>" href="/leave/<%=node.id%>">Leave Server</a>
+                            <a type="button" class="btn btn-danger <% if(!node.online) { %>disabled<% } %>" href="#" onclick="leaveServer()">Leave Server</a>
                             <!-- Checkin with client button  -->
                             <a type="button" class="btn btn-secondary" href="#" onclick="checkInByNodeId('<%=node.id%>')">Check-in with Node</a>
                         </div>
@@ -149,6 +149,7 @@
             </div>
         </div>
     </div>
+    <%- include('partials/joinModal.ejs', {'nearbySystems': node.nearbySystems}) %>    
 <%- include('partials/bodyEnd.ejs') %>
 <script src="/res/js/node.js"></script>
 <%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/htmlHead.ejs b/Server/views/partials/htmlHead.ejs
index 5a3ef3b..9641f52 100644
--- a/Server/views/partials/htmlHead.ejs
+++ b/Server/views/partials/htmlHead.ejs
@@ -2,5 +2,6 @@
 <html lang="en" data-bs-theme="auto">
     <%- include('head.ejs') %>
     <body>
+        <div class="toast-container mx-2" id="toastZone"></div>
         <%- include('navbar.ejs') %>
         <%- include('sidebar.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/joinModal.ejs b/Server/views/partials/joinModal.ejs
new file mode 100644
index 0000000..d912911
--- /dev/null
+++ b/Server/views/partials/joinModal.ejs
@@ -0,0 +1,44 @@
+<div class="modal fade" id="joinModal" tabindex="-1" aria-labelledby="joinModal" aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h1 class="modal-title fs-5" id="joinModal">Join Node <%=node.id%> to a Discord Server</h1>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <div class="container">
+                    <div class="card mb-4">
+                        <div class="card-body">
+                            <form>                                
+                                <div class="row gx-3 mb-3">
+                                    <div class="col-md-12">
+                                        <label class="small mb-1" for="inputDiscordClientId">Discord Client ID:</label>
+                                        <input class="form-control" id="inputDiscordClientId" type="text" value="" required></input>
+                                    </div>
+                                </div>
+                                <div class="row gx-3 mb-3">
+                                    <div class="col-md-6">
+                                        <label class="small mb-1" for="inputDiscordChannelId">Discord Channel ID:</label>
+                                        <input class="form-control" id="inputDiscordChannelId" type="text" value="" required></input>
+                                    </div>
+                                    <div class="col-md-6">
+                                        <label class="small mb-1" for="selectRadioPreset">Selected Preset:</label>
+                                        <select class="custom-select" id="selectRadioPreset">
+                                            <% for(const system in nearbySystems) { %>                                                                                                
+                                                <option value="<%=system%>"><%=system%></option>
+                                            <% } %>
+                                        </select>
+                                    </div>
+                                </div>
+                            </form>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
+                <button type="button" class="btn btn-primary" onclick="joinServer()">Join</button>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file

From 23bea5f74ed22361e0455b0913ec2314cf705f91 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 01:50:01 -0400
Subject: [PATCH 09/57] Update heartbeat function location and name

---
 Server/public/res/js/controller.js | 3 ---
 Server/public/res/js/node.js       | 2 +-
 Server/views/controller.ejs        | 2 +-
 Server/views/node.ejs              | 2 +-
 4 files changed, 3 insertions(+), 6 deletions(-)
 delete mode 100644 Server/public/res/js/controller.js

diff --git a/Server/public/res/js/controller.js b/Server/public/res/js/controller.js
deleted file mode 100644
index 04c0fd9..0000000
--- a/Server/public/res/js/controller.js
+++ /dev/null
@@ -1,3 +0,0 @@
-function sendNodeHeartbeat(nodeId) {
-    console.log(nodeId);
-}
\ No newline at end of file
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index 41b4a4a..68dedd6 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -80,7 +80,7 @@ function createToast(notificationMessage){
     $('.toast').toast('show');
 }
 
-function checkInByNodeId(nodeId){
+function sendNodeHeartbeat(nodeId){
     const Http = new XMLHttpRequest();
     const url='/nodes/'+nodeId;
     Http.open("GET", url);
diff --git a/Server/views/controller.ejs b/Server/views/controller.ejs
index 28099a9..6831d79 100644
--- a/Server/views/controller.ejs
+++ b/Server/views/controller.ejs
@@ -7,5 +7,5 @@
         </div>
     </div>
 <%- include('partials/bodyEnd.ejs') %>
-<script src="/res/js/controller.js"></script>
+<script src="/res/js/node.js"></script>
 <%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
index 2a1bb49..9575b9f 100644
--- a/Server/views/node.ejs
+++ b/Server/views/node.ejs
@@ -30,7 +30,7 @@
                             <!-- Leave Server button  -->
                             <a type="button" class="btn btn-danger <% if(!node.online) { %>disabled<% } %>" href="#" onclick="leaveServer()">Leave Server</a>
                             <!-- Checkin with client button  -->
-                            <a type="button" class="btn btn-secondary" href="#" onclick="checkInByNodeId('<%=node.id%>')">Check-in with Node</a>
+                            <a type="button" class="btn btn-secondary" href="#" onclick="sendNodeHeartbeat('<%=node.id%>')">Check-in with Node</a>
                         </div>
                     </div>
 

From ef45cf6539a4c8eeaaaa633287c3ebfa6acc7022 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 01:51:25 -0400
Subject: [PATCH 10/57] Only show heartbeat toast once HTTP request is complete

---
 Server/public/res/js/node.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index 68dedd6..b82d08a 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -86,7 +86,7 @@ function sendNodeHeartbeat(nodeId){
     Http.open("GET", url);
     Http.send();
 
-    Http.onreadystatechange = (e) => {
+    Http.onloadend = (e) => {
     console.log(Http.responseText)
     createToast(Http.responseText);
     }

From c0927601b9660db1ec55017672c2049ede43a239 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 01:54:13 -0400
Subject: [PATCH 11/57] Update toast creator to display proper date string

---
 Server/public/res/js/node.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index b82d08a..24b784e 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -44,7 +44,7 @@ function createToast(notificationMessage){
     toastTitle.appendChild(document.createTextNode("Server Notification"));
 
     const toastTime = document.createElement('small');
-    toastTime.appendChild(document.createTextNode(Date.now().toLocaleString()));
+    toastTime.appendChild(document.createTextNode(new Date(Date.now()).toLocaleString()));
 
     const toastClose = document.createElement('button');
     toastClose.type = 'button';

From e27dd9d9cb9dc43a836a072e5aeb574dd7e2e3ff Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 16:47:42 -0400
Subject: [PATCH 12/57] Updated NodeCard Design

---
 Server/views/partials/nodeCard.ejs | 25 ++++++++-----------------
 1 file changed, 8 insertions(+), 17 deletions(-)

diff --git a/Server/views/partials/nodeCard.ejs b/Server/views/partials/nodeCard.ejs
index b676560..61082be 100644
--- a/Server/views/partials/nodeCard.ejs
+++ b/Server/views/partials/nodeCard.ejs
@@ -12,10 +12,6 @@
                 </div>
             </div>
             <div class="d-flex align-items-center">
-                <div>
-                    <img src="https://bootdey.com/img/Content/avatar/avatar1.png" alt=""
-                        class="avatar-md rounded-circle img-thumbnail" />
-                </div>
                 <div class="flex-1 ms-3">
                     <h5 class="font-size-16 mb-1"><a href="/node/<%=node.id%>" class="text-dark">
                             <%= node.name %>
@@ -35,21 +31,16 @@
                     <a href="#" target="_blank">
                         <%= node.ip %>:<%= node.port %>
                     </a>
-                </p>
+                </p>                
+                <hr>                
                 <p class="text-muted mb-0">
-                <div class="dropdown">
-                    <i class="bi bi-broadcast-pin font-size-15 align-middle pe-2 text-primary"></i>
-                    <a class="dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
-                        Nearby Systems
-                    </a>
-                    <ul class="dropdown-menu">
+                    <i class="bi bi-broadcast-pin font-size-15 pe-2 text-primary"></i>
+                    Nearby Systems:
+                    <ul>
                         <% for(const system in node.nearbySystems){ %>
-                            <li>
-                                <%= system %>
-                            </li>
-                            <% } %>
-                    </ul>
-                </div>
+                            <li><%= system %></li>
+                        <% } %>
+                    </ul>                    
                 </p>
             </div>
         </div>

From 5428ac6144decfcbd046f0a1e8f574ec1f1b976e Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 18:56:47 -0400
Subject: [PATCH 13/57] Update API and add webapp saving

---
 Server/controllers/nodesController.js | 32 +++++++++++++----
 Server/public/res/js/node.js          | 49 ++++++++++++++++++++++++++-
 Server/routes/nodes.js                | 15 ++++----
 Server/views/node.ejs                 | 41 +++++++++++-----------
 4 files changed, 103 insertions(+), 34 deletions(-)

diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index fa7b622..3012067 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -110,8 +110,8 @@ exports.newNode = async (req, res) => {
  * @param {*} res Defualt express res from router
  */
 exports.getNodeInfo = async (req, res) => {
-    if (!req.query.id) return res.status(400).json("No id specified");
-    getNodeInfoFromId(req.query.id, (nodeInfo) => {
+    if (!req.params.id) return res.status(400).json("No id specified");
+    getNodeInfoFromId(req.params.id, (nodeInfo) => {
         res.status(200).json(nodeInfo);
     })
 }
@@ -121,9 +121,9 @@ exports.getNodeInfo = async (req, res) => {
  * @param {*} req Default express req from router
  * @param {*} res Defualt express res from router
  */
-exports.nodeCheckIn = async (req, res) => {
-    if (!req.body.id) return res.status(400).json("No id specified");
-    getNodeInfoFromId(req.body.id, (nodeInfo) => {
+exports.updateExistingNode = async = (req, res) => {
+    if (!req.params.nodeId) return res.status(400).json("No id specified");
+    getNodeInfoFromId(req.params.nodeId, (nodeInfo) => {
         let checkInObject = {};
         // Convert the online status to a boolean to be worked with
         log.DEBUG("REQ Body: ", req.body);
@@ -163,9 +163,9 @@ exports.nodeCheckIn = async (req, res) => {
         // If no changes are made tell the client
         if (!isObjectUpdated) return res.status(200).json("No keys updated");
 
-        log.INFO("Updating the following keys for ID: ", req.body.id, checkInObject);
+        log.INFO("Updating the following keys for ID: ", req.params.nodeId, checkInObject);
 
-        checkInObject._id = req.body.id;
+        checkInObject._id = req.params.nodeId;
         checkInObject = new nodeObject(checkInObject);
 
         if (!nodeInfo) {
@@ -182,6 +182,24 @@ exports.nodeCheckIn = async (req, res) => {
     });
 }
 
+/** Allows the bots to check in and get any updates from the server
+ * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ */
+exports.nodeCheckIn = async (req, res) => {
+    if (!req.params.nodeId) return res.status(400).json("No id specified");
+        getNodeInfoFromId(req.params.nodeId, (nodeInfo) => {
+            if (!nodeInfo.online) {
+                nodeInfo.online = true;
+                updateNodeInfo(nodeInfo, () => {
+                    return res.status(200).json(nodeInfo);
+                })
+            }
+            else return res.status(200).json(nodeInfo);
+        });
+}
+
 /**
  * Requests a specific node to check in with the server, if it's online
  * 
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index 24b784e..e439c30 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -78,11 +78,12 @@ function createToast(notificationMessage){
     document.getElementById("toastZone").appendChild(wrapperDiv);
     
     $('.toast').toast('show');
+    return $('.toast');
 }
 
 function sendNodeHeartbeat(nodeId){
     const Http = new XMLHttpRequest();
-    const url='/nodes/'+nodeId;
+    const url='/nodes/nodeCheckIn/'+nodeId;
     Http.open("GET", url);
     Http.send();
 
@@ -139,5 +140,51 @@ function leaveServer(){
         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,
+        'online': true
+    }
+
+    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() {
+
+}
+
+function updateSystem() {
+
+}
+
+function requestNodeUpdate() {
+
 }
\ No newline at end of file
diff --git a/Server/routes/nodes.js b/Server/routes/nodes.js
index 773bc45..3a2b7d2 100644
--- a/Server/routes/nodes.js
+++ b/Server/routes/nodes.js
@@ -5,6 +5,13 @@ const nodesController = require('../controllers/nodesController');
 /* GET nodes the server knows */
 router.get('/', nodesController.listAllNodes);
 
+// TODO Need to authenticate this request
+/* GET the information the server has on a particular node */
+router.get('/:nodeId', nodesController.getNodeInfo);
+
+// Update an existing node
+router.put('/:nodeId', nodesController.updateExistingNode);
+
 // TODO Need to authenticate this request
 /* POST a new node to the server
 *
@@ -20,15 +27,11 @@ router.get('/', nodesController.listAllNodes);
 */
 router.post('/newNode', nodesController.newNode);
 
-// TODO Need to authenticate this request
-/* GET the information the server has on a particular node */
-router.get('/nodeInfo', nodesController.getNodeInfo);
-
 // TODO Need to authenticate this request
 // Client checkin with the server to update information
-router.post('/nodeCheckIn', nodesController.nodeCheckIn);
+router.post('/nodeCheckIn/:nodeId', nodesController.nodeCheckIn);
 
 // Request a node to check in with the server
-router.get('/:nodeId', nodesController.requestNodeCheckIn);
+router.get('/nodeCheckIn/:nodeId', nodesController.requestNodeCheckIn);
 
 module.exports = router;
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
index 9575b9f..0bc3a9c 100644
--- a/Server/views/node.ejs
+++ b/Server/views/node.ejs
@@ -9,29 +9,30 @@
                 </p>                
             </div>
             <div class="card-body">
+                <div class="col-md-12 pt-2">                            
+                    <label class="small mb-1" for="nodeStatus">Online Status:</label>
+                    <% if(node.online){%> <span class="badge badge-soft-success mb-0 align-middle fs-6" id="nodeStatus">Online</span>
+                    <% } else {%> <span class="badge badge-soft-danger mb-0 align-middle fs-6">Offline</span>
+                    <% } %>
+                    <br>
+                    <div class="py-2"></div>
+                    <!-- Join Server button-->
+                    <a type="button" class="btn btn-info text-white<% if(!node.online) { %>disabled<% } %>" data-bs-toggle="modal" data-bs-target="#joinModal" href="#">Join Server</a>
+                    <!-- Leave Server button  -->
+                    <a type="button" class="btn btn-danger <% if(!node.online) { %>disabled<% } %>" href="#" onclick="leaveServer()">Leave Server</a>
+                    <!-- Checkin with client button  -->
+                    <a type="button" class="btn btn-secondary" href="#" onclick="sendNodeHeartbeat('<%=node.id%>')">Check-in with Node</a>
+                    <!-- Update Client button -->
+                    <a type="button" class="btn btn-warning" href="#" onclick="requestNodeUpdate('<%=node.id%>')">Update Node</a>
+                </div>
+                <hr>
                 <form>                    
                     <div class="row gx-3 mb-3">
-                        <div class="">
-                            
-                        </div>
                         <div class="col-md-6">
                             <label class="small mb-1" for="nodeId">Node ID (this is the assigned Node ID and cannot be
                                 changed)</label>
                             <input class="form-control" id="nodeId" type="text" value="<%=node.id%>" disabled></input>
-                        </div>                        
-                        <div class="col-md-6">                            
-                            <label class="small mb-1" for="nodeStatus">Online Status:</label>
-                            <% if(node.online){%> <span class="badge badge-soft-success mb-0 align-middle fs-6" id="nodeStatus">Online</span>
-                            <% } else {%> <span class="badge badge-soft-danger mb-0 align-middle fs-6">Offline</span>
-                            <% } %>
-                            <hr>
-                            <!-- Join Server button-->
-                            <a type="button" class="btn btn-info <% if(!node.online) { %>disabled<% } %>" data-bs-toggle="modal" data-bs-target="#joinModal" href="#">Join Server</a>
-                            <!-- Leave Server button  -->
-                            <a type="button" class="btn btn-danger <% if(!node.online) { %>disabled<% } %>" href="#" onclick="leaveServer()">Leave Server</a>
-                            <!-- Checkin with client button  -->
-                            <a type="button" class="btn btn-secondary" href="#" onclick="sendNodeHeartbeat('<%=node.id%>')">Check-in with Node</a>
-                        </div>
+                        </div>                                                
                     </div>
 
                     <div class="row gx-3 mb-3">
@@ -122,11 +123,11 @@
                         </div>
                     </div>
                     <!-- Save changes button-->
-                    <button class="btn btn-primary <% if(!node.online) { %>disabled<% } %>" type="button">Save changes</button>
+                    <button class="btn btn-primary <% if(!node.online) { %>disabled<% } %>" type="button" onclick="saveNodeDetails()">Save changes</button>
                     <!-- Button trigger modal -->
                     <button type="button" class="btn btn-primary float-right <% if(!node.online) { %>disabled<% } %>" data-bs-toggle="modal"
-                        data-bs-target="#newSystemModal">Add New System</button>
-                </form>
+                        data-bs-target="#newSystemModal">Add New System</button>                    
+                </form>                
             </div>
         </div>
     </div>

From 318ee7bf91d08e23075539c82ac33d9ba7d8d633 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 22:30:18 -0400
Subject: [PATCH 14/57] Implement functioning method to update systems on web
 app

---
 Client/controllers/clientController.js      | 15 +++++--
 Server/controllers/nodesController.js       | 41 +++++++++++++++++
 Server/public/res/js/node.js                | 49 ++++++++++++++++++---
 Server/routes/nodes.js                      |  5 ++-
 Server/views/partials/modifySystemModal.ejs | 22 +++++----
 5 files changed, 113 insertions(+), 19 deletions(-)

diff --git a/Client/controllers/clientController.js b/Client/controllers/clientController.js
index 8d02999..2101d44 100644
--- a/Client/controllers/clientController.js
+++ b/Client/controllers/clientController.js
@@ -94,10 +94,12 @@ exports.checkConfig = async function checkConfig() {
 }
 
 /** Check in with the server
- * If the bot has a saved ID, check in with the server to update any information or just check back in
+ * If the bot has a saved ID, check in with the server to get any updated information or just check back in
  * If the bot does not have a saved ID, it will attempt to request a new ID from the server
+ * 
+ * @param {boolean} init If set to true, the client will update the server to it's config, instead of taking the server's config
  */
-exports.checkIn = async () => {
+exports.checkIn = async (init = false) => {
     let reqOptions;
     await this.checkConfig();
     runningClientConfig.online = true;
@@ -134,7 +136,8 @@ exports.checkIn = async () => {
         }
         else {
             // ID is in the config, checking in with the server
-            reqOptions = new requestOptions("/nodes/nodeCheckIn", "POST");
+            if (init) reqOptions = new requestOptions(`/nodes/${runningClientConfig.id}`, "PUT");
+            else reqOptions = new requestOptions(`/nodes/nodeCheckIn/${runningClientConfig.id}`, "POST");
             sendHttpRequest(reqOptions, JSON.stringify(runningClientConfig), (responseObject) => {
                 log.DEBUG("Check In Respose: ", responseObject);
                 // Check if the server responded
@@ -178,7 +181,8 @@ exports.requestCheckIn = async (req, res) => {
  * This is the endpoint wrapper to get the presets object
  */
 exports.getPresets = async (req, res) => {
-    return res.status(200).json(getPresets());
+    runningClientConfig.nearbySystems = getPresets();
+    return res.status(200).json(runningClientConfig.nearbySystems);
 }
 
 /** Controller for the /client/updatePreset endpoint
@@ -187,6 +191,7 @@ exports.getPresets = async (req, res) => {
 exports.updatePreset = async (req, res) => {
     checkBodyForPresetFields(req, res, () => {
         updatePreset(req.body.systemName, () => {
+            runningClientConfig.nearbySystems = getPresets();
             return res.sendStatus(200);
         }, {frequencies: req.body.frequencies, mode: req.body.mode, trunkFile: req.body.trunkFile});
     })
@@ -198,6 +203,7 @@ exports.updatePreset = async (req, res) => {
 exports.addNewPreset = async (req, res) => {
     checkBodyForPresetFields(req, res, () => {
         addNewPreset(req.body.systemName, req.body.frequencies, req.body.mode, () => {
+            runningClientConfig.nearbySystems = getPresets();
             return res.sendStatus(200);
         }, req.body.trunkFile);
     });
@@ -210,6 +216,7 @@ exports.removePreset = async (req, res) => {
     checkBodyForPresetFields(req, res, () => {
         if (!req.body.systemName) return res.status("500").json({"message": "You must specify a system name to delete, this must match exactly to how the system name is saved."})
         removePreset(req.body.systemName, () => {
+            runningClientConfig.nearbySystems = getPresets();
             return res.sendStatus(200);
         }, req.body.trunkFile);
     });
diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index 3012067..63588a6 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -8,6 +8,7 @@ const { sendHttpRequest, requestOptions } = require("../utilities/httpRequests.j
 const { nodeObject } = require("../utilities/recordHelper.js");
 
 const refreshInterval = process.env.NODE_MONITOR_REFRESH_INTERVAL ?? 1200000;
+const digitalModes = ['p25'];
 
 /**
  * Check in with a singular node, mark it offline if it's offline and 
@@ -116,6 +117,44 @@ exports.getNodeInfo = async (req, res) => {
     })
 }
 
+/** Updates a specific system/preset on a given node
+ * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ * @param {*} req.params.nodeId The Node ID to update the preset/system on
+ * @param {*} req.body.systemName The name of the system to update
+ * @param {*} req.body.mode The radio mode of the preset to
+ * @param {*} req.body.frequencies The frequencies of the preset
+ * @param {*} req.body.trunkFile The trunk file to use for digital stations
+ */
+exports.updateNodeSystem = async (req, res) => {
+    if (!req.params.nodeId) return res.status(400).json("No id specified");
+    if (!req.body.systemName) return res.status(400).json("No system specified");
+    log.DEBUG("Updating system for node: ", req.params.nodeId, req.body);
+    getNodeInfoFromId(req.params.nodeId, (node) => {
+        const reqOptions = new requestOptions("/client/updatePreset", "POST", node.ip, node.port);
+        const reqBody = {
+            'systemName': req.body.systemName,
+            'mode': req.body.mode,
+            'frequencies': req.body.frequencies,
+        }
+        if(digitalModes.includes(req.body.mode)) reqBody['trunkFile'] = req.body.trunkFile ?? 'none'
+
+        log.DEBUG("Request body for updating node: ", reqBody, reqOptions);
+        sendHttpRequest(reqOptions, JSON.stringify(reqBody), async (responseObj) => {
+            if(responseObj){
+                // Good
+                log.DEBUG("Response from updating node: ", reqBody, responseObj);
+                return res.sendStatus(200)
+            } else {
+                // Bad
+                log.DEBUG("No Response from updating Node");
+                return res.status(400).json("No Response from updating Node, could be offline");
+            }
+        })
+    })    
+}
+
 /** Updates the information received from the client based on ID
  * 
  * @param {*} req Default express req from router
@@ -171,11 +210,13 @@ exports.updateExistingNode = async = (req, res) => {
         if (!nodeInfo) {
             log.WARN("No existing node found with this ID, adding node: ", checkInObject);
             addNewNode(checkInObject, (newNode) => {
+                this.requestNodeCheckIn(checkInObject.id);
                 return res.status(201).json({ "updatedKeys": newNode });
             });
         }
         else {
             updateNodeInfo(checkInObject, () => {
+                this.requestNodeCheckIn(checkInObject.id);
                 return res.status(202).json({ "updatedKeys": checkInObject });
             });
         }
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index e439c30..e4e5274 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -1,4 +1,11 @@
-function addFrequencyInput(system){
+/**
+ * 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');
@@ -9,6 +16,7 @@ function addFrequencyInput(system){
     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');
@@ -17,7 +25,7 @@ function addFrequencyInput(system){
 
     var input = document.createElement('input');
     input.classList.add('form-control');
-    input.id = 'nodeFreq';
+    input.id = `${system}_systemFreq_${inputId}`;
     input.type = 'text';
 
     var childColInput = document.createElement('div');
@@ -33,6 +41,7 @@ function addFrequencyInput(system){
     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);
@@ -169,22 +178,52 @@ function saveNodeDetails() {
     Http.send(JSON.stringify(reqBody));
 
     Http.onloadend = (e) => {
-        const responseObject = JSON.parse(Http.responseText)
+        const responseObject = JSON.parse(Http.responseText);
         console.log(Http.status);
         console.log(responseObject);
         createToast(`Node Updated!`);
     }
-
 }
 
 function addNewSystem() {
 
 }
 
-function updateSystem() {
+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!`);
+    }
 }
 
 function requestNodeUpdate() {
 
+}
+
+function removeFrequencyInput(elementId) {
+    const element = document.getElementById(elementId);
+    element.remove();
 }
\ No newline at end of file
diff --git a/Server/routes/nodes.js b/Server/routes/nodes.js
index 3a2b7d2..d110343 100644
--- a/Server/routes/nodes.js
+++ b/Server/routes/nodes.js
@@ -12,6 +12,9 @@ router.get('/:nodeId', nodesController.getNodeInfo);
 // Update an existing node
 router.put('/:nodeId', nodesController.updateExistingNode);
 
+// Update an existing node's system
+router.put('/:nodeId/systems', nodesController.updateNodeSystem);
+
 // TODO Need to authenticate this request
 /* POST a new node to the server
 *
@@ -28,7 +31,7 @@ router.put('/:nodeId', nodesController.updateExistingNode);
 router.post('/newNode', nodesController.newNode);
 
 // TODO Need to authenticate this request
-// Client checkin with the server to update information
+// Client checkin with the server to update client information
 router.post('/nodeCheckIn/:nodeId', nodesController.nodeCheckIn);
 
 // Request a node to check in with the server
diff --git a/Server/views/partials/modifySystemModal.ejs b/Server/views/partials/modifySystemModal.ejs
index d24e83f..88ae381 100644
--- a/Server/views/partials/modifySystemModal.ejs
+++ b/Server/views/partials/modifySystemModal.ejs
@@ -1,5 +1,5 @@
 <div class="modal fade" id="updateSystemModal_<%=system.replaceAll(" ", "_")%>" tabindex="-1" aria-labelledby="updateSystemModal_<%=system.replaceAll(" ", "_")%>"
-    aria-hidden="true">
+    aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
     <div class="modal-dialog modal-dialog-centered">
         <div class="modal-content">
             <div class="modal-header">
@@ -10,16 +10,20 @@
                 <div class="card mb-4">
                     <div class="card-body">
                         <form>
+                            <div class="row gx-3 mb-3">
+                                <label class="small mb-1 fs-6" for="systemName">System Name</label>
+                                <input class="form-control" id="systemName" type="text" value="<%= system %>"></input>
+                            </div>
                             <div class="row gx-3 mb-3" id="frequencyRow_<%=system.replaceAll(" ", "_")%>">
-                                <label class="small mb-1 fs-6" for="nodeFreq">Frequencies</label>
+                                <label class="small mb-1 fs-6" for="systemFreq">Frequencies</label>
                                 <% for(const frequency of frequencies) { %>
-                                <div class="col-md-6 mb-1">
+                                <div class="col-md-6 mb-1" id="<%=system%>_systemFreqRow_<%=frequency%>">
                                     <div class="row px-1">
                                         <div class="col-10">
-                                            <input class="form-control" id="nodeFreq" type="text" value="<%= frequency %>"></input>
+                                            <input class="form-control" id="<%=system%>_systemFreq_<%=frequency%>" type="text" value="<%= frequency %>"></input>
                                         </div>
                                         <div class="col-2">
-                                            <a class="align-middle float-left" href="#"><i class="bi bi-x-circle text-black"></i></a>
+                                            <a class="align-middle float-left" href="#" onclick="removeFrequencyInput('<%=system%>_systemFreqRow_<%=frequency%>')"><i class="bi bi-x-circle text-black"></i></a>
                                         </div>
                                     </div>                                                                                        
                                 </div>
@@ -29,9 +33,9 @@
                             <hr>                                                                    
                             <div class="row gx-3 mb-3">
                                 <div class="col-md-6">
-                                    <label class="small mb-1 fs-6" for="modeSelect">Mode</label>
+                                    <label class="small mb-1 fs-6" for="<%=system%>_systemMode">Mode</label>
                                     <br>
-                                    <select class="custom-select" id="modeSelect">
+                                    <select class="custom-select" id="<%=system%>_systemMode">
                                         <option value="<%= node.nearbySystems[system].mode %>" selected><span class="text-uppercase"><%= node.nearbySystems[system].mode %></span></option>
                                         <% if(node.nearbySystems[system].mode == "p25") { %>                                                                                                
                                             <option value="nbfm">NBFM</option>
@@ -46,8 +50,8 @@
                 </div>
             </div>
             <div class="modal-footer">
-                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
-                <button type="button" class="btn btn-primary">Save changes</button>
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" onclick="location.reload()">Close</button>
+                <button type="button" class="btn btn-primary" onclick="updateSystem('<%=system%>')">Save changes</button>
             </div>
         </div>
     </div>

From 31de3a040dacab547d6174e274804002c5420e82 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 23:21:05 -0400
Subject: [PATCH 15/57] Implemented functional method to add a new system to a
 new through web app

---
 Server/controllers/nodesController.js       | 42 ++++++++++++++++++++-
 Server/public/res/js/node.js                | 30 ++++++++++++++-
 Server/routes/nodes.js                      |  5 ++-
 Server/views/node.ejs                       | 23 ++---------
 Server/views/partials/modifySystemModal.ejs | 17 +++++----
 5 files changed, 86 insertions(+), 31 deletions(-)

diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index 63588a6..6799391 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -117,6 +117,44 @@ exports.getNodeInfo = async (req, res) => {
     })
 }
 
+/** Adds a specific system/preset on a given node
+ * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ * @param {*} req.params.nodeId The Node ID to add the preset/system to
+ * @param {*} req.body.systemName The name of the system to add
+ * @param {*} req.body.mode The radio mode of the preset 
+ * @param {*} req.body.frequencies The frequencies of the preset
+ * @param {*} req.body.trunkFile The trunk file to use for digital stations
+ */
+exports.addNodeSystem = async (req, res) => {
+    if (!req.params.nodeId) return res.status(400).json("No id specified");
+    if (!req.body.systemName) return res.status(400).json("No system specified");
+    log.DEBUG("Adding system for node: ", req.params.nodeId, req.body);
+    getNodeInfoFromId(req.params.nodeId, (node) => {
+        const reqOptions = new requestOptions("/client/addPreset", "POST", node.ip, node.port);
+        const reqBody = {
+            'systemName': req.body.systemName,
+            'mode': req.body.mode,
+            'frequencies': req.body.frequencies,
+        }
+        if(digitalModes.includes(req.body.mode)) reqBody['trunkFile'] = req.body.trunkFile ?? 'none'
+
+        log.DEBUG("Request body for adding node system: ", reqBody, reqOptions);
+        sendHttpRequest(reqOptions, JSON.stringify(reqBody), async (responseObj) => {
+            if(responseObj){
+                // Good
+                log.DEBUG("Response from adding node system: ", reqBody, responseObj);
+                return res.sendStatus(200)
+            } else {
+                // Bad
+                log.DEBUG("No Response from adding Node system");
+                return res.status(400).json("No Response from adding Node, could be offline");
+            }
+        })
+    })    
+}
+
 /** Updates a specific system/preset on a given node
  * 
  * @param {*} req Default express req from router
@@ -144,11 +182,11 @@ exports.updateNodeSystem = async (req, res) => {
         sendHttpRequest(reqOptions, JSON.stringify(reqBody), async (responseObj) => {
             if(responseObj){
                 // Good
-                log.DEBUG("Response from updating node: ", reqBody, responseObj);
+                log.DEBUG("Response from updating node system: ", reqBody, responseObj);
                 return res.sendStatus(200)
             } else {
                 // Bad
-                log.DEBUG("No Response from updating Node");
+                log.DEBUG("No Response from updating Node system");
                 return res.status(400).json("No Response from updating Node, could be offline");
             }
         })
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index e4e5274..6c732bd 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -185,8 +185,35 @@ function saveNodeDetails() {
     }
 }
 
-function addNewSystem() {
+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) {
@@ -216,6 +243,7 @@ function updateSystem(systemName) {
         console.log(Http.status);
         console.log(responseObject);
         createToast(`${systemName} Updated!`);
+        location.reload();
     }
 }
 
diff --git a/Server/routes/nodes.js b/Server/routes/nodes.js
index d110343..2ef23b4 100644
--- a/Server/routes/nodes.js
+++ b/Server/routes/nodes.js
@@ -12,7 +12,10 @@ router.get('/:nodeId', nodesController.getNodeInfo);
 // Update an existing node
 router.put('/:nodeId', nodesController.updateExistingNode);
 
-// Update an existing node's system
+// Add a system to an existing node
+router.post('/:nodeId/systems', nodesController.addNodeSystem);
+
+// Update a system on an existing node
 router.put('/:nodeId/systems', nodesController.updateNodeSystem);
 
 // TODO Need to authenticate this request
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
index 0bc3a9c..45a7e28 100644
--- a/Server/views/node.ejs
+++ b/Server/views/node.ejs
@@ -113,7 +113,7 @@
                                                         </td>
                                                     </tr>
                                                     <% // Update system modal %>        
-                                                    <%- include("partials/modifySystemModal.ejs", {'system': system, 'frequencies': node.nearbySystems[system].frequencies}) %>
+                                                    <%- include("partials/modifySystemModal.ejs", {'system': system, 'frequencies': node.nearbySystems[system].frequencies, 'mode': node.nearbySystems[system].mode}) %>
                                                     <% } %>
                                             </tbody>
                                         </table>
@@ -126,31 +126,14 @@
                     <button class="btn btn-primary <% if(!node.online) { %>disabled<% } %>" type="button" onclick="saveNodeDetails()">Save changes</button>
                     <!-- Button trigger modal -->
                     <button type="button" class="btn btn-primary float-right <% if(!node.online) { %>disabled<% } %>" data-bs-toggle="modal"
-                        data-bs-target="#newSystemModal">Add New System</button>                    
+                        data-bs-target="#updateSystemModal_New_System">Add New System</button>                    
                 </form>                
             </div>
         </div>
     </div>
 
     <% // new System Modal %>
-    <div class="modal fade" id="newSystemModal" tabindex="-1" aria-labelledby="newSystemModal" aria-hidden="true">
-        <div class="modal-dialog modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-header">
-                    <h1 class="modal-title fs-5" id="newSystemModal">Add a New System</h1>
-                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-                </div>
-                <div class="modal-body">
-                    ...
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
-                    <button type="button" class="btn btn-primary">Save changes</button>
-                </div>
-            </div>
-        </div>
-    </div>
-    <%- include('partials/joinModal.ejs', {'nearbySystems': node.nearbySystems}) %>    
+    <%- include("partials/modifySystemModal.ejs", {'system': "New System", 'frequencies': [], 'mode': ''}) %>
 <%- include('partials/bodyEnd.ejs') %>
 <script src="/res/js/node.js"></script>
 <%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/modifySystemModal.ejs b/Server/views/partials/modifySystemModal.ejs
index 88ae381..a609964 100644
--- a/Server/views/partials/modifySystemModal.ejs
+++ b/Server/views/partials/modifySystemModal.ejs
@@ -3,7 +3,7 @@
     <div class="modal-dialog modal-dialog-centered">
         <div class="modal-content">
             <div class="modal-header">
-                <h1 class="modal-title fs-5" id="updateSystemModal_<%=system.replaceAll(" ", "_")%>">Update <%=system%></h1>
+                <h1 class="modal-title fs-5" id="updateSystemModal_<%=system.replaceAll(" ", "_")%>"><%if (!system == "New System") {%>Update<%} else {%>Add a<%}%> <%=system%></h1>
                 <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
             </div>
             <div class="modal-body">
@@ -12,7 +12,7 @@
                         <form>
                             <div class="row gx-3 mb-3">
                                 <label class="small mb-1 fs-6" for="systemName">System Name</label>
-                                <input class="form-control" id="systemName" type="text" value="<%= system %>"></input>
+                                <input class="form-control" id="systemName" type="text" value="<%if (!system == "New System") {%><%= system %><%} else {%>Local Radio System<%}%>"></input>
                             </div>
                             <div class="row gx-3 mb-3" id="frequencyRow_<%=system.replaceAll(" ", "_")%>">
                                 <label class="small mb-1 fs-6" for="systemFreq">Frequencies</label>
@@ -36,12 +36,15 @@
                                     <label class="small mb-1 fs-6" for="<%=system%>_systemMode">Mode</label>
                                     <br>
                                     <select class="custom-select" id="<%=system%>_systemMode">
-                                        <option value="<%= node.nearbySystems[system].mode %>" selected><span class="text-uppercase"><%= node.nearbySystems[system].mode %></span></option>
-                                        <% if(node.nearbySystems[system].mode == "p25") { %>                                                                                                
+                                        <option value="<%= mode ?? 'select' %>" selected><span class="text-uppercase"><%= mode ?? 'Select' %></span></option>
+                                        <% if(mode == "p25") { %>                                                                                                
                                             <option value="nbfm">NBFM</option>
-                                        <% } else if (node.nearbySystems[system].mode == "nbfm") { %>
+                                        <% } else if (mode == "nbfm") { %>
                                             <option value="p25">P25</option>
-                                        <% } %>
+                                        <% } else { %>
+                                            <option value="nbfm">NBFM</option>
+                                            <option value="p25">P25</option>
+                                            <%}%>
                                     </select>
                                 </div>
                             </div>
@@ -51,7 +54,7 @@
             </div>
             <div class="modal-footer">
                 <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" onclick="location.reload()">Close</button>
-                <button type="button" class="btn btn-primary" onclick="updateSystem('<%=system%>')">Save changes</button>
+                <button type="button" class="btn btn-primary" data-bs-dismiss="modal" <%if(!system == "New System") {%>onclick="updateSystem('<%=system%>')"<%} else {%>onclick="addNewSystem('<%=system%>')"<%}%>>Save changes</button>
             </div>
         </div>
     </div>

From 9c111eda1a2d431123ed72446f4288cbe3819b40 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Fri, 21 Jul 2023 18:15:51 -0400
Subject: [PATCH 16/57] Update design on navbar and sidebar

---
 Server/public/res/css/main.css    |  9 ++++++++-
 Server/views/partials/navbar.ejs  |  2 +-
 Server/views/partials/sidebar.ejs | 23 ++++++++++++-----------
 3 files changed, 21 insertions(+), 13 deletions(-)

diff --git a/Server/public/res/css/main.css b/Server/public/res/css/main.css
index 6384148..5c44612 100644
--- a/Server/public/res/css/main.css
+++ b/Server/public/res/css/main.css
@@ -138,9 +138,16 @@ a {
 
 /* Global Section */
 .sidebar-container {
-    min-height: 94.2vh;
+    min-height: 95vh;
 }
 
+.sidebar { 
+    position: fixed; 
+    top: 5vh; 
+    bottom: 0;
+    left: 0;
+ }
+
 /* User table section */
 
 .label {
diff --git a/Server/views/partials/navbar.ejs b/Server/views/partials/navbar.ejs
index 169185f..204f863 100644
--- a/Server/views/partials/navbar.ejs
+++ b/Server/views/partials/navbar.ejs
@@ -1,4 +1,4 @@
-<nav class="navbar navbar-expand-lg bg-body-tertiary" data-bs-theme="dark">
+<nav class="navbar fixed-top navbar-expand-lg bg-body-tertiary" data-bs-theme="dark">
     <div class="container-fluid">
         <a class="navbar-brand" href="#">Node Master</a>
         <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
diff --git a/Server/views/partials/sidebar.ejs b/Server/views/partials/sidebar.ejs
index 4b2840e..fd51b50 100644
--- a/Server/views/partials/sidebar.ejs
+++ b/Server/views/partials/sidebar.ejs
@@ -1,21 +1,22 @@
-<div class="container-fluid">
+<div class="container-fluid mt-5">
     <div class="row flex-nowrap">
-        <div class="col-auto col-md-3 col-xl-2 px-sm-2 px-0 bg-dark">
-            <div class="d-flex flex-column align-items-center align-items-sm-start px-3 pt-2 text-white sidebar-container">
+        <div class="col-auto col-md-3 col-xl-2 px-sm-2 px-0 bg-dark sidebar-container">
+            <div
+                class="d-flex flex-column align-items-center align-items-sm-start px-3 pt-2 text-white sidebar">
                 <ul class="nav nav-pills flex-column mb-sm-auto mb-0 align-items-center align-items-sm-start" id="menu">
                     <li>
                         <a href="/" class="nav-link px-0 align-middle">
                             <i class="fs-4 bi-speedometer2"></i> <span class="ms-1 d-none d-sm-inline">Dashboard</span>
-                        </a>                        
-                    </li>                                        
+                        </a>
+                    </li>
                     <li>
                         <a href="/controller" class="nav-link px-0 align-middle">
-                            <i class="fs-4 bi-grid"></i> <span class="ms-1 d-none d-sm-inline">Controller</span> </a>                        
+                            <i class="fs-4 bi-grid"></i> <span class="ms-1 d-none d-sm-inline">Controller</span>
+                        </a>
                     </li>
                 </ul>
                 <hr>
-                <% /*
-                <div class="dropdown pb-4 fixed-bottom px-3">
+                <% /* <div class="dropdown pb-4 fixed-bottom px-3">
                     <a href="#" class="d-flex align-items-center text-white text-decoration-none dropdown-toggle"
                         id="dropdownUser1" data-bs-toggle="dropdown" aria-expanded="false">
                         <img src="https://github.com/mdo.png" alt="hugenerd" width="30" height="30"
@@ -31,8 +32,8 @@
                         </li>
                         <li><a class="dropdown-item" href="#">Sign out</a></li>
                     </ul>
-                </div>
-                */%>
             </div>
+            */%>
         </div>
-        <div class="col py-3">
\ No newline at end of file
+    </div>
+    <div class="col py-3">
\ No newline at end of file

From 11c8a149bb84dd3a34c39d41b2b8c275cefeb698 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Fri, 21 Jul 2023 18:31:41 -0400
Subject: [PATCH 17/57] Remove unnecessary online param from webUI update node

---
 Server/public/res/js/node.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index 6c732bd..7e8fdc0 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -165,8 +165,7 @@ function saveNodeDetails() {
         'name': nodeName,
         'ip': nodeIp,
         'port': nodePort,
-        'location': nodeLocation,
-        'online': true
+        'location': nodeLocation
     }
 
     console.log("Request Body: ", reqBody);

From abb833840a54f9b00e261fbbf8fb80da402cc0f5 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Fri, 21 Jul 2023 18:36:21 -0400
Subject: [PATCH 18/57] Update request node checkin in update node

---
 Server/controllers/nodesController.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index 6799391..688b6d1 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -248,13 +248,13 @@ exports.updateExistingNode = async = (req, res) => {
         if (!nodeInfo) {
             log.WARN("No existing node found with this ID, adding node: ", checkInObject);
             addNewNode(checkInObject, (newNode) => {
-                this.requestNodeCheckIn(checkInObject.id);
+                this.requestNodeCheckIn({"params": {"nodeId": checkInObject.id}});
                 return res.status(201).json({ "updatedKeys": newNode });
             });
         }
         else {
             updateNodeInfo(checkInObject, () => {
-                this.requestNodeCheckIn(checkInObject.id);
+                this.requestNodeCheckIn({"params": {"nodeId": checkInObject.id}});
                 return res.status(202).json({ "updatedKeys": checkInObject });
             });
         }

From 75156d059e628d507f922cd98a3cf8059054c94b Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Fri, 21 Jul 2023 18:51:55 -0400
Subject: [PATCH 19/57] Add new node if node tries to check in with an ID not
 in the DB

---
 Server/controllers/nodesController.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index 688b6d1..d24c89b 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -269,6 +269,7 @@ exports.updateExistingNode = async = (req, res) => {
 exports.nodeCheckIn = async (req, res) => {
     if (!req.params.nodeId) return res.status(400).json("No id specified");
         getNodeInfoFromId(req.params.nodeId, (nodeInfo) => {
+            if (!nodeInfo) return this.newNode(req, res);
             if (!nodeInfo.online) {
                 nodeInfo.online = true;
                 updateNodeInfo(nodeInfo, () => {

From ace762fc760ed6151ccda5afe56bd3084dcd176e Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 01:19:54 -0400
Subject: [PATCH 20/57] Finalizing Server webUI

Still needed:
- Way to update clients' versions
- Way to delete nodes
- working dashboard
- working search function
---
 Client/app.js                               |   2 +-
 Client/config/radioPresets.json             |   2 +-
 Client/controllers/clientController.js      |  19 +-
 Client/routes/client.js                     |   5 +
 Client/utilities/configHandler.js           |   8 +-
 Client/utilities/httpRequests.js            |   2 +-
 Client/utilities/updateConfig.js            |  52 ++++-
 Client/utilities/utilities.js               |   4 +-
 Server/controllers/adminController.js       |   2 +
 Server/controllers/nodesController.js       |  45 +++-
 Server/public/res/js/node.js                | 215 +++++++++++++++++---
 Server/routes/nodes.js                      |   3 +
 Server/views/node.ejs                       |   5 +-
 Server/views/partials/bodyEnd.ejs           |   4 +-
 Server/views/partials/htmlHead.ejs          |   3 +-
 Server/views/partials/modifySystemModal.ejs |   4 +-
 Server/views/partials/navbar.ejs            |   6 +-
 Server/views/partials/sidebar.ejs           |  13 +-
 18 files changed, 327 insertions(+), 67 deletions(-)

diff --git a/Client/app.js b/Client/app.js
index 09ff507..468cd22 100644
--- a/Client/app.js
+++ b/Client/app.js
@@ -98,4 +98,4 @@ log.DEBUG(`Starting HTTP Server`);
 	runHTTPServer();
 
   log.DEBUG("Checking in with the master server")
-  checkIn();
+  checkIn(true);
diff --git a/Client/config/radioPresets.json b/Client/config/radioPresets.json
index 204fe78..b8f268a 100644
--- a/Client/config/radioPresets.json
+++ b/Client/config/radioPresets.json
@@ -1 +1 @@
-{"Westchester Cty. Simulcast":{"frequencies":[470575000,470375000,470525000,470575000,470550000],"mode":"p25","trunkFile":"trunk.tsv"},"coppies":{"frequencies":[154690000],"mode":"nbfm","trunkFile":"none"},"poopoo":{"frequencies":[479135500],"mode":"nbfm","trunkFile":"none"},"ppeeeeeeeeee":{"frequencies":[479135500,133990000,133000000,555999000],"mode":"p25","trunkFile":"none"}}
\ No newline at end of file
+{"Westchester Cty. Simulcast":{"frequencies":[470575000,470375000,470525000,470575000,470550000],"mode":"p25","trunkFile":"trunk.tsv"},"coppies":{"frequencies":[154690000],"mode":"nbfm","trunkFile":"none"},"asdadadadasd":{"frequencies":[123321000],"mode":"nbfm","trunkFile":"none"}}
\ No newline at end of file
diff --git a/Client/controllers/clientController.js b/Client/controllers/clientController.js
index 2101d44..7d1729e 100644
--- a/Client/controllers/clientController.js
+++ b/Client/controllers/clientController.js
@@ -5,13 +5,14 @@ const log = new DebugBuilder("client", "clientController");
 require('dotenv').config();
 const modes = require("../config/modes");
 // Modules
-const { executeAsyncConsoleCommand, nodeObject, BufferToJson } = require("../utilities/utilities");
+const { executeAsyncConsoleCommand, BufferToJson } = require("../utilities/utilities");
 // Utilities
-const { updateId, updateConfig } = require("../utilities/updateConfig");
+const { getFullConfig } = require("../utilities/configHandler");
+const { updateId, updateConfig, updateClientConfig } = require("../utilities/updateConfig");
 const { updatePreset, addNewPreset, getPresets, removePreset } = require("../utilities/updatePresets");
 const { onHttpError, requestOptions, sendHttpRequest } = require("../utilities/httpRequests");
 
-var runningClientConfig = new nodeObject({_id: process.env.CLIENT_ID, _ip: process.env.CLIENT_IP, _name: process.env.CLIENT_NAME, _port: process.env.CLIENT_PORT, _location: process.env.CLIENT_LOCATION, _nearbySystems: getPresets(), _online: process.env.CLIENT_ONLINE});
+var runningClientConfig = getFullConfig()
 
 /**
  * Check the body for the required fields to update or add a preset
@@ -97,12 +98,11 @@ exports.checkConfig = async function checkConfig() {
  * If the bot has a saved ID, check in with the server to get any updated information or just check back in
  * If the bot does not have a saved ID, it will attempt to request a new ID from the server
  * 
- * @param {boolean} init If set to true, the client will update the server to it's config, instead of taking the server's config
+ * @param {boolean} update If set to true, the client will update the server to it's config, instead of taking the server's config
  */
-exports.checkIn = async (init = false) => {
+exports.checkIn = async (update = false) => {
     let reqOptions;
     await this.checkConfig();
-    runningClientConfig.online = true;
     // Check if there is an ID found, if not add the node to the server. If there was an ID, check in with the server to make sure it has the correct information
     try {        
         if (!runningClientConfig?.id || runningClientConfig.id == 0) {                        
@@ -136,7 +136,7 @@ exports.checkIn = async (init = false) => {
         }
         else {
             // ID is in the config, checking in with the server
-            if (init) reqOptions = new requestOptions(`/nodes/${runningClientConfig.id}`, "PUT");
+            if (update) reqOptions = new requestOptions(`/nodes/${runningClientConfig.id}`, "PUT");
             else reqOptions = new requestOptions(`/nodes/nodeCheckIn/${runningClientConfig.id}`, "POST");
             sendHttpRequest(reqOptions, JSON.stringify(runningClientConfig), (responseObject) => {
                 log.DEBUG("Check In Respose: ", responseObject);
@@ -156,6 +156,8 @@ exports.checkIn = async (init = false) => {
                 }
                 if (responseObject.statusCode === 200) {
                     // Server accepted the response but there were no keys to be updated
+                    const tempUpdatedConfig = updateClientConfig(responseObject.body);
+                    if (!tempUpdatedConfig.length > 0) return;
                 }
                 if (responseObject.statusCode >= 300) {
                     // Server threw an error
@@ -192,6 +194,7 @@ exports.updatePreset = async (req, res) => {
     checkBodyForPresetFields(req, res, () => {
         updatePreset(req.body.systemName, () => {
             runningClientConfig.nearbySystems = getPresets();
+            this.checkIn(true);
             return res.sendStatus(200);
         }, {frequencies: req.body.frequencies, mode: req.body.mode, trunkFile: req.body.trunkFile});
     })
@@ -204,6 +207,7 @@ exports.addNewPreset = async (req, res) => {
     checkBodyForPresetFields(req, res, () => {
         addNewPreset(req.body.systemName, req.body.frequencies, req.body.mode, () => {
             runningClientConfig.nearbySystems = getPresets();
+            this.checkIn(true);
             return res.sendStatus(200);
         }, req.body.trunkFile);
     });
@@ -217,6 +221,7 @@ exports.removePreset = async (req, res) => {
         if (!req.body.systemName) return res.status("500").json({"message": "You must specify a system name to delete, this must match exactly to how the system name is saved."})
         removePreset(req.body.systemName, () => {
             runningClientConfig.nearbySystems = getPresets();
+            this.checkIn(true);
             return res.sendStatus(200);
         }, req.body.trunkFile);
     });
diff --git a/Client/routes/client.js b/Client/routes/client.js
index 8e2e8a6..c3a7ed0 100644
--- a/Client/routes/client.js
+++ b/Client/routes/client.js
@@ -11,6 +11,11 @@ const { requestCheckIn, getPresets, updatePreset, addNewPreset, removePreset, up
  */
 router.get('/requestCheckIn', requestCheckIn);
 
+/** GET Object of all known presets
+ * Query the client to get all the known presets
+ */
+router.put('/', );
+
 /** GET Object of all known presets
  * Query the client to get all the known presets
  */
diff --git a/Client/utilities/configHandler.js b/Client/utilities/configHandler.js
index 0d7750e..1b92e79 100644
--- a/Client/utilities/configHandler.js
+++ b/Client/utilities/configHandler.js
@@ -2,6 +2,8 @@
 const { DebugBuilder } = require("../utilities/debugBuilder.js");
 const log = new DebugBuilder("client", "configController");
 // Modules
+const { nodeObject } = require("./utilities.js");
+const { getPresets } = require("../utilities/updatePresets");
 const { readFileSync } = require('fs');
 const path = require("path");
 require('dotenv').config();
@@ -33,4 +35,8 @@ function getDeviceName(){
     log.DEBUG("Device Name: ", DeviceName);
     return DeviceName;
 }
-exports.getDeviceName = getDeviceID;
\ No newline at end of file
+exports.getDeviceName = getDeviceID;
+
+exports.getFullConfig = () => {
+    return new nodeObject({_id: process.env.CLIENT_ID, _ip: process.env.CLIENT_IP, _name: process.env.CLIENT_NAME, _port: process.env.CLIENT_PORT, _location: process.env.CLIENT_LOCATION, _nearbySystems: getPresets()});
+}
\ No newline at end of file
diff --git a/Client/utilities/httpRequests.js b/Client/utilities/httpRequests.js
index a4b5566..f3ddc4b 100644
--- a/Client/utilities/httpRequests.js
+++ b/Client/utilities/httpRequests.js
@@ -9,7 +9,7 @@ const { isJsonString } = require("./utilities.js");
 
 exports.requestOptions = class requestOptions {
     constructor(path, method, hostname = undefined, headers = undefined, port = undefined) {
-        if (method === "POST"){
+        if (["POST", "PUT"].includes(method)){
             log.VERBOSE("Hostname Vars: ", hostname, process.env.SERVER_HOSTNAME, process.env.SERVER_IP);
             if (hostname) this.hostname = hostname;
             if (process.env.SERVER_HOSTNAME) this.hostname = process.env.SERVER_HOSTNAME;
diff --git a/Client/utilities/updateConfig.js b/Client/utilities/updateConfig.js
index e934603..250d90c 100644
--- a/Client/utilities/updateConfig.js
+++ b/Client/utilities/updateConfig.js
@@ -3,6 +3,7 @@ const { DebugBuilder } = require("../utilities/debugBuilder.js");
 const log = new DebugBuilder("client", "updateConfig");
 // Modules
 const replace = require('replace-in-file');
+const { getFullConfig } = require("./configHandler.js");
 
 class Options {
     constructor(key, updatedValue) {
@@ -23,6 +24,56 @@ exports.updateId = (updatedId) => {
     this.updateConfig('CLIENT_ID', updatedId);
 }
 
+/**
+ * Wrapper to update any or all keys in the client config
+ * 
+ * @param {*} configObject Object with what keys you wish to update (node object format, will be converted)
+ * @returns 
+ */
+exports.updateClientConfig = (configObject) => { 
+    const runningConfig = getFullConfig();
+    var updatedKeys = []
+    const configKeys = Object.keys(configObject);
+    
+    if (configKeys.includes("id")) {
+        if (runningConfig.id != configObject.id) {
+            this.updateConfig('CLIENT_ID', configObject.id);
+            updatedKeys.push({'CLIENT_ID': configObject.id});
+            log.DEBUG("Updated ID to: ", configObject.id);
+        }        
+    }
+    if (configKeys.includes("name")) {
+        if (runningConfig.name != configObject.name) {
+            this.updateConfig('CLIENT_NAME', configObject.name);
+            updatedKeys.push({'CLIENT_NAME': configObject.name});
+            log.DEBUG("Updated name to: ", configObject.name);
+        }
+    }
+    if (configKeys.includes("ip")) {
+        if (runningConfig.ip != configObject.ip) {
+            this.updateConfig('CLIENT_IP', configObject.ip);
+            updatedKeys.push({'CLIENT_IP': configObject.ip});
+            log.DEBUG("Updated ip to: ", configObject.ip);
+        }
+    }
+    if (configKeys.includes("port")) {
+        if (runningConfig.port != configObject.port) {
+            this.updateConfig('CLIENT_PORT', configObject.port);
+            updatedKeys.push({'CLIENT_PORT': configObject.port});
+            log.DEBUG("Updated port to: ", configObject.port);
+        }
+    }
+    if (configKeys.includes("location")) {
+        if (runningConfig.location != configObject.location) {
+            this.updateConfig('CLIENT_LOCATION', configObject.location);
+            updatedKeys.push({'CLIENT_LOCATION': configObject.location});
+            log.DEBUG("Updated location to: ", configObject.location);
+        }
+    }
+
+    return updatedKeys;
+}
+
 /**
  * 
  * @param {string} key The config file key to update with the value
@@ -37,7 +88,6 @@ exports.updateConfig = function updateConfig(key, value) {
     })
 }
 
-
 /**
  * Wrapper to write changes to the file
  * @param options An instance of the Objects class specified to the key being updated
diff --git a/Client/utilities/utilities.js b/Client/utilities/utilities.js
index 8ccad58..78733be 100644
--- a/Client/utilities/utilities.js
+++ b/Client/utilities/utilities.js
@@ -25,17 +25,15 @@ exports.nodeObject = class nodeObject {
      * @param {*} param0._ip The IP that the master can contact the node at
      * @param {*} param0._port The port that the client is listening on
      * @param {*} param0._location The physical location of the node
-     * @param {*} param0._online An integer representation of the online status of the bot, ie 0=off, 1=on
      * @param {*} param0._nearbySystems An object array of nearby systems
      */
-    constructor({ _id = null, _name = null, _ip = null, _port = null, _location = null, _nearbySystems = null, _online = null }) {
+    constructor({ _id = null, _name = null, _ip = null, _port = null, _location = null, _nearbySystems = null }) {
         this.id = _id;
         this.name = _name;        
         this.ip = _ip;
         this.port = _port;
         this.location = _location;
         this.nearbySystems = _nearbySystems;
-        this.online = _online;
     }
 }
 
diff --git a/Server/controllers/adminController.js b/Server/controllers/adminController.js
index bc699b2..df6f80c 100644
--- a/Server/controllers/adminController.js
+++ b/Server/controllers/adminController.js
@@ -86,6 +86,8 @@ exports.leaveServer = async (req, res) => {
     const currentConnection = await getConnectionByNodeId(nodeId);
     log.DEBUG("Current Connection for node: ", currentConnection);
 
+	if (!currentConnection) return res.status(400).json("Node is not connected")
+
     await leaveServerWrapper(currentConnection.clientObject)
 
     return res.status(200).json(currentConnection.clientObject.name);
diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index d24c89b..e5f601c 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -20,7 +20,7 @@ async function checkInWithNode(node) {
     sendHttpRequest(reqOptions, "", (responseObj) => {
         if (responseObj) {
             log.DEBUG("Response from: ", node.name, responseObj);
-            const onlineNode = new nodeObject({ _online: false, _id: node.id });
+            const onlineNode = new nodeObject({ _online: true, _id: node.id });
             log.DEBUG("Node update object: ", onlineNode);
             updateNodeInfo(onlineNode, (sqlResponse) => {
                 if (!sqlResponse) this.log.ERROR("No response from SQL object");
@@ -193,6 +193,39 @@ exports.updateNodeSystem = async (req, res) => {
     })    
 }
 
+/** Deletes a specific system/preset from a given node
+ * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ * @param {*} req.params.nodeId The Node ID to update the preset/system on
+ * @param {*} req.body.systemName The name of the system to update
+ */
+exports.removeNodeSystem = async (req, res) => {
+    if (!req.params.nodeId) return res.status(400).json("No id specified");
+    if (!req.body.systemName) return res.status(400).json("No system specified");
+    log.DEBUG("Updating system for node: ", req.params.nodeId, req.body);
+    getNodeInfoFromId(req.params.nodeId, (node) => {
+        const reqOptions = new requestOptions("/client/removePreset", "POST", node.ip, node.port);
+        const reqBody = {
+            'systemName': req.body.systemName
+        }
+
+        log.DEBUG("Request body for deleting preset: ", reqBody, reqOptions);
+        sendHttpRequest(reqOptions, JSON.stringify(reqBody), async (responseObj) => {
+            if(responseObj){
+                // Good
+                log.DEBUG("Response from deleting preset: ", reqBody, responseObj);
+                return res.sendStatus(200)
+            } else {
+                // Bad
+                log.DEBUG("No Response from deleting preset");
+                return res.status(400).json("No Response from deleting preset, could be offline");
+            }
+        })
+    })    
+}
+
+
 /** Updates the information received from the client based on ID
  * 
  * @param {*} req Default express req from router
@@ -247,14 +280,14 @@ exports.updateExistingNode = async = (req, res) => {
 
         if (!nodeInfo) {
             log.WARN("No existing node found with this ID, adding node: ", checkInObject);
-            addNewNode(checkInObject, (newNode) => {
-                this.requestNodeCheckIn({"params": {"nodeId": checkInObject.id}});
+            addNewNode(checkInObject, async (newNode) => {
+                await checkInWithNode(newNode);
                 return res.status(201).json({ "updatedKeys": newNode });
             });
         }
         else {
-            updateNodeInfo(checkInObject, () => {
-                this.requestNodeCheckIn({"params": {"nodeId": checkInObject.id}});
+            updateNodeInfo(checkInObject, async () => {
+                await checkInWithNode(nodeInfo);
                 return res.status(202).json({ "updatedKeys": checkInObject });
             });
         }
@@ -291,7 +324,7 @@ exports.requestNodeCheckIn = async (req, res) => {
     const node = await getNodeInfoFromId(req.params.nodeId);
     if (!node) return res.status(400).json("No Node with the ID given");
     await checkInWithNode(node);
-    res.sendStatus(200);
+    if (res) res.sendStatus(200);
 }
 
 /**
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index 7e8fdc0..67ea019 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -1,11 +1,119 @@
+$(document).ready(async () => {
+    console.log("Loading stored notifications...");
+    await loadStoredToasts();
+    console.log("Showing stored notifications...");
+    await showStoredToasts();
+});
+
+/**
+ * Gets all toasts stored in local storage
+ * 
+ * @returns {Object} Object of toasts in storage
+ */
+function getStoredToasts() {
+    if (localStorage.getItem("toasts")) {
+        const storedToasts = JSON.parse(localStorage.getItem("toasts"));
+        console.log("LOADED STORED TOASTS: ", storedToasts);
+        navbarUpdateNotificationBellCount(storedToasts);
+        return storedToasts;
+    }
+    else return false
+}
+
+/**
+ * Adds a toast to storage, will not allow duplicates
+ * 
+ * @param {Date} time The date object from when the toast was created
+ * @param {*} message The message of the toast
+ */
+function addToastToStorage(time, message) {
+    var toasts = [{ 'time': time, 'message': message }]
+    var storedToasts = getStoredToasts();
+    console.log("Adding new notification to storage: ", toasts);
+    toasts = toasts.concat(storedToasts);
+    console.log("Combined new and stored notifications: ", toasts);
+    toasts = toasts.filter((value, index, self) =>
+        index === self.findIndex((t) => (
+            t.time === value.time && t.message === value.message
+        ))
+    )
+    console.log("Deduped stored notifications: ", toasts);
+    localStorage.setItem("toasts", JSON.stringify(toasts));
+    navbarUpdateNotificationBellCount(toasts);
+}
+
+/**
+ * Removes a toast from the local storage
+ * 
+ * @param {Date} time The date object from when the toast was created
+ * @param {*} message The message of the toast
+ */
+function removeToastFromStorage(time, message) {
+    const toastToRemove = { 'time': time, 'message': message }
+    console.log("Toast to remove: ", toastToRemove);
+    var toasts = getStoredToasts();
+    console.log("Stored toasts: ", toasts);
+    if (toasts.indexOf(toastToRemove)) toasts.splice(toasts.indexOf(toastToRemove) - 1, 1)
+    console.log("Toasts with selected toast removed: ", toasts);
+    localStorage.setItem("toasts", JSON.stringify(toasts));
+    navbarUpdateNotificationBellCount(toasts);
+}
+
+/**
+ * Shows all stored toasts
+ */
+function showStoredToasts() {
+    const storedToasts = getStoredToasts();
+    if (!storedToasts) return
+    console.log("Loaded stored notifications to show: ", storedToasts);
+    for (const toast of storedToasts) {
+        const toastId = `${toast.time}-toast`;
+        console.log("Showing stored toast: ", toast, toastId);
+        const toastElement = bootstrap.Toast.getOrCreateInstance(document.getElementById(toastId));
+        toastElement.show();
+    }
+}
+
+/**
+ * Loads all toasts stored in the local storage into the DOM of the webpage
+ */
+function loadStoredToasts() {
+    const storedToasts = getStoredToasts();
+    if (!storedToasts) return
+    console.log("Loaded stored notifications: ", storedToasts);
+    for (const toast of storedToasts) {
+        createToast(toast.message, { time: toast.time })
+    }
+}
+
+/**
+ * Will update the count of notifications on the bell icon in the navbar
+ * 
+ * @param {Array} storedToasts An array of stored toasts to be counted and updated in the navbar
+ */
+function navbarUpdateNotificationBellCount(storedToasts) {
+    const notificationBellIcon = document.getElementById("navbar-notification-bell");
+    var notificationBellCount = document.getElementById("notification-bell-icon-count");
+    if (!notificationBellCount) {
+        notificationBellCount = document.createElement('span');
+        notificationBellCount.id = "notification-bell-icon-count";
+        notificationBellCount.classList.add('badge');
+        notificationBellCount.classList.add('text-bg-secondary');
+        notificationBellCount.appendChild(document.createTextNode(storedToasts.length));
+    }
+    else notificationBellCount.innerHTML = storedToasts.length;
+
+    notificationBellIcon.appendChild(notificationBellCount);
+}
+
 /**
  * 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; 
+function addFrequencyInput(system, inputId = null) {
+    if (!inputId) inputId = $(`[id^="${system}_systemFreqRow_"]`).length;
     // Create new input
     var icon = document.createElement('i');
     icon.classList.add('bi');
@@ -16,7 +124,7 @@ function addFrequencyInput(system, inputId = null){
     remove.classList.add('align-middle');
     remove.classList.add('float-left');
     remove.href = '#'
-    remove.onclick = () => {removeFrequencyInput(`${system}_systemFreqRow_${inputId}`)}
+    remove.onclick = () => { removeFrequencyInput(`${system}_systemFreqRow_${inputId}`) }
     remove.appendChild(icon);
 
     var childColRemoveIcon = document.createElement('div');
@@ -31,7 +139,7 @@ function addFrequencyInput(system, inputId = null){
     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");
@@ -47,19 +155,30 @@ function addFrequencyInput(system, inputId = null){
     document.getElementById(`frequencyRow_${system.replaceAll(" ", "_")}`).appendChild(colParent);
 }
 
-function createToast(notificationMessage){
+/**
+ * Add a toast element to the DOM
+ * 
+ * @param {*} notificationMessage The message of the notification 
+ * @param {Date} param1.time The date object for when the toast was created, blank if creating new
+ * @param {boolean} param1.showNow Show the toast now or just store it
+ * @returns 
+ */
+function createToast(notificationMessage, { time = undefined, showNow = false } = {}) {
+    if (!time) time = new Date(Date.now());
+    else time = new Date(Date.parse(time));
     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()));
+    toastTime.appendChild(document.createTextNode(time.toLocaleString()));
 
     const toastClose = document.createElement('button');
     toastClose.type = 'button';
     toastClose.classList.add('btn-close');
     toastClose.ariaLabel = 'Close';
     toastClose.setAttribute('data-bs-dismiss', 'toast');
+    toastClose.onclick = () => { removeToastFromStorage(time.toISOString(), notificationMessage); };
 
     const toastHeader = document.createElement('div');
     toastHeader.classList.add('toast-header');
@@ -67,7 +186,6 @@ function createToast(notificationMessage){
     toastHeader.appendChild(toastTime);
     toastHeader.appendChild(toastClose);
 
-
     const toastMessage = document.createElement('p');
     toastMessage.classList.add("px-2");
     toastMessage.appendChild(document.createTextNode(notificationMessage));
@@ -78,31 +196,39 @@ function createToast(notificationMessage){
 
     const wrapperDiv = document.createElement('div');
     wrapperDiv.classList.add('toast');
-    wrapperDiv.role ='alert';
+    //wrapperDiv.classList.add('position-fixed');
+    wrapperDiv.id = `${time.toISOString()}-toast`;
+    wrapperDiv.role = 'alert';
     wrapperDiv.ariaLive = 'assertive';
     wrapperDiv.ariaAtomic = true;
+    wrapperDiv.setAttribute('data-bs-delay', "7500");
+    wrapperDiv.setAttribute('data-bs-animation', true);
     wrapperDiv.appendChild(toastHeader);
     wrapperDiv.appendChild(toastMessage);
 
     document.getElementById("toastZone").appendChild(wrapperDiv);
-    
-    $('.toast').toast('show');
-    return $('.toast');
+    addToastToStorage(time.toISOString(), notificationMessage);
+    if (showNow) {
+        const toastElement = bootstrap.Toast.getOrCreateInstance(document.getElementById(`${time.toISOString()}-toast`));
+        toastElement.show();
+    }
+
+    return;
 }
 
-function sendNodeHeartbeat(nodeId){
+function sendNodeHeartbeat(nodeId) {
     const Http = new XMLHttpRequest();
-    const url='/nodes/nodeCheckIn/'+nodeId;
+    const url = '/nodes/nodeCheckIn/' + nodeId;
     Http.open("GET", url);
     Http.send();
 
     Http.onloadend = (e) => {
-    console.log(Http.responseText)
-    createToast(Http.responseText);
+        console.log(Http.responseText)
+        createToast(Http.responseText, { showNow: true });
     }
 }
 
-function joinServer(){
+function joinServer() {
     const preset = document.getElementById("selectRadioPreset").value;
     const nodeId = document.getElementById("nodeId").value;
     const clientId = document.getElementById("inputDiscordClientId").value;
@@ -118,7 +244,7 @@ function joinServer(){
     console.log(reqBody);
 
     const Http = new XMLHttpRequest();
-    const url='/admin/join';
+    const url = '/admin/join';
     Http.open("POST", url);
     Http.setRequestHeader("Content-Type", "application/json");
     Http.send(JSON.stringify(reqBody));
@@ -127,19 +253,19 @@ function joinServer(){
         const responseObject = JSON.parse(Http.responseText)
         console.log(Http.status);
         console.log(responseObject);
-        createToast(`${responseObject.name} will join shortly`);
+        createToast(`${responseObject.name} will join shortly`, { showNow: true });
         $("#joinModal").modal('toggle');
     }
 }
 
-function leaveServer(){
+function leaveServer() {
     const nodeId = document.getElementById("nodeId").value;
     const reqBody = {
         'nodeId': nodeId
     };
 
     const Http = new XMLHttpRequest();
-    const url='/admin/leave';
+    const url = '/admin/leave';
     Http.open("POST", url);
     Http.setRequestHeader("Content-Type", "application/json");
     Http.send(JSON.stringify(reqBody));
@@ -148,8 +274,7 @@ function leaveServer(){
         const responseObject = JSON.parse(Http.responseText)
         console.log(Http.status);
         console.log(responseObject);
-        createToast(`${responseObject} is leaving`);
-        setTimeout(() => {}, 45000);
+        createToast(`${responseObject} is leaving`, { showNow: true });
     }
 }
 
@@ -171,7 +296,7 @@ function saveNodeDetails() {
     console.log("Request Body: ", reqBody);
 
     const Http = new XMLHttpRequest();
-    const url='/nodes/'+nodeId;
+    const url = '/nodes/' + nodeId;
     Http.open("PUT", url);
     Http.setRequestHeader("Content-Type", "application/json");
     Http.send(JSON.stringify(reqBody));
@@ -181,15 +306,17 @@ function saveNodeDetails() {
         console.log(Http.status);
         console.log(responseObject);
         createToast(`Node Updated!`);
+        location.reload();
     }
 }
 
-function addNewSystem(systemName) {
+function addNewSystem() {
     const nodeId = document.getElementById("nodeId").value;
-    const systemMode = document.getElementById(`${systemName}_systemMode`).value;
-    const inputSystemFreqs = $(`[id^="${systemName}_systemFreq_"]`);
+    const systemName = document.getElementById(`New System_systemName`).value;
+    const systemMode = document.getElementById(`New System_systemMode`).value;
+    const inputSystemFreqs = $(`[id^="New System_systemFreq_"]`);
     let systemFreqs = [];
-    for (const inputFreq of inputSystemFreqs){        
+    for (const inputFreq of inputSystemFreqs) {
         systemFreqs.push(inputFreq.value);
     }
 
@@ -201,13 +328,13 @@ function addNewSystem(systemName) {
 
     console.log("Request Body: ", reqBody);
     const Http = new XMLHttpRequest();
-    const url='/nodes/'+nodeId+"/systems";
+    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)
+        const responseObject = Http.responseText
         console.log(Http.status);
         console.log(responseObject);
         createToast(`${systemName} Added!`);
@@ -218,9 +345,9 @@ function addNewSystem(systemName) {
 function updateSystem(systemName) {
     const nodeId = document.getElementById("nodeId").value;
     const systemMode = document.getElementById(`${systemName}_systemMode`).value;
-    const inputSystemFreqs = $(`[id^="${systemName}_systemFreq_"]`);    
+    const inputSystemFreqs = $(`[id^="${systemName}_systemFreq_"]`);
     let systemFreqs = [];
-    for (const inputFreq of inputSystemFreqs){        
+    for (const inputFreq of inputSystemFreqs) {
         systemFreqs.push(inputFreq.value);
     }
 
@@ -232,13 +359,13 @@ function updateSystem(systemName) {
 
     console.log("Request Body: ", reqBody);
     const Http = new XMLHttpRequest();
-    const url='/nodes/'+nodeId+"/systems";
+    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)
+        const responseObject = Http.responseText;
         console.log(Http.status);
         console.log(responseObject);
         createToast(`${systemName} Updated!`);
@@ -246,6 +373,28 @@ function updateSystem(systemName) {
     }
 }
 
+function removeSystem(systemName) {
+    const nodeId = document.getElementById("nodeId").value;
+
+    const reqBody = {
+        'systemName': systemName,
+    }
+
+    console.log("Request Body: ", reqBody);
+    const Http = new XMLHttpRequest();
+    const url = '/nodes/' + nodeId + "/systems";
+    Http.open("DELETE", url);
+    Http.setRequestHeader("Content-Type", "application/json");
+    Http.send(JSON.stringify(reqBody));
+    Http.onloadend = (e) => {
+        const responseObject = Http.responseText;
+        console.log(Http.status);
+        console.log(responseObject);
+        createToast(`${systemName} Removed!`);
+        location.reload();
+    }
+}
+
 function requestNodeUpdate() {
 
 }
diff --git a/Server/routes/nodes.js b/Server/routes/nodes.js
index 2ef23b4..a1fef18 100644
--- a/Server/routes/nodes.js
+++ b/Server/routes/nodes.js
@@ -18,6 +18,9 @@ router.post('/:nodeId/systems', nodesController.addNodeSystem);
 // Update a system on an existing node
 router.put('/:nodeId/systems', nodesController.updateNodeSystem);
 
+// Delete a system from an existing node
+router.delete('/:nodeId/systems', nodesController.removeNodeSystem);
+
 // TODO Need to authenticate this request
 /* POST a new node to the server
 *
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
index 45a7e28..e56ba5e 100644
--- a/Server/views/node.ejs
+++ b/Server/views/node.ejs
@@ -23,7 +23,7 @@
                     <!-- Checkin with client button  -->
                     <a type="button" class="btn btn-secondary" href="#" onclick="sendNodeHeartbeat('<%=node.id%>')">Check-in with Node</a>
                     <!-- Update Client button -->
-                    <a type="button" class="btn btn-warning" href="#" onclick="requestNodeUpdate('<%=node.id%>')">Update Node</a>
+                    <a type="button" class="btn btn-warning disabled" href="#" onclick="requestNodeUpdate('<%=node.id%>')">Update Node</a>
                 </div>
                 <hr>
                 <form>                    
@@ -107,7 +107,7 @@
                                                                 data-bs-target="#updateSystemModal_<%=system.replaceAll(" ", "_")%>">
                                                                 <i class="bi bi-pencil"></i>
                                                             </a>
-                                                            <a href="#" class="table-link text-danger label">
+                                                            <a class="table-link text-danger label" onclick="removeSystem('<%=system%>')">
                                                                 <i class="bi bi-trash"></i>
                                                             </a>
                                                         </td>
@@ -135,5 +135,4 @@
     <% // new System Modal %>
     <%- include("partials/modifySystemModal.ejs", {'system': "New System", 'frequencies': [], 'mode': ''}) %>
 <%- include('partials/bodyEnd.ejs') %>
-<script src="/res/js/node.js"></script>
 <%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/bodyEnd.ejs b/Server/views/partials/bodyEnd.ejs
index 992066b..d3cfd20 100644
--- a/Server/views/partials/bodyEnd.ejs
+++ b/Server/views/partials/bodyEnd.ejs
@@ -9,4 +9,6 @@
 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"
     integrity="sha512-3gJwYpMe3QewGELv8k/BX9vcqhryRdzRMxVfq6ngyWXwo03GFEzjsUm8Q7RZcHPHksttq7/GFoxjCVUjkjvPdw=="
-    crossorigin="anonymous" referrerpolicy="no-referrer"></script>
\ No newline at end of file
+    crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+
+<script src="/res/js/node.js"></script>
\ No newline at end of file
diff --git a/Server/views/partials/htmlHead.ejs b/Server/views/partials/htmlHead.ejs
index 9641f52..a1b1d37 100644
--- a/Server/views/partials/htmlHead.ejs
+++ b/Server/views/partials/htmlHead.ejs
@@ -1,7 +1,6 @@
 <!doctype html>
 <html lang="en" data-bs-theme="auto">
     <%- include('head.ejs') %>
-    <body>
-        <div class="toast-container mx-2" id="toastZone"></div>
+    <body>        
         <%- include('navbar.ejs') %>
         <%- include('sidebar.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/modifySystemModal.ejs b/Server/views/partials/modifySystemModal.ejs
index a609964..db00411 100644
--- a/Server/views/partials/modifySystemModal.ejs
+++ b/Server/views/partials/modifySystemModal.ejs
@@ -12,7 +12,7 @@
                         <form>
                             <div class="row gx-3 mb-3">
                                 <label class="small mb-1 fs-6" for="systemName">System Name</label>
-                                <input class="form-control" id="systemName" type="text" value="<%if (!system == "New System") {%><%= system %><%} else {%>Local Radio System<%}%>"></input>
+                                <input class="form-control" id="<%=system%>_systemName" type="text" value="<%if (!system == "New System") {%><%= system %><%} else {%>Local Radio System<%}%>"></input>
                             </div>
                             <div class="row gx-3 mb-3" id="frequencyRow_<%=system.replaceAll(" ", "_")%>">
                                 <label class="small mb-1 fs-6" for="systemFreq">Frequencies</label>
@@ -54,7 +54,7 @@
             </div>
             <div class="modal-footer">
                 <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" onclick="location.reload()">Close</button>
-                <button type="button" class="btn btn-primary" data-bs-dismiss="modal" <%if(!system == "New System") {%>onclick="updateSystem('<%=system%>')"<%} else {%>onclick="addNewSystem('<%=system%>')"<%}%>>Save changes</button>
+                <button type="button" class="btn btn-primary" <%if(!system == "New System") {%>onclick="updateSystem('<%=system%>')"<%} else {%>onclick="addNewSystem('<%=system%>')"<%}%>>Save changes</button>
             </div>
         </div>
     </div>
diff --git a/Server/views/partials/navbar.ejs b/Server/views/partials/navbar.ejs
index 204f863..b9816fc 100644
--- a/Server/views/partials/navbar.ejs
+++ b/Server/views/partials/navbar.ejs
@@ -28,10 +28,10 @@
                         <li><a class="dropdown-item" href="#">Something else here</a></li>
                     </ul>
                 </li>
-                <li class="nav-item">
-                    <a class="nav-link disabled">Disabled</a>
-                </li>
                 */%>
+                <li class="nav-item">
+                    <a class="nav-link" id="navbar-notification-bell" onclick="showStoredToasts()"><i class="bi bi-bell-fill"></i></a>
+                </li>                
             </ul>
             <form class="d-flex" role="search">
                 <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
diff --git a/Server/views/partials/sidebar.ejs b/Server/views/partials/sidebar.ejs
index fd51b50..e323e7d 100644
--- a/Server/views/partials/sidebar.ejs
+++ b/Server/views/partials/sidebar.ejs
@@ -1,4 +1,12 @@
 <div class="container-fluid mt-5">
+    <div aria-live="polite" aria-atomic="true" class="position-relative">
+        <!-- Position it: -->
+        <!-- - `.toast-container` for spacing between toasts -->
+        <!-- - `top-0` & `end-0` to position the toasts in the upper right corner -->
+        <!-- - `.p-3` to prevent the toasts from sticking to the edge of the container  -->
+        <div class="toast-container top-0 end-0 p-3 max" id="toastZone">    
+        </div>
+    </div> 
     <div class="row flex-nowrap">
         <div class="col-auto col-md-3 col-xl-2 px-sm-2 px-0 bg-dark sidebar-container">
             <div
@@ -34,6 +42,7 @@
                     </ul>
             </div>
             */%>
-        </div>
+        </div>        
     </div>
-    <div class="col py-3">
\ No newline at end of file
+    <div class="col py-3">
+    
\ No newline at end of file

From 598c802b28e8673dcf9f7e0739f30ef56224064b Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 01:29:47 -0400
Subject: [PATCH 21/57] Remove specific presets and left an example file if
 needed for clients

---
 Client/config/radioPresets.json         |  1 -
 Client/config/radioPresets.json.EXAMPLE | 18 ++++++++++++++++++
 2 files changed, 18 insertions(+), 1 deletion(-)
 delete mode 100644 Client/config/radioPresets.json
 create mode 100644 Client/config/radioPresets.json.EXAMPLE

diff --git a/Client/config/radioPresets.json b/Client/config/radioPresets.json
deleted file mode 100644
index b8f268a..0000000
--- a/Client/config/radioPresets.json
+++ /dev/null
@@ -1 +0,0 @@
-{"Westchester Cty. Simulcast":{"frequencies":[470575000,470375000,470525000,470575000,470550000],"mode":"p25","trunkFile":"trunk.tsv"},"coppies":{"frequencies":[154690000],"mode":"nbfm","trunkFile":"none"},"asdadadadasd":{"frequencies":[123321000],"mode":"nbfm","trunkFile":"none"}}
\ No newline at end of file
diff --git a/Client/config/radioPresets.json.EXAMPLE b/Client/config/radioPresets.json.EXAMPLE
new file mode 100644
index 0000000..d33fe51
--- /dev/null
+++ b/Client/config/radioPresets.json.EXAMPLE
@@ -0,0 +1,18 @@
+{
+    "Default P25 System Name": {
+        "frequencies": [
+            155344000,
+            155444000,
+            155555000
+        ],
+        "mode": "p25",
+        "trunkFile": "trunk.tsv"
+    },
+    "Default NBFM System": {
+        "frequencies": [
+            154690000
+        ],
+        "mode": "nbfm",
+        "trunkFile": "none"
+    }
+}
\ No newline at end of file

From e0bae665ed57273cdb04738fdaa2c4c7d3db840d Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 01:45:32 -0400
Subject: [PATCH 22/57] Fixed bug when editing node systems

- Name defaulted to new system name
---
 Server/views/partials/modifySystemModal.ejs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Server/views/partials/modifySystemModal.ejs b/Server/views/partials/modifySystemModal.ejs
index db00411..664a755 100644
--- a/Server/views/partials/modifySystemModal.ejs
+++ b/Server/views/partials/modifySystemModal.ejs
@@ -12,7 +12,7 @@
                         <form>
                             <div class="row gx-3 mb-3">
                                 <label class="small mb-1 fs-6" for="systemName">System Name</label>
-                                <input class="form-control" id="<%=system%>_systemName" type="text" value="<%if (!system == "New System") {%><%= system %><%} else {%>Local Radio System<%}%>"></input>
+                                <input class="form-control" id="<%=system%>_systemName" type="text" value="<%if (system != "New System") {%><%= system %><%} else {%>Local Radio System<%}%>"></input>
                             </div>
                             <div class="row gx-3 mb-3" id="frequencyRow_<%=system.replaceAll(" ", "_")%>">
                                 <label class="small mb-1 fs-6" for="systemFreq">Frequencies</label>

From 5dd27f0bed80204264861f405422d8f0e7182e79 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 01:46:19 -0400
Subject: [PATCH 23/57] Ignore local radio presets

---
 Client/.gitignore | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 Client/.gitignore

diff --git a/Client/.gitignore b/Client/.gitignore
new file mode 100644
index 0000000..c74a7af
--- /dev/null
+++ b/Client/.gitignore
@@ -0,0 +1 @@
+*radioPresets.json
\ No newline at end of file

From 62c05040286ce99b5516cd7e13dd674efccd9b09 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 01:47:09 -0400
Subject: [PATCH 24/57] Check if the presets exist when going to get them

- Return empty object if no preset file is found
---
 Client/utilities/updatePresets.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/Client/utilities/updatePresets.js b/Client/utilities/updatePresets.js
index 1e7bac6..21d6abd 100644
--- a/Client/utilities/updatePresets.js
+++ b/Client/utilities/updatePresets.js
@@ -17,7 +17,7 @@ function writePresets(presets, callback = undefined) {
         // Error checking
         if (err) throw err;
         log.DEBUG("Write Complete");
-        if (callback) callback()
+        if (callback) callback(); else return
     });
 }
 
@@ -71,8 +71,9 @@ function convertFrequencyToHertz(frequency){
  */
 exports.getPresets = function getPresets() {
     const presetDir = path.resolve("./config/radioPresets.json");
-    log.DEBUG(`Getting presets from directory: '${presetDir}'`);
-    return JSON.parse(fs.readFileSync(presetDir));
+    log.DEBUG(`Getting presets from directory: '${presetDir}'`);    
+    if (fs.existsSync(presetDir)) return JSON.parse(fs.readFileSync(presetDir));
+    else return {};
 }
 
 /**

From f5d58d45dae195a24abc8fa917f4838469c70b7b Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 03:27:39 -0400
Subject: [PATCH 25/57] Semi functional client webUI

- can update client info for sure
- Working on notifications now
---
 Client/controllers/clientController.js      |  60 ++-
 Client/public/res/css/main.css              | 183 +++++++++
 Client/public/res/js/node.js                | 400 ++++++++++++++++++++
 Client/public/stylesheets/style.css         |   8 -
 Client/routes/bot.js                        |   2 +
 Client/routes/client.js                     |  17 +-
 Client/routes/index.js                      |   6 +-
 Client/utilities/updateConfig.js            |  12 +-
 Client/views/index.ejs                      | 176 ++++++++-
 Client/views/partials/joinModal.ejs         |  44 +++
 Client/views/partials/modifySystemModal.ejs |  61 +++
 Client/views/partials/navbar.ejs            |  42 ++
 12 files changed, 964 insertions(+), 47 deletions(-)
 create mode 100644 Client/public/res/css/main.css
 create mode 100644 Client/public/res/js/node.js
 delete mode 100644 Client/public/stylesheets/style.css
 create mode 100644 Client/views/partials/joinModal.ejs
 create mode 100644 Client/views/partials/modifySystemModal.ejs
 create mode 100644 Client/views/partials/navbar.ejs

diff --git a/Client/controllers/clientController.js b/Client/controllers/clientController.js
index 7d1729e..c8812b4 100644
--- a/Client/controllers/clientController.js
+++ b/Client/controllers/clientController.js
@@ -5,7 +5,7 @@ const log = new DebugBuilder("client", "clientController");
 require('dotenv').config();
 const modes = require("../config/modes");
 // Modules
-const { executeAsyncConsoleCommand, BufferToJson } = require("../utilities/utilities");
+const { executeAsyncConsoleCommand, BufferToJson, nodeObject } = require("../utilities/utilities");
 // Utilities
 const { getFullConfig } = require("../utilities/configHandler");
 const { updateId, updateConfig, updateClientConfig } = require("../utilities/updateConfig");
@@ -22,11 +22,11 @@ var runningClientConfig = getFullConfig()
  * @returns {*}
  */
 function checkBodyForPresetFields(req, res, callback) {
-    if (!req.body?.systemName) return res.status(403).json({"message": "No system in the request"});
-    if (!req.body?.frequencies && Array.isArray(req.body.frequencies)) return res.status(403).json({"message": "No frequencies in the request or type is not an array"});
-    if (!req.body?.mode && typeof req.body.mode === "string") return res.status(403).json({"message": "No mode in the request"});
+    if (!req.body?.systemName) return res.status(403).json({ "message": "No system in the request" });
+    if (!req.body?.frequencies && Array.isArray(req.body.frequencies)) return res.status(403).json({ "message": "No frequencies in the request or type is not an array" });
+    if (!req.body?.mode && typeof req.body.mode === "string") return res.status(403).json({ "message": "No mode in the request" });
     if (!req.body?.trunkFile) {
-        if (modes.digitalModes.includes(req.body.mode)) return res.status(403).json({"message": "No trunk file in the request but digital mode specified. If you are not using a trunk file for this frequency make sure to specify 'none' for trunk file in the request"})
+        if (modes.digitalModes.includes(req.body.mode)) return res.status(403).json({ "message": "No trunk file in the request but digital mode specified. If you are not using a trunk file for this frequency make sure to specify 'none' for trunk file in the request" })
         // If there is a value keep it but if not, add nothing so the system can update that key (if needed)
         req.body.trunkFile = req.body.trunkFile ?? "none";
     }
@@ -34,7 +34,7 @@ function checkBodyForPresetFields(req, res, callback) {
     return callback();
 }
 
-async function checkLocalIP() {    
+async function checkLocalIP() {
     if (process.platform === "win32") {
         // Windows
         var networkConfig = await executeAsyncConsoleCommand("ipconfig");
@@ -72,21 +72,21 @@ exports.checkConfig = async function checkConfig() {
         await updateId(0);
         runningClientConfig.id = 0;
     }
-    
+
     if (!runningClientConfig.ip) {
         const ipAddr = await checkLocalIP();
         await updateConfig('CLIENT_IP', ipAddr);
         runningClientConfig.ip = ipAddr;
     }
 
-    if(!runningClientConfig.name) {
+    if (!runningClientConfig.name) {
         const lastOctet = await String(checkLocalIP()).spit('.')[-1];
         const name = `Radio-Node-${lastOctet}`;
         await updateConfig('CLIENT_NAME', name);
         runningClientConfig.name = name;
     }
 
-    if(!runningClientConfig.port) {
+    if (!runningClientConfig.port) {
         const port = 3010;
         await updateConfig('CLIENT_PORT', port);
         runningClientConfig.port = port;
@@ -104,11 +104,11 @@ exports.checkIn = async (update = false) => {
     let reqOptions;
     await this.checkConfig();
     // Check if there is an ID found, if not add the node to the server. If there was an ID, check in with the server to make sure it has the correct information
-    try {        
-        if (!runningClientConfig?.id || runningClientConfig.id == 0) {                        
+    try {
+        if (!runningClientConfig?.id || runningClientConfig.id == 0) {
             // ID was not found in the config, creating a new node
-            reqOptions = new requestOptions("/nodes/newNode", "POST");                
-            sendHttpRequest(reqOptions, JSON.stringify(runningClientConfig), async (responseObject) => {                
+            reqOptions = new requestOptions("/nodes/newNode", "POST");
+            sendHttpRequest(reqOptions, JSON.stringify(runningClientConfig), async (responseObject) => {
                 // Check if the server responded
                 if (!responseObject) {
                     log.WARN("Server did not respond to checkIn. Will wait 60 seconds then try again");
@@ -120,7 +120,7 @@ exports.checkIn = async (update = false) => {
                 }
 
                 // Update the client's ID if the server accepted its
-                if (responseObject.statusCode === 202) {                    
+                if (responseObject.statusCode === 202) {
                     runningClientConfig.id = responseObject.body.nodeId;
                     log.DEBUG("Response object from new node: ", responseObject, runningClientConfig);
                     await updateId(runningClientConfig.id);
@@ -131,7 +131,7 @@ exports.checkIn = async (update = false) => {
                     log.DEBUG("HTTP Error: ", responseObject, await BufferToJson(responseObject.body));
                     await onHttpError(responseObject.statusCode);
                 }
-                
+
             });
         }
         else {
@@ -149,15 +149,17 @@ exports.checkIn = async (update = false) => {
                     }, 60000);
                     return
                 }
-                
+
                 if (responseObject.statusCode === 202) {
                     log.DEBUG("Updated keys: ", responseObject.body.updatedKeys)
                     // Server accepted an update
                 }
                 if (responseObject.statusCode === 200) {
                     // Server accepted the response but there were no keys to be updated
-                    const tempUpdatedConfig = updateClientConfig(responseObject.body);
-                    if (!tempUpdatedConfig.length > 0) return;
+                    if (!update){
+                        const tempUpdatedConfig = updateClientConfig(responseObject.body);
+                        if (!tempUpdatedConfig.length > 0) return;
+                    }
                 }
                 if (responseObject.statusCode >= 300) {
                     // Server threw an error
@@ -179,6 +181,24 @@ exports.requestCheckIn = async (req, res) => {
     return res.sendStatus(200);
 }
 
+/**
+ * Express JS Wrapper for checking and updating client config
+ * @param {*} req 
+ * @param {*} res 
+ * @returns 
+ */
+exports.updateClientConfigWrapper = async (req, res) => {    
+    // Convert the online status to a boolean to be worked with
+    log.DEBUG("REQ Body: ", req.body);
+    const updatedKeys = await updateClientConfig(req.body);
+    if (updatedKeys) {
+        log.DEBUG("Keys have been updated, updating running config and checking in with the server: ", updatedKeys);
+        runningClientConfig = await getFullConfig();
+        await this.checkIn(true);
+    }
+    res.status(200).json(updatedKeys);
+}
+
 /** Controller for the /client/presets endpoint
  * This is the endpoint wrapper to get the presets object
  */
@@ -196,7 +216,7 @@ exports.updatePreset = async (req, res) => {
             runningClientConfig.nearbySystems = getPresets();
             this.checkIn(true);
             return res.sendStatus(200);
-        }, {frequencies: req.body.frequencies, mode: req.body.mode, trunkFile: req.body.trunkFile});
+        }, { frequencies: req.body.frequencies, mode: req.body.mode, trunkFile: req.body.trunkFile });
     })
 }
 
@@ -218,7 +238,7 @@ exports.addNewPreset = async (req, res) => {
  */
 exports.removePreset = async (req, res) => {
     checkBodyForPresetFields(req, res, () => {
-        if (!req.body.systemName) return res.status("500").json({"message": "You must specify a system name to delete, this must match exactly to how the system name is saved."})
+        if (!req.body.systemName) return res.status("500").json({ "message": "You must specify a system name to delete, this must match exactly to how the system name is saved." })
         removePreset(req.body.systemName, () => {
             runningClientConfig.nearbySystems = getPresets();
             this.checkIn(true);
diff --git a/Client/public/res/css/main.css b/Client/public/res/css/main.css
new file mode 100644
index 0000000..5c44612
--- /dev/null
+++ b/Client/public/res/css/main.css
@@ -0,0 +1,183 @@
+.node-card {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    min-width: 0;
+    word-wrap: break-word;
+    background-color: #fff;
+    background-clip: border-box;
+    border: 1px solid #eff0f2;
+    border-radius: 1rem;
+    margin-bottom: 24px;
+    box-shadow: 0 2px 3px #e4e8f0;
+}
+
+.avatar-md {
+    height: 4rem;
+    width: 4rem;
+}
+
+.rounded-circle {
+    border-radius: 50% !important;
+}
+
+.img-thumbnail {
+    padding: 0.25rem;
+    background-color: #f1f3f7;
+    border: 1px solid #eff0f2;
+    border-radius: 0.75rem;
+}
+
+.avatar-title {
+    align-items: center;
+    background-color: #3b76e1;
+    color: #fff;
+    display: flex;
+    font-weight: 500;
+    height: 100%;
+    justify-content: center;
+    width: 100%;
+}
+
+.bg-soft-primary {
+    background-color: rgba(59, 118, 225, .25) !important;
+}
+
+a {
+    text-decoration: none !important;
+}
+
+.badge-soft-danger {
+    color: #f56e6e !important;
+    background-color: rgba(245, 110, 110, .1);
+}
+
+.badge-soft-success {
+    color: #63ad6f !important;
+    background-color: rgba(99, 173, 111, .1);
+}
+
+.mb-0 {
+    margin-bottom: 0 !important;
+}
+
+.badge {
+    display: inline-block;
+    padding: 0.25em 0.6em;
+    font-size: 75%;
+    font-weight: 500;
+    line-height: 1;
+    color: #fff;
+    text-align: center;
+    white-space: nowrap;
+    vertical-align: baseline;
+    border-radius: 0.75rem;
+}
+
+/* Info Card Section */
+.info-card {
+    background-color: #fff;
+    border-radius: 10px;
+    border: none;
+    position: relative;
+    margin-bottom: 30px;
+    box-shadow: 0 0.46875rem 2.1875rem rgba(90, 97, 105, 0.1), 0 0.9375rem 1.40625rem rgba(90, 97, 105, 0.1), 0 0.25rem 0.53125rem rgba(90, 97, 105, 0.12), 0 0.125rem 0.1875rem rgba(90, 97, 105, 0.1);
+}
+
+.info-card .card-statistic .card-icon-large .bi {
+    font-size: 110px;
+}
+
+.info-card .card-statistic .card-icon {
+    text-align: center;
+    line-height: 50px;
+    margin-left: 15px;
+    color: #000;
+    position: absolute;
+    right: -5px;
+    top: 20px;
+    opacity: 0.1;
+}
+
+/* Info Card Background Colors */
+
+.l-bg-cherry {
+    background: linear-gradient(to right, #493240, #f09) !important;
+    color: #fff;
+}
+
+.l-bg-blue-dark {
+    background: linear-gradient(to right, #373b44, #4286f4) !important;
+    color: #fff;
+}
+
+.l-bg-green-dark {
+    background: linear-gradient(to right, #0a504a, #38ef7d) !important;
+    color: #fff;
+}
+
+.l-bg-orange-dark {
+    background: linear-gradient(to right, #a86008, #ffba56) !important;
+    color: #fff;
+}
+
+.l-bg-cyan {
+    background: linear-gradient(135deg, #289cf5, #84c0ec) !important;
+    color: #fff;
+}
+
+.l-bg-green {
+    background: linear-gradient(135deg, #23bdb8 0%, #43e794 100%) !important;
+    color: #fff;
+}
+
+.l-bg-orange {
+    background: linear-gradient(to right, #f9900e, #ffba56) !important;
+    color: #fff;
+}
+
+/* Global Section */
+.sidebar-container {
+    min-height: 95vh;
+}
+
+.sidebar { 
+    position: fixed; 
+    top: 5vh; 
+    bottom: 0;
+    left: 0;
+ }
+
+/* User table section */
+
+.label {
+    border-radius: 3px;
+    font-size: 1.1em;
+    font-weight: 600;
+}
+
+.user-list tbody td .user-subhead {
+    font-size: 1em;
+    font-style: italic;
+}
+
+.table thead tr th {
+    text-transform: uppercase;
+    font-size: 0.875em;
+}
+
+.table thead tr th {
+    border-bottom: 2px solid #e7ebee;
+}
+
+.table tbody tr td:first-child {
+    font-size: 1.125em;
+    font-weight: 300;
+}
+
+.table tbody tr td {
+    font-size: 0.875em;
+    vertical-align: middle;
+    border-top: 1px solid #e7ebee;
+    padding: 12px 8px;
+}
diff --git a/Client/public/res/js/node.js b/Client/public/res/js/node.js
new file mode 100644
index 0000000..dd2cf94
--- /dev/null
+++ b/Client/public/res/js/node.js
@@ -0,0 +1,400 @@
+$(document).ready(async () => {
+    console.log("Loading stored notifications...");
+    await loadStoredToasts();
+    console.log("Showing stored notifications...");
+    await showStoredToasts();
+});
+
+/**
+ * Gets all toasts stored in local storage
+ * 
+ * @returns {Object} Object of toasts in storage
+ */
+function getStoredToasts() {
+    if (localStorage.getItem("toasts")) {
+        const storedToasts = JSON.parse(localStorage.getItem("toasts"));
+        console.log("LOADED STORED TOASTS: ", storedToasts);
+        navbarUpdateNotificationBellCount(storedToasts);
+        return storedToasts;
+    }
+    else return false
+}
+
+/**
+ * Adds a toast to storage, will not allow duplicates
+ * 
+ * @param {Date} time The date object from when the toast was created
+ * @param {*} message The message of the toast
+ */
+function addToastToStorage(time, message) {
+    var toasts = [{ 'time': time, 'message': message }]
+    var storedToasts = getStoredToasts();
+    console.log("Adding new notification to storage: ", toasts);
+    toasts = toasts.concat(storedToasts);
+    console.log("Combined new and stored notifications: ", toasts);
+    toasts = toasts.filter((value, index, self) =>
+        index === self.findIndex((t) => (
+            t.time === value.time && t.message === value.message
+        ))
+    )
+    console.log("Deduped stored notifications: ", toasts);
+    localStorage.setItem("toasts", JSON.stringify(toasts));
+    navbarUpdateNotificationBellCount(toasts);
+}
+
+/**
+ * Removes a toast from the local storage
+ * 
+ * @param {Date} time The date object from when the toast was created
+ * @param {*} message The message of the toast
+ */
+function removeToastFromStorage(time, message) {
+    const toastToRemove = { 'time': time, 'message': message }
+    console.log("Toast to remove: ", toastToRemove);
+    var toasts = getStoredToasts();
+    console.log("Stored toasts: ", toasts);
+    if (toasts.indexOf(toastToRemove)) toasts.splice(toasts.indexOf(toastToRemove) - 1, 1)
+    console.log("Toasts with selected toast removed: ", toasts);
+    localStorage.setItem("toasts", JSON.stringify(toasts));
+    navbarUpdateNotificationBellCount(toasts);
+}
+
+/**
+ * Shows all stored toasts
+ */
+function showStoredToasts() {
+    const storedToasts = getStoredToasts();
+    if (!storedToasts) return
+    console.log("Loaded stored notifications to show: ", storedToasts);
+    for (const toast of storedToasts) {
+        const toastId = `${toast.time}-toast`;
+        console.log("Showing stored toast: ", toast, toastId);
+        const toastElement = bootstrap.Toast.getOrCreateInstance(document.getElementById(toastId));
+        toastElement.show();
+    }
+}
+
+/**
+ * Loads all toasts stored in the local storage into the DOM of the webpage
+ */
+function loadStoredToasts() {
+    const storedToasts = getStoredToasts();
+    if (!storedToasts) return
+    console.log("Loaded stored notifications: ", storedToasts);
+    for (const toast of storedToasts) {
+        createToast(toast.message, { time: toast.time })
+    }
+}
+
+/**
+ * Will update the count of notifications on the bell icon in the navbar
+ * 
+ * @param {Array} storedToasts An array of stored toasts to be counted and updated in the navbar
+ */
+function navbarUpdateNotificationBellCount(storedToasts) {
+    const notificationBellIcon = document.getElementById("navbar-notification-bell");
+    var notificationBellCount = document.getElementById("notification-bell-icon-count");
+    if (!notificationBellCount) {
+        notificationBellCount = document.createElement('span');
+        notificationBellCount.id = "notification-bell-icon-count";
+        notificationBellCount.classList.add('badge');
+        notificationBellCount.classList.add('text-bg-secondary');
+        notificationBellCount.appendChild(document.createTextNode(storedToasts.length));
+    }
+    else notificationBellCount.innerHTML = storedToasts.length;
+
+    notificationBellIcon.appendChild(notificationBellCount);
+}
+
+/**
+ * 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);
+}
+
+/**
+ * Add a toast element to the DOM
+ * 
+ * @param {*} notificationMessage The message of the notification 
+ * @param {Date} param1.time The date object for when the toast was created, blank if creating new
+ * @param {boolean} param1.showNow Show the toast now or just store it
+ * @returns 
+ */
+function createToast(notificationMessage, { time = undefined, showNow = false } = {}) {
+    if (!time) time = new Date(Date.now());
+    else time = new Date(Date.parse(time));
+    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(time.toLocaleString()));
+
+    const toastClose = document.createElement('button');
+    toastClose.type = 'button';
+    toastClose.classList.add('btn-close');
+    toastClose.ariaLabel = 'Close';
+    toastClose.setAttribute('data-bs-dismiss', 'toast');
+    toastClose.onclick = () => { removeToastFromStorage(time.toISOString(), notificationMessage); };
+
+    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.classList.add('position-fixed');
+    wrapperDiv.id = `${time.toISOString()}-toast`;
+    wrapperDiv.role = 'alert';
+    wrapperDiv.ariaLive = 'assertive';
+    wrapperDiv.ariaAtomic = true;
+    wrapperDiv.setAttribute('data-bs-delay', "7500");
+    wrapperDiv.setAttribute('data-bs-animation', true);
+    wrapperDiv.appendChild(toastHeader);
+    wrapperDiv.appendChild(toastMessage);
+
+    document.getElementById("toastZone").appendChild(wrapperDiv);
+    addToastToStorage(time.toISOString(), notificationMessage);
+    if (showNow) {
+        const toastElement = bootstrap.Toast.getOrCreateInstance(document.getElementById(`${time.toISOString()}-toast`));
+        toastElement.show();
+    }
+
+    return;
+}
+
+function sendNodeHeartbeat(nodeId) {
+    const Http = new XMLHttpRequest();
+    const url = '/client/requestCheckIn' + nodeId;
+    Http.open("GET", url);
+    Http.send();
+
+    Http.onloadend = (e) => {
+        console.log(Http.responseText)
+        createToast(Http.responseText, { showNow: true });
+    }
+}
+
+function joinServer() {
+    const preset = document.getElementById("selectRadioPreset").value;
+    const clientId = document.getElementById("inputDiscordClientId").value;
+    const channelId = document.getElementById("inputDiscordChannelId").value;
+
+    const reqBody = {
+        'preset': preset,
+        'clientId': clientId,
+        'channelId': channelId
+    };
+
+    console.log(reqBody);
+
+    const Http = new XMLHttpRequest();
+    const url = '/bot/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`, { showNow: true });
+        $("#joinModal").modal('toggle');
+    }
+}
+
+function leaveServer() {
+    const reqBody = {};
+
+    const Http = new XMLHttpRequest();
+    const url = '/bot/leave';
+    Http.open("POST", url);
+    Http.setRequestHeader("Content-Type", "application/json");
+    Http.send(JSON.stringify(reqBody));
+
+    Http.onloadend = (e) => {
+        const responseObject = Http.responseText;
+        console.log(Http.status);
+        console.log(responseObject);
+        createToast(`${responseObject} is leaving`, { showNow: true });
+    }
+}
+
+function saveNodeDetails() {
+    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 = {
+        'name': nodeName,
+        'ip': nodeIp,
+        'port': nodePort,
+        'location': nodeLocation
+    }
+
+    console.log("Request Body: ", reqBody);
+
+    const Http = new XMLHttpRequest();
+    const url = '/client';
+    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!`);
+        location.reload();
+    }
+}
+
+function addNewSystem() {
+    const nodeId = document.getElementById("nodeId").value;
+    const systemName = document.getElementById(`New System_systemName`).value;
+    const systemMode = document.getElementById(`New System_systemMode`).value;
+    const inputSystemFreqs = $(`[id^="New System_systemFreq_"]`);
+    let systemFreqs = [];
+    for (const inputFreq of inputSystemFreqs) {
+        systemFreqs.push(inputFreq.value);
+    }
+
+    const reqBody = {
+        'systemName': systemName,
+        'mode': systemMode,
+        'frequencies': systemFreqs
+    }
+    if (reqBody.mode == "p25") reqBody.trunkFile = 'none';
+
+    console.log("Request Body: ", reqBody);
+    const Http = new XMLHttpRequest();
+    const url = "/client/addPreset";
+    Http.open("POST", url);
+    Http.setRequestHeader("Content-Type", "application/json");
+    Http.send(JSON.stringify(reqBody));
+
+    Http.onloadend = (e) => {
+        const responseObject = 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
+    }
+    if (reqBody.mode == "p25") reqBody.trunkFile = 'none';
+
+    console.log("Request Body: ", reqBody);
+    const Http = new XMLHttpRequest();
+    const url = "/client/updatePreset";
+    Http.open("POST", url);
+    Http.setRequestHeader("Content-Type", "application/json");
+    Http.send(JSON.stringify(reqBody));
+
+    Http.onloadend = (e) => {
+        const responseObject = Http.responseText;
+        console.log(Http.status);
+        console.log(responseObject);
+        createToast(`${systemName} Updated!`);
+        location.reload();
+    }
+}
+
+function removeSystem(systemName) {
+    const nodeId = document.getElementById("nodeId").value;
+
+    const reqBody = {
+        'systemName': systemName,
+    }
+
+    console.log("Request Body: ", reqBody);
+    const Http = new XMLHttpRequest();
+    const url = '/client/removePreset';
+    Http.open("POST", url);
+    Http.setRequestHeader("Content-Type", "application/json");
+    Http.send(JSON.stringify(reqBody));
+    Http.onloadend = (e) => {
+        const responseObject = Http.responseText;
+        console.log(Http.status);
+        console.log(responseObject);
+        createToast(`${systemName} Removed!`);
+        location.reload();
+    }
+}
+
+function requestNodeUpdate() {
+
+}
+
+function removeFrequencyInput(elementId) {
+    const element = document.getElementById(elementId);
+    element.remove();
+}
\ No newline at end of file
diff --git a/Client/public/stylesheets/style.css b/Client/public/stylesheets/style.css
deleted file mode 100644
index 9453385..0000000
--- a/Client/public/stylesheets/style.css
+++ /dev/null
@@ -1,8 +0,0 @@
-body {
-  padding: 50px;
-  font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
-}
-
-a {
-  color: #00B7FF;
-}
diff --git a/Client/routes/bot.js b/Client/routes/bot.js
index 805f8a1..3af6afa 100644
--- a/Client/routes/bot.js
+++ b/Client/routes/bot.js
@@ -15,7 +15,9 @@ router.get('/status', botController.getStatus);
 *
 * @param req The request sent from the master
 * @param req.body.channelId The channel ID to join
+* @param req.body.clientId The discord Client ID to use when connecting to the server
 * @param req.body.presetName The name of the preset to start listening to
+* @param req.body.NGThreshold [OPTIONAL] The noisegate threshold, this will default to 50 
  */
 router.post('/join', botController.joinServer);
 
diff --git a/Client/routes/client.js b/Client/routes/client.js
index c3a7ed0..36d6bd5 100644
--- a/Client/routes/client.js
+++ b/Client/routes/client.js
@@ -2,7 +2,7 @@
 const express = require('express');
 const router = express.Router();
 // Controllers
-const { requestCheckIn, getPresets, updatePreset, addNewPreset, removePreset, updateClient } = require("../controllers/clientController");
+const { requestCheckIn, getPresets, updatePreset, addNewPreset, removePreset, updateClient, updateClientConfigWrapper } = require("../controllers/clientController");
 
 /** GET Request a check in from the client
  * Queue the client to check in with the server
@@ -11,16 +11,21 @@ const { requestCheckIn, getPresets, updatePreset, addNewPreset, removePreset, up
  */
 router.get('/requestCheckIn', requestCheckIn);
 
-/** GET Object of all known presets
- * Query the client to get all the known presets
- */
-router.put('/', );
-
 /** GET Object of all known presets
  * Query the client to get all the known presets
  */
 router.get('/presets', getPresets);
 
+/**
+ * PUT An update to the running client config (not radio config)
+ * @param {number} req.body.id The ID given to the node to update 
+ * @param {string} req.body.name The name of the node
+ * @param {string} req.body.ip The IP the server can contact the node on
+ * @param {number} req.body.port The port the server can contact the node on 
+ * @param {string} req.body.location The physical location of the node
+ */
+router.put('/', updateClientConfigWrapper);
+
 /** POST Update to preset
  *
  * @param req The request sent from the master
diff --git a/Client/routes/index.js b/Client/routes/index.js
index ecca96a..bf776f0 100644
--- a/Client/routes/index.js
+++ b/Client/routes/index.js
@@ -1,9 +1,11 @@
 var express = require('express');
 var router = express.Router();
+const { getFullConfig } = require('../utilities/configHandler');
 
 /* GET home page. */
-router.get('/', function(req, res, next) {
-  res.render('index', { title: 'Express' });
+router.get('/', async function(req, res, next) {
+  const clientConfig = await getFullConfig();
+  res.render('index', { 'node': clientConfig });
 });
 
 module.exports = router;
diff --git a/Client/utilities/updateConfig.js b/Client/utilities/updateConfig.js
index 250d90c..9e90ba8 100644
--- a/Client/utilities/updateConfig.js
+++ b/Client/utilities/updateConfig.js
@@ -27,7 +27,12 @@ exports.updateId = (updatedId) => {
 /**
  * Wrapper to update any or all keys in the client config
  * 
- * @param {*} configObject Object with what keys you wish to update (node object format, will be converted)
+ * @param {Object} configObject Object with what keys you wish to update (node object format, will be converted)
+ * @param {number} configObject.id The ID given to the node to update 
+ * @param {string} configObject.name The name of the node
+ * @param {string} configObject.ip The IP the server can contact the node on
+ * @param {number} configObject.port The port the server can contact the node on 
+ * @param {string} configObject.location The physical location of the node
  * @returns 
  */
 exports.updateClientConfig = (configObject) => { 
@@ -39,6 +44,7 @@ exports.updateClientConfig = (configObject) => {
         if (runningConfig.id != configObject.id) {
             this.updateConfig('CLIENT_ID', configObject.id);
             updatedKeys.push({'CLIENT_ID': configObject.id});
+            process.env.CLIENT_ID = configObject.id;
             log.DEBUG("Updated ID to: ", configObject.id);
         }        
     }
@@ -46,6 +52,7 @@ exports.updateClientConfig = (configObject) => {
         if (runningConfig.name != configObject.name) {
             this.updateConfig('CLIENT_NAME', configObject.name);
             updatedKeys.push({'CLIENT_NAME': configObject.name});
+            process.env.CLIENT_NAME = configObject.name;
             log.DEBUG("Updated name to: ", configObject.name);
         }
     }
@@ -53,6 +60,7 @@ exports.updateClientConfig = (configObject) => {
         if (runningConfig.ip != configObject.ip) {
             this.updateConfig('CLIENT_IP', configObject.ip);
             updatedKeys.push({'CLIENT_IP': configObject.ip});
+            process.env.CLIENT_IP = configObject.ip;
             log.DEBUG("Updated ip to: ", configObject.ip);
         }
     }
@@ -60,6 +68,7 @@ exports.updateClientConfig = (configObject) => {
         if (runningConfig.port != configObject.port) {
             this.updateConfig('CLIENT_PORT', configObject.port);
             updatedKeys.push({'CLIENT_PORT': configObject.port});
+            process.env.CLIENT_PORT = configObject.port;
             log.DEBUG("Updated port to: ", configObject.port);
         }
     }
@@ -67,6 +76,7 @@ exports.updateClientConfig = (configObject) => {
         if (runningConfig.location != configObject.location) {
             this.updateConfig('CLIENT_LOCATION', configObject.location);
             updatedKeys.push({'CLIENT_LOCATION': configObject.location});
+            process.env.CLIENT_LOCATION = configObject.location;
             log.DEBUG("Updated location to: ", configObject.location);
         }
     }
diff --git a/Client/views/index.ejs b/Client/views/index.ejs
index 7b7a1d6..11a4460 100644
--- a/Client/views/index.ejs
+++ b/Client/views/index.ejs
@@ -1,11 +1,167 @@
 <!DOCTYPE html>
-<html>
-  <head>
-    <title><%= title %></title>
-    <link rel='stylesheet' href='/stylesheets/style.css' />
-  </head>
-  <body>
-    <h1><%= title %></h1>
-    <p>Welcome to <%= title %></p>
-  </body>
-</html>
+<html lang="en" data-bs-theme="auto">
+
+<head>
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Bootstrap demo</title>
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"
+    integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css">
+  <link rel="stylesheet" href="/res/css/main.css">
+</head>
+
+<body>
+  <%- include('partials/navbar.ejs') %>
+    <div aria-live="polite" aria-atomic="true" class="position-relative">
+      <!-- Position it: -->
+      <!-- - `.toast-container` for spacing between toasts -->
+      <!-- - `top-0` & `end-0` to position the toasts in the upper right corner -->
+      <!-- - `.p-3` to prevent the toasts from sticking to the edge of the container  -->
+      <div class="toast-container top-0 end-0 p-3 max" id="toastZone">
+      </div>
+    </div>
+    <div class="container">
+      <div class="card mb-4">
+        <div class="card-header">
+          <p>
+            <span class="fs-2 fw-semibold">
+              Node Details
+            </span>
+          </p>
+        </div>
+        <div class="card-body">
+          <div class="col-md-12 pt-2">
+            <label class="small mb-1" for="nodeStatus">Online Status:</label>
+            <span class="badge badge-soft-success mb-0 align-middle fs-6" id="nodeStatus">Online</span>
+
+            <br>
+            <div class="py-2"></div>
+            <!-- Join Server button-->
+            <a type="button" class="btn btn-info text-white" data-bs-toggle="modal" data-bs-target="#joinModal"
+              href="#">Join Server</a>
+            <!-- Leave Server button  -->
+            <a type="button" class="btn btn-danger" href="#" onclick="leaveServer()">Leave Server</a>
+            <!-- Checkin with client button  -->
+            <a type="button" class="btn btn-secondary" href="#" onclick="sendNodeHeartbeat('<%=node.id%>')">Check-in
+              with Node</a>
+            <!-- Update Client button -->
+            <a type="button" class="btn btn-warning disabled" href="#"
+              onclick="requestNodeUpdate('<%=node.id%>')">Update Node</a>
+          </div>
+          <hr>
+          <form>
+            <div class="row gx-3 mb-3">
+              <div class="col-md-6">
+                <label class="small mb-1" for="nodeId">Node ID (this is the assigned Node ID and cannot be
+                  changed)</label>
+                <input class="form-control" id="nodeId" type="text" value="<%=node.id%>" disabled></input>
+              </div>
+            </div>
+
+            <div class="row gx-3 mb-3">
+              <div class="col-md-12">
+                <label class="small mb-1" for="inputNodeName">Node Name:</label>
+                <input class="form-control" id="inputNodeName" type="text" value="<%=node.name%>"></input>
+              </div>
+            </div>
+            <div class="row gx-3 mb-3">
+              <div class="col-md-4">
+                <label class="small mb-1" for="inputNodeIp">Node IP Address (that the server can
+                  contact):</label>
+                <input class="form-control" id="inputNodeIp" type="text" value="<%=node.ip%>"></input>
+              </div>
+              <div class="col-md-2">
+                <label class="small mb-1" for="inputOrgName">Node Port (with the API):</label>
+                <input class="form-control" id="inputOrgName" type="number" value="<%=node.port%>"></input>
+              </div>
+            </div>
+            <div class="mb-3">
+              <label class="small mb-1" for="inputNodeLocation">Node Location (physical location):</label>
+              <input class="form-control" id="inputNodeLocation" type="location" value="<%=node.location%>"></input>
+            </div>
+            <h4>
+              Nearby Systems
+            </h4>
+            <hr>
+            <div class="row">
+              <div class="col-lg-12">
+                <div class="main-box no-header clearfix">
+                  <div class="main-box-body clearfix">
+                    <div class="table-responsive">
+                      <table class="table user-list <% if(!node.online) { %>disabled<% } %>">
+                        <thead>
+                          <tr>
+                            <th><span>System Name</span></th>
+                            <th><span>Frequencies</span></th>
+                            <th><span>Protocol</span></th>
+                            <th>&nbsp;</th>
+                          </tr>
+                        </thead>
+                        <tbody>
+                          <% for(const system in node.nearbySystems){ %>
+                            <tr>
+                              <td>
+                                <%= system %>
+                              </td>
+                              <td>
+                                <% if(node.nearbySystems[system].frequencies.length> 1) { %>
+                                  <ul>
+                                    <% for(const frequency of node.nearbySystems[system].frequencies) { %>
+                                      <li>
+                                        <%=frequency%> MHz
+                                      </li>
+                                      <% } %>
+                                  </ul>
+                                  <% } else { const frequency=node.nearbySystems[system].frequencies[0] %>
+                                    <%=frequency%> MHz
+                                      <% } %>
+                              </td>
+                              <td>
+                                <span class="label label-default text-uppercase">
+                                  <%= node.nearbySystems[system].mode %>
+                                </span>
+                              </td>
+                              <td>
+                                <a href="#" class="table-link text-info label" data-bs-toggle="modal"
+                                  data-bs-target="#updateSystemModal_<%=system.replaceAll(" ", " _")%>">
+                                  <i class="bi bi-pencil"></i>
+                                </a>
+                                <a class="table-link text-danger label" onclick="removeSystem('<%=system%>')">
+                                  <i class="bi bi-trash"></i>
+                                </a>
+                              </td>
+                            </tr>
+                            <% // Update system modal %>
+                              <%- include("partials/modifySystemModal.ejs", {'system': system, 'frequencies' :
+                                node.nearbySystems[system].frequencies, 'mode' : node.nearbySystems[system].mode}) %>
+                                <% } %>
+                        </tbody>
+                      </table>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <!-- Save changes button-->
+            <button class="btn btn-primary" type="button" onclick="saveNodeDetails()">Save changes</button>
+            <!-- Button trigger modal -->
+            <button type="button" class="btn btn-primary float-right" data-bs-toggle="modal"
+              data-bs-target="#updateSystemModal_New_System">Add New System</button>
+          </form>
+        </div>
+      </div>
+    </div>
+
+    <% // new System Modal %>
+      <%- include("partials/modifySystemModal.ejs", {'system': "New System" , 'frequencies' : [], 'mode' : '' }) %>
+</body>
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"
+  integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz" crossorigin="anonymous"></script>
+
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"
+  integrity="sha512-3gJwYpMe3QewGELv8k/BX9vcqhryRdzRMxVfq6ngyWXwo03GFEzjsUm8Q7RZcHPHksttq7/GFoxjCVUjkjvPdw=="
+  crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+
+<script src="/res/js/node.js"></script>
+
+</html>
\ No newline at end of file
diff --git a/Client/views/partials/joinModal.ejs b/Client/views/partials/joinModal.ejs
new file mode 100644
index 0000000..d912911
--- /dev/null
+++ b/Client/views/partials/joinModal.ejs
@@ -0,0 +1,44 @@
+<div class="modal fade" id="joinModal" tabindex="-1" aria-labelledby="joinModal" aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h1 class="modal-title fs-5" id="joinModal">Join Node <%=node.id%> to a Discord Server</h1>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <div class="container">
+                    <div class="card mb-4">
+                        <div class="card-body">
+                            <form>                                
+                                <div class="row gx-3 mb-3">
+                                    <div class="col-md-12">
+                                        <label class="small mb-1" for="inputDiscordClientId">Discord Client ID:</label>
+                                        <input class="form-control" id="inputDiscordClientId" type="text" value="" required></input>
+                                    </div>
+                                </div>
+                                <div class="row gx-3 mb-3">
+                                    <div class="col-md-6">
+                                        <label class="small mb-1" for="inputDiscordChannelId">Discord Channel ID:</label>
+                                        <input class="form-control" id="inputDiscordChannelId" type="text" value="" required></input>
+                                    </div>
+                                    <div class="col-md-6">
+                                        <label class="small mb-1" for="selectRadioPreset">Selected Preset:</label>
+                                        <select class="custom-select" id="selectRadioPreset">
+                                            <% for(const system in nearbySystems) { %>                                                                                                
+                                                <option value="<%=system%>"><%=system%></option>
+                                            <% } %>
+                                        </select>
+                                    </div>
+                                </div>
+                            </form>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
+                <button type="button" class="btn btn-primary" onclick="joinServer()">Join</button>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/Client/views/partials/modifySystemModal.ejs b/Client/views/partials/modifySystemModal.ejs
new file mode 100644
index 0000000..664a755
--- /dev/null
+++ b/Client/views/partials/modifySystemModal.ejs
@@ -0,0 +1,61 @@
+<div class="modal fade" id="updateSystemModal_<%=system.replaceAll(" ", "_")%>" tabindex="-1" aria-labelledby="updateSystemModal_<%=system.replaceAll(" ", "_")%>"
+    aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
+    <div class="modal-dialog modal-dialog-centered">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h1 class="modal-title fs-5" id="updateSystemModal_<%=system.replaceAll(" ", "_")%>"><%if (!system == "New System") {%>Update<%} else {%>Add a<%}%> <%=system%></h1>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <div class="card mb-4">
+                    <div class="card-body">
+                        <form>
+                            <div class="row gx-3 mb-3">
+                                <label class="small mb-1 fs-6" for="systemName">System Name</label>
+                                <input class="form-control" id="<%=system%>_systemName" type="text" value="<%if (system != "New System") {%><%= system %><%} else {%>Local Radio System<%}%>"></input>
+                            </div>
+                            <div class="row gx-3 mb-3" id="frequencyRow_<%=system.replaceAll(" ", "_")%>">
+                                <label class="small mb-1 fs-6" for="systemFreq">Frequencies</label>
+                                <% for(const frequency of frequencies) { %>
+                                <div class="col-md-6 mb-1" id="<%=system%>_systemFreqRow_<%=frequency%>">
+                                    <div class="row px-1">
+                                        <div class="col-10">
+                                            <input class="form-control" id="<%=system%>_systemFreq_<%=frequency%>" type="text" value="<%= frequency %>"></input>
+                                        </div>
+                                        <div class="col-2">
+                                            <a class="align-middle float-left" href="#" onclick="removeFrequencyInput('<%=system%>_systemFreqRow_<%=frequency%>')"><i class="bi bi-x-circle text-black"></i></a>
+                                        </div>
+                                    </div>                                                                                        
+                                </div>
+                                <% } %>                                                                                    
+                            </div>
+                            <button type="button" class="btn btn-info text-white" onclick="addFrequencyInput('<%=system%>')">Add Frequency</button>
+                            <hr>                                                                    
+                            <div class="row gx-3 mb-3">
+                                <div class="col-md-6">
+                                    <label class="small mb-1 fs-6" for="<%=system%>_systemMode">Mode</label>
+                                    <br>
+                                    <select class="custom-select" id="<%=system%>_systemMode">
+                                        <option value="<%= mode ?? 'select' %>" selected><span class="text-uppercase"><%= mode ?? 'Select' %></span></option>
+                                        <% if(mode == "p25") { %>                                                                                                
+                                            <option value="nbfm">NBFM</option>
+                                        <% } else if (mode == "nbfm") { %>
+                                            <option value="p25">P25</option>
+                                        <% } else { %>
+                                            <option value="nbfm">NBFM</option>
+                                            <option value="p25">P25</option>
+                                            <%}%>
+                                    </select>
+                                </div>
+                            </div>
+                        </form>
+                    </div>
+                </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" onclick="location.reload()">Close</button>
+                <button type="button" class="btn btn-primary" <%if(!system == "New System") {%>onclick="updateSystem('<%=system%>')"<%} else {%>onclick="addNewSystem('<%=system%>')"<%}%>>Save changes</button>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/Client/views/partials/navbar.ejs b/Client/views/partials/navbar.ejs
new file mode 100644
index 0000000..b9816fc
--- /dev/null
+++ b/Client/views/partials/navbar.ejs
@@ -0,0 +1,42 @@
+<nav class="navbar fixed-top navbar-expand-lg bg-body-tertiary" data-bs-theme="dark">
+    <div class="container-fluid">
+        <a class="navbar-brand" href="#">Node Master</a>
+        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
+            aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+            <span class="navbar-toggler-icon"></span>
+        </button>
+        <div class="collapse navbar-collapse" id="navbarSupportedContent">
+            <ul class="navbar-nav me-auto mb-2 mb-lg-0">
+                <% /*
+                <li class="nav-item">
+                    <a class="nav-link active" aria-current="page" href="#">Home</a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link" href="#">Link</a>
+                </li>
+                <li class="nav-item dropdown">
+                    <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
+                        aria-expanded="false">
+                        Dropdown
+                    </a>
+                    <ul class="dropdown-menu">
+                        <li><a class="dropdown-item" href="#">Action</a></li>
+                        <li><a class="dropdown-item" href="#">Another action</a></li>
+                        <li>
+                            <hr class="dropdown-divider">
+                        </li>
+                        <li><a class="dropdown-item" href="#">Something else here</a></li>
+                    </ul>
+                </li>
+                */%>
+                <li class="nav-item">
+                    <a class="nav-link" id="navbar-notification-bell" onclick="showStoredToasts()"><i class="bi bi-bell-fill"></i></a>
+                </li>                
+            </ul>
+            <form class="d-flex" role="search">
+                <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
+                <button class="btn btn-outline-success" type="submit">Search</button>
+            </form>
+        </div>
+    </div>
+</nav>
\ No newline at end of file

From d4b974f81b2e28f3a35a0d252050525df07793f3 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 15 Jul 2023 17:58:12 -0400
Subject: [PATCH 26/57] Update join command to accept a specific node ID

---
 Server/commands/join.js | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/Server/commands/join.js b/Server/commands/join.js
index 6dab9a7..e7f59b3 100644
--- a/Server/commands/join.js
+++ b/Server/commands/join.js
@@ -1,7 +1,7 @@
 // Modules
 const { SlashCommandBuilder } = require('discord.js');
 const { DebugBuilder } = require("../utilities/debugBuilder");
-const { getMembersInRole, getAllClientIds, filterAutocompleteValues } = require("../utilities/utils");
+const { getMembersInRole, getAllClientIds, filterAutocompleteValues, getKeyByArrayValue } = require("../utilities/utils");
 const { requestOptions, sendHttpRequest } = require("../utilities/httpRequests");
 const { getOnlineNodes, updateNodeInfo, addNodeConnection, getConnectionByNodeId, getAllConnections } = require("../utilities/mysqlHandler");
 
@@ -14,15 +14,16 @@ const log = new DebugBuilder("server", "join");
  * @param {*} presetName The preset name to listen to on the client
  * @param {*} channelId The channel ID to join the bot to 
  * @param {*} connections EITHER A collection of clients that are currently connected OR a single discord client ID (NOT dev portal ID) that should be used to join the server with
+ * @param {number} nodeId [OPTIONAL] The node ID to join with (will join with another node if given node is not available)
  * @returns 
  */
-async function joinServerWrapper(presetName, channelId, connections) {
+async function joinServerWrapper(presetName, channelId, connections, nodeId = 0) {
 	// Get nodes online
 	var onlineNodes = await new Promise((recordResolve, recordReject) => {
 		getOnlineNodes((nodeRows) => {
 			recordResolve(nodeRows);
 		});
-	});	
+	});		
 
 	// Check which nodes have the selected preset
 	onlineNodes = onlineNodes.filter(node => node.presets.includes(presetName));
@@ -63,7 +64,10 @@ async function joinServerWrapper(presetName, channelId, connections) {
 		selectedClientId = availableClientIds[0];
 	}
 
-	const selectedNode = nodesCurrentlyAvailable[0];
+	let selectedNode;
+	if (nodeId > 0) selectedNode = getKeyByArrayValue(nodesCurrentlyAvailable, nodeId);
+	
+	if (!selectedNode) selectedNode = nodesCurrentlyAvailable[0];
 	
 	const reqOptions = new requestOptions("/bot/join", "POST", selectedNode.ip, selectedNode.port);	
 	const postObject = {

From 0426f5eb274684336cb82fd89735879ef0ca6984 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 15 Jul 2023 17:58:35 -0400
Subject: [PATCH 27/57] Add jsDoc to leaveServerWrapper

---
 Server/commands/leave.js | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/Server/commands/leave.js b/Server/commands/leave.js
index c5ad0b2..e65de07 100644
--- a/Server/commands/leave.js
+++ b/Server/commands/leave.js
@@ -8,6 +8,11 @@ const { checkNodeConnectionByClientId, removeNodeConnectionByNodeId, getAllConne
 // Global Vars
 const log = new DebugBuilder("server", "leave");
 
+/**
+ * 
+ * @param {*} clientIdObject The client ID object for the node to leave the server. Either 'clientId'||'name' can be set.
+ * @returns 
+ */
 async function leaveServerWrapper(clientIdObject) {
 	if (!clientIdObject.clientId || !clientIdObject.name) return log.ERROR("Tried to leave server without client ID and/or Name");
 

From 0a8dc75a93b73a22356200cec750160642fa37bc Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 15 Jul 2023 18:14:40 -0400
Subject: [PATCH 28/57] Update adminController to use join/leave command
 wrappers

---
 Server/controllers/adminController.js | 90 ++++++++-------------------
 1 file changed, 27 insertions(+), 63 deletions(-)

diff --git a/Server/controllers/adminController.js b/Server/controllers/adminController.js
index 46b6b8c..fdef282 100644
--- a/Server/controllers/adminController.js
+++ b/Server/controllers/adminController.js
@@ -7,6 +7,9 @@ const log = new DebugBuilder("server", "adminController");
 const mysqlHandler = require("../utilities/mysqlHandler");
 const utils = require("../utilities/utils");
 const requests = require("../utilities/httpRequests");
+const { leaveServerWrapper } = require("../commands/leave");
+const { joinServerWrapper } = require("../commands/join");
+
 
 /** Get the presets of all online nodes, can be used for functions
  * 
@@ -15,27 +18,10 @@ const requests = require("../utilities/httpRequests");
  */
 async function getPresetsOfOnlineNodes(callback) {
     mysqlHandler.getOnlineNodes((onlineNodes) => {
-        let systems = {};
-        onlineNodes.forEach(onlineNode => {
-            systems[onlineNode.id] = utils.BufferToJson(onlineNode.nearbySystems);                        
-        });                
-
-        return callback(systems);
+        return callback(onlineNodes);
     });
 }
 
-async function requestNodeListenToPreset(preset, nodeId, callback) {
-    mysqlHandler.getNodeInfoFromId(nodeId, (nodeObject) =>{
-        reqOptions = new requests.requestOptions("/bot/join", "POST", nodeObject.ip, nodeObject.port);
-        requests.sendHttpRequest(reqOptions, JSON.stringify({
-            "channelID": process.env.DEFAULT_VOICE_CHANNEL_ID,
-            "presetName": preset
-        }), (responseObject) => {
-            return callback(responseObject)
-        });
-    })    
-}
-
 async function getNodeBotStatus(nodeId, callback) {
     mysqlHandler.getNodeInfoFromId(nodeId, (nodeObject) =>{
         reqOptions = new requests.requestOptions("/bot/status", "GET", nodeObject.ip, nodeObject.port, undefined, 5);
@@ -51,24 +37,6 @@ async function getNodeBotStatus(nodeId, callback) {
     });
 }
 
-async function requestNodeLeaveServer(nodeId, callback) {
-    getNodeBotStatus(nodeId, (responseObject) => {
-        if (responseObject === false) {
-            // Bot is joined     
-            mysqlHandler.getNodeInfoFromId(nodeId, (nodeObject) =>{           
-                reqOptions = new requests.requestOptions("/bot/leave", "POST", nodeObject.ip, nodeObject.port);
-                requests.sendHttpRequest(reqOptions, JSON.stringify({}), (responseObject) => {
-                    return callback(responseObject);
-                });
-            });
-        }
-        else {
-            // Bot is free
-            return callback(false);
-        }
-    })
-}
-
 
 /** Return to requests for the presets of all online nodes, cannot be used in functions  
  * 
@@ -87,43 +55,39 @@ exports.getAvailablePresets = async (req, res) => {
  * 
  * @param {*} req Express request parameter
  * @var {*} req.body.preset The preset to join (REQ)
- * @var {*} req.body.nodeId The specific node to join (OPT/REQ if more than one node has the preset) 
+ * @var {*} req.body.nodeId The specific node to join (OPT/REQ if more than one node has the preset)
+ * @var {*} req.body.clientId The ID of the client that we want to join with
+ * @var {*} req.body.channelId The channel Id of the discord channel to join
  * @param {*} res Express response parameter
  */
 exports.joinPreset = async (req, res) => {
-    if (!req.body.preset) return res.status(400).json("No preset specified");    
-    await getPresetsOfOnlineNodes((systems) => {
-        const systemsWithSelectedPreset = Object.values(systems).filter(nodePresets => nodePresets.includes(req.body.preset)).length
-        if (!systemsWithSelectedPreset) return res.status(400).json("No system online with that preset");
-        if (systemsWithSelectedPreset > 1) {
-            if (!req.body.nodeId) return res.status(175).json("Multiple locations with the selected channel, please specify a nodeID (nodeId)")
-            requestNodeListenToPreset(req.body.preset, req.body.nodeId, (responseObject) => {
-                if (responseObject === false) return res.status(400).json("Timeout reached");
-                return res.sendStatus(responseObject.statusCode);
-            });          
-        } 
-        else {   
-            let nodeId;
-            if (!req.body.nodeId) nodeId = utils.getKeyByArrayValue(systems, req.body.preset);
-            else nodeId = req.body.nodeId;
-            requestNodeListenToPreset(req.body.preset, nodeId, (responseObject) => {
-                if (responseObject === false) return res.status(400).json("Timeout reached");
-                return res.sendStatus(responseObject.statusCode);
-            });                        
-        }
-    });
+    if (!req.body.preset) return res.status(400).json("No preset specified");
+    if (!req.body.nodeId) return res.status(400).json("No node ID specified");
+    if (!req.body.clientId) return res.status(400).json("No client ID specified");
+    if (!req.body.channelId) return res.status(400).json("No channel ID specified");
+
+    const preset = req.body.preset;
+    const nodeId = req.body.nodeId;
+    const clientId = req.body.clientId;
+    const channelId = req.body.channelId;
+
+    const joinedClient = await joinServerWrapper(preset, channelId, clientId, nodeId);
+    if (!joinedClient) return res.send(400).json("No joined client");
+    return res.send(200).json(joinedClient);
 }
 
 /** Request a node to join the server listening to a specific preset
  * 
  * @param {*} req Express request parameter
  * @param {*} res Express response parameter
+ * @var {*} req.body.clientId The ID of the client to disconnect
  */
 exports.leaveServer = async (req, res) => {
-    if (!req.body.nodeId) return res.status(400).json("No nodeID specified");
+    if (!req.body.clientId) return res.status(400).json("No clientID specified");
 
-    requestNodeLeaveServer(req.body.nodeId, (responseObject) => {
-        if (responseObject === false) return res.status(400).json("Bot not joined to server");
-        return res.sendStatus(responseObject.statusCode);
-    });
+    const clientId = req.body.clientId;
+
+    await leaveServerWrapper(clientId)
+
+    return res.send(200);
 }
\ No newline at end of file

From cfeea57744eaeb0bec46cd83cba0b2f95ff6b1d5 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 15 Jul 2023 18:14:53 -0400
Subject: [PATCH 29/57] Update jsDoc in nodeController

---
 Server/controllers/nodesController.js | 42 +++++++++++++++++++++++----
 1 file changed, 37 insertions(+), 5 deletions(-)

diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index 9c9d274..45d26e8 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -7,13 +7,14 @@ const utils = require("../utilities/utils");
 const { sendHttpRequest, requestOptions } = require("../utilities/httpRequests.js");
 const { nodeObject } = require("../utilities/recordHelper.js");
 const { joinServerWrapper } = require("../commands/join");
+const { leaveServerWrapper } = require("../commands/leave");
 
 const refreshInterval = process.env.NODE_MONITOR_REFRESH_INTERVAL ?? 1200000;
 
 /**
  * 
- * @param {*} req 
- * @param {*} res 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
  */
 exports.listAllNodes = async (req, res) => {
     getAllNodes((allNodes) => {
@@ -23,7 +24,11 @@ exports.listAllNodes = async (req, res) => {
     });
 }
 
-// Add a new node to the storage
+/**
+ *  Add a new node to the storage
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ */ 
 exports.newNode = async (req, res) => {
     if (!req.body.name) return res.status(400).json("No name specified for new node");
 
@@ -53,7 +58,11 @@ exports.newNode = async (req, res) => {
     }
 }
 
-// Get the known info for the node specified
+/** Get the known info for the node specified
+ * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ */ 
 exports.getNodeInfo = async (req, res) => {
     if (!req.query.id) return res.status(400).json("No id specified");
     getNodeInfoFromId(req.query.id, (nodeInfo) => {
@@ -61,7 +70,11 @@ exports.getNodeInfo = async (req, res) => {
     })
 }
 
-// Updates the information received from the client based on ID
+/** Updates the information received from the client based on ID
+ * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ */
 exports.nodeCheckIn = async  (req, res) => {
     if (!req.body.id) return res.status(400).json("No id specified");
     getNodeInfoFromId(req.body.id, (nodeInfo) => {
@@ -126,6 +139,8 @@ exports.nodeCheckIn = async  (req, res) => {
 /**
  * Request the node to join the specified server/channel and listen to the specified resource
  * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
  * @param req.body.clientId The client ID to join discord with (NOT dev portal ID, right click user -> Copy ID)
  * @param req.body.channelId The Channel ID to join in Discord
  * @param req.body.presetName The preset name to listen to in Discord
@@ -135,6 +150,17 @@ exports.requestNodeJoinServer = async (req, res) => {
     await joinServerWrapper(req.body.presetName, req.body.channelId, req.body.clientId);
 }
 
+/**
+ * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ * @param {*} req.body.clientId The client ID to request to leave the server 
+ */
+exports.requestNodeLeaveServer = async (req, res) => {
+    if (!req.body.ClientId) return res.status(400).json("Missing client ID in request");
+    await leaveServerWrapper({clientId: req.body.ClientId});
+}
+
 /**
  * The node monitor service, this will periodically check in on the online nodes to make sure they are still online
  */
@@ -143,6 +169,9 @@ exports.nodeMonitorService = class nodeMonitorService {
         this.log = new DebugBuilder("server", "nodeMonitorService");
     }
 
+    /**
+     * Start the node monitor service in the background
+     */
     async start(){
 	    // Wait for the a portion of the refresh period before checking in with the nodes, so the rest of the bot can start
         await new Promise(resolve => setTimeout(resolve, refreshInterval/10));
@@ -161,6 +190,9 @@ exports.nodeMonitorService = class nodeMonitorService {
         }        
     }
 
+    /**
+     * Check in with all online nodes and mark any nodes that are actually offline
+     */
     async checkInWithOnlineNodes(){
         getOnlineNodes((nodes) => {
             this.log.DEBUG("Online Nodes: ", nodes);

From 4a54be7e514bafdddeb4b830c4091fb620c53dab Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 15 Jul 2023 18:15:17 -0400
Subject: [PATCH 30/57] Update jsDoc in utils

---
 Server/utilities/utils.js | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/Server/utilities/utils.js b/Server/utilities/utils.js
index 2acef73..06aa75b 100644
--- a/Server/utilities/utils.js
+++ b/Server/utilities/utils.js
@@ -119,7 +119,12 @@ exports.getClientObjectByClientID = (clientId) => {
     return undefined
 }
 
-
+/**
+ * Wrapper to filter auto complete 
+ * 
+ * @param {*} interaction 
+ * @param {*} options 
+ */
 exports.filterAutocompleteValues = async (interaction, options) => {
     // Get the command used
     const command = interaction.command;

From 02854fb78391ccb1751d0cd0e6b669f1d46f3da8 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 15 Jul 2023 18:16:42 -0400
Subject: [PATCH 31/57] Initial bones for #37

---
 Server/public/res/css/main.css       | 142 ++++++++++++++++++++++++++
 Server/public/res/js/controller.js   |   3 +
 Server/routes/index.js               |  27 ++++-
 Server/views/controller.ejs          |  11 ++
 Server/views/index.ejs               | 144 +++++++++++++++++++++++++--
 Server/views/node.ejs                |  41 ++++++++
 Server/views/partials/bodyEnd.ejs    |  11 ++
 Server/views/partials/head.ejs       |   9 ++
 Server/views/partials/htmlFooter.ejs |   1 +
 Server/views/partials/htmlHead.ejs   |   6 ++
 Server/views/partials/navbar.ejs     |  40 ++++++++
 Server/views/partials/nodeCard.ejs   |  57 +++++++++++
 Server/views/partials/sidebar.ejs    |  83 +++++++++++++++
 13 files changed, 561 insertions(+), 14 deletions(-)
 create mode 100644 Server/public/res/css/main.css
 create mode 100644 Server/public/res/js/controller.js
 create mode 100644 Server/views/controller.ejs
 create mode 100644 Server/views/node.ejs
 create mode 100644 Server/views/partials/bodyEnd.ejs
 create mode 100644 Server/views/partials/head.ejs
 create mode 100644 Server/views/partials/htmlFooter.ejs
 create mode 100644 Server/views/partials/htmlHead.ejs
 create mode 100644 Server/views/partials/navbar.ejs
 create mode 100644 Server/views/partials/nodeCard.ejs
 create mode 100644 Server/views/partials/sidebar.ejs

diff --git a/Server/public/res/css/main.css b/Server/public/res/css/main.css
new file mode 100644
index 0000000..d057e2a
--- /dev/null
+++ b/Server/public/res/css/main.css
@@ -0,0 +1,142 @@
+.node-card {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    min-width: 0;
+    word-wrap: break-word;
+    background-color: #fff;
+    background-clip: border-box;
+    border: 1px solid #eff0f2;
+    border-radius: 1rem;
+    margin-bottom: 24px;
+    box-shadow: 0 2px 3px #e4e8f0;
+}
+
+.avatar-md {
+    height: 4rem;
+    width: 4rem;
+}
+
+.rounded-circle {
+    border-radius: 50% !important;
+}
+
+.img-thumbnail {
+    padding: 0.25rem;
+    background-color: #f1f3f7;
+    border: 1px solid #eff0f2;
+    border-radius: 0.75rem;
+}
+
+.avatar-title {
+    align-items: center;
+    background-color: #3b76e1;
+    color: #fff;
+    display: flex;
+    font-weight: 500;
+    height: 100%;
+    justify-content: center;
+    width: 100%;
+}
+
+.bg-soft-primary {
+    background-color: rgba(59, 118, 225, .25) !important;
+}
+
+a {
+    text-decoration: none !important;
+}
+
+.badge-soft-danger {
+    color: #f56e6e !important;
+    background-color: rgba(245, 110, 110, .1);
+}
+
+.badge-soft-success {
+    color: #63ad6f !important;
+    background-color: rgba(99, 173, 111, .1);
+}
+
+.mb-0 {
+    margin-bottom: 0 !important;
+}
+
+.badge {
+    display: inline-block;
+    padding: 0.25em 0.6em;
+    font-size: 75%;
+    font-weight: 500;
+    line-height: 1;
+    color: #fff;
+    text-align: center;
+    white-space: nowrap;
+    vertical-align: baseline;
+    border-radius: 0.75rem;
+}
+
+/* Info Card Section */
+.info-card {
+    background-color: #fff;
+    border-radius: 10px;
+    border: none;
+    position: relative;
+    margin-bottom: 30px;
+    box-shadow: 0 0.46875rem 2.1875rem rgba(90, 97, 105, 0.1), 0 0.9375rem 1.40625rem rgba(90, 97, 105, 0.1), 0 0.25rem 0.53125rem rgba(90, 97, 105, 0.12), 0 0.125rem 0.1875rem rgba(90, 97, 105, 0.1);
+}
+
+.info-card .card-statistic .card-icon-large .bi {
+    font-size: 110px;
+}
+
+.info-card .card-statistic .card-icon {
+    text-align: center;
+    line-height: 50px;
+    margin-left: 15px;
+    color: #000;
+    position: absolute;
+    right: -5px;
+    top: 20px;
+    opacity: 0.1;
+}
+
+/* Info Card Background Colors */
+
+.l-bg-cherry {
+    background: linear-gradient(to right, #493240, #f09) !important;
+    color: #fff;
+}
+
+.l-bg-blue-dark {
+    background: linear-gradient(to right, #373b44, #4286f4) !important;
+    color: #fff;
+}
+
+.l-bg-green-dark {
+    background: linear-gradient(to right, #0a504a, #38ef7d) !important;
+    color: #fff;
+}
+
+.l-bg-orange-dark {
+    background: linear-gradient(to right, #a86008, #ffba56) !important;
+    color: #fff;
+}
+
+.l-bg-cyan {
+    background: linear-gradient(135deg, #289cf5, #84c0ec) !important;
+    color: #fff;
+}
+
+.l-bg-green {
+    background: linear-gradient(135deg, #23bdb8 0%, #43e794 100%) !important;
+    color: #fff;
+}
+
+.l-bg-orange {
+    background: linear-gradient(to right, #f9900e, #ffba56) !important;
+    color: #fff;
+}
+
+/* Global Section */
+.sidebar-container {
+    min-height: 94.2vh;
+}
\ No newline at end of file
diff --git a/Server/public/res/js/controller.js b/Server/public/res/js/controller.js
new file mode 100644
index 0000000..04c0fd9
--- /dev/null
+++ b/Server/public/res/js/controller.js
@@ -0,0 +1,3 @@
+function sendNodeHeartbeat(nodeId) {
+    console.log(nodeId);
+}
\ No newline at end of file
diff --git a/Server/routes/index.js b/Server/routes/index.js
index a188406..1f43b2a 100644
--- a/Server/routes/index.js
+++ b/Server/routes/index.js
@@ -1,11 +1,12 @@
-const libCore = require("../libCore");
 var express = require('express');
 var router = express.Router();
 
+const { getAllNodes, getNodeInfoFromId } = require("../utilities/mysqlHandler");
+
 /* GET home page. */
 router.get('/', (req, res) => {
-  var sources = libCore.getSources();
-  //res.render('index', { "sources": sources });
+  //var sources = libCore.getSources();
+  return res.render('index');
 
   var htmlOutput = "";
 
@@ -28,4 +29,24 @@ router.get('/', (req, res) => {
 	res.send(htmlOutput);
 });
 
+/* GET node controller page. */
+router.get('/controller', async (req, res) => {
+	var nodes = await new Promise((recordResolve, recordReject) => {
+		getAllNodes((nodeRows) => {
+			recordResolve(nodeRows);
+		});
+	});	
+
+	//var sources = libCore.getSources();
+	return res.render('controller', {'nodes' : nodes});
+});
+
+/* GET individual node page. */
+router.get('/node/:id', async (req, res) => {
+	var node = await getNodeInfoFromId(req.params.id);
+
+	//var sources = libCore.getSources();
+	return res.render('node', {'node' : node});
+});
+
 module.exports = router;
diff --git a/Server/views/controller.ejs b/Server/views/controller.ejs
new file mode 100644
index 0000000..28099a9
--- /dev/null
+++ b/Server/views/controller.ejs
@@ -0,0 +1,11 @@
+<%- include('partials/htmlHead.ejs') %>
+    <div class="container">
+        <div class="row row-cols-1 row-cols-md-2 row-cols-xl-4">
+            <% for(const node of nodes) {%>
+                <%- include('partials/nodeCard.ejs', {'node': node}) %>
+            <% } %>
+        </div>
+    </div>
+<%- include('partials/bodyEnd.ejs') %>
+<script src="/res/js/controller.js"></script>
+<%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/index.ejs b/Server/views/index.ejs
index 7b7a1d6..b6524a3 100644
--- a/Server/views/index.ejs
+++ b/Server/views/index.ejs
@@ -1,11 +1,133 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <title><%= title %></title>
-    <link rel='stylesheet' href='/stylesheets/style.css' />
-  </head>
-  <body>
-    <h1><%= title %></h1>
-    <p>Welcome to <%= title %></p>
-  </body>
-</html>
+<%- include('partials/htmlHead.ejs') %>
+    <div class="container">
+        <div class="row row-cols-1 row-cols-md-2 row-cols-xl-4">
+            <div class="col-xl-3 col-lg-6">
+                <div class="info-card l-bg-cherry">
+                    <div class="card-statistic p-4">
+                        <div class="card-icon card-icon-large"><i class="bi bi-cart"></i></div>
+                        <div class="mb-4">
+                            <h5 class="card-title mb-0">New Orders</h5>
+                        </div>
+                        <div class="row align-items-center mb-2 d-flex">
+                            <div class="col-8">
+                                <h2 class="d-flex align-items-center mb-0">
+                                    3,243
+                                </h2>
+                            </div>
+                            <div class="col-4 text-right">
+                                <span>12.5% <i class="fa fa-arrow-up"></i></span>
+                            </div>
+                        </div>
+                        <div class="progress mt-1 " data-height="8" style="height: 8px;">
+                            <div class="progress-bar l-bg-cyan" role="progressbar" data-width="25%" aria-valuenow="25"
+                                aria-valuemin="0" aria-valuemax="100" style="width: 25%;"></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-xl-3 col-lg-6">
+                <div class="info-card l-bg-blue-dark">
+                    <div class="card-statistic p-4">
+                        <div class="card-icon card-icon-large"><i class="bi bi-cart"></i></div>
+                        <div class="mb-4">
+                            <h5 class="card-title mb-0">New Orders</h5>
+                        </div>
+                        <div class="row align-items-center mb-2 d-flex">
+                            <div class="col-8">
+                                <h2 class="d-flex align-items-center mb-0">
+                                    3,243
+                                </h2>
+                            </div>
+                            <div class="col-4 text-right">
+                                <span>12.5% <i class="fa fa-arrow-up"></i></span>
+                            </div>
+                        </div>
+                        <div class="progress mt-1 " data-height="8" style="height: 8px;">
+                            <div class="progress-bar l-bg-cyan" role="progressbar" data-width="25%" aria-valuenow="25"
+                                aria-valuemin="0" aria-valuemax="100" style="width: 25%;"></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-xl-3 col-sm-6">
+                <div class="card node-card">
+                    <div class="card-body">
+                        <div class="dropdown float-end">
+                            <a class="text-muted dropdown-toggle font-size-16" href="#" role="button"
+                                data-bs-toggle="dropdown" aria-haspopup="true"><i
+                                    class="bx bx-dots-horizontal-rounded"></i></a>
+                            <div class="dropdown-menu dropdown-menu-end"><a class="dropdown-item" href="#">Edit</a><a
+                                    class="dropdown-item" href="#">Action</a><a class="dropdown-item"
+                                    href="#">Remove</a></div>
+                        </div>
+                        <div class="d-flex align-items-center">
+                            <div><img src="https://bootdey.com/img/Content/avatar/avatar1.png" alt=""
+                                    class="avatar-md rounded-circle img-thumbnail" /></div>
+                            <div class="flex-1 ms-3">
+                                <h5 class="font-size-16 mb-1"><a href="#" class="text-dark">Phyllis Gatlin</a></h5>
+                                <span class="badge badge-soft-success mb-0">Full Stack Developer</span>
+                            </div>
+                        </div>
+                        <div class="mt-3 pt-1">
+                            <p class="text-muted mb-0"><i
+                                    class="mdi mdi-phone font-size-15 align-middle pe-2 text-primary"></i> 070 2860 5375
+                            </p>
+                            <p class="text-muted mb-0 mt-2"><i
+                                    class="mdi mdi-email font-size-15 align-middle pe-2 text-primary"></i>
+                                PhyllisGatlin@spy.com</p>
+                            <p class="text-muted mb-0 mt-2"><i
+                                    class="mdi mdi-google-maps font-size-15 align-middle pe-2 text-primary"></i> 52
+                                Ilchester MYBSTER 9WX</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-xl-3 col-sm-6">
+                <div class="card node-card">
+                    <div class="card-body">
+                        <div class="dropdown float-end">
+                            <a class="text-muted dropdown-toggle font-size-16" href="#" role="button"
+                                data-bs-toggle="dropdown" aria-haspopup="true"><i
+                                    class="bx bx-dots-horizontal-rounded"></i></a>
+                            <div class="dropdown-menu dropdown-menu-end"><a class="dropdown-item" href="#">Edit</a><a
+                                    class="dropdown-item" href="#">Action</a><a class="dropdown-item"
+                                    href="#">Remove</a></div>
+                        </div>
+                        <div class="d-flex align-items-center">
+                            <div><img src="https://bootdey.com/img/Content/avatar/avatar5.png" alt=""
+                                    class="avatar-md rounded-circle img-thumbnail" /></div>
+                            <div class="flex-1 ms-3">
+                                <h5 class="font-size-16 mb-1"><a href="#" class="text-dark">Diana Owens</a></h5>
+                                <span class="badge badge-soft-danger mb-0">UI/UX Designer</span>
+                            </div>
+                        </div>
+                        <div class="mt-3 pt-1">
+                            <p class="text-muted mb-0"><i
+                                    class="mdi mdi-phone font-size-15 align-middle pe-2 text-primary"></i> 087 6321 3235
+                            </p>
+                            <p class="text-muted mb-0 mt-2"><i
+                                    class="mdi mdi-email font-size-15 align-middle pe-2 text-primary"></i>
+                                DianaOwens@spy.com</p>
+                            <p class="text-muted mb-0 mt-2"><i
+                                    class="mdi mdi-google-maps font-size-15 align-middle pe-2 text-primary"></i> 52
+                                Ilchester MYBSTER 9WX</p>
+                        </div>
+                        <div class="d-flex gap-2 pt-4">
+                            <button type="button" class="btn btn-soft-primary btn-sm w-50"><i
+                                    class="bx bx-user me-1"></i> Profile</button>
+                            <button type="button" class="btn btn-primary btn-sm w-50"><i
+                                    class="bx bx-message-square-dots me-1"></i> Contact</button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+
+        </div>
+    </div>
+<%- include('partials/bodyEnd.ejs') %>
+
+<%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
new file mode 100644
index 0000000..941e326
--- /dev/null
+++ b/Server/views/node.ejs
@@ -0,0 +1,41 @@
+<%- include('partials/htmlHead.ejs') %>
+<div class="card mb-4">
+    <div class="card-header">
+        Account Details
+        <% if(node.online){%> <span class="badge badge-soft-success mb-0">Online</span>
+        <% } else {%> <span class="badge badge-soft-danger mb-0">Offline</span>
+        <% } %>
+    </div>
+    <div class="card-body">
+        <form>
+            <div class="mb-3">
+                <label class="small mb-1" for="nodeId">Node ID (this is the assigned Node ID and cannot be changed)</label>
+                <input class="form-control" id="nodeId" type="text" value="<%=node.id%>" disabled>
+            </div>
+            <div class="row gx-3 mb-3">
+                <div class="col-md-12">
+                    <label class="small mb-1" for="inputNodeName">Node Name</label>
+                    <input class="form-control" id="inputNodeName" type="text" value="<%=node.name%>">
+                </div>                
+            </div>
+            <div class="row gx-3 mb-3">
+                <div class="col-md-4">
+                    <label class="small mb-1" for="inputNodeIp">Node IP Address (that the server can contact)</label>
+                    <input class="form-control" id="inputNodeIp" type="text" value="<%=node.ip%>">
+                </div>
+                <div class="col-md-2">
+                    <label class="small mb-1" for="inputOrgName">Node Port (with the API)</label>
+                    <input class="form-control" id="inputOrgName" type="number" value="<%=node.port%>">
+                </div>
+            </div>
+            <div class="mb-3">
+                <label class="small mb-1" for="inputNodeLocation">Node Location (physical location)</label>
+                <input class="form-control" id="inputNodeLocation" type="location" value="<%=node.location%>">
+            </div>            
+            <!-- Save changes button-->
+            <button class="btn btn-primary" type="button">Save changes</button>
+        </form>
+    </div>
+</div>
+<%- include('partials/bodyEnd.ejs') %>
+<%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/bodyEnd.ejs b/Server/views/partials/bodyEnd.ejs
new file mode 100644
index 0000000..2a347cf
--- /dev/null
+++ b/Server/views/partials/bodyEnd.ejs
@@ -0,0 +1,11 @@
+</div>
+</div>
+</div>
+
+</body>
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"
+    integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz"
+    crossorigin="anonymous"></script>
+
+<script src="https://code.jquery.com/jquery-3.7.0.slim.min.js"
+    integrity="sha256-tG5mcZUtJsZvyKAxYLVXrmjKBVLd6VpVccqz/r4ypFE=" crossorigin="anonymous"></script>
\ No newline at end of file
diff --git a/Server/views/partials/head.ejs b/Server/views/partials/head.ejs
new file mode 100644
index 0000000..3429389
--- /dev/null
+++ b/Server/views/partials/head.ejs
@@ -0,0 +1,9 @@
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Bootstrap demo</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"
+        integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css">
+    <link rel="stylesheet" href="/res/css/main.css">
+</head>
\ No newline at end of file
diff --git a/Server/views/partials/htmlFooter.ejs b/Server/views/partials/htmlFooter.ejs
new file mode 100644
index 0000000..62d09b8
--- /dev/null
+++ b/Server/views/partials/htmlFooter.ejs
@@ -0,0 +1 @@
+</html>
\ No newline at end of file
diff --git a/Server/views/partials/htmlHead.ejs b/Server/views/partials/htmlHead.ejs
new file mode 100644
index 0000000..5a3ef3b
--- /dev/null
+++ b/Server/views/partials/htmlHead.ejs
@@ -0,0 +1,6 @@
+<!doctype html>
+<html lang="en" data-bs-theme="auto">
+    <%- include('head.ejs') %>
+    <body>
+        <%- include('navbar.ejs') %>
+        <%- include('sidebar.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/navbar.ejs b/Server/views/partials/navbar.ejs
new file mode 100644
index 0000000..ccac10e
--- /dev/null
+++ b/Server/views/partials/navbar.ejs
@@ -0,0 +1,40 @@
+<nav class="navbar navbar-expand-lg bg-body-tertiary" data-bs-theme="dark">
+    <div class="container-fluid">
+        <a class="navbar-brand" href="#">Navbar</a>
+        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
+            aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+            <span class="navbar-toggler-icon"></span>
+        </button>
+        <div class="collapse navbar-collapse" id="navbarSupportedContent">
+            <ul class="navbar-nav me-auto mb-2 mb-lg-0">
+                <li class="nav-item">
+                    <a class="nav-link active" aria-current="page" href="#">Home</a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link" href="#">Link</a>
+                </li>
+                <li class="nav-item dropdown">
+                    <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
+                        aria-expanded="false">
+                        Dropdown
+                    </a>
+                    <ul class="dropdown-menu">
+                        <li><a class="dropdown-item" href="#">Action</a></li>
+                        <li><a class="dropdown-item" href="#">Another action</a></li>
+                        <li>
+                            <hr class="dropdown-divider">
+                        </li>
+                        <li><a class="dropdown-item" href="#">Something else here</a></li>
+                    </ul>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link disabled">Disabled</a>
+                </li>
+            </ul>
+            <form class="d-flex" role="search">
+                <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
+                <button class="btn btn-outline-success" type="submit">Search</button>
+            </form>
+        </div>
+    </div>
+</nav>
\ No newline at end of file
diff --git a/Server/views/partials/nodeCard.ejs b/Server/views/partials/nodeCard.ejs
new file mode 100644
index 0000000..b676560
--- /dev/null
+++ b/Server/views/partials/nodeCard.ejs
@@ -0,0 +1,57 @@
+<div class="col-xl-3 col-sm-6">
+    <div class="card node-card">
+        <div class="card-body">
+            <div class="dropdown float-end">
+                <a class="text-muted dropdown-toggle font-size-16" href="#" role="button" data-bs-toggle="dropdown"
+                    aria-haspopup="true">
+                    <i class="bx bx-dots-horizontal-rounded"></i>
+                </a>
+                <div class="dropdown-menu dropdown-menu-end">
+                    <a class="dropdown-item node-action" href="/node/<%=node.id%>" >Edit</a>
+                    <a class="dropdown-item node-action" href="#" onclick="sendNodeHeartbeat('<%=node.id%>')">Send Heartbeat</a>
+                </div>
+            </div>
+            <div class="d-flex align-items-center">
+                <div>
+                    <img src="https://bootdey.com/img/Content/avatar/avatar1.png" alt=""
+                        class="avatar-md rounded-circle img-thumbnail" />
+                </div>
+                <div class="flex-1 ms-3">
+                    <h5 class="font-size-16 mb-1"><a href="/node/<%=node.id%>" class="text-dark">
+                            <%= node.name %>
+                        </a></h5>
+                    <% if(node.online){%> <span class="badge badge-soft-success mb-0">Online</span>
+                        <% } else {%> <span class="badge badge-soft-danger mb-0">Offline</span>
+                            <% } %>
+                </div>
+            </div>
+            <div class="mt-3 pt-1">
+                <p class="text-muted mb-0">
+                    <i class="bi bi-geo font-size-15 align-middle pe-2 text-primary"></i>
+                    <%= node.location %>
+                </p>
+                <p class="text-muted mb-0">
+                    <i class="bi bi-phone font-size-15 align-middle pe-2 text-primary"></i>
+                    <a href="#" target="_blank">
+                        <%= node.ip %>:<%= node.port %>
+                    </a>
+                </p>
+                <p class="text-muted mb-0">
+                <div class="dropdown">
+                    <i class="bi bi-broadcast-pin font-size-15 align-middle pe-2 text-primary"></i>
+                    <a class="dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
+                        Nearby Systems
+                    </a>
+                    <ul class="dropdown-menu">
+                        <% for(const system in node.nearbySystems){ %>
+                            <li>
+                                <%= system %>
+                            </li>
+                            <% } %>
+                    </ul>
+                </div>
+                </p>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/Server/views/partials/sidebar.ejs b/Server/views/partials/sidebar.ejs
new file mode 100644
index 0000000..8eb5815
--- /dev/null
+++ b/Server/views/partials/sidebar.ejs
@@ -0,0 +1,83 @@
+<div class="container-fluid">
+    <div class="row flex-nowrap">
+        <div class="col-auto col-md-3 col-xl-2 px-sm-2 px-0 bg-dark">
+            <div class="d-flex flex-column align-items-center align-items-sm-start px-3 pt-2 text-white sidebar-container">
+                <ul class="nav nav-pills flex-column mb-sm-auto mb-0 align-items-center align-items-sm-start" id="menu">
+                    <li class="nav-item">
+                        <a href="#" class="nav-link align-middle px-0">
+                            <i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Home</span>
+                        </a>
+                    </li>
+                    <li>
+                        <a href="#submenu1" data-bs-toggle="collapse" class="nav-link px-0 align-middle">
+                            <i class="fs-4 bi-speedometer2"></i> <span class="ms-1 d-none d-sm-inline">Dashboard</span>
+                        </a>
+                        <ul class="collapse nav flex-column ms-1" id="submenu1" data-bs-parent="#menu">
+                            <li class="w-100">
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 1 </a>
+                            </li>
+                            <li>
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 2 </a>
+                            </li>
+                        </ul>
+                    </li>
+                    <li>
+                        <a href="#" class="nav-link px-0 align-middle">
+                            <i class="fs-4 bi-table"></i> <span class="ms-1 d-none d-sm-inline">Orders</span></a>
+                    </li>
+                    <li>
+                        <a href="#submenu2" data-bs-toggle="collapse" class="nav-link px-0 align-middle ">
+                            <i class="fs-4 bi-bootstrap"></i> <span class="ms-1 d-none d-sm-inline">Bootstrap</span></a>
+                        <ul class="collapse nav flex-column ms-1" id="submenu2" data-bs-parent="#menu">
+                            <li class="w-100">
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 1</a>
+                            </li>
+                            <li>
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 2</a>
+                            </li>
+                        </ul>
+                    </li>
+                    <li>
+                        <a href="#submenu3" data-bs-toggle="collapse" class="nav-link px-0 align-middle">
+                            <i class="fs-4 bi-grid"></i> <span class="ms-1 d-none d-sm-inline">Products</span> </a>
+                        <ul class="collapse nav flex-column ms-1" id="submenu3" data-bs-parent="#menu">
+                            <li class="w-100">
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 1</a>
+                            </li>
+                            <li>
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 2</a>
+                            </li>
+                            <li>
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 3</a>
+                            </li>
+                            <li>
+                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 4</a>
+                            </li>
+                        </ul>
+                    </li>
+                    <li>
+                        <a href="#" class="nav-link px-0 align-middle">
+                            <i class="fs-4 bi-people"></i> <span class="ms-1 d-none d-sm-inline">Customers</span> </a>
+                    </li>
+                </ul>
+                <hr>
+                <div class="dropdown pb-4 fixed-bottom px-3">
+                    <a href="#" class="d-flex align-items-center text-white text-decoration-none dropdown-toggle"
+                        id="dropdownUser1" data-bs-toggle="dropdown" aria-expanded="false">
+                        <img src="https://github.com/mdo.png" alt="hugenerd" width="30" height="30"
+                            class="rounded-circle">
+                        <span class="d-none d-sm-inline mx-1">loser</span>
+                    </a>
+                    <ul class="dropdown-menu dropdown-menu-dark text-small shadow">
+                        <li><a class="dropdown-item" href="#">New project...</a></li>
+                        <li><a class="dropdown-item" href="#">Settings</a></li>
+                        <li><a class="dropdown-item" href="#">Profile</a></li>
+                        <li>
+                            <hr class="dropdown-divider">
+                        </li>
+                        <li><a class="dropdown-item" href="#">Sign out</a></li>
+                    </ul>
+                </div>
+            </div>
+        </div>
+        <div class="col py-3">
\ No newline at end of file

From c5f7cc1da67373edc1c286b20020791edd32e797 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 15 Jul 2023 23:30:41 -0400
Subject: [PATCH 32/57] Additional changes for #37

- Updating side bar
- Updating nav bar
- Adding node details page
- Adding controller page
- Updating routes
---
 Server/controllers/nodesController.js       | 144 ++++++++--------
 Server/public/res/css/main.css              |  36 +++-
 Server/public/res/js/node.js                |  50 ++++++
 Server/routes/nodes.js                      |   5 +-
 Server/utilities/recordHelper.js            |   3 +-
 Server/views/node.ejs                       | 179 ++++++++++++++++----
 Server/views/partials/bodyEnd.ejs           |   5 +-
 Server/views/partials/modifySystemModal.ejs |  54 ++++++
 Server/views/partials/navbar.ejs            |   4 +-
 Server/views/partials/sidebar.ejs           |  59 +------
 10 files changed, 376 insertions(+), 163 deletions(-)
 create mode 100644 Server/public/res/js/node.js
 create mode 100644 Server/views/partials/modifySystemModal.ejs

diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index 45d26e8..c1999ed 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -2,15 +2,61 @@
 const { DebugBuilder } = require("../utilities/debugBuilder.js");
 const log = new DebugBuilder("server", "nodesController");
 // Utilities
-const {getAllNodes, addNewNode, updateNodeInfo, getNodeInfoFromId, getOnlineNodes } = require("../utilities/mysqlHandler");
+const { getAllNodes, addNewNode, updateNodeInfo, getNodeInfoFromId, getOnlineNodes } = require("../utilities/mysqlHandler");
 const utils = require("../utilities/utils");
 const { sendHttpRequest, requestOptions } = require("../utilities/httpRequests.js");
 const { nodeObject } = require("../utilities/recordHelper.js");
-const { joinServerWrapper } = require("../commands/join");
-const { leaveServerWrapper } = require("../commands/leave");
 
 const refreshInterval = process.env.NODE_MONITOR_REFRESH_INTERVAL ?? 1200000;
 
+/**
+ * Check in with a singular node, mark it offline if it's offline and 
+ * 
+ * @param {*} node The node Object to check in with
+ */
+async function checkInWithNode(node) {
+    const reqOptions = new requestOptions("/client/requestCheckIn", "GET", node.ip, node.port)
+    sendHttpRequest(reqOptions, "", (responseObj) => {
+        if (responseObj) {
+            log.DEBUG("Response from: ", node.name, responseObj);
+            const onlineNode = new nodeObject({ _online: false, _id: node.id });
+            log.DEBUG("Node update object: ", onlineNode);
+            updateNodeInfo(onlineNode, (sqlResponse) => {
+                if (!sqlResponse) this.log.ERROR("No response from SQL object");
+
+                log.DEBUG("Updated node: ", sqlResponse);
+                return true
+            })            
+        }
+        else {
+            log.DEBUG("No response from node, assuming it's offline");
+            const offlineNode = new nodeObject({ _online: false, _id: node.id });
+            log.DEBUG("Offline node update object: ", offlineNode);
+            updateNodeInfo(offlineNode, (sqlResponse) => {
+                if (!sqlResponse) this.log.ERROR("No response from SQL object");
+
+                log.DEBUG("Updated offline node: ", sqlResponse);
+                return false
+            })
+        }
+    })
+}
+exports.checkInWithNode = checkInWithNode;
+
+/**
+ * Check in with all online nodes and mark any nodes that are actually offline
+*/
+async function checkInWithOnlineNodes() {
+    getOnlineNodes((nodes) => {
+        log.DEBUG("Online Nodes: ", nodes);
+        for (const node of nodes) {
+            checkInWithNode(node);
+        }
+        return;
+    });
+}
+exports.checkInWithOnlineNodes = checkInWithOnlineNodes;
+
 /**
  * 
  * @param {*} req Default express req from router
@@ -28,7 +74,7 @@ exports.listAllNodes = async (req, res) => {
  *  Add a new node to the storage
  * @param {*} req Default express req from router
  * @param {*} res Defualt express res from router
- */ 
+ */
 exports.newNode = async (req, res) => {
     if (!req.body.name) return res.status(400).json("No name specified for new node");
 
@@ -45,7 +91,7 @@ exports.newNode = async (req, res) => {
 
         addNewNode(newNode, (newNodeObject) => {
             // Send back a success if the user has been added and the ID for the client to keep track of
-            res.status(202).json({"nodeId": newNodeObject.id});
+            res.status(202).json({ "nodeId": newNodeObject.id });
         })
     }
     catch (err) {
@@ -62,7 +108,7 @@ exports.newNode = async (req, res) => {
  * 
  * @param {*} req Default express req from router
  * @param {*} res Defualt express res from router
- */ 
+ */
 exports.getNodeInfo = async (req, res) => {
     if (!req.query.id) return res.status(400).json("No id specified");
     getNodeInfoFromId(req.query.id, (nodeInfo) => {
@@ -75,7 +121,7 @@ exports.getNodeInfo = async (req, res) => {
  * @param {*} req Default express req from router
  * @param {*} res Defualt express res from router
  */
-exports.nodeCheckIn = async  (req, res) => {
+exports.nodeCheckIn = async (req, res) => {
     if (!req.body.id) return res.status(400).json("No id specified");
     getNodeInfoFromId(req.body.id, (nodeInfo) => {
         let checkInObject = {};
@@ -87,7 +133,7 @@ exports.nodeCheckIn = async  (req, res) => {
         if (req.body.name && req.body.name != nodeInfo.name) {
             checkInObject._name = req.body.name;
             isObjectUpdated = true;
-        } 
+        }
 
         if (req.body.ip && req.body.ip != nodeInfo.ip) {
             checkInObject._ip = req.body.ip;
@@ -115,9 +161,9 @@ exports.nodeCheckIn = async  (req, res) => {
         }
 
         // If no changes are made tell the client
-        if (!isObjectUpdated) return res.status(200).json("No keys updated");        
+        if (!isObjectUpdated) return res.status(200).json("No keys updated");
 
-        log.INFO("Updating the following keys for ID: ", req.body.id, checkInObject);        
+        log.INFO("Updating the following keys for ID: ", req.body.id, checkInObject);
 
         checkInObject._id = req.body.id;
         checkInObject = new nodeObject(checkInObject);
@@ -125,40 +171,28 @@ exports.nodeCheckIn = async  (req, res) => {
         if (!nodeInfo) {
             log.WARN("No existing node found with this ID, adding node: ", checkInObject);
             addNewNode(checkInObject, (newNode) => {
-                return res.status(201).json({"updatedKeys": newNode});
+                return res.status(201).json({ "updatedKeys": newNode });
             });
         }
-        else {            
+        else {
             updateNodeInfo(checkInObject, () => {
-                return res.status(202).json({"updatedKeys": checkInObject});
+                return res.status(202).json({ "updatedKeys": checkInObject });
             });
-        }        
+        }
     });
 }
 
 /**
- * Request the node to join the specified server/channel and listen to the specified resource
+ * Requests a specific node to check in with the server, if it's online
  * 
  * @param {*} req Default express req from router
  * @param {*} res Defualt express res from router
- * @param req.body.clientId The client ID to join discord with (NOT dev portal ID, right click user -> Copy ID)
- * @param req.body.channelId The Channel ID to join in Discord
- * @param req.body.presetName The preset name to listen to in Discord
  */
-exports.requestNodeJoinServer = async (req, res) => {
-    if (!req.body.clientId || !req.body.channelId || !req.body.presetName) return res.status(400).json("Missing information in request, requires clientId, channelId, presetName");
-    await joinServerWrapper(req.body.presetName, req.body.channelId, req.body.clientId);
-}
-
-/**
- * 
- * @param {*} req Default express req from router
- * @param {*} res Defualt express res from router
- * @param {*} req.body.clientId The client ID to request to leave the server 
- */
-exports.requestNodeLeaveServer = async (req, res) => {
-    if (!req.body.ClientId) return res.status(400).json("Missing client ID in request");
-    await leaveServerWrapper({clientId: req.body.ClientId});
+exports.requestNodeCheckIn = async (req, res) => {
+    if (!req.params.nodeId) return res.status(400).json("No Node ID supplied in request");
+    const node = await getNodeInfoFromId(req.params.nodeId);
+    if (!node) return res.status(400).json("No Node with the ID given");
+    checkInWithNode(node);
 }
 
 /**
@@ -172,49 +206,21 @@ exports.nodeMonitorService = class nodeMonitorService {
     /**
      * Start the node monitor service in the background
      */
-    async start(){
-	    // Wait for the a portion of the refresh period before checking in with the nodes, so the rest of the bot can start
-        await new Promise(resolve => setTimeout(resolve, refreshInterval/10));
+    async start() {
+        // Wait for the a portion of the refresh period before checking in with the nodes, so the rest of the bot can start
+        await new Promise(resolve => setTimeout(resolve, refreshInterval / 10));
 
         log.INFO("Starting Node Monitor Service");
         // Check in before starting the infinite loop
-        await this.checkInWithOnlineNodes();
-        
-        
-        while(true){
+        await checkInWithOnlineNodes();
+
+
+        while (true) {
             // Wait for the refresh interval, then wait for the posts to return, then wait a quarter of the refresh interval to make sure everything is cleared up
             await new Promise(resolve => setTimeout(resolve, refreshInterval));
-            await this.checkInWithOnlineNodes();
+            await checkInWithOnlineNodes();
             await new Promise(resolve => setTimeout(resolve, refreshInterval / 4));
             continue;
-        }        
-    }
-
-    /**
-     * Check in with all online nodes and mark any nodes that are actually offline
-     */
-    async checkInWithOnlineNodes(){
-        getOnlineNodes((nodes) => {
-            this.log.DEBUG("Online Nodes: ", nodes);
-            for (const node of nodes) {
-                const reqOptions = new requestOptions("/client/requestCheckIn", "GET", node.ip, node.port)
-                sendHttpRequest(reqOptions, "", (responseObj) => {
-                    if (responseObj) {
-                        this.log.DEBUG("Response from: ", node.name, responseObj);
-                    }
-                    else {
-                        this.log.DEBUG("No response from node, assuming it's offline");
-                        const offlineNode = new nodeObject({ _online: 0, _id: node.id });
-                        this.log.DEBUG("Offline node update object: ", offlineNode);
-                        updateNodeInfo(offlineNode, (sqlResponse) => {
-                            if (!sqlResponse) this.log.ERROR("No response from SQL object");
-
-                            this.log.DEBUG("Updated offline node: ", sqlResponse);
-                        })
-                    }
-                })
-            }
-            return;
-        });
+        }
     }
 }
diff --git a/Server/public/res/css/main.css b/Server/public/res/css/main.css
index d057e2a..6384148 100644
--- a/Server/public/res/css/main.css
+++ b/Server/public/res/css/main.css
@@ -139,4 +139,38 @@ a {
 /* Global Section */
 .sidebar-container {
     min-height: 94.2vh;
-}
\ No newline at end of file
+}
+
+/* User table section */
+
+.label {
+    border-radius: 3px;
+    font-size: 1.1em;
+    font-weight: 600;
+}
+
+.user-list tbody td .user-subhead {
+    font-size: 1em;
+    font-style: italic;
+}
+
+.table thead tr th {
+    text-transform: uppercase;
+    font-size: 0.875em;
+}
+
+.table thead tr th {
+    border-bottom: 2px solid #e7ebee;
+}
+
+.table tbody tr td:first-child {
+    font-size: 1.125em;
+    font-weight: 300;
+}
+
+.table tbody tr td {
+    font-size: 0.875em;
+    vertical-align: middle;
+    border-top: 1px solid #e7ebee;
+    padding: 12px 8px;
+}
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
new file mode 100644
index 0000000..a1530f4
--- /dev/null
+++ b/Server/public/res/js/node.js
@@ -0,0 +1,50 @@
+function addFrequencyInput(system){
+    // 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.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 = 'nodeFreq';
+    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.appendChild(childRow);
+
+    document.getElementById(`frequencyRow_${system.replaceAll(" ", "_")}`).appendChild(colParent);
+}
+
+function checkInByNodeId(nodeId){
+    const Http = new XMLHttpRequest();
+    const url='/nodes/'+nodeId;
+    Http.open("GET", url);
+    Http.send();
+
+    Http.onreadystatechange = (e) => {
+    console.log(Http.responseText)
+    }
+}
\ No newline at end of file
diff --git a/Server/routes/nodes.js b/Server/routes/nodes.js
index b90e8db..773bc45 100644
--- a/Server/routes/nodes.js
+++ b/Server/routes/nodes.js
@@ -28,8 +28,7 @@ router.get('/nodeInfo', nodesController.getNodeInfo);
 // Client checkin with the server to update information
 router.post('/nodeCheckIn', nodesController.nodeCheckIn);
 
-// TODO Need to authenticate this request
-// Request a particular client to join a particular channel listening to a particular preset
-router.post('/joinServer', nodesController.requestNodeJoinServer);
+// Request a node to check in with the server
+router.get('/:nodeId', nodesController.requestNodeCheckIn);
 
 module.exports = router;
diff --git a/Server/utilities/recordHelper.js b/Server/utilities/recordHelper.js
index 5464374..eb26ae3 100644
--- a/Server/utilities/recordHelper.js
+++ b/Server/utilities/recordHelper.js
@@ -118,8 +118,7 @@ class nodeObject {
         this.ip = _ip;
         this.port = _port;
         this.location = _location;        
-        this.nearbySystems = _nearbySystems;
-        if (this.nearbySystems) this.presets = Object.keys(_nearbySystems);
+        this.nearbySystems = _nearbySystems;        
         this.online = _online;
     }
 }
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
index 941e326..05cd447 100644
--- a/Server/views/node.ejs
+++ b/Server/views/node.ejs
@@ -1,41 +1,154 @@
 <%- include('partials/htmlHead.ejs') %>
-<div class="card mb-4">
-    <div class="card-header">
-        Account Details
-        <% if(node.online){%> <span class="badge badge-soft-success mb-0">Online</span>
-        <% } else {%> <span class="badge badge-soft-danger mb-0">Offline</span>
-        <% } %>
+    <div class="container">
+        <div class="card mb-4">
+            <div class="card-header">
+                <p>
+                    <span class="fs-2 fw-semibold">
+                        Node Details
+                    </span>                                    
+                </p>                
+            </div>
+            <div class="card-body">
+                <form>
+                    <div class="row gx-3 mb-3">
+                        <div class="">
+                            
+                        </div>
+                        <div class="col-md-6">
+                            <label class="small mb-1" for="nodeId">Node ID (this is the assigned Node ID and cannot be
+                                changed)</label>
+                            <input class="form-control" id="nodeId" type="text" value="<%=node.id%>" disabled></input>
+                        </div>                        
+                        <div class="col-md-6">                            
+                            <label class="small mb-1" for="nodeStatus">Online Status:</label>
+                            <% if(node.online){%> <span class="badge badge-soft-success mb-0 align-middle fs-6" id="nodeStatus">Online</span>
+                            <% } else {%> <span class="badge badge-soft-danger mb-0 align-middle fs-6">Offline</span>
+                            <% } %>
+                            <hr>
+                            <!-- Join Server button-->
+                            <a type="button" class="btn btn-info <% if(!node.online) { %>disabled<% } %>" href="/join/<%=node.id%>">Join Server</a>
+                            <!-- Leave Server button  -->
+                            <a type="button" class="btn btn-danger <% if(!node.online) { %>disabled<% } %>" href="/leave/<%=node.id%>">Leave Server</a>
+                            <!-- Checkin with client button  -->
+                            <a type="button" class="btn btn-secondary" href="#" onclick="checkInByNodeId('<%=node.id%>')">Check-in with Node</a>
+                        </div>
+                    </div>
+
+                    <div class="row gx-3 mb-3">
+                        <div class="col-md-12">
+                            <label class="small mb-1" for="inputNodeName">Node Name:</label>
+                            <input class="form-control" id="inputNodeName" type="text" value="<%=node.name%>"></input>
+                        </div>
+                    </div>
+                    <div class="row gx-3 mb-3">
+                        <div class="col-md-4">
+                            <label class="small mb-1" for="inputNodeIp">Node IP Address (that the server can
+                                contact):</label>
+                            <input class="form-control" id="inputNodeIp" type="text" value="<%=node.ip%>"></input>
+                        </div>
+                        <div class="col-md-2">
+                            <label class="small mb-1" for="inputOrgName">Node Port (with the API):</label>
+                            <input class="form-control" id="inputOrgName" type="number" value="<%=node.port%>"></input>
+                        </div>
+                    </div>
+                    <div class="mb-3">
+                        <label class="small mb-1" for="inputNodeLocation">Node Location (physical location):</label>
+                        <input class="form-control" id="inputNodeLocation" type="location" value="<%=node.location%>"></input>
+                    </div>
+                    <h4>
+                        Nearby Systems
+                    </h4>
+                    <hr>
+                    <div class="row">
+                        <div class="col-lg-12">
+                            <div class="main-box no-header clearfix">
+                                <div class="main-box-body clearfix">
+                                    <div class="table-responsive">
+                                        <table class="table user-list <% if(!node.online) { %>disabled<% } %>">
+                                            <thead>
+                                                <tr>
+                                                    <th><span>System Name</span></th>
+                                                    <th><span>Frequencies</span></th>
+                                                    <th><span>Protocol</span></th>
+                                                    <th>&nbsp;</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <% for(const system in node.nearbySystems){ %>
+                                                    <tr>
+                                                        <td>
+                                                            <%= system %>
+                                                        </td>
+                                                        <td>
+                                                            <% if(node.nearbySystems[system].frequencies.length> 1) { %>
+                                                                <ul>
+                                                                    <% for(const frequency of
+                                                                        node.nearbySystems[system].frequencies) { %>
+                                                                        <li>
+                                                                            <%=frequency%> MHz
+                                                                        </li>
+                                                                        <% } %>
+                                                                </ul>
+                                                                <% } else { const
+                                                                    frequency=node.nearbySystems[system].frequencies[0]
+                                                                    %>
+                                                                    <%=frequency%> MHz
+                                                                        <% } %>
+                                                        </td>
+                                                        <td>
+                                                            <span class="label label-default text-uppercase">
+                                                                <%= node.nearbySystems[system].mode %>
+                                                            </span>
+                                                        </td>
+                                                        <td>
+                                                            <a href="#" class="table-link text-info label"
+                                                                data-bs-toggle="modal"
+                                                                data-bs-target="#updateSystemModal_<%=system.replaceAll(" ", "_")%>">
+                                                                <i class="bi bi-pencil"></i>
+                                                            </a>
+                                                            <a href="#" class="table-link text-danger label">
+                                                                <i class="bi bi-trash"></i>
+                                                            </a>
+                                                        </td>
+                                                    </tr>
+                                                    <% // Update system modal %>        
+                                                    <%- include("partials/modifySystemModal.ejs", {'system': system, 'frequencies': node.nearbySystems[system].frequencies}) %>
+                                                    <% } %>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <!-- Save changes button-->
+                    <button class="btn btn-primary <% if(!node.online) { %>disabled<% } %>" type="button">Save changes</button>
+                    <!-- Button trigger modal -->
+                    <button type="button" class="btn btn-primary float-right <% if(!node.online) { %>disabled<% } %>" data-bs-toggle="modal"
+                        data-bs-target="#newSystemModal">Add New System</button>
+                </form>
+            </div>
+        </div>
     </div>
-    <div class="card-body">
-        <form>
-            <div class="mb-3">
-                <label class="small mb-1" for="nodeId">Node ID (this is the assigned Node ID and cannot be changed)</label>
-                <input class="form-control" id="nodeId" type="text" value="<%=node.id%>" disabled>
-            </div>
-            <div class="row gx-3 mb-3">
-                <div class="col-md-12">
-                    <label class="small mb-1" for="inputNodeName">Node Name</label>
-                    <input class="form-control" id="inputNodeName" type="text" value="<%=node.name%>">
-                </div>                
-            </div>
-            <div class="row gx-3 mb-3">
-                <div class="col-md-4">
-                    <label class="small mb-1" for="inputNodeIp">Node IP Address (that the server can contact)</label>
-                    <input class="form-control" id="inputNodeIp" type="text" value="<%=node.ip%>">
+
+    <% // new System Modal %>
+    <div class="modal fade" id="newSystemModal" tabindex="-1" aria-labelledby="newSystemModal" aria-hidden="true">
+        <div class="modal-dialog modal-dialog-centered">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <h1 class="modal-title fs-5" id="newSystemModal">Add a New System</h1>
+                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                 </div>
-                <div class="col-md-2">
-                    <label class="small mb-1" for="inputOrgName">Node Port (with the API)</label>
-                    <input class="form-control" id="inputOrgName" type="number" value="<%=node.port%>">
+                <div class="modal-body">
+                    ...
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+                    <button type="button" class="btn btn-primary">Save changes</button>
                 </div>
             </div>
-            <div class="mb-3">
-                <label class="small mb-1" for="inputNodeLocation">Node Location (physical location)</label>
-                <input class="form-control" id="inputNodeLocation" type="location" value="<%=node.location%>">
-            </div>            
-            <!-- Save changes button-->
-            <button class="btn btn-primary" type="button">Save changes</button>
-        </form>
+        </div>
     </div>
-</div>
 <%- include('partials/bodyEnd.ejs') %>
+<script src="/res/js/node.js"></script>
 <%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/bodyEnd.ejs b/Server/views/partials/bodyEnd.ejs
index 2a347cf..992066b 100644
--- a/Server/views/partials/bodyEnd.ejs
+++ b/Server/views/partials/bodyEnd.ejs
@@ -7,5 +7,6 @@
     integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz"
     crossorigin="anonymous"></script>
 
-<script src="https://code.jquery.com/jquery-3.7.0.slim.min.js"
-    integrity="sha256-tG5mcZUtJsZvyKAxYLVXrmjKBVLd6VpVccqz/r4ypFE=" crossorigin="anonymous"></script>
\ No newline at end of file
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"
+    integrity="sha512-3gJwYpMe3QewGELv8k/BX9vcqhryRdzRMxVfq6ngyWXwo03GFEzjsUm8Q7RZcHPHksttq7/GFoxjCVUjkjvPdw=="
+    crossorigin="anonymous" referrerpolicy="no-referrer"></script>
\ No newline at end of file
diff --git a/Server/views/partials/modifySystemModal.ejs b/Server/views/partials/modifySystemModal.ejs
new file mode 100644
index 0000000..d24e83f
--- /dev/null
+++ b/Server/views/partials/modifySystemModal.ejs
@@ -0,0 +1,54 @@
+<div class="modal fade" id="updateSystemModal_<%=system.replaceAll(" ", "_")%>" tabindex="-1" aria-labelledby="updateSystemModal_<%=system.replaceAll(" ", "_")%>"
+    aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h1 class="modal-title fs-5" id="updateSystemModal_<%=system.replaceAll(" ", "_")%>">Update <%=system%></h1>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <div class="card mb-4">
+                    <div class="card-body">
+                        <form>
+                            <div class="row gx-3 mb-3" id="frequencyRow_<%=system.replaceAll(" ", "_")%>">
+                                <label class="small mb-1 fs-6" for="nodeFreq">Frequencies</label>
+                                <% for(const frequency of frequencies) { %>
+                                <div class="col-md-6 mb-1">
+                                    <div class="row px-1">
+                                        <div class="col-10">
+                                            <input class="form-control" id="nodeFreq" type="text" value="<%= frequency %>"></input>
+                                        </div>
+                                        <div class="col-2">
+                                            <a class="align-middle float-left" href="#"><i class="bi bi-x-circle text-black"></i></a>
+                                        </div>
+                                    </div>                                                                                        
+                                </div>
+                                <% } %>                                                                                    
+                            </div>
+                            <button type="button" class="btn btn-info text-white" onclick="addFrequencyInput('<%=system%>')">Add Frequency</button>
+                            <hr>                                                                    
+                            <div class="row gx-3 mb-3">
+                                <div class="col-md-6">
+                                    <label class="small mb-1 fs-6" for="modeSelect">Mode</label>
+                                    <br>
+                                    <select class="custom-select" id="modeSelect">
+                                        <option value="<%= node.nearbySystems[system].mode %>" selected><span class="text-uppercase"><%= node.nearbySystems[system].mode %></span></option>
+                                        <% if(node.nearbySystems[system].mode == "p25") { %>                                                                                                
+                                            <option value="nbfm">NBFM</option>
+                                        <% } else if (node.nearbySystems[system].mode == "nbfm") { %>
+                                            <option value="p25">P25</option>
+                                        <% } %>
+                                    </select>
+                                </div>
+                            </div>
+                        </form>
+                    </div>
+                </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+                <button type="button" class="btn btn-primary">Save changes</button>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/Server/views/partials/navbar.ejs b/Server/views/partials/navbar.ejs
index ccac10e..169185f 100644
--- a/Server/views/partials/navbar.ejs
+++ b/Server/views/partials/navbar.ejs
@@ -1,12 +1,13 @@
 <nav class="navbar navbar-expand-lg bg-body-tertiary" data-bs-theme="dark">
     <div class="container-fluid">
-        <a class="navbar-brand" href="#">Navbar</a>
+        <a class="navbar-brand" href="#">Node Master</a>
         <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
             aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
             <span class="navbar-toggler-icon"></span>
         </button>
         <div class="collapse navbar-collapse" id="navbarSupportedContent">
             <ul class="navbar-nav me-auto mb-2 mb-lg-0">
+                <% /*
                 <li class="nav-item">
                     <a class="nav-link active" aria-current="page" href="#">Home</a>
                 </li>
@@ -30,6 +31,7 @@
                 <li class="nav-item">
                     <a class="nav-link disabled">Disabled</a>
                 </li>
+                */%>
             </ul>
             <form class="d-flex" role="search">
                 <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
diff --git a/Server/views/partials/sidebar.ejs b/Server/views/partials/sidebar.ejs
index 8eb5815..4b2840e 100644
--- a/Server/views/partials/sidebar.ejs
+++ b/Server/views/partials/sidebar.ejs
@@ -3,64 +3,18 @@
         <div class="col-auto col-md-3 col-xl-2 px-sm-2 px-0 bg-dark">
             <div class="d-flex flex-column align-items-center align-items-sm-start px-3 pt-2 text-white sidebar-container">
                 <ul class="nav nav-pills flex-column mb-sm-auto mb-0 align-items-center align-items-sm-start" id="menu">
-                    <li class="nav-item">
-                        <a href="#" class="nav-link align-middle px-0">
-                            <i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Home</span>
-                        </a>
-                    </li>
                     <li>
-                        <a href="#submenu1" data-bs-toggle="collapse" class="nav-link px-0 align-middle">
+                        <a href="/" class="nav-link px-0 align-middle">
                             <i class="fs-4 bi-speedometer2"></i> <span class="ms-1 d-none d-sm-inline">Dashboard</span>
-                        </a>
-                        <ul class="collapse nav flex-column ms-1" id="submenu1" data-bs-parent="#menu">
-                            <li class="w-100">
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 1 </a>
-                            </li>
-                            <li>
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 2 </a>
-                            </li>
-                        </ul>
-                    </li>
+                        </a>                        
+                    </li>                                        
                     <li>
-                        <a href="#" class="nav-link px-0 align-middle">
-                            <i class="fs-4 bi-table"></i> <span class="ms-1 d-none d-sm-inline">Orders</span></a>
-                    </li>
-                    <li>
-                        <a href="#submenu2" data-bs-toggle="collapse" class="nav-link px-0 align-middle ">
-                            <i class="fs-4 bi-bootstrap"></i> <span class="ms-1 d-none d-sm-inline">Bootstrap</span></a>
-                        <ul class="collapse nav flex-column ms-1" id="submenu2" data-bs-parent="#menu">
-                            <li class="w-100">
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 1</a>
-                            </li>
-                            <li>
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Item</span> 2</a>
-                            </li>
-                        </ul>
-                    </li>
-                    <li>
-                        <a href="#submenu3" data-bs-toggle="collapse" class="nav-link px-0 align-middle">
-                            <i class="fs-4 bi-grid"></i> <span class="ms-1 d-none d-sm-inline">Products</span> </a>
-                        <ul class="collapse nav flex-column ms-1" id="submenu3" data-bs-parent="#menu">
-                            <li class="w-100">
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 1</a>
-                            </li>
-                            <li>
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 2</a>
-                            </li>
-                            <li>
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 3</a>
-                            </li>
-                            <li>
-                                <a href="#" class="nav-link px-0"> <span class="d-none d-sm-inline">Product</span> 4</a>
-                            </li>
-                        </ul>
-                    </li>
-                    <li>
-                        <a href="#" class="nav-link px-0 align-middle">
-                            <i class="fs-4 bi-people"></i> <span class="ms-1 d-none d-sm-inline">Customers</span> </a>
+                        <a href="/controller" class="nav-link px-0 align-middle">
+                            <i class="fs-4 bi-grid"></i> <span class="ms-1 d-none d-sm-inline">Controller</span> </a>                        
                     </li>
                 </ul>
                 <hr>
+                <% /*
                 <div class="dropdown pb-4 fixed-bottom px-3">
                     <a href="#" class="d-flex align-items-center text-white text-decoration-none dropdown-toggle"
                         id="dropdownUser1" data-bs-toggle="dropdown" aria-expanded="false">
@@ -78,6 +32,7 @@
                         <li><a class="dropdown-item" href="#">Sign out</a></li>
                     </ul>
                 </div>
+                */%>
             </div>
         </div>
         <div class="col py-3">
\ No newline at end of file

From f55361575ed398159b5fe8bae1cd2ec3a45522dc Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 01:43:13 -0400
Subject: [PATCH 33/57] #37 Working Joining and Leaving

---
 Server/commands/join.js               |  91 +---------------
 Server/commands/leave.js              |  34 +-----
 Server/controllers/adminController.js | 151 +++++++++++++++++++++++---
 Server/controllers/nodesController.js |   3 +-
 Server/public/res/js/node.js          |  93 ++++++++++++++++
 Server/utilities/recordHelper.js      |   3 +-
 Server/views/node.ejs                 |   7 +-
 Server/views/partials/htmlHead.ejs    |   1 +
 Server/views/partials/joinModal.ejs   |  44 ++++++++
 9 files changed, 285 insertions(+), 142 deletions(-)
 create mode 100644 Server/views/partials/joinModal.ejs

diff --git a/Server/commands/join.js b/Server/commands/join.js
index e7f59b3..d608d39 100644
--- a/Server/commands/join.js
+++ b/Server/commands/join.js
@@ -1,98 +1,13 @@
 // Modules
 const { SlashCommandBuilder } = require('discord.js');
 const { DebugBuilder } = require("../utilities/debugBuilder");
-const { getMembersInRole, getAllClientIds, filterAutocompleteValues, getKeyByArrayValue } = require("../utilities/utils");
-const { requestOptions, sendHttpRequest } = require("../utilities/httpRequests");
-const { getOnlineNodes, updateNodeInfo, addNodeConnection, getConnectionByNodeId, getAllConnections } = require("../utilities/mysqlHandler");
+const { filterAutocompleteValues } = require("../utilities/utils");
+const { getOnlineNodes, getAllConnections } = require("../utilities/mysqlHandler");
+const { joinServerWrapper } = require("../controllers/adminController");
 
 // Global Vars
 const log = new DebugBuilder("server", "join");
 
-/**
- * * This wrapper will check if there is an available node with the requested preset and if so checks for an available client ID to join with
- * 
- * @param {*} presetName The preset name to listen to on the client
- * @param {*} channelId The channel ID to join the bot to 
- * @param {*} connections EITHER A collection of clients that are currently connected OR a single discord client ID (NOT dev portal ID) that should be used to join the server with
- * @param {number} nodeId [OPTIONAL] The node ID to join with (will join with another node if given node is not available)
- * @returns 
- */
-async function joinServerWrapper(presetName, channelId, connections, nodeId = 0) {
-	// Get nodes online
-	var onlineNodes = await new Promise((recordResolve, recordReject) => {
-		getOnlineNodes((nodeRows) => {
-			recordResolve(nodeRows);
-		});
-	});		
-
-	// Check which nodes have the selected preset
-	onlineNodes = onlineNodes.filter(node => node.presets.includes(presetName));
-	log.DEBUG("Filtered Online Nodes: ", onlineNodes);
-
-	// Check if any nodes with this preset are available
-	var nodesCurrentlyAvailable = [];
-	for (const node of onlineNodes) {
-		const currentConnection = await getConnectionByNodeId(node.id);
-		log.DEBUG("Checking to see if there is a connection for Node: ", node, currentConnection);
-		if(!currentConnection) nodesCurrentlyAvailable.push(node);		
-	}
-	log.DEBUG("Nodes Currently Available: ", nodesCurrentlyAvailable);
-
-	// If not, let the user know	
-	if (!nodesCurrentlyAvailable.length > 0) return Error("All nodes with this channel are unavailable, consider swapping one of the currently joined bots.");
-
-	// If so, join with the first node
-	var availableClientIds = await getAllClientIds();
-	log.DEBUG("All clients: ", Object.keys(availableClientIds));
-
-	var selectedClientId;
-	if (typeof connections === 'string') {
-		for (const availableClientId of availableClientIds) {
-			if (availableClientId.discordId != connections ) selectedClientId = availableClientId;
-		}		
-	}
-	else {
-		log.DEBUG("Open connections: ", connections);
-		for (const connection of connections) {
-			log.DEBUG("Used Client ID: ", connection);
-			availableClientIds = availableClientIds.filter(cid => cid.discordId != connection.clientObject.discordId);			
-		}
-
-		log.DEBUG("Available Client IDs: ", availableClientIds);
-
-		if (!Object.keys(availableClientIds).length > 0) return log.ERROR("All client ID have been used, consider swapping one of the curretly joined bots or adding more Client IDs to the pool.")	
-		selectedClientId = availableClientIds[0];
-	}
-
-	let selectedNode;
-	if (nodeId > 0) selectedNode = getKeyByArrayValue(nodesCurrentlyAvailable, nodeId);
-	
-	if (!selectedNode) selectedNode = nodesCurrentlyAvailable[0];
-	
-	const reqOptions = new requestOptions("/bot/join", "POST", selectedNode.ip, selectedNode.port);	
-	const postObject = {
-		"channelId": channelId,
-		"clientId": selectedClientId.clientId,
-		"presetName": presetName
-	};
-	log.INFO("Post Object: ", postObject);
-	sendHttpRequest(reqOptions, JSON.stringify(postObject), async (responseObj) => {
-		log.VERBOSE("Response Object from node ", selectedNode, responseObj);
-		if (!responseObj || !responseObj.statusCode == 200) return false;		
-		// Node has connected to discord
-		// Updating node Object in DB
-		const updatedNode = await updateNodeInfo(selectedNode);
-		log.DEBUG("Updated Node: ", updatedNode);
-
-		// Adding a new node connection
-		const nodeConnection = await addNodeConnection(selectedNode, selectedClientId);
-		log.DEBUG("Node Connection: ", nodeConnection);
-	});	
-
-	return selectedClientId;
-}
-exports.joinServerWrapper = joinServerWrapper;
-
 module.exports = {
 	data: new SlashCommandBuilder()
 		.setName('join')
diff --git a/Server/commands/leave.js b/Server/commands/leave.js
index e65de07..760c5b0 100644
--- a/Server/commands/leave.js
+++ b/Server/commands/leave.js
@@ -2,41 +2,12 @@
 const { SlashCommandBuilder } = require('discord.js');
 const { DebugBuilder } = require("../utilities/debugBuilder");
 const { getAllClientIds, getKeyByArrayValue, filterAutocompleteValues } = require("../utilities/utils");
-const { requestOptions, sendHttpRequest } = require("../utilities/httpRequests");
-const { checkNodeConnectionByClientId, removeNodeConnectionByNodeId, getAllConnections } = require('../utilities/mysqlHandler');
+const { getAllConnections } = require('../utilities/mysqlHandler');
+const { leaveServerWrapper } = require('../controllers/adminController');
 
 // Global Vars
 const log = new DebugBuilder("server", "leave");
 
-/**
- * 
- * @param {*} clientIdObject The client ID object for the node to leave the server. Either 'clientId'||'name' can be set.
- * @returns 
- */
-async function leaveServerWrapper(clientIdObject) {
-	if (!clientIdObject.clientId || !clientIdObject.name) return log.ERROR("Tried to leave server without client ID and/or Name");
-
-	const node = await checkNodeConnectionByClientId(clientIdObject);
-	
-	reqOptions = new requestOptions("/bot/leave", "POST", node.ip, node.port);
-
-	const responseObj = await new Promise((recordResolve, recordReject) => {
-		sendHttpRequest(reqOptions, JSON.stringify({}), async (responseObj) => {
-			recordResolve(responseObj);
-		});
-	});	
-
-	log.VERBOSE("Response Object from node ", node, responseObj);
-	if (!responseObj || !responseObj.statusCode == 202) return false;		
-	// Node has disconnected from discor
-	// Removing the node connection from the DB
-	const removedConnection = removeNodeConnectionByNodeId(node.id);
-	log.DEBUG("Removed Node Connection: ", removedConnection);
-
-	return;
-}
-exports.leaveServerWrapper = leaveServerWrapper;
-
 module.exports = {
 	data: new SlashCommandBuilder()
 		.setName('leave')
@@ -64,7 +35,6 @@ module.exports = {
 			log.DEBUG("Client names: ", clinetIds);
 			const clientDiscordId = getKeyByArrayValue(clinetIds, {'name': botName});
 			log.DEBUG("Selected bot: ", clinetIds[clientDiscordId]);
-			// Need to create a table in DB to keep track of what bots have what IDs or an endpoint on the clients to return what ID they are running with
 			await leaveServerWrapper(clinetIds[clientDiscordId]);
 			
 			await interaction.editReply(`**${clinetIds[clientDiscordId].name}** has been disconnected`);  // This will reply to the initial interaction
diff --git a/Server/controllers/adminController.js b/Server/controllers/adminController.js
index fdef282..bc699b2 100644
--- a/Server/controllers/adminController.js
+++ b/Server/controllers/adminController.js
@@ -4,12 +4,9 @@ require('dotenv').config();
 const { DebugBuilder } = require("../utilities/debugBuilder.js");
 const log = new DebugBuilder("server", "adminController");
 // Utilities
-const mysqlHandler = require("../utilities/mysqlHandler");
-const utils = require("../utilities/utils");
-const requests = require("../utilities/httpRequests");
-const { leaveServerWrapper } = require("../commands/leave");
-const { joinServerWrapper } = require("../commands/join");
-
+const { getAllClientIds } = require("../utilities/utils");
+const { getOnlineNodes, updateNodeInfo, addNodeConnection, getConnectionByNodeId, getNodeInfoFromId, checkNodeConnectionByClientId, removeNodeConnectionByNodeId } = require("../utilities/mysqlHandler");
+const { requestOptions, sendHttpRequest } = require("../utilities/httpRequests");
 
 /** Get the presets of all online nodes, can be used for functions
  * 
@@ -17,15 +14,15 @@ const { joinServerWrapper } = require("../commands/join");
  * @returns {*} A list of the systems online
  */
 async function getPresetsOfOnlineNodes(callback) {
-    mysqlHandler.getOnlineNodes((onlineNodes) => {
+    getOnlineNodes((onlineNodes) => {
         return callback(onlineNodes);
     });
 }
 
 async function getNodeBotStatus(nodeId, callback) {
-    mysqlHandler.getNodeInfoFromId(nodeId, (nodeObject) =>{
-        reqOptions = new requests.requestOptions("/bot/status", "GET", nodeObject.ip, nodeObject.port, undefined, 5);
-        requests.sendHttpRequest(reqOptions, JSON.stringify({}), (responseObject) => {
+    getNodeInfoFromId(nodeId, (nodeObject) =>{
+        reqOptions = new requestOptions("/bot/status", "GET", nodeObject.ip, nodeObject.port, undefined, 5);
+        sendHttpRequest(reqOptions, JSON.stringify({}), (responseObject) => {
             if (responseObject === false) {
                 // Bot is joined                
             }
@@ -73,21 +70,141 @@ exports.joinPreset = async (req, res) => {
 
     const joinedClient = await joinServerWrapper(preset, channelId, clientId, nodeId);
     if (!joinedClient) return res.send(400).json("No joined client");
-    return res.send(200).json(joinedClient);
+    return res.status(200).json(joinedClient);
 }
 
 /** Request a node to join the server listening to a specific preset
  * 
  * @param {*} req Express request parameter
  * @param {*} res Express response parameter
- * @var {*} req.body.clientId The ID of the client to disconnect
+ * @var {*} req.body.nodeId The ID of the node to disconnect
  */
 exports.leaveServer = async (req, res) => {
-    if (!req.body.clientId) return res.status(400).json("No clientID specified");
+    if (!req.body.nodeId) return res.status(400).json("No node ID specified");
 
-    const clientId = req.body.clientId;
+    const nodeId = req.body.nodeId;
+    const currentConnection = await getConnectionByNodeId(nodeId);
+    log.DEBUG("Current Connection for node: ", currentConnection);
 
-    await leaveServerWrapper(clientId)
+    await leaveServerWrapper(currentConnection.clientObject)
 
-    return res.send(200);
-}
\ No newline at end of file
+    return res.status(200).json(currentConnection.clientObject.name);
+}
+
+/**
+ * * This wrapper will check if there is an available node with the requested preset and if so checks for an available client ID to join with
+ * 
+ * @param {*} presetName The preset name to listen to on the client
+ * @param {*} channelId The channel ID to join the bot to 
+ * @param {*} connections EITHER A collection of clients that are currently connected OR a single discord client ID (NOT dev portal ID) that should be used to join the server with
+ * @param {number} nodeId [OPTIONAL] The node ID to join with (will join with another node if given node is not available)
+ * @returns 
+ */
+async function joinServerWrapper(presetName, channelId, connections, nodeId = 0) {
+	// Get nodes online
+	var onlineNodes = await new Promise((recordResolve, recordReject) => {
+		getOnlineNodes((nodeRows) => {
+			recordResolve(nodeRows);
+		});
+	});		
+
+	// Check which nodes have the selected preset
+	onlineNodes = onlineNodes.filter(node => node.presets.includes(presetName));
+	log.DEBUG("Filtered Online Nodes: ", onlineNodes);
+
+	// Check if any nodes with this preset are available
+	var nodesCurrentlyAvailable = [];
+	for (const node of onlineNodes) {
+		const currentConnection = await getConnectionByNodeId(node.id);
+		log.DEBUG("Checking to see if there is a connection for Node: ", node, currentConnection);
+		if(!currentConnection) nodesCurrentlyAvailable.push(node);		
+	}
+	log.DEBUG("Nodes Currently Available: ", nodesCurrentlyAvailable);
+
+	// If not, let the user know	
+	if (!nodesCurrentlyAvailable.length > 0) return Error("All nodes with this channel are unavailable, consider swapping one of the currently joined bots.");
+
+	// If so, join with the first node
+	var availableClientIds = await getAllClientIds();
+	log.DEBUG("All clients: ", Object.keys(availableClientIds));
+
+	var selectedClientId;
+	if (typeof connections === 'string') {
+		for (const availableClientId of availableClientIds) {
+			if (availableClientId.discordId != connections ) selectedClientId = availableClientId;
+		}		
+	}
+	else {
+		log.DEBUG("Open connections: ", connections);
+		for (const connection of connections) {
+			log.DEBUG("Used Client ID: ", connection);
+			availableClientIds = availableClientIds.filter(cid => cid.discordId != connection.clientObject.discordId);			
+		}
+
+		log.DEBUG("Available Client IDs: ", availableClientIds);
+
+		if (!Object.keys(availableClientIds).length > 0) return log.ERROR("All client ID have been used, consider swapping one of the curretly joined bots or adding more Client IDs to the pool.")	
+		selectedClientId = availableClientIds[0];
+	}
+
+	let selectedNode;
+	if (nodeId > 0) {
+        for(const availableNode of nodesCurrentlyAvailable){
+            if (availableNode.id == nodeId) selectedNode = availableNode;
+        }        
+    }
+	
+	if (!selectedNode) selectedNode = nodesCurrentlyAvailable[0];
+	
+	const reqOptions = new requestOptions("/bot/join", "POST", selectedNode.ip, selectedNode.port);	
+	const postObject = {
+		"channelId": channelId,
+		"clientId": selectedClientId.clientId,
+		"presetName": presetName
+	};
+	log.INFO("Post Object: ", postObject);
+	sendHttpRequest(reqOptions, JSON.stringify(postObject), async (responseObj) => {
+		log.VERBOSE("Response Object from node ", selectedNode, responseObj);
+		if (!responseObj || !responseObj.statusCode == 200) return false;		
+		// Node has connected to discord
+		// Updating node Object in DB
+		const updatedNode = await updateNodeInfo(selectedNode);
+		log.DEBUG("Updated Node: ", updatedNode);
+
+		// Adding a new node connection
+		const nodeConnection = await addNodeConnection(selectedNode, selectedClientId);
+		log.DEBUG("Node Connection: ", nodeConnection);
+	});	
+
+	return selectedClientId;
+}
+exports.joinServerWrapper = joinServerWrapper;
+
+/**
+ * 
+ * @param {*} clientIdObject The client ID object for the node to leave the server. Either 'clientId'||'name' can be set.
+ * @returns 
+ */
+async function leaveServerWrapper(clientIdObject) {
+	if (!clientIdObject.clientId || !clientIdObject.name) return log.ERROR("Tried to leave server without client ID and/or Name");
+
+	const node = await checkNodeConnectionByClientId(clientIdObject);
+	
+	reqOptions = new requestOptions("/bot/leave", "POST", node.ip, node.port);
+
+	const responseObj = await new Promise((recordResolve, recordReject) => {
+		sendHttpRequest(reqOptions, JSON.stringify({}), async (responseObj) => {
+			recordResolve(responseObj);
+		});
+	});	
+
+	log.VERBOSE("Response Object from node ", node, responseObj);
+	if (!responseObj || !responseObj.statusCode == 202) return false;		
+	// Node has disconnected from discor
+	// Removing the node connection from the DB
+	const removedConnection = removeNodeConnectionByNodeId(node.id);
+	log.DEBUG("Removed Node Connection: ", removedConnection);
+
+	return;
+}
+exports.leaveServerWrapper = leaveServerWrapper;
\ No newline at end of file
diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index c1999ed..fa7b622 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -192,7 +192,8 @@ exports.requestNodeCheckIn = async (req, res) => {
     if (!req.params.nodeId) return res.status(400).json("No Node ID supplied in request");
     const node = await getNodeInfoFromId(req.params.nodeId);
     if (!node) return res.status(400).json("No Node with the ID given");
-    checkInWithNode(node);
+    await checkInWithNode(node);
+    res.sendStatus(200);
 }
 
 /**
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index a1530f4..41b4a4a 100644
--- a/Server/public/res/js/node.js
+++ b/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`);
     }
 }
\ No newline at end of file
diff --git a/Server/utilities/recordHelper.js b/Server/utilities/recordHelper.js
index eb26ae3..2b68db3 100644
--- a/Server/utilities/recordHelper.js
+++ b/Server/utilities/recordHelper.js
@@ -118,7 +118,8 @@ class nodeObject {
         this.ip = _ip;
         this.port = _port;
         this.location = _location;        
-        this.nearbySystems = _nearbySystems;        
+        this.nearbySystems = _nearbySystems;
+        if (this.nearbySystems) this.presets = Object.keys(_nearbySystems);       
         this.online = _online;
     }
 }
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
index 05cd447..2a1bb49 100644
--- a/Server/views/node.ejs
+++ b/Server/views/node.ejs
@@ -9,7 +9,7 @@
                 </p>                
             </div>
             <div class="card-body">
-                <form>
+                <form>                    
                     <div class="row gx-3 mb-3">
                         <div class="">
                             
@@ -26,9 +26,9 @@
                             <% } %>
                             <hr>
                             <!-- Join Server button-->
-                            <a type="button" class="btn btn-info <% if(!node.online) { %>disabled<% } %>" href="/join/<%=node.id%>">Join Server</a>
+                            <a type="button" class="btn btn-info <% if(!node.online) { %>disabled<% } %>" data-bs-toggle="modal" data-bs-target="#joinModal" href="#">Join Server</a>
                             <!-- Leave Server button  -->
-                            <a type="button" class="btn btn-danger <% if(!node.online) { %>disabled<% } %>" href="/leave/<%=node.id%>">Leave Server</a>
+                            <a type="button" class="btn btn-danger <% if(!node.online) { %>disabled<% } %>" href="#" onclick="leaveServer()">Leave Server</a>
                             <!-- Checkin with client button  -->
                             <a type="button" class="btn btn-secondary" href="#" onclick="checkInByNodeId('<%=node.id%>')">Check-in with Node</a>
                         </div>
@@ -149,6 +149,7 @@
             </div>
         </div>
     </div>
+    <%- include('partials/joinModal.ejs', {'nearbySystems': node.nearbySystems}) %>    
 <%- include('partials/bodyEnd.ejs') %>
 <script src="/res/js/node.js"></script>
 <%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/htmlHead.ejs b/Server/views/partials/htmlHead.ejs
index 5a3ef3b..9641f52 100644
--- a/Server/views/partials/htmlHead.ejs
+++ b/Server/views/partials/htmlHead.ejs
@@ -2,5 +2,6 @@
 <html lang="en" data-bs-theme="auto">
     <%- include('head.ejs') %>
     <body>
+        <div class="toast-container mx-2" id="toastZone"></div>
         <%- include('navbar.ejs') %>
         <%- include('sidebar.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/joinModal.ejs b/Server/views/partials/joinModal.ejs
new file mode 100644
index 0000000..d912911
--- /dev/null
+++ b/Server/views/partials/joinModal.ejs
@@ -0,0 +1,44 @@
+<div class="modal fade" id="joinModal" tabindex="-1" aria-labelledby="joinModal" aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h1 class="modal-title fs-5" id="joinModal">Join Node <%=node.id%> to a Discord Server</h1>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <div class="container">
+                    <div class="card mb-4">
+                        <div class="card-body">
+                            <form>                                
+                                <div class="row gx-3 mb-3">
+                                    <div class="col-md-12">
+                                        <label class="small mb-1" for="inputDiscordClientId">Discord Client ID:</label>
+                                        <input class="form-control" id="inputDiscordClientId" type="text" value="" required></input>
+                                    </div>
+                                </div>
+                                <div class="row gx-3 mb-3">
+                                    <div class="col-md-6">
+                                        <label class="small mb-1" for="inputDiscordChannelId">Discord Channel ID:</label>
+                                        <input class="form-control" id="inputDiscordChannelId" type="text" value="" required></input>
+                                    </div>
+                                    <div class="col-md-6">
+                                        <label class="small mb-1" for="selectRadioPreset">Selected Preset:</label>
+                                        <select class="custom-select" id="selectRadioPreset">
+                                            <% for(const system in nearbySystems) { %>                                                                                                
+                                                <option value="<%=system%>"><%=system%></option>
+                                            <% } %>
+                                        </select>
+                                    </div>
+                                </div>
+                            </form>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
+                <button type="button" class="btn btn-primary" onclick="joinServer()">Join</button>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file

From c14316933b997901abecf1bad96bce83e6fff4d3 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 01:50:01 -0400
Subject: [PATCH 34/57] Update heartbeat function location and name

---
 Server/public/res/js/controller.js | 3 ---
 Server/public/res/js/node.js       | 2 +-
 Server/views/controller.ejs        | 2 +-
 Server/views/node.ejs              | 2 +-
 4 files changed, 3 insertions(+), 6 deletions(-)
 delete mode 100644 Server/public/res/js/controller.js

diff --git a/Server/public/res/js/controller.js b/Server/public/res/js/controller.js
deleted file mode 100644
index 04c0fd9..0000000
--- a/Server/public/res/js/controller.js
+++ /dev/null
@@ -1,3 +0,0 @@
-function sendNodeHeartbeat(nodeId) {
-    console.log(nodeId);
-}
\ No newline at end of file
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index 41b4a4a..68dedd6 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -80,7 +80,7 @@ function createToast(notificationMessage){
     $('.toast').toast('show');
 }
 
-function checkInByNodeId(nodeId){
+function sendNodeHeartbeat(nodeId){
     const Http = new XMLHttpRequest();
     const url='/nodes/'+nodeId;
     Http.open("GET", url);
diff --git a/Server/views/controller.ejs b/Server/views/controller.ejs
index 28099a9..6831d79 100644
--- a/Server/views/controller.ejs
+++ b/Server/views/controller.ejs
@@ -7,5 +7,5 @@
         </div>
     </div>
 <%- include('partials/bodyEnd.ejs') %>
-<script src="/res/js/controller.js"></script>
+<script src="/res/js/node.js"></script>
 <%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
index 2a1bb49..9575b9f 100644
--- a/Server/views/node.ejs
+++ b/Server/views/node.ejs
@@ -30,7 +30,7 @@
                             <!-- Leave Server button  -->
                             <a type="button" class="btn btn-danger <% if(!node.online) { %>disabled<% } %>" href="#" onclick="leaveServer()">Leave Server</a>
                             <!-- Checkin with client button  -->
-                            <a type="button" class="btn btn-secondary" href="#" onclick="checkInByNodeId('<%=node.id%>')">Check-in with Node</a>
+                            <a type="button" class="btn btn-secondary" href="#" onclick="sendNodeHeartbeat('<%=node.id%>')">Check-in with Node</a>
                         </div>
                     </div>
 

From 61d7b69c10dfec0fce1cc3b8e454b7c44ccc63e2 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 01:51:25 -0400
Subject: [PATCH 35/57] Only show heartbeat toast once HTTP request is complete

---
 Server/public/res/js/node.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index 68dedd6..b82d08a 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -86,7 +86,7 @@ function sendNodeHeartbeat(nodeId){
     Http.open("GET", url);
     Http.send();
 
-    Http.onreadystatechange = (e) => {
+    Http.onloadend = (e) => {
     console.log(Http.responseText)
     createToast(Http.responseText);
     }

From 6ffa12911a17e9e668997366ed6175182db1adcb Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 01:54:13 -0400
Subject: [PATCH 36/57] Update toast creator to display proper date string

---
 Server/public/res/js/node.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index b82d08a..24b784e 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -44,7 +44,7 @@ function createToast(notificationMessage){
     toastTitle.appendChild(document.createTextNode("Server Notification"));
 
     const toastTime = document.createElement('small');
-    toastTime.appendChild(document.createTextNode(Date.now().toLocaleString()));
+    toastTime.appendChild(document.createTextNode(new Date(Date.now()).toLocaleString()));
 
     const toastClose = document.createElement('button');
     toastClose.type = 'button';

From d7ea6bbbd47d643c2520bd1bf90cec38b30d1295 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 16:47:42 -0400
Subject: [PATCH 37/57] Updated NodeCard Design

---
 Server/views/partials/nodeCard.ejs | 25 ++++++++-----------------
 1 file changed, 8 insertions(+), 17 deletions(-)

diff --git a/Server/views/partials/nodeCard.ejs b/Server/views/partials/nodeCard.ejs
index b676560..61082be 100644
--- a/Server/views/partials/nodeCard.ejs
+++ b/Server/views/partials/nodeCard.ejs
@@ -12,10 +12,6 @@
                 </div>
             </div>
             <div class="d-flex align-items-center">
-                <div>
-                    <img src="https://bootdey.com/img/Content/avatar/avatar1.png" alt=""
-                        class="avatar-md rounded-circle img-thumbnail" />
-                </div>
                 <div class="flex-1 ms-3">
                     <h5 class="font-size-16 mb-1"><a href="/node/<%=node.id%>" class="text-dark">
                             <%= node.name %>
@@ -35,21 +31,16 @@
                     <a href="#" target="_blank">
                         <%= node.ip %>:<%= node.port %>
                     </a>
-                </p>
+                </p>                
+                <hr>                
                 <p class="text-muted mb-0">
-                <div class="dropdown">
-                    <i class="bi bi-broadcast-pin font-size-15 align-middle pe-2 text-primary"></i>
-                    <a class="dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
-                        Nearby Systems
-                    </a>
-                    <ul class="dropdown-menu">
+                    <i class="bi bi-broadcast-pin font-size-15 pe-2 text-primary"></i>
+                    Nearby Systems:
+                    <ul>
                         <% for(const system in node.nearbySystems){ %>
-                            <li>
-                                <%= system %>
-                            </li>
-                            <% } %>
-                    </ul>
-                </div>
+                            <li><%= system %></li>
+                        <% } %>
+                    </ul>                    
                 </p>
             </div>
         </div>

From 648782658c02e3aaded6a0c3360d9de579de2e2a Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 18:56:47 -0400
Subject: [PATCH 38/57] Update API and add webapp saving

---
 Server/controllers/nodesController.js | 32 +++++++++++++----
 Server/public/res/js/node.js          | 49 ++++++++++++++++++++++++++-
 Server/routes/nodes.js                | 15 ++++----
 Server/views/node.ejs                 | 41 +++++++++++-----------
 4 files changed, 103 insertions(+), 34 deletions(-)

diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index fa7b622..3012067 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -110,8 +110,8 @@ exports.newNode = async (req, res) => {
  * @param {*} res Defualt express res from router
  */
 exports.getNodeInfo = async (req, res) => {
-    if (!req.query.id) return res.status(400).json("No id specified");
-    getNodeInfoFromId(req.query.id, (nodeInfo) => {
+    if (!req.params.id) return res.status(400).json("No id specified");
+    getNodeInfoFromId(req.params.id, (nodeInfo) => {
         res.status(200).json(nodeInfo);
     })
 }
@@ -121,9 +121,9 @@ exports.getNodeInfo = async (req, res) => {
  * @param {*} req Default express req from router
  * @param {*} res Defualt express res from router
  */
-exports.nodeCheckIn = async (req, res) => {
-    if (!req.body.id) return res.status(400).json("No id specified");
-    getNodeInfoFromId(req.body.id, (nodeInfo) => {
+exports.updateExistingNode = async = (req, res) => {
+    if (!req.params.nodeId) return res.status(400).json("No id specified");
+    getNodeInfoFromId(req.params.nodeId, (nodeInfo) => {
         let checkInObject = {};
         // Convert the online status to a boolean to be worked with
         log.DEBUG("REQ Body: ", req.body);
@@ -163,9 +163,9 @@ exports.nodeCheckIn = async (req, res) => {
         // If no changes are made tell the client
         if (!isObjectUpdated) return res.status(200).json("No keys updated");
 
-        log.INFO("Updating the following keys for ID: ", req.body.id, checkInObject);
+        log.INFO("Updating the following keys for ID: ", req.params.nodeId, checkInObject);
 
-        checkInObject._id = req.body.id;
+        checkInObject._id = req.params.nodeId;
         checkInObject = new nodeObject(checkInObject);
 
         if (!nodeInfo) {
@@ -182,6 +182,24 @@ exports.nodeCheckIn = async (req, res) => {
     });
 }
 
+/** Allows the bots to check in and get any updates from the server
+ * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ */
+exports.nodeCheckIn = async (req, res) => {
+    if (!req.params.nodeId) return res.status(400).json("No id specified");
+        getNodeInfoFromId(req.params.nodeId, (nodeInfo) => {
+            if (!nodeInfo.online) {
+                nodeInfo.online = true;
+                updateNodeInfo(nodeInfo, () => {
+                    return res.status(200).json(nodeInfo);
+                })
+            }
+            else return res.status(200).json(nodeInfo);
+        });
+}
+
 /**
  * Requests a specific node to check in with the server, if it's online
  * 
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index 24b784e..e439c30 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -78,11 +78,12 @@ function createToast(notificationMessage){
     document.getElementById("toastZone").appendChild(wrapperDiv);
     
     $('.toast').toast('show');
+    return $('.toast');
 }
 
 function sendNodeHeartbeat(nodeId){
     const Http = new XMLHttpRequest();
-    const url='/nodes/'+nodeId;
+    const url='/nodes/nodeCheckIn/'+nodeId;
     Http.open("GET", url);
     Http.send();
 
@@ -139,5 +140,51 @@ function leaveServer(){
         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,
+        'online': true
+    }
+
+    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() {
+
+}
+
+function updateSystem() {
+
+}
+
+function requestNodeUpdate() {
+
 }
\ No newline at end of file
diff --git a/Server/routes/nodes.js b/Server/routes/nodes.js
index 773bc45..3a2b7d2 100644
--- a/Server/routes/nodes.js
+++ b/Server/routes/nodes.js
@@ -5,6 +5,13 @@ const nodesController = require('../controllers/nodesController');
 /* GET nodes the server knows */
 router.get('/', nodesController.listAllNodes);
 
+// TODO Need to authenticate this request
+/* GET the information the server has on a particular node */
+router.get('/:nodeId', nodesController.getNodeInfo);
+
+// Update an existing node
+router.put('/:nodeId', nodesController.updateExistingNode);
+
 // TODO Need to authenticate this request
 /* POST a new node to the server
 *
@@ -20,15 +27,11 @@ router.get('/', nodesController.listAllNodes);
 */
 router.post('/newNode', nodesController.newNode);
 
-// TODO Need to authenticate this request
-/* GET the information the server has on a particular node */
-router.get('/nodeInfo', nodesController.getNodeInfo);
-
 // TODO Need to authenticate this request
 // Client checkin with the server to update information
-router.post('/nodeCheckIn', nodesController.nodeCheckIn);
+router.post('/nodeCheckIn/:nodeId', nodesController.nodeCheckIn);
 
 // Request a node to check in with the server
-router.get('/:nodeId', nodesController.requestNodeCheckIn);
+router.get('/nodeCheckIn/:nodeId', nodesController.requestNodeCheckIn);
 
 module.exports = router;
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
index 9575b9f..0bc3a9c 100644
--- a/Server/views/node.ejs
+++ b/Server/views/node.ejs
@@ -9,29 +9,30 @@
                 </p>                
             </div>
             <div class="card-body">
+                <div class="col-md-12 pt-2">                            
+                    <label class="small mb-1" for="nodeStatus">Online Status:</label>
+                    <% if(node.online){%> <span class="badge badge-soft-success mb-0 align-middle fs-6" id="nodeStatus">Online</span>
+                    <% } else {%> <span class="badge badge-soft-danger mb-0 align-middle fs-6">Offline</span>
+                    <% } %>
+                    <br>
+                    <div class="py-2"></div>
+                    <!-- Join Server button-->
+                    <a type="button" class="btn btn-info text-white<% if(!node.online) { %>disabled<% } %>" data-bs-toggle="modal" data-bs-target="#joinModal" href="#">Join Server</a>
+                    <!-- Leave Server button  -->
+                    <a type="button" class="btn btn-danger <% if(!node.online) { %>disabled<% } %>" href="#" onclick="leaveServer()">Leave Server</a>
+                    <!-- Checkin with client button  -->
+                    <a type="button" class="btn btn-secondary" href="#" onclick="sendNodeHeartbeat('<%=node.id%>')">Check-in with Node</a>
+                    <!-- Update Client button -->
+                    <a type="button" class="btn btn-warning" href="#" onclick="requestNodeUpdate('<%=node.id%>')">Update Node</a>
+                </div>
+                <hr>
                 <form>                    
                     <div class="row gx-3 mb-3">
-                        <div class="">
-                            
-                        </div>
                         <div class="col-md-6">
                             <label class="small mb-1" for="nodeId">Node ID (this is the assigned Node ID and cannot be
                                 changed)</label>
                             <input class="form-control" id="nodeId" type="text" value="<%=node.id%>" disabled></input>
-                        </div>                        
-                        <div class="col-md-6">                            
-                            <label class="small mb-1" for="nodeStatus">Online Status:</label>
-                            <% if(node.online){%> <span class="badge badge-soft-success mb-0 align-middle fs-6" id="nodeStatus">Online</span>
-                            <% } else {%> <span class="badge badge-soft-danger mb-0 align-middle fs-6">Offline</span>
-                            <% } %>
-                            <hr>
-                            <!-- Join Server button-->
-                            <a type="button" class="btn btn-info <% if(!node.online) { %>disabled<% } %>" data-bs-toggle="modal" data-bs-target="#joinModal" href="#">Join Server</a>
-                            <!-- Leave Server button  -->
-                            <a type="button" class="btn btn-danger <% if(!node.online) { %>disabled<% } %>" href="#" onclick="leaveServer()">Leave Server</a>
-                            <!-- Checkin with client button  -->
-                            <a type="button" class="btn btn-secondary" href="#" onclick="sendNodeHeartbeat('<%=node.id%>')">Check-in with Node</a>
-                        </div>
+                        </div>                                                
                     </div>
 
                     <div class="row gx-3 mb-3">
@@ -122,11 +123,11 @@
                         </div>
                     </div>
                     <!-- Save changes button-->
-                    <button class="btn btn-primary <% if(!node.online) { %>disabled<% } %>" type="button">Save changes</button>
+                    <button class="btn btn-primary <% if(!node.online) { %>disabled<% } %>" type="button" onclick="saveNodeDetails()">Save changes</button>
                     <!-- Button trigger modal -->
                     <button type="button" class="btn btn-primary float-right <% if(!node.online) { %>disabled<% } %>" data-bs-toggle="modal"
-                        data-bs-target="#newSystemModal">Add New System</button>
-                </form>
+                        data-bs-target="#newSystemModal">Add New System</button>                    
+                </form>                
             </div>
         </div>
     </div>

From 0f114066a66e29fb24dc3149b18fcacdb00c1537 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 22:30:18 -0400
Subject: [PATCH 39/57] Implement functioning method to update systems on web
 app

---
 Client/controllers/clientController.js      | 15 +++++--
 Server/controllers/nodesController.js       | 41 +++++++++++++++++
 Server/public/res/js/node.js                | 49 ++++++++++++++++++---
 Server/routes/nodes.js                      |  5 ++-
 Server/views/partials/modifySystemModal.ejs | 22 +++++----
 5 files changed, 113 insertions(+), 19 deletions(-)

diff --git a/Client/controllers/clientController.js b/Client/controllers/clientController.js
index 8d02999..2101d44 100644
--- a/Client/controllers/clientController.js
+++ b/Client/controllers/clientController.js
@@ -94,10 +94,12 @@ exports.checkConfig = async function checkConfig() {
 }
 
 /** Check in with the server
- * If the bot has a saved ID, check in with the server to update any information or just check back in
+ * If the bot has a saved ID, check in with the server to get any updated information or just check back in
  * If the bot does not have a saved ID, it will attempt to request a new ID from the server
+ * 
+ * @param {boolean} init If set to true, the client will update the server to it's config, instead of taking the server's config
  */
-exports.checkIn = async () => {
+exports.checkIn = async (init = false) => {
     let reqOptions;
     await this.checkConfig();
     runningClientConfig.online = true;
@@ -134,7 +136,8 @@ exports.checkIn = async () => {
         }
         else {
             // ID is in the config, checking in with the server
-            reqOptions = new requestOptions("/nodes/nodeCheckIn", "POST");
+            if (init) reqOptions = new requestOptions(`/nodes/${runningClientConfig.id}`, "PUT");
+            else reqOptions = new requestOptions(`/nodes/nodeCheckIn/${runningClientConfig.id}`, "POST");
             sendHttpRequest(reqOptions, JSON.stringify(runningClientConfig), (responseObject) => {
                 log.DEBUG("Check In Respose: ", responseObject);
                 // Check if the server responded
@@ -178,7 +181,8 @@ exports.requestCheckIn = async (req, res) => {
  * This is the endpoint wrapper to get the presets object
  */
 exports.getPresets = async (req, res) => {
-    return res.status(200).json(getPresets());
+    runningClientConfig.nearbySystems = getPresets();
+    return res.status(200).json(runningClientConfig.nearbySystems);
 }
 
 /** Controller for the /client/updatePreset endpoint
@@ -187,6 +191,7 @@ exports.getPresets = async (req, res) => {
 exports.updatePreset = async (req, res) => {
     checkBodyForPresetFields(req, res, () => {
         updatePreset(req.body.systemName, () => {
+            runningClientConfig.nearbySystems = getPresets();
             return res.sendStatus(200);
         }, {frequencies: req.body.frequencies, mode: req.body.mode, trunkFile: req.body.trunkFile});
     })
@@ -198,6 +203,7 @@ exports.updatePreset = async (req, res) => {
 exports.addNewPreset = async (req, res) => {
     checkBodyForPresetFields(req, res, () => {
         addNewPreset(req.body.systemName, req.body.frequencies, req.body.mode, () => {
+            runningClientConfig.nearbySystems = getPresets();
             return res.sendStatus(200);
         }, req.body.trunkFile);
     });
@@ -210,6 +216,7 @@ exports.removePreset = async (req, res) => {
     checkBodyForPresetFields(req, res, () => {
         if (!req.body.systemName) return res.status("500").json({"message": "You must specify a system name to delete, this must match exactly to how the system name is saved."})
         removePreset(req.body.systemName, () => {
+            runningClientConfig.nearbySystems = getPresets();
             return res.sendStatus(200);
         }, req.body.trunkFile);
     });
diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index 3012067..63588a6 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -8,6 +8,7 @@ const { sendHttpRequest, requestOptions } = require("../utilities/httpRequests.j
 const { nodeObject } = require("../utilities/recordHelper.js");
 
 const refreshInterval = process.env.NODE_MONITOR_REFRESH_INTERVAL ?? 1200000;
+const digitalModes = ['p25'];
 
 /**
  * Check in with a singular node, mark it offline if it's offline and 
@@ -116,6 +117,44 @@ exports.getNodeInfo = async (req, res) => {
     })
 }
 
+/** Updates a specific system/preset on a given node
+ * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ * @param {*} req.params.nodeId The Node ID to update the preset/system on
+ * @param {*} req.body.systemName The name of the system to update
+ * @param {*} req.body.mode The radio mode of the preset to
+ * @param {*} req.body.frequencies The frequencies of the preset
+ * @param {*} req.body.trunkFile The trunk file to use for digital stations
+ */
+exports.updateNodeSystem = async (req, res) => {
+    if (!req.params.nodeId) return res.status(400).json("No id specified");
+    if (!req.body.systemName) return res.status(400).json("No system specified");
+    log.DEBUG("Updating system for node: ", req.params.nodeId, req.body);
+    getNodeInfoFromId(req.params.nodeId, (node) => {
+        const reqOptions = new requestOptions("/client/updatePreset", "POST", node.ip, node.port);
+        const reqBody = {
+            'systemName': req.body.systemName,
+            'mode': req.body.mode,
+            'frequencies': req.body.frequencies,
+        }
+        if(digitalModes.includes(req.body.mode)) reqBody['trunkFile'] = req.body.trunkFile ?? 'none'
+
+        log.DEBUG("Request body for updating node: ", reqBody, reqOptions);
+        sendHttpRequest(reqOptions, JSON.stringify(reqBody), async (responseObj) => {
+            if(responseObj){
+                // Good
+                log.DEBUG("Response from updating node: ", reqBody, responseObj);
+                return res.sendStatus(200)
+            } else {
+                // Bad
+                log.DEBUG("No Response from updating Node");
+                return res.status(400).json("No Response from updating Node, could be offline");
+            }
+        })
+    })    
+}
+
 /** Updates the information received from the client based on ID
  * 
  * @param {*} req Default express req from router
@@ -171,11 +210,13 @@ exports.updateExistingNode = async = (req, res) => {
         if (!nodeInfo) {
             log.WARN("No existing node found with this ID, adding node: ", checkInObject);
             addNewNode(checkInObject, (newNode) => {
+                this.requestNodeCheckIn(checkInObject.id);
                 return res.status(201).json({ "updatedKeys": newNode });
             });
         }
         else {
             updateNodeInfo(checkInObject, () => {
+                this.requestNodeCheckIn(checkInObject.id);
                 return res.status(202).json({ "updatedKeys": checkInObject });
             });
         }
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index e439c30..e4e5274 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -1,4 +1,11 @@
-function addFrequencyInput(system){
+/**
+ * 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');
@@ -9,6 +16,7 @@ function addFrequencyInput(system){
     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');
@@ -17,7 +25,7 @@ function addFrequencyInput(system){
 
     var input = document.createElement('input');
     input.classList.add('form-control');
-    input.id = 'nodeFreq';
+    input.id = `${system}_systemFreq_${inputId}`;
     input.type = 'text';
 
     var childColInput = document.createElement('div');
@@ -33,6 +41,7 @@ function addFrequencyInput(system){
     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);
@@ -169,22 +178,52 @@ function saveNodeDetails() {
     Http.send(JSON.stringify(reqBody));
 
     Http.onloadend = (e) => {
-        const responseObject = JSON.parse(Http.responseText)
+        const responseObject = JSON.parse(Http.responseText);
         console.log(Http.status);
         console.log(responseObject);
         createToast(`Node Updated!`);
     }
-
 }
 
 function addNewSystem() {
 
 }
 
-function updateSystem() {
+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!`);
+    }
 }
 
 function requestNodeUpdate() {
 
+}
+
+function removeFrequencyInput(elementId) {
+    const element = document.getElementById(elementId);
+    element.remove();
 }
\ No newline at end of file
diff --git a/Server/routes/nodes.js b/Server/routes/nodes.js
index 3a2b7d2..d110343 100644
--- a/Server/routes/nodes.js
+++ b/Server/routes/nodes.js
@@ -12,6 +12,9 @@ router.get('/:nodeId', nodesController.getNodeInfo);
 // Update an existing node
 router.put('/:nodeId', nodesController.updateExistingNode);
 
+// Update an existing node's system
+router.put('/:nodeId/systems', nodesController.updateNodeSystem);
+
 // TODO Need to authenticate this request
 /* POST a new node to the server
 *
@@ -28,7 +31,7 @@ router.put('/:nodeId', nodesController.updateExistingNode);
 router.post('/newNode', nodesController.newNode);
 
 // TODO Need to authenticate this request
-// Client checkin with the server to update information
+// Client checkin with the server to update client information
 router.post('/nodeCheckIn/:nodeId', nodesController.nodeCheckIn);
 
 // Request a node to check in with the server
diff --git a/Server/views/partials/modifySystemModal.ejs b/Server/views/partials/modifySystemModal.ejs
index d24e83f..88ae381 100644
--- a/Server/views/partials/modifySystemModal.ejs
+++ b/Server/views/partials/modifySystemModal.ejs
@@ -1,5 +1,5 @@
 <div class="modal fade" id="updateSystemModal_<%=system.replaceAll(" ", "_")%>" tabindex="-1" aria-labelledby="updateSystemModal_<%=system.replaceAll(" ", "_")%>"
-    aria-hidden="true">
+    aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
     <div class="modal-dialog modal-dialog-centered">
         <div class="modal-content">
             <div class="modal-header">
@@ -10,16 +10,20 @@
                 <div class="card mb-4">
                     <div class="card-body">
                         <form>
+                            <div class="row gx-3 mb-3">
+                                <label class="small mb-1 fs-6" for="systemName">System Name</label>
+                                <input class="form-control" id="systemName" type="text" value="<%= system %>"></input>
+                            </div>
                             <div class="row gx-3 mb-3" id="frequencyRow_<%=system.replaceAll(" ", "_")%>">
-                                <label class="small mb-1 fs-6" for="nodeFreq">Frequencies</label>
+                                <label class="small mb-1 fs-6" for="systemFreq">Frequencies</label>
                                 <% for(const frequency of frequencies) { %>
-                                <div class="col-md-6 mb-1">
+                                <div class="col-md-6 mb-1" id="<%=system%>_systemFreqRow_<%=frequency%>">
                                     <div class="row px-1">
                                         <div class="col-10">
-                                            <input class="form-control" id="nodeFreq" type="text" value="<%= frequency %>"></input>
+                                            <input class="form-control" id="<%=system%>_systemFreq_<%=frequency%>" type="text" value="<%= frequency %>"></input>
                                         </div>
                                         <div class="col-2">
-                                            <a class="align-middle float-left" href="#"><i class="bi bi-x-circle text-black"></i></a>
+                                            <a class="align-middle float-left" href="#" onclick="removeFrequencyInput('<%=system%>_systemFreqRow_<%=frequency%>')"><i class="bi bi-x-circle text-black"></i></a>
                                         </div>
                                     </div>                                                                                        
                                 </div>
@@ -29,9 +33,9 @@
                             <hr>                                                                    
                             <div class="row gx-3 mb-3">
                                 <div class="col-md-6">
-                                    <label class="small mb-1 fs-6" for="modeSelect">Mode</label>
+                                    <label class="small mb-1 fs-6" for="<%=system%>_systemMode">Mode</label>
                                     <br>
-                                    <select class="custom-select" id="modeSelect">
+                                    <select class="custom-select" id="<%=system%>_systemMode">
                                         <option value="<%= node.nearbySystems[system].mode %>" selected><span class="text-uppercase"><%= node.nearbySystems[system].mode %></span></option>
                                         <% if(node.nearbySystems[system].mode == "p25") { %>                                                                                                
                                             <option value="nbfm">NBFM</option>
@@ -46,8 +50,8 @@
                 </div>
             </div>
             <div class="modal-footer">
-                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
-                <button type="button" class="btn btn-primary">Save changes</button>
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" onclick="location.reload()">Close</button>
+                <button type="button" class="btn btn-primary" onclick="updateSystem('<%=system%>')">Save changes</button>
             </div>
         </div>
     </div>

From 6b4ffc88b3246c8906773916d02acafa1a513772 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sun, 16 Jul 2023 23:21:05 -0400
Subject: [PATCH 40/57] Implemented functional method to add a new system to a
 new through web app

---
 Server/controllers/nodesController.js       | 42 ++++++++++++++++++++-
 Server/public/res/js/node.js                | 30 ++++++++++++++-
 Server/routes/nodes.js                      |  5 ++-
 Server/views/node.ejs                       | 23 ++---------
 Server/views/partials/modifySystemModal.ejs | 17 +++++----
 5 files changed, 86 insertions(+), 31 deletions(-)

diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index 63588a6..6799391 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -117,6 +117,44 @@ exports.getNodeInfo = async (req, res) => {
     })
 }
 
+/** Adds a specific system/preset on a given node
+ * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ * @param {*} req.params.nodeId The Node ID to add the preset/system to
+ * @param {*} req.body.systemName The name of the system to add
+ * @param {*} req.body.mode The radio mode of the preset 
+ * @param {*} req.body.frequencies The frequencies of the preset
+ * @param {*} req.body.trunkFile The trunk file to use for digital stations
+ */
+exports.addNodeSystem = async (req, res) => {
+    if (!req.params.nodeId) return res.status(400).json("No id specified");
+    if (!req.body.systemName) return res.status(400).json("No system specified");
+    log.DEBUG("Adding system for node: ", req.params.nodeId, req.body);
+    getNodeInfoFromId(req.params.nodeId, (node) => {
+        const reqOptions = new requestOptions("/client/addPreset", "POST", node.ip, node.port);
+        const reqBody = {
+            'systemName': req.body.systemName,
+            'mode': req.body.mode,
+            'frequencies': req.body.frequencies,
+        }
+        if(digitalModes.includes(req.body.mode)) reqBody['trunkFile'] = req.body.trunkFile ?? 'none'
+
+        log.DEBUG("Request body for adding node system: ", reqBody, reqOptions);
+        sendHttpRequest(reqOptions, JSON.stringify(reqBody), async (responseObj) => {
+            if(responseObj){
+                // Good
+                log.DEBUG("Response from adding node system: ", reqBody, responseObj);
+                return res.sendStatus(200)
+            } else {
+                // Bad
+                log.DEBUG("No Response from adding Node system");
+                return res.status(400).json("No Response from adding Node, could be offline");
+            }
+        })
+    })    
+}
+
 /** Updates a specific system/preset on a given node
  * 
  * @param {*} req Default express req from router
@@ -144,11 +182,11 @@ exports.updateNodeSystem = async (req, res) => {
         sendHttpRequest(reqOptions, JSON.stringify(reqBody), async (responseObj) => {
             if(responseObj){
                 // Good
-                log.DEBUG("Response from updating node: ", reqBody, responseObj);
+                log.DEBUG("Response from updating node system: ", reqBody, responseObj);
                 return res.sendStatus(200)
             } else {
                 // Bad
-                log.DEBUG("No Response from updating Node");
+                log.DEBUG("No Response from updating Node system");
                 return res.status(400).json("No Response from updating Node, could be offline");
             }
         })
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index e4e5274..6c732bd 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -185,8 +185,35 @@ function saveNodeDetails() {
     }
 }
 
-function addNewSystem() {
+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) {
@@ -216,6 +243,7 @@ function updateSystem(systemName) {
         console.log(Http.status);
         console.log(responseObject);
         createToast(`${systemName} Updated!`);
+        location.reload();
     }
 }
 
diff --git a/Server/routes/nodes.js b/Server/routes/nodes.js
index d110343..2ef23b4 100644
--- a/Server/routes/nodes.js
+++ b/Server/routes/nodes.js
@@ -12,7 +12,10 @@ router.get('/:nodeId', nodesController.getNodeInfo);
 // Update an existing node
 router.put('/:nodeId', nodesController.updateExistingNode);
 
-// Update an existing node's system
+// Add a system to an existing node
+router.post('/:nodeId/systems', nodesController.addNodeSystem);
+
+// Update a system on an existing node
 router.put('/:nodeId/systems', nodesController.updateNodeSystem);
 
 // TODO Need to authenticate this request
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
index 0bc3a9c..45a7e28 100644
--- a/Server/views/node.ejs
+++ b/Server/views/node.ejs
@@ -113,7 +113,7 @@
                                                         </td>
                                                     </tr>
                                                     <% // Update system modal %>        
-                                                    <%- include("partials/modifySystemModal.ejs", {'system': system, 'frequencies': node.nearbySystems[system].frequencies}) %>
+                                                    <%- include("partials/modifySystemModal.ejs", {'system': system, 'frequencies': node.nearbySystems[system].frequencies, 'mode': node.nearbySystems[system].mode}) %>
                                                     <% } %>
                                             </tbody>
                                         </table>
@@ -126,31 +126,14 @@
                     <button class="btn btn-primary <% if(!node.online) { %>disabled<% } %>" type="button" onclick="saveNodeDetails()">Save changes</button>
                     <!-- Button trigger modal -->
                     <button type="button" class="btn btn-primary float-right <% if(!node.online) { %>disabled<% } %>" data-bs-toggle="modal"
-                        data-bs-target="#newSystemModal">Add New System</button>                    
+                        data-bs-target="#updateSystemModal_New_System">Add New System</button>                    
                 </form>                
             </div>
         </div>
     </div>
 
     <% // new System Modal %>
-    <div class="modal fade" id="newSystemModal" tabindex="-1" aria-labelledby="newSystemModal" aria-hidden="true">
-        <div class="modal-dialog modal-dialog-centered">
-            <div class="modal-content">
-                <div class="modal-header">
-                    <h1 class="modal-title fs-5" id="newSystemModal">Add a New System</h1>
-                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-                </div>
-                <div class="modal-body">
-                    ...
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
-                    <button type="button" class="btn btn-primary">Save changes</button>
-                </div>
-            </div>
-        </div>
-    </div>
-    <%- include('partials/joinModal.ejs', {'nearbySystems': node.nearbySystems}) %>    
+    <%- include("partials/modifySystemModal.ejs", {'system': "New System", 'frequencies': [], 'mode': ''}) %>
 <%- include('partials/bodyEnd.ejs') %>
 <script src="/res/js/node.js"></script>
 <%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/modifySystemModal.ejs b/Server/views/partials/modifySystemModal.ejs
index 88ae381..a609964 100644
--- a/Server/views/partials/modifySystemModal.ejs
+++ b/Server/views/partials/modifySystemModal.ejs
@@ -3,7 +3,7 @@
     <div class="modal-dialog modal-dialog-centered">
         <div class="modal-content">
             <div class="modal-header">
-                <h1 class="modal-title fs-5" id="updateSystemModal_<%=system.replaceAll(" ", "_")%>">Update <%=system%></h1>
+                <h1 class="modal-title fs-5" id="updateSystemModal_<%=system.replaceAll(" ", "_")%>"><%if (!system == "New System") {%>Update<%} else {%>Add a<%}%> <%=system%></h1>
                 <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
             </div>
             <div class="modal-body">
@@ -12,7 +12,7 @@
                         <form>
                             <div class="row gx-3 mb-3">
                                 <label class="small mb-1 fs-6" for="systemName">System Name</label>
-                                <input class="form-control" id="systemName" type="text" value="<%= system %>"></input>
+                                <input class="form-control" id="systemName" type="text" value="<%if (!system == "New System") {%><%= system %><%} else {%>Local Radio System<%}%>"></input>
                             </div>
                             <div class="row gx-3 mb-3" id="frequencyRow_<%=system.replaceAll(" ", "_")%>">
                                 <label class="small mb-1 fs-6" for="systemFreq">Frequencies</label>
@@ -36,12 +36,15 @@
                                     <label class="small mb-1 fs-6" for="<%=system%>_systemMode">Mode</label>
                                     <br>
                                     <select class="custom-select" id="<%=system%>_systemMode">
-                                        <option value="<%= node.nearbySystems[system].mode %>" selected><span class="text-uppercase"><%= node.nearbySystems[system].mode %></span></option>
-                                        <% if(node.nearbySystems[system].mode == "p25") { %>                                                                                                
+                                        <option value="<%= mode ?? 'select' %>" selected><span class="text-uppercase"><%= mode ?? 'Select' %></span></option>
+                                        <% if(mode == "p25") { %>                                                                                                
                                             <option value="nbfm">NBFM</option>
-                                        <% } else if (node.nearbySystems[system].mode == "nbfm") { %>
+                                        <% } else if (mode == "nbfm") { %>
                                             <option value="p25">P25</option>
-                                        <% } %>
+                                        <% } else { %>
+                                            <option value="nbfm">NBFM</option>
+                                            <option value="p25">P25</option>
+                                            <%}%>
                                     </select>
                                 </div>
                             </div>
@@ -51,7 +54,7 @@
             </div>
             <div class="modal-footer">
                 <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" onclick="location.reload()">Close</button>
-                <button type="button" class="btn btn-primary" onclick="updateSystem('<%=system%>')">Save changes</button>
+                <button type="button" class="btn btn-primary" data-bs-dismiss="modal" <%if(!system == "New System") {%>onclick="updateSystem('<%=system%>')"<%} else {%>onclick="addNewSystem('<%=system%>')"<%}%>>Save changes</button>
             </div>
         </div>
     </div>

From 58b4b7ff40306ddf48e6867ca9a46a7840675e92 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Fri, 21 Jul 2023 18:15:51 -0400
Subject: [PATCH 41/57] Update design on navbar and sidebar

---
 Server/public/res/css/main.css    |  9 ++++++++-
 Server/views/partials/navbar.ejs  |  2 +-
 Server/views/partials/sidebar.ejs | 23 ++++++++++++-----------
 3 files changed, 21 insertions(+), 13 deletions(-)

diff --git a/Server/public/res/css/main.css b/Server/public/res/css/main.css
index 6384148..5c44612 100644
--- a/Server/public/res/css/main.css
+++ b/Server/public/res/css/main.css
@@ -138,9 +138,16 @@ a {
 
 /* Global Section */
 .sidebar-container {
-    min-height: 94.2vh;
+    min-height: 95vh;
 }
 
+.sidebar { 
+    position: fixed; 
+    top: 5vh; 
+    bottom: 0;
+    left: 0;
+ }
+
 /* User table section */
 
 .label {
diff --git a/Server/views/partials/navbar.ejs b/Server/views/partials/navbar.ejs
index 169185f..204f863 100644
--- a/Server/views/partials/navbar.ejs
+++ b/Server/views/partials/navbar.ejs
@@ -1,4 +1,4 @@
-<nav class="navbar navbar-expand-lg bg-body-tertiary" data-bs-theme="dark">
+<nav class="navbar fixed-top navbar-expand-lg bg-body-tertiary" data-bs-theme="dark">
     <div class="container-fluid">
         <a class="navbar-brand" href="#">Node Master</a>
         <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
diff --git a/Server/views/partials/sidebar.ejs b/Server/views/partials/sidebar.ejs
index 4b2840e..fd51b50 100644
--- a/Server/views/partials/sidebar.ejs
+++ b/Server/views/partials/sidebar.ejs
@@ -1,21 +1,22 @@
-<div class="container-fluid">
+<div class="container-fluid mt-5">
     <div class="row flex-nowrap">
-        <div class="col-auto col-md-3 col-xl-2 px-sm-2 px-0 bg-dark">
-            <div class="d-flex flex-column align-items-center align-items-sm-start px-3 pt-2 text-white sidebar-container">
+        <div class="col-auto col-md-3 col-xl-2 px-sm-2 px-0 bg-dark sidebar-container">
+            <div
+                class="d-flex flex-column align-items-center align-items-sm-start px-3 pt-2 text-white sidebar">
                 <ul class="nav nav-pills flex-column mb-sm-auto mb-0 align-items-center align-items-sm-start" id="menu">
                     <li>
                         <a href="/" class="nav-link px-0 align-middle">
                             <i class="fs-4 bi-speedometer2"></i> <span class="ms-1 d-none d-sm-inline">Dashboard</span>
-                        </a>                        
-                    </li>                                        
+                        </a>
+                    </li>
                     <li>
                         <a href="/controller" class="nav-link px-0 align-middle">
-                            <i class="fs-4 bi-grid"></i> <span class="ms-1 d-none d-sm-inline">Controller</span> </a>                        
+                            <i class="fs-4 bi-grid"></i> <span class="ms-1 d-none d-sm-inline">Controller</span>
+                        </a>
                     </li>
                 </ul>
                 <hr>
-                <% /*
-                <div class="dropdown pb-4 fixed-bottom px-3">
+                <% /* <div class="dropdown pb-4 fixed-bottom px-3">
                     <a href="#" class="d-flex align-items-center text-white text-decoration-none dropdown-toggle"
                         id="dropdownUser1" data-bs-toggle="dropdown" aria-expanded="false">
                         <img src="https://github.com/mdo.png" alt="hugenerd" width="30" height="30"
@@ -31,8 +32,8 @@
                         </li>
                         <li><a class="dropdown-item" href="#">Sign out</a></li>
                     </ul>
-                </div>
-                */%>
             </div>
+            */%>
         </div>
-        <div class="col py-3">
\ No newline at end of file
+    </div>
+    <div class="col py-3">
\ No newline at end of file

From cf9deb4841a107d6a9b54b14b54c92c3de90799d Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Fri, 21 Jul 2023 18:31:41 -0400
Subject: [PATCH 42/57] Remove unnecessary online param from webUI update node

---
 Server/public/res/js/node.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index 6c732bd..7e8fdc0 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -165,8 +165,7 @@ function saveNodeDetails() {
         'name': nodeName,
         'ip': nodeIp,
         'port': nodePort,
-        'location': nodeLocation,
-        'online': true
+        'location': nodeLocation
     }
 
     console.log("Request Body: ", reqBody);

From 9ff87403b26cd1cfacb04eb89b76c16a33a0843c Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Fri, 21 Jul 2023 18:36:21 -0400
Subject: [PATCH 43/57] Update request node checkin in update node

---
 Server/controllers/nodesController.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index 6799391..688b6d1 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -248,13 +248,13 @@ exports.updateExistingNode = async = (req, res) => {
         if (!nodeInfo) {
             log.WARN("No existing node found with this ID, adding node: ", checkInObject);
             addNewNode(checkInObject, (newNode) => {
-                this.requestNodeCheckIn(checkInObject.id);
+                this.requestNodeCheckIn({"params": {"nodeId": checkInObject.id}});
                 return res.status(201).json({ "updatedKeys": newNode });
             });
         }
         else {
             updateNodeInfo(checkInObject, () => {
-                this.requestNodeCheckIn(checkInObject.id);
+                this.requestNodeCheckIn({"params": {"nodeId": checkInObject.id}});
                 return res.status(202).json({ "updatedKeys": checkInObject });
             });
         }

From d847aa4fc7b8008c8550e31cdc79dcd46d832d3a Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Fri, 21 Jul 2023 18:51:55 -0400
Subject: [PATCH 44/57] Add new node if node tries to check in with an ID not
 in the DB

---
 Server/controllers/nodesController.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index 688b6d1..d24c89b 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -269,6 +269,7 @@ exports.updateExistingNode = async = (req, res) => {
 exports.nodeCheckIn = async (req, res) => {
     if (!req.params.nodeId) return res.status(400).json("No id specified");
         getNodeInfoFromId(req.params.nodeId, (nodeInfo) => {
+            if (!nodeInfo) return this.newNode(req, res);
             if (!nodeInfo.online) {
                 nodeInfo.online = true;
                 updateNodeInfo(nodeInfo, () => {

From 4b86621626f4e42806543238fff4f7a4843927ba Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 01:19:54 -0400
Subject: [PATCH 45/57] Finalizing Server webUI

Still needed:
- Way to update clients' versions
- Way to delete nodes
- working dashboard
- working search function
---
 Client/app.js                               |   2 +-
 Client/config/radioPresets.json             |   2 +-
 Client/controllers/clientController.js      |  19 +-
 Client/routes/client.js                     |   5 +
 Client/utilities/configHandler.js           |   8 +-
 Client/utilities/httpRequests.js            |   2 +-
 Client/utilities/updateConfig.js            |  52 ++++-
 Client/utilities/utilities.js               |   4 +-
 Server/controllers/adminController.js       |   2 +
 Server/controllers/nodesController.js       |  45 +++-
 Server/public/res/js/node.js                | 215 +++++++++++++++++---
 Server/routes/nodes.js                      |   3 +
 Server/views/node.ejs                       |   5 +-
 Server/views/partials/bodyEnd.ejs           |   4 +-
 Server/views/partials/htmlHead.ejs          |   3 +-
 Server/views/partials/modifySystemModal.ejs |   4 +-
 Server/views/partials/navbar.ejs            |   6 +-
 Server/views/partials/sidebar.ejs           |  13 +-
 18 files changed, 327 insertions(+), 67 deletions(-)

diff --git a/Client/app.js b/Client/app.js
index 09ff507..468cd22 100644
--- a/Client/app.js
+++ b/Client/app.js
@@ -98,4 +98,4 @@ log.DEBUG(`Starting HTTP Server`);
 	runHTTPServer();
 
   log.DEBUG("Checking in with the master server")
-  checkIn();
+  checkIn(true);
diff --git a/Client/config/radioPresets.json b/Client/config/radioPresets.json
index 204fe78..b8f268a 100644
--- a/Client/config/radioPresets.json
+++ b/Client/config/radioPresets.json
@@ -1 +1 @@
-{"Westchester Cty. Simulcast":{"frequencies":[470575000,470375000,470525000,470575000,470550000],"mode":"p25","trunkFile":"trunk.tsv"},"coppies":{"frequencies":[154690000],"mode":"nbfm","trunkFile":"none"},"poopoo":{"frequencies":[479135500],"mode":"nbfm","trunkFile":"none"},"ppeeeeeeeeee":{"frequencies":[479135500,133990000,133000000,555999000],"mode":"p25","trunkFile":"none"}}
\ No newline at end of file
+{"Westchester Cty. Simulcast":{"frequencies":[470575000,470375000,470525000,470575000,470550000],"mode":"p25","trunkFile":"trunk.tsv"},"coppies":{"frequencies":[154690000],"mode":"nbfm","trunkFile":"none"},"asdadadadasd":{"frequencies":[123321000],"mode":"nbfm","trunkFile":"none"}}
\ No newline at end of file
diff --git a/Client/controllers/clientController.js b/Client/controllers/clientController.js
index 2101d44..7d1729e 100644
--- a/Client/controllers/clientController.js
+++ b/Client/controllers/clientController.js
@@ -5,13 +5,14 @@ const log = new DebugBuilder("client", "clientController");
 require('dotenv').config();
 const modes = require("../config/modes");
 // Modules
-const { executeAsyncConsoleCommand, nodeObject, BufferToJson } = require("../utilities/utilities");
+const { executeAsyncConsoleCommand, BufferToJson } = require("../utilities/utilities");
 // Utilities
-const { updateId, updateConfig } = require("../utilities/updateConfig");
+const { getFullConfig } = require("../utilities/configHandler");
+const { updateId, updateConfig, updateClientConfig } = require("../utilities/updateConfig");
 const { updatePreset, addNewPreset, getPresets, removePreset } = require("../utilities/updatePresets");
 const { onHttpError, requestOptions, sendHttpRequest } = require("../utilities/httpRequests");
 
-var runningClientConfig = new nodeObject({_id: process.env.CLIENT_ID, _ip: process.env.CLIENT_IP, _name: process.env.CLIENT_NAME, _port: process.env.CLIENT_PORT, _location: process.env.CLIENT_LOCATION, _nearbySystems: getPresets(), _online: process.env.CLIENT_ONLINE});
+var runningClientConfig = getFullConfig()
 
 /**
  * Check the body for the required fields to update or add a preset
@@ -97,12 +98,11 @@ exports.checkConfig = async function checkConfig() {
  * If the bot has a saved ID, check in with the server to get any updated information or just check back in
  * If the bot does not have a saved ID, it will attempt to request a new ID from the server
  * 
- * @param {boolean} init If set to true, the client will update the server to it's config, instead of taking the server's config
+ * @param {boolean} update If set to true, the client will update the server to it's config, instead of taking the server's config
  */
-exports.checkIn = async (init = false) => {
+exports.checkIn = async (update = false) => {
     let reqOptions;
     await this.checkConfig();
-    runningClientConfig.online = true;
     // Check if there is an ID found, if not add the node to the server. If there was an ID, check in with the server to make sure it has the correct information
     try {        
         if (!runningClientConfig?.id || runningClientConfig.id == 0) {                        
@@ -136,7 +136,7 @@ exports.checkIn = async (init = false) => {
         }
         else {
             // ID is in the config, checking in with the server
-            if (init) reqOptions = new requestOptions(`/nodes/${runningClientConfig.id}`, "PUT");
+            if (update) reqOptions = new requestOptions(`/nodes/${runningClientConfig.id}`, "PUT");
             else reqOptions = new requestOptions(`/nodes/nodeCheckIn/${runningClientConfig.id}`, "POST");
             sendHttpRequest(reqOptions, JSON.stringify(runningClientConfig), (responseObject) => {
                 log.DEBUG("Check In Respose: ", responseObject);
@@ -156,6 +156,8 @@ exports.checkIn = async (init = false) => {
                 }
                 if (responseObject.statusCode === 200) {
                     // Server accepted the response but there were no keys to be updated
+                    const tempUpdatedConfig = updateClientConfig(responseObject.body);
+                    if (!tempUpdatedConfig.length > 0) return;
                 }
                 if (responseObject.statusCode >= 300) {
                     // Server threw an error
@@ -192,6 +194,7 @@ exports.updatePreset = async (req, res) => {
     checkBodyForPresetFields(req, res, () => {
         updatePreset(req.body.systemName, () => {
             runningClientConfig.nearbySystems = getPresets();
+            this.checkIn(true);
             return res.sendStatus(200);
         }, {frequencies: req.body.frequencies, mode: req.body.mode, trunkFile: req.body.trunkFile});
     })
@@ -204,6 +207,7 @@ exports.addNewPreset = async (req, res) => {
     checkBodyForPresetFields(req, res, () => {
         addNewPreset(req.body.systemName, req.body.frequencies, req.body.mode, () => {
             runningClientConfig.nearbySystems = getPresets();
+            this.checkIn(true);
             return res.sendStatus(200);
         }, req.body.trunkFile);
     });
@@ -217,6 +221,7 @@ exports.removePreset = async (req, res) => {
         if (!req.body.systemName) return res.status("500").json({"message": "You must specify a system name to delete, this must match exactly to how the system name is saved."})
         removePreset(req.body.systemName, () => {
             runningClientConfig.nearbySystems = getPresets();
+            this.checkIn(true);
             return res.sendStatus(200);
         }, req.body.trunkFile);
     });
diff --git a/Client/routes/client.js b/Client/routes/client.js
index 8e2e8a6..c3a7ed0 100644
--- a/Client/routes/client.js
+++ b/Client/routes/client.js
@@ -11,6 +11,11 @@ const { requestCheckIn, getPresets, updatePreset, addNewPreset, removePreset, up
  */
 router.get('/requestCheckIn', requestCheckIn);
 
+/** GET Object of all known presets
+ * Query the client to get all the known presets
+ */
+router.put('/', );
+
 /** GET Object of all known presets
  * Query the client to get all the known presets
  */
diff --git a/Client/utilities/configHandler.js b/Client/utilities/configHandler.js
index 0d7750e..1b92e79 100644
--- a/Client/utilities/configHandler.js
+++ b/Client/utilities/configHandler.js
@@ -2,6 +2,8 @@
 const { DebugBuilder } = require("../utilities/debugBuilder.js");
 const log = new DebugBuilder("client", "configController");
 // Modules
+const { nodeObject } = require("./utilities.js");
+const { getPresets } = require("../utilities/updatePresets");
 const { readFileSync } = require('fs');
 const path = require("path");
 require('dotenv').config();
@@ -33,4 +35,8 @@ function getDeviceName(){
     log.DEBUG("Device Name: ", DeviceName);
     return DeviceName;
 }
-exports.getDeviceName = getDeviceID;
\ No newline at end of file
+exports.getDeviceName = getDeviceID;
+
+exports.getFullConfig = () => {
+    return new nodeObject({_id: process.env.CLIENT_ID, _ip: process.env.CLIENT_IP, _name: process.env.CLIENT_NAME, _port: process.env.CLIENT_PORT, _location: process.env.CLIENT_LOCATION, _nearbySystems: getPresets()});
+}
\ No newline at end of file
diff --git a/Client/utilities/httpRequests.js b/Client/utilities/httpRequests.js
index a4b5566..f3ddc4b 100644
--- a/Client/utilities/httpRequests.js
+++ b/Client/utilities/httpRequests.js
@@ -9,7 +9,7 @@ const { isJsonString } = require("./utilities.js");
 
 exports.requestOptions = class requestOptions {
     constructor(path, method, hostname = undefined, headers = undefined, port = undefined) {
-        if (method === "POST"){
+        if (["POST", "PUT"].includes(method)){
             log.VERBOSE("Hostname Vars: ", hostname, process.env.SERVER_HOSTNAME, process.env.SERVER_IP);
             if (hostname) this.hostname = hostname;
             if (process.env.SERVER_HOSTNAME) this.hostname = process.env.SERVER_HOSTNAME;
diff --git a/Client/utilities/updateConfig.js b/Client/utilities/updateConfig.js
index e934603..250d90c 100644
--- a/Client/utilities/updateConfig.js
+++ b/Client/utilities/updateConfig.js
@@ -3,6 +3,7 @@ const { DebugBuilder } = require("../utilities/debugBuilder.js");
 const log = new DebugBuilder("client", "updateConfig");
 // Modules
 const replace = require('replace-in-file');
+const { getFullConfig } = require("./configHandler.js");
 
 class Options {
     constructor(key, updatedValue) {
@@ -23,6 +24,56 @@ exports.updateId = (updatedId) => {
     this.updateConfig('CLIENT_ID', updatedId);
 }
 
+/**
+ * Wrapper to update any or all keys in the client config
+ * 
+ * @param {*} configObject Object with what keys you wish to update (node object format, will be converted)
+ * @returns 
+ */
+exports.updateClientConfig = (configObject) => { 
+    const runningConfig = getFullConfig();
+    var updatedKeys = []
+    const configKeys = Object.keys(configObject);
+    
+    if (configKeys.includes("id")) {
+        if (runningConfig.id != configObject.id) {
+            this.updateConfig('CLIENT_ID', configObject.id);
+            updatedKeys.push({'CLIENT_ID': configObject.id});
+            log.DEBUG("Updated ID to: ", configObject.id);
+        }        
+    }
+    if (configKeys.includes("name")) {
+        if (runningConfig.name != configObject.name) {
+            this.updateConfig('CLIENT_NAME', configObject.name);
+            updatedKeys.push({'CLIENT_NAME': configObject.name});
+            log.DEBUG("Updated name to: ", configObject.name);
+        }
+    }
+    if (configKeys.includes("ip")) {
+        if (runningConfig.ip != configObject.ip) {
+            this.updateConfig('CLIENT_IP', configObject.ip);
+            updatedKeys.push({'CLIENT_IP': configObject.ip});
+            log.DEBUG("Updated ip to: ", configObject.ip);
+        }
+    }
+    if (configKeys.includes("port")) {
+        if (runningConfig.port != configObject.port) {
+            this.updateConfig('CLIENT_PORT', configObject.port);
+            updatedKeys.push({'CLIENT_PORT': configObject.port});
+            log.DEBUG("Updated port to: ", configObject.port);
+        }
+    }
+    if (configKeys.includes("location")) {
+        if (runningConfig.location != configObject.location) {
+            this.updateConfig('CLIENT_LOCATION', configObject.location);
+            updatedKeys.push({'CLIENT_LOCATION': configObject.location});
+            log.DEBUG("Updated location to: ", configObject.location);
+        }
+    }
+
+    return updatedKeys;
+}
+
 /**
  * 
  * @param {string} key The config file key to update with the value
@@ -37,7 +88,6 @@ exports.updateConfig = function updateConfig(key, value) {
     })
 }
 
-
 /**
  * Wrapper to write changes to the file
  * @param options An instance of the Objects class specified to the key being updated
diff --git a/Client/utilities/utilities.js b/Client/utilities/utilities.js
index 8ccad58..78733be 100644
--- a/Client/utilities/utilities.js
+++ b/Client/utilities/utilities.js
@@ -25,17 +25,15 @@ exports.nodeObject = class nodeObject {
      * @param {*} param0._ip The IP that the master can contact the node at
      * @param {*} param0._port The port that the client is listening on
      * @param {*} param0._location The physical location of the node
-     * @param {*} param0._online An integer representation of the online status of the bot, ie 0=off, 1=on
      * @param {*} param0._nearbySystems An object array of nearby systems
      */
-    constructor({ _id = null, _name = null, _ip = null, _port = null, _location = null, _nearbySystems = null, _online = null }) {
+    constructor({ _id = null, _name = null, _ip = null, _port = null, _location = null, _nearbySystems = null }) {
         this.id = _id;
         this.name = _name;        
         this.ip = _ip;
         this.port = _port;
         this.location = _location;
         this.nearbySystems = _nearbySystems;
-        this.online = _online;
     }
 }
 
diff --git a/Server/controllers/adminController.js b/Server/controllers/adminController.js
index bc699b2..df6f80c 100644
--- a/Server/controllers/adminController.js
+++ b/Server/controllers/adminController.js
@@ -86,6 +86,8 @@ exports.leaveServer = async (req, res) => {
     const currentConnection = await getConnectionByNodeId(nodeId);
     log.DEBUG("Current Connection for node: ", currentConnection);
 
+	if (!currentConnection) return res.status(400).json("Node is not connected")
+
     await leaveServerWrapper(currentConnection.clientObject)
 
     return res.status(200).json(currentConnection.clientObject.name);
diff --git a/Server/controllers/nodesController.js b/Server/controllers/nodesController.js
index d24c89b..e5f601c 100644
--- a/Server/controllers/nodesController.js
+++ b/Server/controllers/nodesController.js
@@ -20,7 +20,7 @@ async function checkInWithNode(node) {
     sendHttpRequest(reqOptions, "", (responseObj) => {
         if (responseObj) {
             log.DEBUG("Response from: ", node.name, responseObj);
-            const onlineNode = new nodeObject({ _online: false, _id: node.id });
+            const onlineNode = new nodeObject({ _online: true, _id: node.id });
             log.DEBUG("Node update object: ", onlineNode);
             updateNodeInfo(onlineNode, (sqlResponse) => {
                 if (!sqlResponse) this.log.ERROR("No response from SQL object");
@@ -193,6 +193,39 @@ exports.updateNodeSystem = async (req, res) => {
     })    
 }
 
+/** Deletes a specific system/preset from a given node
+ * 
+ * @param {*} req Default express req from router
+ * @param {*} res Defualt express res from router
+ * @param {*} req.params.nodeId The Node ID to update the preset/system on
+ * @param {*} req.body.systemName The name of the system to update
+ */
+exports.removeNodeSystem = async (req, res) => {
+    if (!req.params.nodeId) return res.status(400).json("No id specified");
+    if (!req.body.systemName) return res.status(400).json("No system specified");
+    log.DEBUG("Updating system for node: ", req.params.nodeId, req.body);
+    getNodeInfoFromId(req.params.nodeId, (node) => {
+        const reqOptions = new requestOptions("/client/removePreset", "POST", node.ip, node.port);
+        const reqBody = {
+            'systemName': req.body.systemName
+        }
+
+        log.DEBUG("Request body for deleting preset: ", reqBody, reqOptions);
+        sendHttpRequest(reqOptions, JSON.stringify(reqBody), async (responseObj) => {
+            if(responseObj){
+                // Good
+                log.DEBUG("Response from deleting preset: ", reqBody, responseObj);
+                return res.sendStatus(200)
+            } else {
+                // Bad
+                log.DEBUG("No Response from deleting preset");
+                return res.status(400).json("No Response from deleting preset, could be offline");
+            }
+        })
+    })    
+}
+
+
 /** Updates the information received from the client based on ID
  * 
  * @param {*} req Default express req from router
@@ -247,14 +280,14 @@ exports.updateExistingNode = async = (req, res) => {
 
         if (!nodeInfo) {
             log.WARN("No existing node found with this ID, adding node: ", checkInObject);
-            addNewNode(checkInObject, (newNode) => {
-                this.requestNodeCheckIn({"params": {"nodeId": checkInObject.id}});
+            addNewNode(checkInObject, async (newNode) => {
+                await checkInWithNode(newNode);
                 return res.status(201).json({ "updatedKeys": newNode });
             });
         }
         else {
-            updateNodeInfo(checkInObject, () => {
-                this.requestNodeCheckIn({"params": {"nodeId": checkInObject.id}});
+            updateNodeInfo(checkInObject, async () => {
+                await checkInWithNode(nodeInfo);
                 return res.status(202).json({ "updatedKeys": checkInObject });
             });
         }
@@ -291,7 +324,7 @@ exports.requestNodeCheckIn = async (req, res) => {
     const node = await getNodeInfoFromId(req.params.nodeId);
     if (!node) return res.status(400).json("No Node with the ID given");
     await checkInWithNode(node);
-    res.sendStatus(200);
+    if (res) res.sendStatus(200);
 }
 
 /**
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index 7e8fdc0..67ea019 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -1,11 +1,119 @@
+$(document).ready(async () => {
+    console.log("Loading stored notifications...");
+    await loadStoredToasts();
+    console.log("Showing stored notifications...");
+    await showStoredToasts();
+});
+
+/**
+ * Gets all toasts stored in local storage
+ * 
+ * @returns {Object} Object of toasts in storage
+ */
+function getStoredToasts() {
+    if (localStorage.getItem("toasts")) {
+        const storedToasts = JSON.parse(localStorage.getItem("toasts"));
+        console.log("LOADED STORED TOASTS: ", storedToasts);
+        navbarUpdateNotificationBellCount(storedToasts);
+        return storedToasts;
+    }
+    else return false
+}
+
+/**
+ * Adds a toast to storage, will not allow duplicates
+ * 
+ * @param {Date} time The date object from when the toast was created
+ * @param {*} message The message of the toast
+ */
+function addToastToStorage(time, message) {
+    var toasts = [{ 'time': time, 'message': message }]
+    var storedToasts = getStoredToasts();
+    console.log("Adding new notification to storage: ", toasts);
+    toasts = toasts.concat(storedToasts);
+    console.log("Combined new and stored notifications: ", toasts);
+    toasts = toasts.filter((value, index, self) =>
+        index === self.findIndex((t) => (
+            t.time === value.time && t.message === value.message
+        ))
+    )
+    console.log("Deduped stored notifications: ", toasts);
+    localStorage.setItem("toasts", JSON.stringify(toasts));
+    navbarUpdateNotificationBellCount(toasts);
+}
+
+/**
+ * Removes a toast from the local storage
+ * 
+ * @param {Date} time The date object from when the toast was created
+ * @param {*} message The message of the toast
+ */
+function removeToastFromStorage(time, message) {
+    const toastToRemove = { 'time': time, 'message': message }
+    console.log("Toast to remove: ", toastToRemove);
+    var toasts = getStoredToasts();
+    console.log("Stored toasts: ", toasts);
+    if (toasts.indexOf(toastToRemove)) toasts.splice(toasts.indexOf(toastToRemove) - 1, 1)
+    console.log("Toasts with selected toast removed: ", toasts);
+    localStorage.setItem("toasts", JSON.stringify(toasts));
+    navbarUpdateNotificationBellCount(toasts);
+}
+
+/**
+ * Shows all stored toasts
+ */
+function showStoredToasts() {
+    const storedToasts = getStoredToasts();
+    if (!storedToasts) return
+    console.log("Loaded stored notifications to show: ", storedToasts);
+    for (const toast of storedToasts) {
+        const toastId = `${toast.time}-toast`;
+        console.log("Showing stored toast: ", toast, toastId);
+        const toastElement = bootstrap.Toast.getOrCreateInstance(document.getElementById(toastId));
+        toastElement.show();
+    }
+}
+
+/**
+ * Loads all toasts stored in the local storage into the DOM of the webpage
+ */
+function loadStoredToasts() {
+    const storedToasts = getStoredToasts();
+    if (!storedToasts) return
+    console.log("Loaded stored notifications: ", storedToasts);
+    for (const toast of storedToasts) {
+        createToast(toast.message, { time: toast.time })
+    }
+}
+
+/**
+ * Will update the count of notifications on the bell icon in the navbar
+ * 
+ * @param {Array} storedToasts An array of stored toasts to be counted and updated in the navbar
+ */
+function navbarUpdateNotificationBellCount(storedToasts) {
+    const notificationBellIcon = document.getElementById("navbar-notification-bell");
+    var notificationBellCount = document.getElementById("notification-bell-icon-count");
+    if (!notificationBellCount) {
+        notificationBellCount = document.createElement('span');
+        notificationBellCount.id = "notification-bell-icon-count";
+        notificationBellCount.classList.add('badge');
+        notificationBellCount.classList.add('text-bg-secondary');
+        notificationBellCount.appendChild(document.createTextNode(storedToasts.length));
+    }
+    else notificationBellCount.innerHTML = storedToasts.length;
+
+    notificationBellIcon.appendChild(notificationBellCount);
+}
+
 /**
  * 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; 
+function addFrequencyInput(system, inputId = null) {
+    if (!inputId) inputId = $(`[id^="${system}_systemFreqRow_"]`).length;
     // Create new input
     var icon = document.createElement('i');
     icon.classList.add('bi');
@@ -16,7 +124,7 @@ function addFrequencyInput(system, inputId = null){
     remove.classList.add('align-middle');
     remove.classList.add('float-left');
     remove.href = '#'
-    remove.onclick = () => {removeFrequencyInput(`${system}_systemFreqRow_${inputId}`)}
+    remove.onclick = () => { removeFrequencyInput(`${system}_systemFreqRow_${inputId}`) }
     remove.appendChild(icon);
 
     var childColRemoveIcon = document.createElement('div');
@@ -31,7 +139,7 @@ function addFrequencyInput(system, inputId = null){
     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");
@@ -47,19 +155,30 @@ function addFrequencyInput(system, inputId = null){
     document.getElementById(`frequencyRow_${system.replaceAll(" ", "_")}`).appendChild(colParent);
 }
 
-function createToast(notificationMessage){
+/**
+ * Add a toast element to the DOM
+ * 
+ * @param {*} notificationMessage The message of the notification 
+ * @param {Date} param1.time The date object for when the toast was created, blank if creating new
+ * @param {boolean} param1.showNow Show the toast now or just store it
+ * @returns 
+ */
+function createToast(notificationMessage, { time = undefined, showNow = false } = {}) {
+    if (!time) time = new Date(Date.now());
+    else time = new Date(Date.parse(time));
     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()));
+    toastTime.appendChild(document.createTextNode(time.toLocaleString()));
 
     const toastClose = document.createElement('button');
     toastClose.type = 'button';
     toastClose.classList.add('btn-close');
     toastClose.ariaLabel = 'Close';
     toastClose.setAttribute('data-bs-dismiss', 'toast');
+    toastClose.onclick = () => { removeToastFromStorage(time.toISOString(), notificationMessage); };
 
     const toastHeader = document.createElement('div');
     toastHeader.classList.add('toast-header');
@@ -67,7 +186,6 @@ function createToast(notificationMessage){
     toastHeader.appendChild(toastTime);
     toastHeader.appendChild(toastClose);
 
-
     const toastMessage = document.createElement('p');
     toastMessage.classList.add("px-2");
     toastMessage.appendChild(document.createTextNode(notificationMessage));
@@ -78,31 +196,39 @@ function createToast(notificationMessage){
 
     const wrapperDiv = document.createElement('div');
     wrapperDiv.classList.add('toast');
-    wrapperDiv.role ='alert';
+    //wrapperDiv.classList.add('position-fixed');
+    wrapperDiv.id = `${time.toISOString()}-toast`;
+    wrapperDiv.role = 'alert';
     wrapperDiv.ariaLive = 'assertive';
     wrapperDiv.ariaAtomic = true;
+    wrapperDiv.setAttribute('data-bs-delay', "7500");
+    wrapperDiv.setAttribute('data-bs-animation', true);
     wrapperDiv.appendChild(toastHeader);
     wrapperDiv.appendChild(toastMessage);
 
     document.getElementById("toastZone").appendChild(wrapperDiv);
-    
-    $('.toast').toast('show');
-    return $('.toast');
+    addToastToStorage(time.toISOString(), notificationMessage);
+    if (showNow) {
+        const toastElement = bootstrap.Toast.getOrCreateInstance(document.getElementById(`${time.toISOString()}-toast`));
+        toastElement.show();
+    }
+
+    return;
 }
 
-function sendNodeHeartbeat(nodeId){
+function sendNodeHeartbeat(nodeId) {
     const Http = new XMLHttpRequest();
-    const url='/nodes/nodeCheckIn/'+nodeId;
+    const url = '/nodes/nodeCheckIn/' + nodeId;
     Http.open("GET", url);
     Http.send();
 
     Http.onloadend = (e) => {
-    console.log(Http.responseText)
-    createToast(Http.responseText);
+        console.log(Http.responseText)
+        createToast(Http.responseText, { showNow: true });
     }
 }
 
-function joinServer(){
+function joinServer() {
     const preset = document.getElementById("selectRadioPreset").value;
     const nodeId = document.getElementById("nodeId").value;
     const clientId = document.getElementById("inputDiscordClientId").value;
@@ -118,7 +244,7 @@ function joinServer(){
     console.log(reqBody);
 
     const Http = new XMLHttpRequest();
-    const url='/admin/join';
+    const url = '/admin/join';
     Http.open("POST", url);
     Http.setRequestHeader("Content-Type", "application/json");
     Http.send(JSON.stringify(reqBody));
@@ -127,19 +253,19 @@ function joinServer(){
         const responseObject = JSON.parse(Http.responseText)
         console.log(Http.status);
         console.log(responseObject);
-        createToast(`${responseObject.name} will join shortly`);
+        createToast(`${responseObject.name} will join shortly`, { showNow: true });
         $("#joinModal").modal('toggle');
     }
 }
 
-function leaveServer(){
+function leaveServer() {
     const nodeId = document.getElementById("nodeId").value;
     const reqBody = {
         'nodeId': nodeId
     };
 
     const Http = new XMLHttpRequest();
-    const url='/admin/leave';
+    const url = '/admin/leave';
     Http.open("POST", url);
     Http.setRequestHeader("Content-Type", "application/json");
     Http.send(JSON.stringify(reqBody));
@@ -148,8 +274,7 @@ function leaveServer(){
         const responseObject = JSON.parse(Http.responseText)
         console.log(Http.status);
         console.log(responseObject);
-        createToast(`${responseObject} is leaving`);
-        setTimeout(() => {}, 45000);
+        createToast(`${responseObject} is leaving`, { showNow: true });
     }
 }
 
@@ -171,7 +296,7 @@ function saveNodeDetails() {
     console.log("Request Body: ", reqBody);
 
     const Http = new XMLHttpRequest();
-    const url='/nodes/'+nodeId;
+    const url = '/nodes/' + nodeId;
     Http.open("PUT", url);
     Http.setRequestHeader("Content-Type", "application/json");
     Http.send(JSON.stringify(reqBody));
@@ -181,15 +306,17 @@ function saveNodeDetails() {
         console.log(Http.status);
         console.log(responseObject);
         createToast(`Node Updated!`);
+        location.reload();
     }
 }
 
-function addNewSystem(systemName) {
+function addNewSystem() {
     const nodeId = document.getElementById("nodeId").value;
-    const systemMode = document.getElementById(`${systemName}_systemMode`).value;
-    const inputSystemFreqs = $(`[id^="${systemName}_systemFreq_"]`);
+    const systemName = document.getElementById(`New System_systemName`).value;
+    const systemMode = document.getElementById(`New System_systemMode`).value;
+    const inputSystemFreqs = $(`[id^="New System_systemFreq_"]`);
     let systemFreqs = [];
-    for (const inputFreq of inputSystemFreqs){        
+    for (const inputFreq of inputSystemFreqs) {
         systemFreqs.push(inputFreq.value);
     }
 
@@ -201,13 +328,13 @@ function addNewSystem(systemName) {
 
     console.log("Request Body: ", reqBody);
     const Http = new XMLHttpRequest();
-    const url='/nodes/'+nodeId+"/systems";
+    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)
+        const responseObject = Http.responseText
         console.log(Http.status);
         console.log(responseObject);
         createToast(`${systemName} Added!`);
@@ -218,9 +345,9 @@ function addNewSystem(systemName) {
 function updateSystem(systemName) {
     const nodeId = document.getElementById("nodeId").value;
     const systemMode = document.getElementById(`${systemName}_systemMode`).value;
-    const inputSystemFreqs = $(`[id^="${systemName}_systemFreq_"]`);    
+    const inputSystemFreqs = $(`[id^="${systemName}_systemFreq_"]`);
     let systemFreqs = [];
-    for (const inputFreq of inputSystemFreqs){        
+    for (const inputFreq of inputSystemFreqs) {
         systemFreqs.push(inputFreq.value);
     }
 
@@ -232,13 +359,13 @@ function updateSystem(systemName) {
 
     console.log("Request Body: ", reqBody);
     const Http = new XMLHttpRequest();
-    const url='/nodes/'+nodeId+"/systems";
+    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)
+        const responseObject = Http.responseText;
         console.log(Http.status);
         console.log(responseObject);
         createToast(`${systemName} Updated!`);
@@ -246,6 +373,28 @@ function updateSystem(systemName) {
     }
 }
 
+function removeSystem(systemName) {
+    const nodeId = document.getElementById("nodeId").value;
+
+    const reqBody = {
+        'systemName': systemName,
+    }
+
+    console.log("Request Body: ", reqBody);
+    const Http = new XMLHttpRequest();
+    const url = '/nodes/' + nodeId + "/systems";
+    Http.open("DELETE", url);
+    Http.setRequestHeader("Content-Type", "application/json");
+    Http.send(JSON.stringify(reqBody));
+    Http.onloadend = (e) => {
+        const responseObject = Http.responseText;
+        console.log(Http.status);
+        console.log(responseObject);
+        createToast(`${systemName} Removed!`);
+        location.reload();
+    }
+}
+
 function requestNodeUpdate() {
 
 }
diff --git a/Server/routes/nodes.js b/Server/routes/nodes.js
index 2ef23b4..a1fef18 100644
--- a/Server/routes/nodes.js
+++ b/Server/routes/nodes.js
@@ -18,6 +18,9 @@ router.post('/:nodeId/systems', nodesController.addNodeSystem);
 // Update a system on an existing node
 router.put('/:nodeId/systems', nodesController.updateNodeSystem);
 
+// Delete a system from an existing node
+router.delete('/:nodeId/systems', nodesController.removeNodeSystem);
+
 // TODO Need to authenticate this request
 /* POST a new node to the server
 *
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
index 45a7e28..e56ba5e 100644
--- a/Server/views/node.ejs
+++ b/Server/views/node.ejs
@@ -23,7 +23,7 @@
                     <!-- Checkin with client button  -->
                     <a type="button" class="btn btn-secondary" href="#" onclick="sendNodeHeartbeat('<%=node.id%>')">Check-in with Node</a>
                     <!-- Update Client button -->
-                    <a type="button" class="btn btn-warning" href="#" onclick="requestNodeUpdate('<%=node.id%>')">Update Node</a>
+                    <a type="button" class="btn btn-warning disabled" href="#" onclick="requestNodeUpdate('<%=node.id%>')">Update Node</a>
                 </div>
                 <hr>
                 <form>                    
@@ -107,7 +107,7 @@
                                                                 data-bs-target="#updateSystemModal_<%=system.replaceAll(" ", "_")%>">
                                                                 <i class="bi bi-pencil"></i>
                                                             </a>
-                                                            <a href="#" class="table-link text-danger label">
+                                                            <a class="table-link text-danger label" onclick="removeSystem('<%=system%>')">
                                                                 <i class="bi bi-trash"></i>
                                                             </a>
                                                         </td>
@@ -135,5 +135,4 @@
     <% // new System Modal %>
     <%- include("partials/modifySystemModal.ejs", {'system': "New System", 'frequencies': [], 'mode': ''}) %>
 <%- include('partials/bodyEnd.ejs') %>
-<script src="/res/js/node.js"></script>
 <%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/bodyEnd.ejs b/Server/views/partials/bodyEnd.ejs
index 992066b..d3cfd20 100644
--- a/Server/views/partials/bodyEnd.ejs
+++ b/Server/views/partials/bodyEnd.ejs
@@ -9,4 +9,6 @@
 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"
     integrity="sha512-3gJwYpMe3QewGELv8k/BX9vcqhryRdzRMxVfq6ngyWXwo03GFEzjsUm8Q7RZcHPHksttq7/GFoxjCVUjkjvPdw=="
-    crossorigin="anonymous" referrerpolicy="no-referrer"></script>
\ No newline at end of file
+    crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+
+<script src="/res/js/node.js"></script>
\ No newline at end of file
diff --git a/Server/views/partials/htmlHead.ejs b/Server/views/partials/htmlHead.ejs
index 9641f52..a1b1d37 100644
--- a/Server/views/partials/htmlHead.ejs
+++ b/Server/views/partials/htmlHead.ejs
@@ -1,7 +1,6 @@
 <!doctype html>
 <html lang="en" data-bs-theme="auto">
     <%- include('head.ejs') %>
-    <body>
-        <div class="toast-container mx-2" id="toastZone"></div>
+    <body>        
         <%- include('navbar.ejs') %>
         <%- include('sidebar.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/modifySystemModal.ejs b/Server/views/partials/modifySystemModal.ejs
index a609964..db00411 100644
--- a/Server/views/partials/modifySystemModal.ejs
+++ b/Server/views/partials/modifySystemModal.ejs
@@ -12,7 +12,7 @@
                         <form>
                             <div class="row gx-3 mb-3">
                                 <label class="small mb-1 fs-6" for="systemName">System Name</label>
-                                <input class="form-control" id="systemName" type="text" value="<%if (!system == "New System") {%><%= system %><%} else {%>Local Radio System<%}%>"></input>
+                                <input class="form-control" id="<%=system%>_systemName" type="text" value="<%if (!system == "New System") {%><%= system %><%} else {%>Local Radio System<%}%>"></input>
                             </div>
                             <div class="row gx-3 mb-3" id="frequencyRow_<%=system.replaceAll(" ", "_")%>">
                                 <label class="small mb-1 fs-6" for="systemFreq">Frequencies</label>
@@ -54,7 +54,7 @@
             </div>
             <div class="modal-footer">
                 <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" onclick="location.reload()">Close</button>
-                <button type="button" class="btn btn-primary" data-bs-dismiss="modal" <%if(!system == "New System") {%>onclick="updateSystem('<%=system%>')"<%} else {%>onclick="addNewSystem('<%=system%>')"<%}%>>Save changes</button>
+                <button type="button" class="btn btn-primary" <%if(!system == "New System") {%>onclick="updateSystem('<%=system%>')"<%} else {%>onclick="addNewSystem('<%=system%>')"<%}%>>Save changes</button>
             </div>
         </div>
     </div>
diff --git a/Server/views/partials/navbar.ejs b/Server/views/partials/navbar.ejs
index 204f863..b9816fc 100644
--- a/Server/views/partials/navbar.ejs
+++ b/Server/views/partials/navbar.ejs
@@ -28,10 +28,10 @@
                         <li><a class="dropdown-item" href="#">Something else here</a></li>
                     </ul>
                 </li>
-                <li class="nav-item">
-                    <a class="nav-link disabled">Disabled</a>
-                </li>
                 */%>
+                <li class="nav-item">
+                    <a class="nav-link" id="navbar-notification-bell" onclick="showStoredToasts()"><i class="bi bi-bell-fill"></i></a>
+                </li>                
             </ul>
             <form class="d-flex" role="search">
                 <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
diff --git a/Server/views/partials/sidebar.ejs b/Server/views/partials/sidebar.ejs
index fd51b50..e323e7d 100644
--- a/Server/views/partials/sidebar.ejs
+++ b/Server/views/partials/sidebar.ejs
@@ -1,4 +1,12 @@
 <div class="container-fluid mt-5">
+    <div aria-live="polite" aria-atomic="true" class="position-relative">
+        <!-- Position it: -->
+        <!-- - `.toast-container` for spacing between toasts -->
+        <!-- - `top-0` & `end-0` to position the toasts in the upper right corner -->
+        <!-- - `.p-3` to prevent the toasts from sticking to the edge of the container  -->
+        <div class="toast-container top-0 end-0 p-3 max" id="toastZone">    
+        </div>
+    </div> 
     <div class="row flex-nowrap">
         <div class="col-auto col-md-3 col-xl-2 px-sm-2 px-0 bg-dark sidebar-container">
             <div
@@ -34,6 +42,7 @@
                     </ul>
             </div>
             */%>
-        </div>
+        </div>        
     </div>
-    <div class="col py-3">
\ No newline at end of file
+    <div class="col py-3">
+    
\ No newline at end of file

From 4ceb71bd8479bd806f3c5338bd58ad12a27c0a54 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 01:29:47 -0400
Subject: [PATCH 46/57] Remove specific presets and left an example file if
 needed for clients

---
 Client/config/radioPresets.json         |  1 -
 Client/config/radioPresets.json.EXAMPLE | 18 ++++++++++++++++++
 2 files changed, 18 insertions(+), 1 deletion(-)
 delete mode 100644 Client/config/radioPresets.json
 create mode 100644 Client/config/radioPresets.json.EXAMPLE

diff --git a/Client/config/radioPresets.json b/Client/config/radioPresets.json
deleted file mode 100644
index b8f268a..0000000
--- a/Client/config/radioPresets.json
+++ /dev/null
@@ -1 +0,0 @@
-{"Westchester Cty. Simulcast":{"frequencies":[470575000,470375000,470525000,470575000,470550000],"mode":"p25","trunkFile":"trunk.tsv"},"coppies":{"frequencies":[154690000],"mode":"nbfm","trunkFile":"none"},"asdadadadasd":{"frequencies":[123321000],"mode":"nbfm","trunkFile":"none"}}
\ No newline at end of file
diff --git a/Client/config/radioPresets.json.EXAMPLE b/Client/config/radioPresets.json.EXAMPLE
new file mode 100644
index 0000000..d33fe51
--- /dev/null
+++ b/Client/config/radioPresets.json.EXAMPLE
@@ -0,0 +1,18 @@
+{
+    "Default P25 System Name": {
+        "frequencies": [
+            155344000,
+            155444000,
+            155555000
+        ],
+        "mode": "p25",
+        "trunkFile": "trunk.tsv"
+    },
+    "Default NBFM System": {
+        "frequencies": [
+            154690000
+        ],
+        "mode": "nbfm",
+        "trunkFile": "none"
+    }
+}
\ No newline at end of file

From c680c8fb2c7d5abaae241572f0a1d928da111c48 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 01:45:32 -0400
Subject: [PATCH 47/57] Fixed bug when editing node systems

- Name defaulted to new system name
---
 Server/views/partials/modifySystemModal.ejs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Server/views/partials/modifySystemModal.ejs b/Server/views/partials/modifySystemModal.ejs
index db00411..664a755 100644
--- a/Server/views/partials/modifySystemModal.ejs
+++ b/Server/views/partials/modifySystemModal.ejs
@@ -12,7 +12,7 @@
                         <form>
                             <div class="row gx-3 mb-3">
                                 <label class="small mb-1 fs-6" for="systemName">System Name</label>
-                                <input class="form-control" id="<%=system%>_systemName" type="text" value="<%if (!system == "New System") {%><%= system %><%} else {%>Local Radio System<%}%>"></input>
+                                <input class="form-control" id="<%=system%>_systemName" type="text" value="<%if (system != "New System") {%><%= system %><%} else {%>Local Radio System<%}%>"></input>
                             </div>
                             <div class="row gx-3 mb-3" id="frequencyRow_<%=system.replaceAll(" ", "_")%>">
                                 <label class="small mb-1 fs-6" for="systemFreq">Frequencies</label>

From bc09840dda5eb0e68e4538dc3ff7f865d332a76e Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 01:46:19 -0400
Subject: [PATCH 48/57] Ignore local radio presets

---
 Client/.gitignore | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 Client/.gitignore

diff --git a/Client/.gitignore b/Client/.gitignore
new file mode 100644
index 0000000..c74a7af
--- /dev/null
+++ b/Client/.gitignore
@@ -0,0 +1 @@
+*radioPresets.json
\ No newline at end of file

From 167f87128e054106b9805e83c8870b362d508beb Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 01:47:09 -0400
Subject: [PATCH 49/57] Check if the presets exist when going to get them

- Return empty object if no preset file is found
---
 Client/utilities/updatePresets.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/Client/utilities/updatePresets.js b/Client/utilities/updatePresets.js
index 1e7bac6..21d6abd 100644
--- a/Client/utilities/updatePresets.js
+++ b/Client/utilities/updatePresets.js
@@ -17,7 +17,7 @@ function writePresets(presets, callback = undefined) {
         // Error checking
         if (err) throw err;
         log.DEBUG("Write Complete");
-        if (callback) callback()
+        if (callback) callback(); else return
     });
 }
 
@@ -71,8 +71,9 @@ function convertFrequencyToHertz(frequency){
  */
 exports.getPresets = function getPresets() {
     const presetDir = path.resolve("./config/radioPresets.json");
-    log.DEBUG(`Getting presets from directory: '${presetDir}'`);
-    return JSON.parse(fs.readFileSync(presetDir));
+    log.DEBUG(`Getting presets from directory: '${presetDir}'`);    
+    if (fs.existsSync(presetDir)) return JSON.parse(fs.readFileSync(presetDir));
+    else return {};
 }
 
 /**

From abdb725964b7ac223ae277ea9b390ebd78780f35 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 03:27:39 -0400
Subject: [PATCH 50/57] Semi functional client webUI

- can update client info for sure
- Working on notifications now
---
 Client/controllers/clientController.js      |  60 ++-
 Client/public/res/css/main.css              | 183 +++++++++
 Client/public/res/js/node.js                | 400 ++++++++++++++++++++
 Client/public/stylesheets/style.css         |   8 -
 Client/routes/bot.js                        |   2 +
 Client/routes/client.js                     |  17 +-
 Client/routes/index.js                      |   6 +-
 Client/utilities/updateConfig.js            |  12 +-
 Client/views/index.ejs                      | 176 ++++++++-
 Client/views/partials/joinModal.ejs         |  44 +++
 Client/views/partials/modifySystemModal.ejs |  61 +++
 Client/views/partials/navbar.ejs            |  42 ++
 12 files changed, 964 insertions(+), 47 deletions(-)
 create mode 100644 Client/public/res/css/main.css
 create mode 100644 Client/public/res/js/node.js
 delete mode 100644 Client/public/stylesheets/style.css
 create mode 100644 Client/views/partials/joinModal.ejs
 create mode 100644 Client/views/partials/modifySystemModal.ejs
 create mode 100644 Client/views/partials/navbar.ejs

diff --git a/Client/controllers/clientController.js b/Client/controllers/clientController.js
index 7d1729e..c8812b4 100644
--- a/Client/controllers/clientController.js
+++ b/Client/controllers/clientController.js
@@ -5,7 +5,7 @@ const log = new DebugBuilder("client", "clientController");
 require('dotenv').config();
 const modes = require("../config/modes");
 // Modules
-const { executeAsyncConsoleCommand, BufferToJson } = require("../utilities/utilities");
+const { executeAsyncConsoleCommand, BufferToJson, nodeObject } = require("../utilities/utilities");
 // Utilities
 const { getFullConfig } = require("../utilities/configHandler");
 const { updateId, updateConfig, updateClientConfig } = require("../utilities/updateConfig");
@@ -22,11 +22,11 @@ var runningClientConfig = getFullConfig()
  * @returns {*}
  */
 function checkBodyForPresetFields(req, res, callback) {
-    if (!req.body?.systemName) return res.status(403).json({"message": "No system in the request"});
-    if (!req.body?.frequencies && Array.isArray(req.body.frequencies)) return res.status(403).json({"message": "No frequencies in the request or type is not an array"});
-    if (!req.body?.mode && typeof req.body.mode === "string") return res.status(403).json({"message": "No mode in the request"});
+    if (!req.body?.systemName) return res.status(403).json({ "message": "No system in the request" });
+    if (!req.body?.frequencies && Array.isArray(req.body.frequencies)) return res.status(403).json({ "message": "No frequencies in the request or type is not an array" });
+    if (!req.body?.mode && typeof req.body.mode === "string") return res.status(403).json({ "message": "No mode in the request" });
     if (!req.body?.trunkFile) {
-        if (modes.digitalModes.includes(req.body.mode)) return res.status(403).json({"message": "No trunk file in the request but digital mode specified. If you are not using a trunk file for this frequency make sure to specify 'none' for trunk file in the request"})
+        if (modes.digitalModes.includes(req.body.mode)) return res.status(403).json({ "message": "No trunk file in the request but digital mode specified. If you are not using a trunk file for this frequency make sure to specify 'none' for trunk file in the request" })
         // If there is a value keep it but if not, add nothing so the system can update that key (if needed)
         req.body.trunkFile = req.body.trunkFile ?? "none";
     }
@@ -34,7 +34,7 @@ function checkBodyForPresetFields(req, res, callback) {
     return callback();
 }
 
-async function checkLocalIP() {    
+async function checkLocalIP() {
     if (process.platform === "win32") {
         // Windows
         var networkConfig = await executeAsyncConsoleCommand("ipconfig");
@@ -72,21 +72,21 @@ exports.checkConfig = async function checkConfig() {
         await updateId(0);
         runningClientConfig.id = 0;
     }
-    
+
     if (!runningClientConfig.ip) {
         const ipAddr = await checkLocalIP();
         await updateConfig('CLIENT_IP', ipAddr);
         runningClientConfig.ip = ipAddr;
     }
 
-    if(!runningClientConfig.name) {
+    if (!runningClientConfig.name) {
         const lastOctet = await String(checkLocalIP()).spit('.')[-1];
         const name = `Radio-Node-${lastOctet}`;
         await updateConfig('CLIENT_NAME', name);
         runningClientConfig.name = name;
     }
 
-    if(!runningClientConfig.port) {
+    if (!runningClientConfig.port) {
         const port = 3010;
         await updateConfig('CLIENT_PORT', port);
         runningClientConfig.port = port;
@@ -104,11 +104,11 @@ exports.checkIn = async (update = false) => {
     let reqOptions;
     await this.checkConfig();
     // Check if there is an ID found, if not add the node to the server. If there was an ID, check in with the server to make sure it has the correct information
-    try {        
-        if (!runningClientConfig?.id || runningClientConfig.id == 0) {                        
+    try {
+        if (!runningClientConfig?.id || runningClientConfig.id == 0) {
             // ID was not found in the config, creating a new node
-            reqOptions = new requestOptions("/nodes/newNode", "POST");                
-            sendHttpRequest(reqOptions, JSON.stringify(runningClientConfig), async (responseObject) => {                
+            reqOptions = new requestOptions("/nodes/newNode", "POST");
+            sendHttpRequest(reqOptions, JSON.stringify(runningClientConfig), async (responseObject) => {
                 // Check if the server responded
                 if (!responseObject) {
                     log.WARN("Server did not respond to checkIn. Will wait 60 seconds then try again");
@@ -120,7 +120,7 @@ exports.checkIn = async (update = false) => {
                 }
 
                 // Update the client's ID if the server accepted its
-                if (responseObject.statusCode === 202) {                    
+                if (responseObject.statusCode === 202) {
                     runningClientConfig.id = responseObject.body.nodeId;
                     log.DEBUG("Response object from new node: ", responseObject, runningClientConfig);
                     await updateId(runningClientConfig.id);
@@ -131,7 +131,7 @@ exports.checkIn = async (update = false) => {
                     log.DEBUG("HTTP Error: ", responseObject, await BufferToJson(responseObject.body));
                     await onHttpError(responseObject.statusCode);
                 }
-                
+
             });
         }
         else {
@@ -149,15 +149,17 @@ exports.checkIn = async (update = false) => {
                     }, 60000);
                     return
                 }
-                
+
                 if (responseObject.statusCode === 202) {
                     log.DEBUG("Updated keys: ", responseObject.body.updatedKeys)
                     // Server accepted an update
                 }
                 if (responseObject.statusCode === 200) {
                     // Server accepted the response but there were no keys to be updated
-                    const tempUpdatedConfig = updateClientConfig(responseObject.body);
-                    if (!tempUpdatedConfig.length > 0) return;
+                    if (!update){
+                        const tempUpdatedConfig = updateClientConfig(responseObject.body);
+                        if (!tempUpdatedConfig.length > 0) return;
+                    }
                 }
                 if (responseObject.statusCode >= 300) {
                     // Server threw an error
@@ -179,6 +181,24 @@ exports.requestCheckIn = async (req, res) => {
     return res.sendStatus(200);
 }
 
+/**
+ * Express JS Wrapper for checking and updating client config
+ * @param {*} req 
+ * @param {*} res 
+ * @returns 
+ */
+exports.updateClientConfigWrapper = async (req, res) => {    
+    // Convert the online status to a boolean to be worked with
+    log.DEBUG("REQ Body: ", req.body);
+    const updatedKeys = await updateClientConfig(req.body);
+    if (updatedKeys) {
+        log.DEBUG("Keys have been updated, updating running config and checking in with the server: ", updatedKeys);
+        runningClientConfig = await getFullConfig();
+        await this.checkIn(true);
+    }
+    res.status(200).json(updatedKeys);
+}
+
 /** Controller for the /client/presets endpoint
  * This is the endpoint wrapper to get the presets object
  */
@@ -196,7 +216,7 @@ exports.updatePreset = async (req, res) => {
             runningClientConfig.nearbySystems = getPresets();
             this.checkIn(true);
             return res.sendStatus(200);
-        }, {frequencies: req.body.frequencies, mode: req.body.mode, trunkFile: req.body.trunkFile});
+        }, { frequencies: req.body.frequencies, mode: req.body.mode, trunkFile: req.body.trunkFile });
     })
 }
 
@@ -218,7 +238,7 @@ exports.addNewPreset = async (req, res) => {
  */
 exports.removePreset = async (req, res) => {
     checkBodyForPresetFields(req, res, () => {
-        if (!req.body.systemName) return res.status("500").json({"message": "You must specify a system name to delete, this must match exactly to how the system name is saved."})
+        if (!req.body.systemName) return res.status("500").json({ "message": "You must specify a system name to delete, this must match exactly to how the system name is saved." })
         removePreset(req.body.systemName, () => {
             runningClientConfig.nearbySystems = getPresets();
             this.checkIn(true);
diff --git a/Client/public/res/css/main.css b/Client/public/res/css/main.css
new file mode 100644
index 0000000..5c44612
--- /dev/null
+++ b/Client/public/res/css/main.css
@@ -0,0 +1,183 @@
+.node-card {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    min-width: 0;
+    word-wrap: break-word;
+    background-color: #fff;
+    background-clip: border-box;
+    border: 1px solid #eff0f2;
+    border-radius: 1rem;
+    margin-bottom: 24px;
+    box-shadow: 0 2px 3px #e4e8f0;
+}
+
+.avatar-md {
+    height: 4rem;
+    width: 4rem;
+}
+
+.rounded-circle {
+    border-radius: 50% !important;
+}
+
+.img-thumbnail {
+    padding: 0.25rem;
+    background-color: #f1f3f7;
+    border: 1px solid #eff0f2;
+    border-radius: 0.75rem;
+}
+
+.avatar-title {
+    align-items: center;
+    background-color: #3b76e1;
+    color: #fff;
+    display: flex;
+    font-weight: 500;
+    height: 100%;
+    justify-content: center;
+    width: 100%;
+}
+
+.bg-soft-primary {
+    background-color: rgba(59, 118, 225, .25) !important;
+}
+
+a {
+    text-decoration: none !important;
+}
+
+.badge-soft-danger {
+    color: #f56e6e !important;
+    background-color: rgba(245, 110, 110, .1);
+}
+
+.badge-soft-success {
+    color: #63ad6f !important;
+    background-color: rgba(99, 173, 111, .1);
+}
+
+.mb-0 {
+    margin-bottom: 0 !important;
+}
+
+.badge {
+    display: inline-block;
+    padding: 0.25em 0.6em;
+    font-size: 75%;
+    font-weight: 500;
+    line-height: 1;
+    color: #fff;
+    text-align: center;
+    white-space: nowrap;
+    vertical-align: baseline;
+    border-radius: 0.75rem;
+}
+
+/* Info Card Section */
+.info-card {
+    background-color: #fff;
+    border-radius: 10px;
+    border: none;
+    position: relative;
+    margin-bottom: 30px;
+    box-shadow: 0 0.46875rem 2.1875rem rgba(90, 97, 105, 0.1), 0 0.9375rem 1.40625rem rgba(90, 97, 105, 0.1), 0 0.25rem 0.53125rem rgba(90, 97, 105, 0.12), 0 0.125rem 0.1875rem rgba(90, 97, 105, 0.1);
+}
+
+.info-card .card-statistic .card-icon-large .bi {
+    font-size: 110px;
+}
+
+.info-card .card-statistic .card-icon {
+    text-align: center;
+    line-height: 50px;
+    margin-left: 15px;
+    color: #000;
+    position: absolute;
+    right: -5px;
+    top: 20px;
+    opacity: 0.1;
+}
+
+/* Info Card Background Colors */
+
+.l-bg-cherry {
+    background: linear-gradient(to right, #493240, #f09) !important;
+    color: #fff;
+}
+
+.l-bg-blue-dark {
+    background: linear-gradient(to right, #373b44, #4286f4) !important;
+    color: #fff;
+}
+
+.l-bg-green-dark {
+    background: linear-gradient(to right, #0a504a, #38ef7d) !important;
+    color: #fff;
+}
+
+.l-bg-orange-dark {
+    background: linear-gradient(to right, #a86008, #ffba56) !important;
+    color: #fff;
+}
+
+.l-bg-cyan {
+    background: linear-gradient(135deg, #289cf5, #84c0ec) !important;
+    color: #fff;
+}
+
+.l-bg-green {
+    background: linear-gradient(135deg, #23bdb8 0%, #43e794 100%) !important;
+    color: #fff;
+}
+
+.l-bg-orange {
+    background: linear-gradient(to right, #f9900e, #ffba56) !important;
+    color: #fff;
+}
+
+/* Global Section */
+.sidebar-container {
+    min-height: 95vh;
+}
+
+.sidebar { 
+    position: fixed; 
+    top: 5vh; 
+    bottom: 0;
+    left: 0;
+ }
+
+/* User table section */
+
+.label {
+    border-radius: 3px;
+    font-size: 1.1em;
+    font-weight: 600;
+}
+
+.user-list tbody td .user-subhead {
+    font-size: 1em;
+    font-style: italic;
+}
+
+.table thead tr th {
+    text-transform: uppercase;
+    font-size: 0.875em;
+}
+
+.table thead tr th {
+    border-bottom: 2px solid #e7ebee;
+}
+
+.table tbody tr td:first-child {
+    font-size: 1.125em;
+    font-weight: 300;
+}
+
+.table tbody tr td {
+    font-size: 0.875em;
+    vertical-align: middle;
+    border-top: 1px solid #e7ebee;
+    padding: 12px 8px;
+}
diff --git a/Client/public/res/js/node.js b/Client/public/res/js/node.js
new file mode 100644
index 0000000..dd2cf94
--- /dev/null
+++ b/Client/public/res/js/node.js
@@ -0,0 +1,400 @@
+$(document).ready(async () => {
+    console.log("Loading stored notifications...");
+    await loadStoredToasts();
+    console.log("Showing stored notifications...");
+    await showStoredToasts();
+});
+
+/**
+ * Gets all toasts stored in local storage
+ * 
+ * @returns {Object} Object of toasts in storage
+ */
+function getStoredToasts() {
+    if (localStorage.getItem("toasts")) {
+        const storedToasts = JSON.parse(localStorage.getItem("toasts"));
+        console.log("LOADED STORED TOASTS: ", storedToasts);
+        navbarUpdateNotificationBellCount(storedToasts);
+        return storedToasts;
+    }
+    else return false
+}
+
+/**
+ * Adds a toast to storage, will not allow duplicates
+ * 
+ * @param {Date} time The date object from when the toast was created
+ * @param {*} message The message of the toast
+ */
+function addToastToStorage(time, message) {
+    var toasts = [{ 'time': time, 'message': message }]
+    var storedToasts = getStoredToasts();
+    console.log("Adding new notification to storage: ", toasts);
+    toasts = toasts.concat(storedToasts);
+    console.log("Combined new and stored notifications: ", toasts);
+    toasts = toasts.filter((value, index, self) =>
+        index === self.findIndex((t) => (
+            t.time === value.time && t.message === value.message
+        ))
+    )
+    console.log("Deduped stored notifications: ", toasts);
+    localStorage.setItem("toasts", JSON.stringify(toasts));
+    navbarUpdateNotificationBellCount(toasts);
+}
+
+/**
+ * Removes a toast from the local storage
+ * 
+ * @param {Date} time The date object from when the toast was created
+ * @param {*} message The message of the toast
+ */
+function removeToastFromStorage(time, message) {
+    const toastToRemove = { 'time': time, 'message': message }
+    console.log("Toast to remove: ", toastToRemove);
+    var toasts = getStoredToasts();
+    console.log("Stored toasts: ", toasts);
+    if (toasts.indexOf(toastToRemove)) toasts.splice(toasts.indexOf(toastToRemove) - 1, 1)
+    console.log("Toasts with selected toast removed: ", toasts);
+    localStorage.setItem("toasts", JSON.stringify(toasts));
+    navbarUpdateNotificationBellCount(toasts);
+}
+
+/**
+ * Shows all stored toasts
+ */
+function showStoredToasts() {
+    const storedToasts = getStoredToasts();
+    if (!storedToasts) return
+    console.log("Loaded stored notifications to show: ", storedToasts);
+    for (const toast of storedToasts) {
+        const toastId = `${toast.time}-toast`;
+        console.log("Showing stored toast: ", toast, toastId);
+        const toastElement = bootstrap.Toast.getOrCreateInstance(document.getElementById(toastId));
+        toastElement.show();
+    }
+}
+
+/**
+ * Loads all toasts stored in the local storage into the DOM of the webpage
+ */
+function loadStoredToasts() {
+    const storedToasts = getStoredToasts();
+    if (!storedToasts) return
+    console.log("Loaded stored notifications: ", storedToasts);
+    for (const toast of storedToasts) {
+        createToast(toast.message, { time: toast.time })
+    }
+}
+
+/**
+ * Will update the count of notifications on the bell icon in the navbar
+ * 
+ * @param {Array} storedToasts An array of stored toasts to be counted and updated in the navbar
+ */
+function navbarUpdateNotificationBellCount(storedToasts) {
+    const notificationBellIcon = document.getElementById("navbar-notification-bell");
+    var notificationBellCount = document.getElementById("notification-bell-icon-count");
+    if (!notificationBellCount) {
+        notificationBellCount = document.createElement('span');
+        notificationBellCount.id = "notification-bell-icon-count";
+        notificationBellCount.classList.add('badge');
+        notificationBellCount.classList.add('text-bg-secondary');
+        notificationBellCount.appendChild(document.createTextNode(storedToasts.length));
+    }
+    else notificationBellCount.innerHTML = storedToasts.length;
+
+    notificationBellIcon.appendChild(notificationBellCount);
+}
+
+/**
+ * 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);
+}
+
+/**
+ * Add a toast element to the DOM
+ * 
+ * @param {*} notificationMessage The message of the notification 
+ * @param {Date} param1.time The date object for when the toast was created, blank if creating new
+ * @param {boolean} param1.showNow Show the toast now or just store it
+ * @returns 
+ */
+function createToast(notificationMessage, { time = undefined, showNow = false } = {}) {
+    if (!time) time = new Date(Date.now());
+    else time = new Date(Date.parse(time));
+    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(time.toLocaleString()));
+
+    const toastClose = document.createElement('button');
+    toastClose.type = 'button';
+    toastClose.classList.add('btn-close');
+    toastClose.ariaLabel = 'Close';
+    toastClose.setAttribute('data-bs-dismiss', 'toast');
+    toastClose.onclick = () => { removeToastFromStorage(time.toISOString(), notificationMessage); };
+
+    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.classList.add('position-fixed');
+    wrapperDiv.id = `${time.toISOString()}-toast`;
+    wrapperDiv.role = 'alert';
+    wrapperDiv.ariaLive = 'assertive';
+    wrapperDiv.ariaAtomic = true;
+    wrapperDiv.setAttribute('data-bs-delay', "7500");
+    wrapperDiv.setAttribute('data-bs-animation', true);
+    wrapperDiv.appendChild(toastHeader);
+    wrapperDiv.appendChild(toastMessage);
+
+    document.getElementById("toastZone").appendChild(wrapperDiv);
+    addToastToStorage(time.toISOString(), notificationMessage);
+    if (showNow) {
+        const toastElement = bootstrap.Toast.getOrCreateInstance(document.getElementById(`${time.toISOString()}-toast`));
+        toastElement.show();
+    }
+
+    return;
+}
+
+function sendNodeHeartbeat(nodeId) {
+    const Http = new XMLHttpRequest();
+    const url = '/client/requestCheckIn' + nodeId;
+    Http.open("GET", url);
+    Http.send();
+
+    Http.onloadend = (e) => {
+        console.log(Http.responseText)
+        createToast(Http.responseText, { showNow: true });
+    }
+}
+
+function joinServer() {
+    const preset = document.getElementById("selectRadioPreset").value;
+    const clientId = document.getElementById("inputDiscordClientId").value;
+    const channelId = document.getElementById("inputDiscordChannelId").value;
+
+    const reqBody = {
+        'preset': preset,
+        'clientId': clientId,
+        'channelId': channelId
+    };
+
+    console.log(reqBody);
+
+    const Http = new XMLHttpRequest();
+    const url = '/bot/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`, { showNow: true });
+        $("#joinModal").modal('toggle');
+    }
+}
+
+function leaveServer() {
+    const reqBody = {};
+
+    const Http = new XMLHttpRequest();
+    const url = '/bot/leave';
+    Http.open("POST", url);
+    Http.setRequestHeader("Content-Type", "application/json");
+    Http.send(JSON.stringify(reqBody));
+
+    Http.onloadend = (e) => {
+        const responseObject = Http.responseText;
+        console.log(Http.status);
+        console.log(responseObject);
+        createToast(`${responseObject} is leaving`, { showNow: true });
+    }
+}
+
+function saveNodeDetails() {
+    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 = {
+        'name': nodeName,
+        'ip': nodeIp,
+        'port': nodePort,
+        'location': nodeLocation
+    }
+
+    console.log("Request Body: ", reqBody);
+
+    const Http = new XMLHttpRequest();
+    const url = '/client';
+    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!`);
+        location.reload();
+    }
+}
+
+function addNewSystem() {
+    const nodeId = document.getElementById("nodeId").value;
+    const systemName = document.getElementById(`New System_systemName`).value;
+    const systemMode = document.getElementById(`New System_systemMode`).value;
+    const inputSystemFreqs = $(`[id^="New System_systemFreq_"]`);
+    let systemFreqs = [];
+    for (const inputFreq of inputSystemFreqs) {
+        systemFreqs.push(inputFreq.value);
+    }
+
+    const reqBody = {
+        'systemName': systemName,
+        'mode': systemMode,
+        'frequencies': systemFreqs
+    }
+    if (reqBody.mode == "p25") reqBody.trunkFile = 'none';
+
+    console.log("Request Body: ", reqBody);
+    const Http = new XMLHttpRequest();
+    const url = "/client/addPreset";
+    Http.open("POST", url);
+    Http.setRequestHeader("Content-Type", "application/json");
+    Http.send(JSON.stringify(reqBody));
+
+    Http.onloadend = (e) => {
+        const responseObject = 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
+    }
+    if (reqBody.mode == "p25") reqBody.trunkFile = 'none';
+
+    console.log("Request Body: ", reqBody);
+    const Http = new XMLHttpRequest();
+    const url = "/client/updatePreset";
+    Http.open("POST", url);
+    Http.setRequestHeader("Content-Type", "application/json");
+    Http.send(JSON.stringify(reqBody));
+
+    Http.onloadend = (e) => {
+        const responseObject = Http.responseText;
+        console.log(Http.status);
+        console.log(responseObject);
+        createToast(`${systemName} Updated!`);
+        location.reload();
+    }
+}
+
+function removeSystem(systemName) {
+    const nodeId = document.getElementById("nodeId").value;
+
+    const reqBody = {
+        'systemName': systemName,
+    }
+
+    console.log("Request Body: ", reqBody);
+    const Http = new XMLHttpRequest();
+    const url = '/client/removePreset';
+    Http.open("POST", url);
+    Http.setRequestHeader("Content-Type", "application/json");
+    Http.send(JSON.stringify(reqBody));
+    Http.onloadend = (e) => {
+        const responseObject = Http.responseText;
+        console.log(Http.status);
+        console.log(responseObject);
+        createToast(`${systemName} Removed!`);
+        location.reload();
+    }
+}
+
+function requestNodeUpdate() {
+
+}
+
+function removeFrequencyInput(elementId) {
+    const element = document.getElementById(elementId);
+    element.remove();
+}
\ No newline at end of file
diff --git a/Client/public/stylesheets/style.css b/Client/public/stylesheets/style.css
deleted file mode 100644
index 9453385..0000000
--- a/Client/public/stylesheets/style.css
+++ /dev/null
@@ -1,8 +0,0 @@
-body {
-  padding: 50px;
-  font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
-}
-
-a {
-  color: #00B7FF;
-}
diff --git a/Client/routes/bot.js b/Client/routes/bot.js
index 805f8a1..3af6afa 100644
--- a/Client/routes/bot.js
+++ b/Client/routes/bot.js
@@ -15,7 +15,9 @@ router.get('/status', botController.getStatus);
 *
 * @param req The request sent from the master
 * @param req.body.channelId The channel ID to join
+* @param req.body.clientId The discord Client ID to use when connecting to the server
 * @param req.body.presetName The name of the preset to start listening to
+* @param req.body.NGThreshold [OPTIONAL] The noisegate threshold, this will default to 50 
  */
 router.post('/join', botController.joinServer);
 
diff --git a/Client/routes/client.js b/Client/routes/client.js
index c3a7ed0..36d6bd5 100644
--- a/Client/routes/client.js
+++ b/Client/routes/client.js
@@ -2,7 +2,7 @@
 const express = require('express');
 const router = express.Router();
 // Controllers
-const { requestCheckIn, getPresets, updatePreset, addNewPreset, removePreset, updateClient } = require("../controllers/clientController");
+const { requestCheckIn, getPresets, updatePreset, addNewPreset, removePreset, updateClient, updateClientConfigWrapper } = require("../controllers/clientController");
 
 /** GET Request a check in from the client
  * Queue the client to check in with the server
@@ -11,16 +11,21 @@ const { requestCheckIn, getPresets, updatePreset, addNewPreset, removePreset, up
  */
 router.get('/requestCheckIn', requestCheckIn);
 
-/** GET Object of all known presets
- * Query the client to get all the known presets
- */
-router.put('/', );
-
 /** GET Object of all known presets
  * Query the client to get all the known presets
  */
 router.get('/presets', getPresets);
 
+/**
+ * PUT An update to the running client config (not radio config)
+ * @param {number} req.body.id The ID given to the node to update 
+ * @param {string} req.body.name The name of the node
+ * @param {string} req.body.ip The IP the server can contact the node on
+ * @param {number} req.body.port The port the server can contact the node on 
+ * @param {string} req.body.location The physical location of the node
+ */
+router.put('/', updateClientConfigWrapper);
+
 /** POST Update to preset
  *
  * @param req The request sent from the master
diff --git a/Client/routes/index.js b/Client/routes/index.js
index ecca96a..bf776f0 100644
--- a/Client/routes/index.js
+++ b/Client/routes/index.js
@@ -1,9 +1,11 @@
 var express = require('express');
 var router = express.Router();
+const { getFullConfig } = require('../utilities/configHandler');
 
 /* GET home page. */
-router.get('/', function(req, res, next) {
-  res.render('index', { title: 'Express' });
+router.get('/', async function(req, res, next) {
+  const clientConfig = await getFullConfig();
+  res.render('index', { 'node': clientConfig });
 });
 
 module.exports = router;
diff --git a/Client/utilities/updateConfig.js b/Client/utilities/updateConfig.js
index 250d90c..9e90ba8 100644
--- a/Client/utilities/updateConfig.js
+++ b/Client/utilities/updateConfig.js
@@ -27,7 +27,12 @@ exports.updateId = (updatedId) => {
 /**
  * Wrapper to update any or all keys in the client config
  * 
- * @param {*} configObject Object with what keys you wish to update (node object format, will be converted)
+ * @param {Object} configObject Object with what keys you wish to update (node object format, will be converted)
+ * @param {number} configObject.id The ID given to the node to update 
+ * @param {string} configObject.name The name of the node
+ * @param {string} configObject.ip The IP the server can contact the node on
+ * @param {number} configObject.port The port the server can contact the node on 
+ * @param {string} configObject.location The physical location of the node
  * @returns 
  */
 exports.updateClientConfig = (configObject) => { 
@@ -39,6 +44,7 @@ exports.updateClientConfig = (configObject) => {
         if (runningConfig.id != configObject.id) {
             this.updateConfig('CLIENT_ID', configObject.id);
             updatedKeys.push({'CLIENT_ID': configObject.id});
+            process.env.CLIENT_ID = configObject.id;
             log.DEBUG("Updated ID to: ", configObject.id);
         }        
     }
@@ -46,6 +52,7 @@ exports.updateClientConfig = (configObject) => {
         if (runningConfig.name != configObject.name) {
             this.updateConfig('CLIENT_NAME', configObject.name);
             updatedKeys.push({'CLIENT_NAME': configObject.name});
+            process.env.CLIENT_NAME = configObject.name;
             log.DEBUG("Updated name to: ", configObject.name);
         }
     }
@@ -53,6 +60,7 @@ exports.updateClientConfig = (configObject) => {
         if (runningConfig.ip != configObject.ip) {
             this.updateConfig('CLIENT_IP', configObject.ip);
             updatedKeys.push({'CLIENT_IP': configObject.ip});
+            process.env.CLIENT_IP = configObject.ip;
             log.DEBUG("Updated ip to: ", configObject.ip);
         }
     }
@@ -60,6 +68,7 @@ exports.updateClientConfig = (configObject) => {
         if (runningConfig.port != configObject.port) {
             this.updateConfig('CLIENT_PORT', configObject.port);
             updatedKeys.push({'CLIENT_PORT': configObject.port});
+            process.env.CLIENT_PORT = configObject.port;
             log.DEBUG("Updated port to: ", configObject.port);
         }
     }
@@ -67,6 +76,7 @@ exports.updateClientConfig = (configObject) => {
         if (runningConfig.location != configObject.location) {
             this.updateConfig('CLIENT_LOCATION', configObject.location);
             updatedKeys.push({'CLIENT_LOCATION': configObject.location});
+            process.env.CLIENT_LOCATION = configObject.location;
             log.DEBUG("Updated location to: ", configObject.location);
         }
     }
diff --git a/Client/views/index.ejs b/Client/views/index.ejs
index 7b7a1d6..11a4460 100644
--- a/Client/views/index.ejs
+++ b/Client/views/index.ejs
@@ -1,11 +1,167 @@
 <!DOCTYPE html>
-<html>
-  <head>
-    <title><%= title %></title>
-    <link rel='stylesheet' href='/stylesheets/style.css' />
-  </head>
-  <body>
-    <h1><%= title %></h1>
-    <p>Welcome to <%= title %></p>
-  </body>
-</html>
+<html lang="en" data-bs-theme="auto">
+
+<head>
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Bootstrap demo</title>
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"
+    integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css">
+  <link rel="stylesheet" href="/res/css/main.css">
+</head>
+
+<body>
+  <%- include('partials/navbar.ejs') %>
+    <div aria-live="polite" aria-atomic="true" class="position-relative">
+      <!-- Position it: -->
+      <!-- - `.toast-container` for spacing between toasts -->
+      <!-- - `top-0` & `end-0` to position the toasts in the upper right corner -->
+      <!-- - `.p-3` to prevent the toasts from sticking to the edge of the container  -->
+      <div class="toast-container top-0 end-0 p-3 max" id="toastZone">
+      </div>
+    </div>
+    <div class="container">
+      <div class="card mb-4">
+        <div class="card-header">
+          <p>
+            <span class="fs-2 fw-semibold">
+              Node Details
+            </span>
+          </p>
+        </div>
+        <div class="card-body">
+          <div class="col-md-12 pt-2">
+            <label class="small mb-1" for="nodeStatus">Online Status:</label>
+            <span class="badge badge-soft-success mb-0 align-middle fs-6" id="nodeStatus">Online</span>
+
+            <br>
+            <div class="py-2"></div>
+            <!-- Join Server button-->
+            <a type="button" class="btn btn-info text-white" data-bs-toggle="modal" data-bs-target="#joinModal"
+              href="#">Join Server</a>
+            <!-- Leave Server button  -->
+            <a type="button" class="btn btn-danger" href="#" onclick="leaveServer()">Leave Server</a>
+            <!-- Checkin with client button  -->
+            <a type="button" class="btn btn-secondary" href="#" onclick="sendNodeHeartbeat('<%=node.id%>')">Check-in
+              with Node</a>
+            <!-- Update Client button -->
+            <a type="button" class="btn btn-warning disabled" href="#"
+              onclick="requestNodeUpdate('<%=node.id%>')">Update Node</a>
+          </div>
+          <hr>
+          <form>
+            <div class="row gx-3 mb-3">
+              <div class="col-md-6">
+                <label class="small mb-1" for="nodeId">Node ID (this is the assigned Node ID and cannot be
+                  changed)</label>
+                <input class="form-control" id="nodeId" type="text" value="<%=node.id%>" disabled></input>
+              </div>
+            </div>
+
+            <div class="row gx-3 mb-3">
+              <div class="col-md-12">
+                <label class="small mb-1" for="inputNodeName">Node Name:</label>
+                <input class="form-control" id="inputNodeName" type="text" value="<%=node.name%>"></input>
+              </div>
+            </div>
+            <div class="row gx-3 mb-3">
+              <div class="col-md-4">
+                <label class="small mb-1" for="inputNodeIp">Node IP Address (that the server can
+                  contact):</label>
+                <input class="form-control" id="inputNodeIp" type="text" value="<%=node.ip%>"></input>
+              </div>
+              <div class="col-md-2">
+                <label class="small mb-1" for="inputOrgName">Node Port (with the API):</label>
+                <input class="form-control" id="inputOrgName" type="number" value="<%=node.port%>"></input>
+              </div>
+            </div>
+            <div class="mb-3">
+              <label class="small mb-1" for="inputNodeLocation">Node Location (physical location):</label>
+              <input class="form-control" id="inputNodeLocation" type="location" value="<%=node.location%>"></input>
+            </div>
+            <h4>
+              Nearby Systems
+            </h4>
+            <hr>
+            <div class="row">
+              <div class="col-lg-12">
+                <div class="main-box no-header clearfix">
+                  <div class="main-box-body clearfix">
+                    <div class="table-responsive">
+                      <table class="table user-list <% if(!node.online) { %>disabled<% } %>">
+                        <thead>
+                          <tr>
+                            <th><span>System Name</span></th>
+                            <th><span>Frequencies</span></th>
+                            <th><span>Protocol</span></th>
+                            <th>&nbsp;</th>
+                          </tr>
+                        </thead>
+                        <tbody>
+                          <% for(const system in node.nearbySystems){ %>
+                            <tr>
+                              <td>
+                                <%= system %>
+                              </td>
+                              <td>
+                                <% if(node.nearbySystems[system].frequencies.length> 1) { %>
+                                  <ul>
+                                    <% for(const frequency of node.nearbySystems[system].frequencies) { %>
+                                      <li>
+                                        <%=frequency%> MHz
+                                      </li>
+                                      <% } %>
+                                  </ul>
+                                  <% } else { const frequency=node.nearbySystems[system].frequencies[0] %>
+                                    <%=frequency%> MHz
+                                      <% } %>
+                              </td>
+                              <td>
+                                <span class="label label-default text-uppercase">
+                                  <%= node.nearbySystems[system].mode %>
+                                </span>
+                              </td>
+                              <td>
+                                <a href="#" class="table-link text-info label" data-bs-toggle="modal"
+                                  data-bs-target="#updateSystemModal_<%=system.replaceAll(" ", " _")%>">
+                                  <i class="bi bi-pencil"></i>
+                                </a>
+                                <a class="table-link text-danger label" onclick="removeSystem('<%=system%>')">
+                                  <i class="bi bi-trash"></i>
+                                </a>
+                              </td>
+                            </tr>
+                            <% // Update system modal %>
+                              <%- include("partials/modifySystemModal.ejs", {'system': system, 'frequencies' :
+                                node.nearbySystems[system].frequencies, 'mode' : node.nearbySystems[system].mode}) %>
+                                <% } %>
+                        </tbody>
+                      </table>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <!-- Save changes button-->
+            <button class="btn btn-primary" type="button" onclick="saveNodeDetails()">Save changes</button>
+            <!-- Button trigger modal -->
+            <button type="button" class="btn btn-primary float-right" data-bs-toggle="modal"
+              data-bs-target="#updateSystemModal_New_System">Add New System</button>
+          </form>
+        </div>
+      </div>
+    </div>
+
+    <% // new System Modal %>
+      <%- include("partials/modifySystemModal.ejs", {'system': "New System" , 'frequencies' : [], 'mode' : '' }) %>
+</body>
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"
+  integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz" crossorigin="anonymous"></script>
+
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"
+  integrity="sha512-3gJwYpMe3QewGELv8k/BX9vcqhryRdzRMxVfq6ngyWXwo03GFEzjsUm8Q7RZcHPHksttq7/GFoxjCVUjkjvPdw=="
+  crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+
+<script src="/res/js/node.js"></script>
+
+</html>
\ No newline at end of file
diff --git a/Client/views/partials/joinModal.ejs b/Client/views/partials/joinModal.ejs
new file mode 100644
index 0000000..d912911
--- /dev/null
+++ b/Client/views/partials/joinModal.ejs
@@ -0,0 +1,44 @@
+<div class="modal fade" id="joinModal" tabindex="-1" aria-labelledby="joinModal" aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h1 class="modal-title fs-5" id="joinModal">Join Node <%=node.id%> to a Discord Server</h1>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <div class="container">
+                    <div class="card mb-4">
+                        <div class="card-body">
+                            <form>                                
+                                <div class="row gx-3 mb-3">
+                                    <div class="col-md-12">
+                                        <label class="small mb-1" for="inputDiscordClientId">Discord Client ID:</label>
+                                        <input class="form-control" id="inputDiscordClientId" type="text" value="" required></input>
+                                    </div>
+                                </div>
+                                <div class="row gx-3 mb-3">
+                                    <div class="col-md-6">
+                                        <label class="small mb-1" for="inputDiscordChannelId">Discord Channel ID:</label>
+                                        <input class="form-control" id="inputDiscordChannelId" type="text" value="" required></input>
+                                    </div>
+                                    <div class="col-md-6">
+                                        <label class="small mb-1" for="selectRadioPreset">Selected Preset:</label>
+                                        <select class="custom-select" id="selectRadioPreset">
+                                            <% for(const system in nearbySystems) { %>                                                                                                
+                                                <option value="<%=system%>"><%=system%></option>
+                                            <% } %>
+                                        </select>
+                                    </div>
+                                </div>
+                            </form>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
+                <button type="button" class="btn btn-primary" onclick="joinServer()">Join</button>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/Client/views/partials/modifySystemModal.ejs b/Client/views/partials/modifySystemModal.ejs
new file mode 100644
index 0000000..664a755
--- /dev/null
+++ b/Client/views/partials/modifySystemModal.ejs
@@ -0,0 +1,61 @@
+<div class="modal fade" id="updateSystemModal_<%=system.replaceAll(" ", "_")%>" tabindex="-1" aria-labelledby="updateSystemModal_<%=system.replaceAll(" ", "_")%>"
+    aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
+    <div class="modal-dialog modal-dialog-centered">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h1 class="modal-title fs-5" id="updateSystemModal_<%=system.replaceAll(" ", "_")%>"><%if (!system == "New System") {%>Update<%} else {%>Add a<%}%> <%=system%></h1>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <div class="card mb-4">
+                    <div class="card-body">
+                        <form>
+                            <div class="row gx-3 mb-3">
+                                <label class="small mb-1 fs-6" for="systemName">System Name</label>
+                                <input class="form-control" id="<%=system%>_systemName" type="text" value="<%if (system != "New System") {%><%= system %><%} else {%>Local Radio System<%}%>"></input>
+                            </div>
+                            <div class="row gx-3 mb-3" id="frequencyRow_<%=system.replaceAll(" ", "_")%>">
+                                <label class="small mb-1 fs-6" for="systemFreq">Frequencies</label>
+                                <% for(const frequency of frequencies) { %>
+                                <div class="col-md-6 mb-1" id="<%=system%>_systemFreqRow_<%=frequency%>">
+                                    <div class="row px-1">
+                                        <div class="col-10">
+                                            <input class="form-control" id="<%=system%>_systemFreq_<%=frequency%>" type="text" value="<%= frequency %>"></input>
+                                        </div>
+                                        <div class="col-2">
+                                            <a class="align-middle float-left" href="#" onclick="removeFrequencyInput('<%=system%>_systemFreqRow_<%=frequency%>')"><i class="bi bi-x-circle text-black"></i></a>
+                                        </div>
+                                    </div>                                                                                        
+                                </div>
+                                <% } %>                                                                                    
+                            </div>
+                            <button type="button" class="btn btn-info text-white" onclick="addFrequencyInput('<%=system%>')">Add Frequency</button>
+                            <hr>                                                                    
+                            <div class="row gx-3 mb-3">
+                                <div class="col-md-6">
+                                    <label class="small mb-1 fs-6" for="<%=system%>_systemMode">Mode</label>
+                                    <br>
+                                    <select class="custom-select" id="<%=system%>_systemMode">
+                                        <option value="<%= mode ?? 'select' %>" selected><span class="text-uppercase"><%= mode ?? 'Select' %></span></option>
+                                        <% if(mode == "p25") { %>                                                                                                
+                                            <option value="nbfm">NBFM</option>
+                                        <% } else if (mode == "nbfm") { %>
+                                            <option value="p25">P25</option>
+                                        <% } else { %>
+                                            <option value="nbfm">NBFM</option>
+                                            <option value="p25">P25</option>
+                                            <%}%>
+                                    </select>
+                                </div>
+                            </div>
+                        </form>
+                    </div>
+                </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" onclick="location.reload()">Close</button>
+                <button type="button" class="btn btn-primary" <%if(!system == "New System") {%>onclick="updateSystem('<%=system%>')"<%} else {%>onclick="addNewSystem('<%=system%>')"<%}%>>Save changes</button>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/Client/views/partials/navbar.ejs b/Client/views/partials/navbar.ejs
new file mode 100644
index 0000000..b9816fc
--- /dev/null
+++ b/Client/views/partials/navbar.ejs
@@ -0,0 +1,42 @@
+<nav class="navbar fixed-top navbar-expand-lg bg-body-tertiary" data-bs-theme="dark">
+    <div class="container-fluid">
+        <a class="navbar-brand" href="#">Node Master</a>
+        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
+            aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+            <span class="navbar-toggler-icon"></span>
+        </button>
+        <div class="collapse navbar-collapse" id="navbarSupportedContent">
+            <ul class="navbar-nav me-auto mb-2 mb-lg-0">
+                <% /*
+                <li class="nav-item">
+                    <a class="nav-link active" aria-current="page" href="#">Home</a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link" href="#">Link</a>
+                </li>
+                <li class="nav-item dropdown">
+                    <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
+                        aria-expanded="false">
+                        Dropdown
+                    </a>
+                    <ul class="dropdown-menu">
+                        <li><a class="dropdown-item" href="#">Action</a></li>
+                        <li><a class="dropdown-item" href="#">Another action</a></li>
+                        <li>
+                            <hr class="dropdown-divider">
+                        </li>
+                        <li><a class="dropdown-item" href="#">Something else here</a></li>
+                    </ul>
+                </li>
+                */%>
+                <li class="nav-item">
+                    <a class="nav-link" id="navbar-notification-bell" onclick="showStoredToasts()"><i class="bi bi-bell-fill"></i></a>
+                </li>                
+            </ul>
+            <form class="d-flex" role="search">
+                <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
+                <button class="btn btn-outline-success" type="submit">Search</button>
+            </form>
+        </div>
+    </div>
+</nav>
\ No newline at end of file

From a5996ccfc0b04aee7d46456cb19bdb4118b7c3ec Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 04:21:06 -0400
Subject: [PATCH 51/57] Added page titles to server webUI

---
 Server/routes/index.js             | 26 +++-----------------------
 Server/views/index.ejs             |  2 +-
 Server/views/partials/head.ejs     | 15 ++++++++++++++-
 Server/views/partials/htmlHead.ejs |  2 +-
 4 files changed, 19 insertions(+), 26 deletions(-)

diff --git a/Server/routes/index.js b/Server/routes/index.js
index 1f43b2a..b79078f 100644
--- a/Server/routes/index.js
+++ b/Server/routes/index.js
@@ -6,27 +6,7 @@ const { getAllNodes, getNodeInfoFromId } = require("../utilities/mysqlHandler");
 /* GET home page. */
 router.get('/', (req, res) => {
   //var sources = libCore.getSources();
-  return res.render('index');
-
-  var htmlOutput = "";
-
-  sources.forEach(source => {
-		htmlOutput += `
-			<div style='margin-bottom:15px;'>
-
-				<div> Title: ${source.title} </div>
-				<div> Link: ${source.link} </div>
-				<div> category: ${source.category} </div>
-
-			</div>
-			<div>
-				<hr />
-
-			</div>
-
-			`
-	});
-	res.send(htmlOutput);
+  return res.render('index', {'page': 'index'});
 });
 
 /* GET node controller page. */
@@ -38,7 +18,7 @@ router.get('/controller', async (req, res) => {
 	});	
 
 	//var sources = libCore.getSources();
-	return res.render('controller', {'nodes' : nodes});
+	return res.render('controller', {'nodes' : nodes, 'page': 'controller'});
 });
 
 /* GET individual node page. */
@@ -46,7 +26,7 @@ router.get('/node/:id', async (req, res) => {
 	var node = await getNodeInfoFromId(req.params.id);
 
 	//var sources = libCore.getSources();
-	return res.render('node', {'node' : node});
+	return res.render('node', {'node' : node, 'page': 'node'});
 });
 
 module.exports = router;
diff --git a/Server/views/index.ejs b/Server/views/index.ejs
index b6524a3..8e72b3f 100644
--- a/Server/views/index.ejs
+++ b/Server/views/index.ejs
@@ -1,4 +1,4 @@
-<%- include('partials/htmlHead.ejs') %>
+<%- include('partials/htmlHead.ejs', {'page': page}) %>
     <div class="container">
         <div class="row row-cols-1 row-cols-md-2 row-cols-xl-4">
             <div class="col-xl-3 col-lg-6">
diff --git a/Server/views/partials/head.ejs b/Server/views/partials/head.ejs
index 3429389..2aa5d1a 100644
--- a/Server/views/partials/head.ejs
+++ b/Server/views/partials/head.ejs
@@ -1,7 +1,20 @@
 <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Bootstrap demo</title>
+    <% switch (page) {
+        case "index":%>
+            <title>Node Dashboard</title>   
+            <% break;
+        case "controller":%>
+            <title>Node Controller</title>   
+            <% break;
+        case "node":%>
+            <title>Node Configuration</title>   
+            <% break;
+        default:%>
+            <title>DRB_CnC Server</title>
+            <%break;
+    } %>     
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"
         integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css">
diff --git a/Server/views/partials/htmlHead.ejs b/Server/views/partials/htmlHead.ejs
index a1b1d37..89af0ef 100644
--- a/Server/views/partials/htmlHead.ejs
+++ b/Server/views/partials/htmlHead.ejs
@@ -1,6 +1,6 @@
 <!doctype html>
 <html lang="en" data-bs-theme="auto">
-    <%- include('head.ejs') %>
+    <%- include('head.ejs', {'page': page}) %>
     <body>        
         <%- include('navbar.ejs') %>
         <%- include('sidebar.ejs') %>
\ No newline at end of file

From ec091c00179a669b45acf2eea93c20b21de5746d Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 14:46:51 -0400
Subject: [PATCH 52/57] Only concat the stored toasts with new toast when there
 are stored toasts

---
 Client/public/res/js/node.js | 16 +++++++++-------
 Server/public/res/js/node.js | 16 +++++++++-------
 2 files changed, 18 insertions(+), 14 deletions(-)

diff --git a/Client/public/res/js/node.js b/Client/public/res/js/node.js
index dd2cf94..7b8d45d 100644
--- a/Client/public/res/js/node.js
+++ b/Client/public/res/js/node.js
@@ -30,13 +30,15 @@ function addToastToStorage(time, message) {
     var toasts = [{ 'time': time, 'message': message }]
     var storedToasts = getStoredToasts();
     console.log("Adding new notification to storage: ", toasts);
-    toasts = toasts.concat(storedToasts);
-    console.log("Combined new and stored notifications: ", toasts);
-    toasts = toasts.filter((value, index, self) =>
-        index === self.findIndex((t) => (
-            t.time === value.time && t.message === value.message
-        ))
-    )
+    if (storedToasts) {
+        toasts = toasts.concat(storedToasts);
+        console.log("Combined new and stored notifications: ", toasts);
+        toasts = toasts.filter((value, index, self) =>
+            index === self.findIndex((t) => (
+                t.time === value.time && t.message === value.message
+            ))
+        )
+    }
     console.log("Deduped stored notifications: ", toasts);
     localStorage.setItem("toasts", JSON.stringify(toasts));
     navbarUpdateNotificationBellCount(toasts);
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index 67ea019..41e8f6c 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -30,13 +30,15 @@ function addToastToStorage(time, message) {
     var toasts = [{ 'time': time, 'message': message }]
     var storedToasts = getStoredToasts();
     console.log("Adding new notification to storage: ", toasts);
-    toasts = toasts.concat(storedToasts);
-    console.log("Combined new and stored notifications: ", toasts);
-    toasts = toasts.filter((value, index, self) =>
-        index === self.findIndex((t) => (
-            t.time === value.time && t.message === value.message
-        ))
-    )
+    if (storedToasts) {
+        toasts = toasts.concat(storedToasts);
+        console.log("Combined new and stored notifications: ", toasts);
+        toasts = toasts.filter((value, index, self) =>
+            index === self.findIndex((t) => (
+                t.time === value.time && t.message === value.message
+            ))
+        )
+    }
     console.log("Deduped stored notifications: ", toasts);
     localStorage.setItem("toasts", JSON.stringify(toasts));
     navbarUpdateNotificationBellCount(toasts);

From 8a0baa5bc96644bdccea733d8428f1c426198768 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Sat, 22 Jul 2023 15:01:48 -0400
Subject: [PATCH 53/57] Small tweaks

- Update local webUI to refresh when joining server to clear modal
- Updated client webUI page title
- Re-added join modal to node page (client & server)
- updated join modal to use node.nearbySystems
---
 Client/public/res/js/node.js        | 4 ++--
 Client/views/index.ejs              | 6 ++++--
 Client/views/partials/joinModal.ejs | 2 +-
 Server/public/res/js/node.js        | 2 +-
 Server/views/node.ejs               | 2 ++
 Server/views/partials/joinModal.ejs | 2 +-
 6 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/Client/public/res/js/node.js b/Client/public/res/js/node.js
index 7b8d45d..746de7b 100644
--- a/Client/public/res/js/node.js
+++ b/Client/public/res/js/node.js
@@ -253,8 +253,8 @@ function joinServer() {
         const responseObject = JSON.parse(Http.responseText)
         console.log(Http.status);
         console.log(responseObject);
-        createToast(`${responseObject.name} will join shortly`, { showNow: true });
-        $("#joinModal").modal('toggle');
+        createToast(`${responseObject.name} will join shortly`);
+        location.reload();
     }
 }
 
diff --git a/Client/views/index.ejs b/Client/views/index.ejs
index 11a4460..84aa23d 100644
--- a/Client/views/index.ejs
+++ b/Client/views/index.ejs
@@ -3,7 +3,7 @@
 
 <head>
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>Bootstrap demo</title>
+  <title>'<%=node.name%>' - Configuration</title>
   <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"
     integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css">
@@ -153,7 +153,9 @@
     </div>
 
     <% // new System Modal %>
-      <%- include("partials/modifySystemModal.ejs", {'system': "New System" , 'frequencies' : [], 'mode' : '' }) %>
+    <%- include("partials/modifySystemModal.ejs", {'system': "New System" , 'frequencies' : [], 'mode' : '' }) %>
+    <% // Join Server Modal %>
+    <%- include("partials/joinModal.ejs", {'node': node}) %>
 </body>
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"
   integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz" crossorigin="anonymous"></script>
diff --git a/Client/views/partials/joinModal.ejs b/Client/views/partials/joinModal.ejs
index d912911..1cc6feb 100644
--- a/Client/views/partials/joinModal.ejs
+++ b/Client/views/partials/joinModal.ejs
@@ -24,7 +24,7 @@
                                     <div class="col-md-6">
                                         <label class="small mb-1" for="selectRadioPreset">Selected Preset:</label>
                                         <select class="custom-select" id="selectRadioPreset">
-                                            <% for(const system in nearbySystems) { %>                                                                                                
+                                            <% for(const system in node.nearbySystems) { %>                                                                                                
                                                 <option value="<%=system%>"><%=system%></option>
                                             <% } %>
                                         </select>
diff --git a/Server/public/res/js/node.js b/Server/public/res/js/node.js
index 41e8f6c..2fe1e6a 100644
--- a/Server/public/res/js/node.js
+++ b/Server/public/res/js/node.js
@@ -256,7 +256,7 @@ function joinServer() {
         console.log(Http.status);
         console.log(responseObject);
         createToast(`${responseObject.name} will join shortly`, { showNow: true });
-        $("#joinModal").modal('toggle');
+        location.reload();
     }
 }
 
diff --git a/Server/views/node.ejs b/Server/views/node.ejs
index e56ba5e..4d8c5d7 100644
--- a/Server/views/node.ejs
+++ b/Server/views/node.ejs
@@ -134,5 +134,7 @@
 
     <% // new System Modal %>
     <%- include("partials/modifySystemModal.ejs", {'system': "New System", 'frequencies': [], 'mode': ''}) %>
+    <% // Join Server Modal %>
+    <%- include("partials/joinModal.ejs", {'node': node}) %>
 <%- include('partials/bodyEnd.ejs') %>
 <%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/joinModal.ejs b/Server/views/partials/joinModal.ejs
index d912911..1cc6feb 100644
--- a/Server/views/partials/joinModal.ejs
+++ b/Server/views/partials/joinModal.ejs
@@ -24,7 +24,7 @@
                                     <div class="col-md-6">
                                         <label class="small mb-1" for="selectRadioPreset">Selected Preset:</label>
                                         <select class="custom-select" id="selectRadioPreset">
-                                            <% for(const system in nearbySystems) { %>                                                                                                
+                                            <% for(const system in node.nearbySystems) { %>                                                                                                
                                                 <option value="<%=system%>"><%=system%></option>
                                             <% } %>
                                         </select>

From 2260deee01a77be7db10a717c073f7b1e530a368 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Fri, 4 Aug 2023 22:10:09 -0400
Subject: [PATCH 54/57] Added filter presets function to utils and code
 formatted

---
 Server/utilities/utils.js | 44 +++++++++++++++++++++++++++++----------
 1 file changed, 33 insertions(+), 11 deletions(-)

diff --git a/Server/utilities/utils.js b/Server/utilities/utils.js
index 06aa75b..5dc3737 100644
--- a/Server/utilities/utils.js
+++ b/Server/utilities/utils.js
@@ -23,7 +23,7 @@ exports.BufferToJson = (buffer) => {
  * @returns {string} The sanitized preset name to be used elsewhere 
  */
 exports.SanitizePresetName = (presetName) => {
-    return String(presetName).toLowerCase().replace(/[\W_]+/g,"-")
+    return String(presetName).toLowerCase().replace(/[\W_]+/g, "-")
 }
 
 /**
@@ -32,16 +32,16 @@ exports.SanitizePresetName = (presetName) => {
  * @param interaction Discord interaction object
  * @param param0.roleName {OPTIONAL} The role name to check the members in; Defaults to 'Bots'
  */
-exports.getMembersInRole = async (interaction, roleName = "Bots" ) => {
+exports.getMembersInRole = async (interaction, roleName = "Bots") => {
     log.DEBUG("Fetching all members");
     var guild = await interaction.client.guilds.fetch({ guild: interaction.guild.id, cache: false }); //cache all members in the server
-    await guild.members.fetch({cache: false});
-    await guild.roles.fetch({cache: false});
+    await guild.members.fetch({ cache: false });
+    await guild.roles.fetch({ cache: false });
     log.VERBOSE("Guild: ", guild);
     const role = await guild.roles.cache.find(role => role.name === roleName); //the role to check
     log.DEBUG("Role to check members from: ", role);
     log.DEBUG("Members of role: ", role.members);
-    
+
     // This is not working, can't get the status of the users, rest of join is untested
     const onlineMembers = await role.members.filter(member => member.voice.channel !== null);
     const offlineMembers = await role.members.filter(member => member.voice.channel === null);
@@ -50,8 +50,8 @@ exports.getMembersInRole = async (interaction, roleName = "Bots" ) => {
     log.VERBOSE("All members: ", allMembers, onlineMembers, offlineMembers)
 
     return {
-        'online': onlineMembers, 
-        'offline': offlineMembers, 
+        'online': onlineMembers,
+        'offline': offlineMembers,
         'all': allMembers
     }
 }
@@ -64,9 +64,9 @@ exports.getMembersInRole = async (interaction, roleName = "Bots" ) => {
  */
 exports.getKeyByArrayValue = (object, value) => {
     if (typeof value == "string") return Object.keys(object).find(key => object[key].includes(value));
-    const valueKey = Object.keys(value)[0];    
+    const valueKey = Object.keys(value)[0];
     return Object.keys(object).find(key => (object[key][valueKey] == value[valueKey]));
-  }
+}
 
 /**
  * Check to see if the input is a valid JSON string
@@ -91,7 +91,7 @@ exports.isJsonString = (str) => {
 exports.getAllClientIds = () => {
     const jsonClientIds = JSON.parse(readFileSync(path.resolve(__dirname, '../clientIds.json')));
     var clientObjects = [];
-    for (const jsonClientId of Object.keys(jsonClientIds)){
+    for (const jsonClientId of Object.keys(jsonClientIds)) {
         clientObjects.push(new clientObject({
             _discord_id: jsonClientId,
             _name: jsonClientIds[jsonClientId].name,
@@ -110,7 +110,7 @@ exports.getAllClientIds = () => {
 exports.getClientObjectByClientID = (clientId) => {
     const clientObjects = this.getAllClientIds();
     log.DEBUG("All client IDs: ", clientObjects);
-    for (const clientObject of clientObjects){
+    for (const clientObject of clientObjects) {
         if (clientObject.clientId == clientId) {
             log.DEBUG("Found client ID from given ID: ", clientObject);
             return clientObject
@@ -138,4 +138,26 @@ exports.filterAutocompleteValues = async (interaction, options) => {
     await interaction.respond(
         filtered.map(option => ({ name: option, value: option })),
     );
+}
+
+/**
+ * Filter an array of nodeObjects to get all unique presets within
+ * 
+ * @param {Array} nodeObjects An array of nodeObjects to get the presets from
+ * @returns {Array} Presets available from given nodeObjects
+ */
+exports.filterPresetsAvailable = async (nodeObjects) => {
+    log.DEBUG("Node objects: ", nodeObjects);
+    var presetsAvailable = [];
+    for (const nodeObject of nodeObjects) {
+        log.DEBUG("Node object: ", nodeObject);
+        presetsAvailable.push.apply(presetsAvailable, nodeObject.presets);
+    }
+
+    log.DEBUG("All Presets available: ", presetsAvailable);
+
+    // Remove duplicates
+    presetsAvailable = [...new Set(presetsAvailable)];
+    log.DEBUG("DeDuped Presets available: ", presetsAvailable);
+    return presetsAvailable;
 }
\ No newline at end of file

From 76c4d002a0fd3b50f50ec38d2024d56cf7a1783f Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Fri, 4 Aug 2023 22:10:28 -0400
Subject: [PATCH 55/57] Update to filter presets function in utils

---
 Server/commands/join.js | 15 ++-------------
 1 file changed, 2 insertions(+), 13 deletions(-)

diff --git a/Server/commands/join.js b/Server/commands/join.js
index d608d39..5de2aa5 100644
--- a/Server/commands/join.js
+++ b/Server/commands/join.js
@@ -1,7 +1,7 @@
 // Modules
 const { SlashCommandBuilder } = require('discord.js');
 const { DebugBuilder } = require("../utilities/debugBuilder");
-const { filterAutocompleteValues } = require("../utilities/utils");
+const { filterAutocompleteValues, filterPresetsAvailable } = require("../utilities/utils");
 const { getOnlineNodes, getAllConnections } = require("../utilities/mysqlHandler");
 const { joinServerWrapper } = require("../controllers/adminController");
 
@@ -28,18 +28,7 @@ module.exports = {
                 recordResolve(nodeRows);
             });
         });
-        log.DEBUG("Node objects: ", nodeObjects);
-        var presetsAvailable = [];
-        for (const nodeObject of nodeObjects) {            
-            log.DEBUG("Node object: ", nodeObject);
-			presetsAvailable.push.apply(presetsAvailable, nodeObject.presets);
-        }
-
-        log.DEBUG("All Presets available: ", presetsAvailable);
-
-        // Remove duplicates
-        options = [...new Set(presetsAvailable)];
-        log.DEBUG("DeDuped Presets available: ", options);
+        const options = await filterPresetsAvailable(nodeObjects);
 
 		// Filter the results to what the user is entering
 		filterAutocompleteValues(interaction, options);

From 880f1ccb01cb463407f66b6ede2ff4cec3681c76 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Fri, 4 Aug 2023 23:21:35 -0400
Subject: [PATCH 56/57] Implemented v1 admin dashboard

---
 Server/public/res/css/main.css           |   1 +
 Server/routes/index.js                   |  27 +++-
 Server/views/index.ejs                   | 177 +++++++----------------
 Server/views/partials/connectioncard.ejs |  29 ++++
 Server/views/partials/valueChip.ejs      |  32 ++++
 5 files changed, 136 insertions(+), 130 deletions(-)
 create mode 100644 Server/views/partials/connectioncard.ejs
 create mode 100644 Server/views/partials/valueChip.ejs

diff --git a/Server/public/res/css/main.css b/Server/public/res/css/main.css
index 5c44612..a0aeba6 100644
--- a/Server/public/res/css/main.css
+++ b/Server/public/res/css/main.css
@@ -82,6 +82,7 @@ a {
     position: relative;
     margin-bottom: 30px;
     box-shadow: 0 0.46875rem 2.1875rem rgba(90, 97, 105, 0.1), 0 0.9375rem 1.40625rem rgba(90, 97, 105, 0.1), 0 0.25rem 0.53125rem rgba(90, 97, 105, 0.12), 0 0.125rem 0.1875rem rgba(90, 97, 105, 0.1);
+    min-height: 85%;
 }
 
 .info-card .card-statistic .card-icon-large .bi {
diff --git a/Server/routes/index.js b/Server/routes/index.js
index b79078f..87c0a60 100644
--- a/Server/routes/index.js
+++ b/Server/routes/index.js
@@ -1,12 +1,25 @@
 var express = require('express');
 var router = express.Router();
 
-const { getAllNodes, getNodeInfoFromId } = require("../utilities/mysqlHandler");
+const { getAllNodes, getNodeInfoFromId, getAllConnections } = require("../utilities/mysqlHandler");
+const { filterPresetsAvailable } = require("../utilities/utils");
 
 /* GET home page. */
-router.get('/', (req, res) => {
-  //var sources = libCore.getSources();
-  return res.render('index', {'page': 'index'});
+router.get('/', async (req, res) => {
+	var nodes = await new Promise((recordResolve, recordReject) => {
+		getAllNodes((nodeRows) => {
+			recordResolve(nodeRows);
+		});
+	});
+	var connections = await getAllConnections();
+	var presets = await new Promise((recordResolve, recordReject) => {
+		getAllNodes((nodeRows) => {
+			recordResolve(filterPresetsAvailable(nodeRows));			
+		});
+	});
+
+	//var sources = libCore.getSources();
+	return res.render('index', { 'page': 'index', 'nodes': nodes, 'connections': connections, 'presets': presets });
 });
 
 /* GET node controller page. */
@@ -15,10 +28,10 @@ router.get('/controller', async (req, res) => {
 		getAllNodes((nodeRows) => {
 			recordResolve(nodeRows);
 		});
-	});	
+	});
 
 	//var sources = libCore.getSources();
-	return res.render('controller', {'nodes' : nodes, 'page': 'controller'});
+	return res.render('controller', { 'nodes': nodes, 'page': 'controller' });
 });
 
 /* GET individual node page. */
@@ -26,7 +39,7 @@ router.get('/node/:id', async (req, res) => {
 	var node = await getNodeInfoFromId(req.params.id);
 
 	//var sources = libCore.getSources();
-	return res.render('node', {'node' : node, 'page': 'node'});
+	return res.render('node', { 'node': node, 'page': 'node' });
 });
 
 module.exports = router;
diff --git a/Server/views/index.ejs b/Server/views/index.ejs
index 8e72b3f..4eb1c60 100644
--- a/Server/views/index.ejs
+++ b/Server/views/index.ejs
@@ -1,133 +1,64 @@
 <%- include('partials/htmlHead.ejs', {'page': page}) %>
     <div class="container">
+        <div class="row row-cols-1 row-cols-md-2 row-cols-xl-4 mt-2">
+            <%- include('partials/valueChip.ejs', {
+                'title': 'Nodes in the Network',
+                'bgColor': "orange-dark",
+                'value': nodes.length,        
+                'progressPercent': false,
+                'icon': 'server'
+            }) %>
+
+            <%- include('partials/valueChip.ejs', {
+                'title': 'Nodes Online',
+                'bgColor': "green",
+                'value': nodes.filter(node => node.online).length,
+                'progressPercent': false,
+                'icon': 'cpu-fill'
+            }) %> 
+            
+            <%- include('partials/valueChip.ejs', {
+                'title': 'Nodes with Discord Connections',
+                'bgColor': "blue-dark",
+                'value': connections.length,
+                'progressPercent': false,
+                'icon': 'gear-wide-connected'
+            }) %> 
+            
+        </div>
+
+        <div class="my-4">
+            <p><h3><b>Current Connections</b></h3></p>
+        </div>
+
+        <hr>
+
         <div class="row row-cols-1 row-cols-md-2 row-cols-xl-4">
-            <div class="col-xl-3 col-lg-6">
-                <div class="info-card l-bg-cherry">
-                    <div class="card-statistic p-4">
-                        <div class="card-icon card-icon-large"><i class="bi bi-cart"></i></div>
-                        <div class="mb-4">
-                            <h5 class="card-title mb-0">New Orders</h5>
-                        </div>
-                        <div class="row align-items-center mb-2 d-flex">
-                            <div class="col-8">
-                                <h2 class="d-flex align-items-center mb-0">
-                                    3,243
-                                </h2>
-                            </div>
-                            <div class="col-4 text-right">
-                                <span>12.5% <i class="fa fa-arrow-up"></i></span>
-                            </div>
-                        </div>
-                        <div class="progress mt-1 " data-height="8" style="height: 8px;">
-                            <div class="progress-bar l-bg-cyan" role="progressbar" data-width="25%" aria-valuenow="25"
-                                aria-valuemin="0" aria-valuemax="100" style="width: 25%;"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
+            <% for(const conn of connections) { %>
+                <%- include('partials/connectionCard.ejs', {'connection': conn}) %>
+            <%}%>
+        </div>
 
-            <div class="col-xl-3 col-lg-6">
-                <div class="info-card l-bg-blue-dark">
-                    <div class="card-statistic p-4">
-                        <div class="card-icon card-icon-large"><i class="bi bi-cart"></i></div>
-                        <div class="mb-4">
-                            <h5 class="card-title mb-0">New Orders</h5>
-                        </div>
-                        <div class="row align-items-center mb-2 d-flex">
-                            <div class="col-8">
-                                <h2 class="d-flex align-items-center mb-0">
-                                    3,243
-                                </h2>
-                            </div>
-                            <div class="col-4 text-right">
-                                <span>12.5% <i class="fa fa-arrow-up"></i></span>
-                            </div>
-                        </div>
-                        <div class="progress mt-1 " data-height="8" style="height: 8px;">
-                            <div class="progress-bar l-bg-cyan" role="progressbar" data-width="25%" aria-valuenow="25"
-                                aria-valuemin="0" aria-valuemax="100" style="width: 25%;"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="col-xl-3 col-sm-6">
-                <div class="card node-card">
-                    <div class="card-body">
-                        <div class="dropdown float-end">
-                            <a class="text-muted dropdown-toggle font-size-16" href="#" role="button"
-                                data-bs-toggle="dropdown" aria-haspopup="true"><i
-                                    class="bx bx-dots-horizontal-rounded"></i></a>
-                            <div class="dropdown-menu dropdown-menu-end"><a class="dropdown-item" href="#">Edit</a><a
-                                    class="dropdown-item" href="#">Action</a><a class="dropdown-item"
-                                    href="#">Remove</a></div>
-                        </div>
-                        <div class="d-flex align-items-center">
-                            <div><img src="https://bootdey.com/img/Content/avatar/avatar1.png" alt=""
-                                    class="avatar-md rounded-circle img-thumbnail" /></div>
-                            <div class="flex-1 ms-3">
-                                <h5 class="font-size-16 mb-1"><a href="#" class="text-dark">Phyllis Gatlin</a></h5>
-                                <span class="badge badge-soft-success mb-0">Full Stack Developer</span>
-                            </div>
-                        </div>
-                        <div class="mt-3 pt-1">
-                            <p class="text-muted mb-0"><i
-                                    class="mdi mdi-phone font-size-15 align-middle pe-2 text-primary"></i> 070 2860 5375
-                            </p>
-                            <p class="text-muted mb-0 mt-2"><i
-                                    class="mdi mdi-email font-size-15 align-middle pe-2 text-primary"></i>
-                                PhyllisGatlin@spy.com</p>
-                            <p class="text-muted mb-0 mt-2"><i
-                                    class="mdi mdi-google-maps font-size-15 align-middle pe-2 text-primary"></i> 52
-                                Ilchester MYBSTER 9WX</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="col-xl-3 col-sm-6">
-                <div class="card node-card">
-                    <div class="card-body">
-                        <div class="dropdown float-end">
-                            <a class="text-muted dropdown-toggle font-size-16" href="#" role="button"
-                                data-bs-toggle="dropdown" aria-haspopup="true"><i
-                                    class="bx bx-dots-horizontal-rounded"></i></a>
-                            <div class="dropdown-menu dropdown-menu-end"><a class="dropdown-item" href="#">Edit</a><a
-                                    class="dropdown-item" href="#">Action</a><a class="dropdown-item"
-                                    href="#">Remove</a></div>
-                        </div>
-                        <div class="d-flex align-items-center">
-                            <div><img src="https://bootdey.com/img/Content/avatar/avatar5.png" alt=""
-                                    class="avatar-md rounded-circle img-thumbnail" /></div>
-                            <div class="flex-1 ms-3">
-                                <h5 class="font-size-16 mb-1"><a href="#" class="text-dark">Diana Owens</a></h5>
-                                <span class="badge badge-soft-danger mb-0">UI/UX Designer</span>
-                            </div>
-                        </div>
-                        <div class="mt-3 pt-1">
-                            <p class="text-muted mb-0"><i
-                                    class="mdi mdi-phone font-size-15 align-middle pe-2 text-primary"></i> 087 6321 3235
-                            </p>
-                            <p class="text-muted mb-0 mt-2"><i
-                                    class="mdi mdi-email font-size-15 align-middle pe-2 text-primary"></i>
-                                DianaOwens@spy.com</p>
-                            <p class="text-muted mb-0 mt-2"><i
-                                    class="mdi mdi-google-maps font-size-15 align-middle pe-2 text-primary"></i> 52
-                                Ilchester MYBSTER 9WX</p>
-                        </div>
-                        <div class="d-flex gap-2 pt-4">
-                            <button type="button" class="btn btn-soft-primary btn-sm w-50"><i
-                                    class="bx bx-user me-1"></i> Profile</button>
-                            <button type="button" class="btn btn-primary btn-sm w-50"><i
-                                    class="bx bx-message-square-dots me-1"></i> Contact</button>
-                        </div>
-                    </div>
-                </div>
-            </div>
+        <div class="my-4">
+            <p><h3><b>Online Nodes</b></h3></p>
+        </div>
 
+        <hr>
 
+        <div class="row row-cols-1 row-cols-md-2 row-cols-xl-4">
+            <% for(const node of nodes.filter(node => node.online)) { %>
+                <%- include('partials/nodeCard.ejs', {'node': node}) %>
+            <%}%>
+        </div>
+        <div class="my-4">
+            <p><h3><b>Offline Nodes</b></h3></p>
+        </div>
+        <hr>
+        <div class="row row-cols-1 row-cols-md-2 row-cols-xl-4">
+            <% for(const node of nodes.filter(node => node.online == false)) { %>
+                <%- include('partials/nodeCard.ejs', {'node': node}) %>
+            <%}%>
         </div>
     </div>
 <%- include('partials/bodyEnd.ejs') %>
-
 <%- include('partials/htmlFooter.ejs') %>
\ No newline at end of file
diff --git a/Server/views/partials/connectioncard.ejs b/Server/views/partials/connectioncard.ejs
new file mode 100644
index 0000000..d1a0711
--- /dev/null
+++ b/Server/views/partials/connectioncard.ejs
@@ -0,0 +1,29 @@
+<div class="col-xl-3 col-sm-6">
+    <div class="card node-card">
+        <div class="card-body">
+            <div class="dropdown float-end">
+                <a class="text-muted dropdown-toggle font-size-16" href="#" role="button" data-bs-toggle="dropdown"
+                    aria-haspopup="true">
+                    <i class="bx bx-dots-horizontal-rounded"></i>
+                </a>
+                <div class="dropdown-menu dropdown-menu-end">
+                    <a class="dropdown-item node-action">Edit</a>
+                    <a class="dropdown-item node-action" onclick="">Send Heartbeat</a>
+                </div>
+            </div>
+            <div class="d-flex align-items-center">
+                <div class="flex-1 ms-3">
+                    <h5 class="font-size-16 mb-1"><a  class="text-dark">
+                            <%= connection.clientObject.name%>
+                        </a></h5>
+                </div>
+            </div>
+            <div class="mt-3 pt-1">
+                <p class="text-muted mb-0">
+                    <i class="bi bi-cpu-fill font-size-15 align-middle pe-2 text-primary"></i>
+                    Node ID: <a href="/node/<%= connection.node.id %>"><%= connection.node.id %></a>
+                </p>                
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/Server/views/partials/valueChip.ejs b/Server/views/partials/valueChip.ejs
new file mode 100644
index 0000000..12b11ea
--- /dev/null
+++ b/Server/views/partials/valueChip.ejs
@@ -0,0 +1,32 @@
+<div class="col-xl-3 col-lg-6">
+    <div class="info-card l-bg-<%=bgColor%>">
+        <div class="card-statistic p-4">
+            <div class="card-icon card-icon-large"><i class="bi bi-<%=icon%>"></i></div>
+            <div class="mb-4">
+                <h5 class="card-title mb-0">
+                    <%=title%>
+                </h5>
+            </div>
+            <div class="row align-items-center mb-2 d-flex">
+                <div class="col-8">
+                    <h2 class="d-flex align-items-center mb-0">
+                        <%=value%>
+                    </h2>
+                </div>
+                <% if (progressPercent) {%>
+                    <div class="col-4 text-right">
+                        <span>
+                            <%=progressPercent%>%<i class="fa fa-arrow-up"></i>
+                        </span>
+                    </div>
+                <%}%>
+            </div>
+            <% if (progressPercent) {%>
+            <div class="progress mt-1 " data-height="8" style="height: 8px;">
+                <div class="progress-bar l-bg-cyan" role="progressbar" data-width="<%=progressPercent%>%" aria-valuenow="<%=progressPercent%>"
+                    aria-valuemin="0" aria-valuemax="100" style="width: <%=progressPercent%>%;"></div>
+            </div>
+             <%}%>
+        </div>
+    </div>
+</div>
\ No newline at end of file

From 75580c0547e35c85edbdc35e08b14ffb550340e0 Mon Sep 17 00:00:00 2001
From: Logan Cusano <logan@simplestepsolutions.com>
Date: Fri, 4 Aug 2023 23:44:28 -0400
Subject: [PATCH 57/57] Fix bug in httprequests, hostname was overwritten

---
 Client/utilities/httpRequests.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/Client/utilities/httpRequests.js b/Client/utilities/httpRequests.js
index f3ddc4b..beecbaf 100644
--- a/Client/utilities/httpRequests.js
+++ b/Client/utilities/httpRequests.js
@@ -12,8 +12,8 @@ exports.requestOptions = class requestOptions {
         if (["POST", "PUT"].includes(method)){
             log.VERBOSE("Hostname Vars: ", hostname, process.env.SERVER_HOSTNAME, process.env.SERVER_IP);
             if (hostname) this.hostname = hostname;
-            if (process.env.SERVER_HOSTNAME) this.hostname = process.env.SERVER_HOSTNAME;
-            if (process.env.SERVER_IP) this.hostname = process.env.SERVER_IP;
+            if (!this.hostname && process.env.SERVER_HOSTNAME) this.hostname = process.env.SERVER_HOSTNAME;
+            if (!this.hostname && process.env.SERVER_IP) this.hostname = process.env.SERVER_IP;
             if (!this.hostname) throw new Error("No server hostname / IP was given when creating a request");
             this.path = path;
             this.port = port ?? process.env.SERVER_PORT;