Began improvements to server monitor page. Notifies when a server is offline now

html/js/monitor.js

@@ -2,22 +2,28 @@ var threads;
 var cpu;
 var ram;
 var swap;
-const api = "https://api.nolancasey.click/server"
+const apis = [
+    {
+        "id":"Main",
+        "url":"https://api.nolancasey.click/server",
+        "online": true
+    }
+];
 const colors = ["red", "green", "blue", "chartreuse", "darkmagenta", "darkkhaki", "purple", "salmon", "yellow", "blueviolet", "chocolate", "crimson", "cyan", "darkslategrey", "khaki", "hotpink"];
 const resolution = 32;
 
 window.addEventListener("load", async function () {
+    apis.forEach(async api => {
         var json;
+        var div = document.getElementById(api.id);
+        console.log(div.childNodes);
+        
         try{
-        var response = await fetch(api);
+            var response = await fetch(api.url);
             if (!response.ok){
                 throw new Error(response.status);
             }
             json = await response.json();
-        console.log(json);
-    }catch (error){
-        console.log(error.message);
-    }
             
             var labels = [];
             for (var i = 0; i < resolution; i++){
@@ -150,13 +156,26 @@ window.addEventListener("load", async function () {
                     }
                 }
             });
+        }catch (error){
+            div.textContent = "";
+            api.online = false;
+            var p = document.createElement("p");
+            var node = document.createTextNode(api.id + " Server Offline");
+            console.log(api.id + " Server Offline");
+            p.appendChild(node);
+            div.appendChild(p);
+            console.log(error.message);
+        }
+    });
 
     this.setInterval(increment, 1000);
 });
 
 async function increment() {
+    apis.forEach(async api => {
+        if (!api.online) return;
         try{
-        var response = await fetch(api);
+            var response = await fetch(api.url);
             if (!response.ok){
                 throw new Error(response.status);
             }
@@ -183,4 +202,5 @@ async function increment() {
         }catch (error){
             console.log(error.message);
         }
+    });
 }

html/pages/monitor.html

@@ -24,6 +24,9 @@
         <div class="box vflex thin">
             <h1>Server Monitor</h1>
             <hr>
+        </div>
+        <br>
+        <div id="Main" class="box vflex thin">
             <canvas id="cpu"></canvas>
             <br>
             <canvas id="threads"></canvas>