info: Added info page

This commit is contained in:
Nathan Woodburn 2023-05-31 14:42:15 +10:00
parent fa55c16dbe
commit cb3c36b842
Signed by: nathanwoodburn
GPG Key ID: 203B000478AD0EF1
3 changed files with 60 additions and 0 deletions

BIN
assets/img/bg/back.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB

1
assets/js/info.min.js vendored Normal file
View File

@ -0,0 +1 @@
onload=function(){dockerInfo(),systemUptime(),systemLoad()},setInterval((function(){dockerInfo(),systemUptime(),systemLoad(),console.log("Updated")}),1e3);const api="https://glances.woodburn.au/api/3/";function dockerInfo(){fetch(api+"docker").then((e=>e.json())).then((e=>{let n=[],t=[];for(let o=0;o<e.containers.length;o++)"running"===e.containers[o].Status?n.push(e.containers[o].name):t.push(e.containers[o].name);let o="Total Containers: "+e.containers.length+"<br>";o+="Running Containers: "+n.length+"<br>",o+="Stopped Containers: "+t.length+"<br><br>",document.getElementById("containers").innerHTML=o})).catch((e=>console.log(e)))}function systemUptime(){fetch(api+"uptime").then((e=>e.text())).then((e=>{let n=e.replace(/['"]+/g,"");document.getElementById("uptime").innerHTML=n})).catch((e=>console.log(e)))}function systemLoad(){fetch(api+"mem").then((e=>e.json())).then((e=>{let n=e.percent+"% RAM";document.getElementById("mem").innerHTML=n})).catch((e=>console.log(e))),fetch(api+"cpu").then((e=>e.json())).then((e=>{let n=e.total+"% CPU";document.getElementById("cpu").innerHTML=n})).catch((e=>console.log(e))),fetch(api+"fs").then((e=>e.json())).then((e=>{let n=e[0].percent+"% Disk",t=e[0].free;t/=1e9,t=t.toFixed(2),n+="<br>"+t+" GB Free",document.getElementById("disk").innerHTML=n})).catch((e=>console.log(e)))}

59
info.html Normal file
View File

@ -0,0 +1,59 @@
<!DOCTYPE html>
<html lang="en-au">
<head>
<meta charset="utf-8">
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-NNXTCKW');</script>
<!-- End Google Tag Manager -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>Nathan.Woodburn/</title>
<meta name="theme-color" content="#97009a">
<link rel="canonical" href="https://nathan.woodburn.au/info.html">
<meta property="og:url" content="https://nathan.woodburn.au/info.html">
<meta name="description" content="G'day, this is my personal website. You can find out who I am or check out some of my projects.">
<meta name="twitter:title" content="Nathan.Woodburn/">
<meta property="og:type" content="website">
<meta property="og:image" content="https://nathan.woodburn.au/assets/img/profile.jpg">
<meta name="twitter:image" content="https://nathan.woodburn.au/assets/img/profile.jpg">
<meta name="twitter:description" content="G'day, this is my personal website. You can find out who I am or check some of my projects.">
<meta name="twitter:card" content="summary">
<link rel="apple-touch-icon" type="image/png" sizes="180x180" href="assets/img/NJW%20Icon%20180.png">
<link rel="icon" type="image/png" sizes="16x16" href="assets/img/NJW%20Icon%2016.png">
<link rel="icon" type="image/png" sizes="32x32" href="assets/img/NJW%20Icon%2032.png">
<link rel="icon" type="image/png" sizes="180x180" href="assets/img/NJW%20Icon%20180.png">
<link rel="icon" type="image/png" sizes="192x192" href="assets/img/NJW%20Icon%20192.png">
<link rel="icon" type="image/png" sizes="512x512" href="assets/img/NJW%20Icon%20512.png">
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="manifest" href="manifest.json">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic&amp;display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Cabin:700&amp;display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Anonymous+Pro&amp;display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700">
<link rel="stylesheet" href="assets/css/styles.min.css">
<link rel="stylesheet" href="assets/css/profile.min.css">
</head>
<body style="background: url(&quot;assets/img/bg/back.webp&quot;) center / cover no-repeat;">
<div style="height: 10%;"></div>
<div style="margin-right: 2%;margin-left: 2%;">
<div style="text-align: right;">
<h1>Docker Status</h1>
<p id="containers">Docker status</p>
<p style="margin-bottom: 0px;">Uptime</p>
<p id="uptime">0:00</p>
<p id="mem" style="margin-bottom: 0px;">0% RAM Used</p>
<p id="cpu" style="margin-bottom: 0px;">0% CPU Used</p>
<p id="disk" style="margin-bottom: 0px;">0% Disk Used</p>
</div>
</div>
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
<script src="assets/js/script.min.js"></script>
<script src="assets/js/info.min.js"></script>
</body>
</html>