Delete websites/Servers directory
This commit is contained in:
Arlo Filley
GitHub
parent
860bd085e3
commit
786eb5bb0f
@ -1,170 +0,0 @@
|
|||||||
:root {
|
|
||||||
--navbar: #333333;
|
|
||||||
|
|
||||||
/* Navbar Button Properties */
|
|
||||||
--navbar-button: #058ED9;
|
|
||||||
--navbar-button-hover: #283F3B;
|
|
||||||
--navbar-button-border: #058ED9;
|
|
||||||
|
|
||||||
/* */
|
|
||||||
--background: #1f1f1f;
|
|
||||||
|
|
||||||
/* Table Properties*/
|
|
||||||
--table: #FFD07B;
|
|
||||||
--table-top:#FDB833;
|
|
||||||
|
|
||||||
/* Title Properties */
|
|
||||||
--title-background: #333333;
|
|
||||||
--title-text: #ffffff;
|
|
||||||
|
|
||||||
/* General Properties */
|
|
||||||
--text: #000000;
|
|
||||||
--border: #000000;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
background: var(--background);
|
|
||||||
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
|
||||||
font-size: medium;
|
|
||||||
}
|
|
||||||
|
|
||||||
div {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
color: var(--title-text);
|
|
||||||
text-align: center;
|
|
||||||
width: 100%;
|
|
||||||
margin: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
#navbar {
|
|
||||||
padding: 20px 0 0 10px;
|
|
||||||
height: 96%;
|
|
||||||
width: 15%;
|
|
||||||
position: fixed;
|
|
||||||
|
|
||||||
display: block;
|
|
||||||
|
|
||||||
background: var(--navbar);
|
|
||||||
border-radius: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
#navbar h2 {
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
#systems {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
width: 95%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#navbar #option-buttons {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
width: 95%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#navbar #option-buttons button {
|
|
||||||
background-color: #32DE8A;
|
|
||||||
border-color: #32DE8A;
|
|
||||||
}
|
|
||||||
|
|
||||||
#navbar button {
|
|
||||||
transition-duration: 0.2s;
|
|
||||||
border-radius: 8px;
|
|
||||||
background-color: var(--navbar-button);
|
|
||||||
margin-bottom: 8px;
|
|
||||||
color: var(--text);
|
|
||||||
border: none;
|
|
||||||
padding: 10px;
|
|
||||||
font-size: larger;
|
|
||||||
}
|
|
||||||
|
|
||||||
#navbar button:hover, #navbar #option-buttons button:hover {
|
|
||||||
box-shadow:
|
|
||||||
0 12px 16px 0 rgba(0,0,0,0.24),
|
|
||||||
0 17px 50px 0 rgba(0,0,0,0.19);
|
|
||||||
transition-duration: 0.5s;
|
|
||||||
}
|
|
||||||
|
|
||||||
#navbar #allSystemsButton {
|
|
||||||
background-color: #4d23a8;
|
|
||||||
width: 97%;
|
|
||||||
padding: 36px;
|
|
||||||
color: #FFE3E3;
|
|
||||||
font-size: 35px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#navbar #allSystemsButton:hover, #navbar #allSystemsButton:focus {
|
|
||||||
background-color: #3E1C87;
|
|
||||||
}
|
|
||||||
|
|
||||||
#navbar #option-buttons button:hover, #navbar #option-buttons button:focus {
|
|
||||||
background-color: #1DAF68;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
#navbar button:hover {
|
|
||||||
background-color: #04699F;
|
|
||||||
}
|
|
||||||
|
|
||||||
#SystemName {
|
|
||||||
background: var(--title-background);
|
|
||||||
width: 100%;
|
|
||||||
font-family:
|
|
||||||
system-ui, -apple-system, BlinkMacSystemFont,
|
|
||||||
'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
|
|
||||||
'Open Sans', 'Helvetica Neue', sans-serif;
|
|
||||||
font-size: 50px;
|
|
||||||
padding-bottom: 20px;
|
|
||||||
|
|
||||||
width: 84%;
|
|
||||||
margin-left: 16%;
|
|
||||||
border-radius: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#tables {
|
|
||||||
display: block;
|
|
||||||
width: 84%;
|
|
||||||
margin-left: 15%;
|
|
||||||
padding: 10px 0 0 20px;
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
table {
|
|
||||||
width: 100%;
|
|
||||||
border-collapse: collapse;
|
|
||||||
margin: 0px;
|
|
||||||
padding: 0px;
|
|
||||||
border-spacing: 0px;
|
|
||||||
border: 2px var(--border) solid;
|
|
||||||
border-radius: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
table tr:nth-child(n) {
|
|
||||||
background: var(--table);
|
|
||||||
}
|
|
||||||
|
|
||||||
table tr:nth-child(1) {
|
|
||||||
background: var(--table-top);
|
|
||||||
}
|
|
||||||
|
|
||||||
tr {
|
|
||||||
border: 1px black dotted;
|
|
||||||
}
|
|
||||||
|
|
||||||
td {
|
|
||||||
text-align: center;
|
|
||||||
padding: 10px;
|
|
||||||
font-size: larger;
|
|
||||||
}
|
|
||||||
@ -1,46 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title id="title">Leaderboard</title>
|
|
||||||
<link rel="stylesheet" href="index.css">
|
|
||||||
<script src="index.js" defer="true"></script>
|
|
||||||
<script src="cpu.js" defer="true"></script>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<div id="navbar">
|
|
||||||
<div id="allButton">
|
|
||||||
<button id="allSystemsButton">All Systems</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<h2>Options</h2>
|
|
||||||
<div id="option-buttons">
|
|
||||||
<button id="systeminfo">System</button>
|
|
||||||
<button id="Disks Header">Disks</button>
|
|
||||||
<button id="Processes Header">Processes</button>
|
|
||||||
<button id="CPU Header">CPU</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<h2>Systems</h2>
|
|
||||||
<div id="systems"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="SystemName">
|
|
||||||
<h1 id="system">
|
|
||||||
Loading...
|
|
||||||
</h1>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div id="tables">
|
|
||||||
<div id="allSystemInfo" align="center"></div>
|
|
||||||
<div id="systemInfo" align="center"></div>
|
|
||||||
<div id="disks" align="center"></div>
|
|
||||||
<div id="processes" align="center"></div>
|
|
||||||
<div id="CPU" align="center"></div>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@ -1,277 +0,0 @@
|
|||||||
|
|
||||||
get();
|
|
||||||
let disks = false;
|
|
||||||
let processes = false;
|
|
||||||
let sysinfo = true;
|
|
||||||
let allSysInfo = false;
|
|
||||||
let cpu = false;
|
|
||||||
let json;
|
|
||||||
let server = 0;
|
|
||||||
|
|
||||||
setInterval(get, 5000);
|
|
||||||
function get() {
|
|
||||||
let xhr = new XMLHttpRequest();
|
|
||||||
xhr.open('GET', 'https://arlofilley.com/api/server_info');
|
|
||||||
xhr.setRequestHeader('Content-Type', 'application/json');
|
|
||||||
xhr.responseType = 'json';
|
|
||||||
xhr.send();
|
|
||||||
xhr.onload = () => {
|
|
||||||
json = xhr.response
|
|
||||||
createElements(json);
|
|
||||||
createButtons(json);
|
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|
||||||
function reset_tables() {
|
|
||||||
disks = false;
|
|
||||||
processes = false;
|
|
||||||
sysinfo = false;
|
|
||||||
allSysInfo = false;
|
|
||||||
cpu = false;
|
|
||||||
}
|
|
||||||
|
|
||||||
function createElements(pJson) {
|
|
||||||
let title = document.getElementById(`system`);
|
|
||||||
title.textContent = pJson[server].host_name;
|
|
||||||
document.title = pJson[server].host_name;
|
|
||||||
|
|
||||||
createAllSystemInfo(pJson);
|
|
||||||
createProcesses(pJson[server]);
|
|
||||||
createDisks(pJson[server]);
|
|
||||||
createSystemInfo(pJson[server]);
|
|
||||||
create_cpu_table(pJson[server], cpu);
|
|
||||||
};
|
|
||||||
|
|
||||||
function createAllSystemInfo(systems) {
|
|
||||||
let div = document.getElementById(`allSystemInfo`)
|
|
||||||
|
|
||||||
|
|
||||||
while (div.firstChild) {
|
|
||||||
div.removeChild(div.firstChild)
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!allSysInfo) return;
|
|
||||||
|
|
||||||
document.title = "All Systems"
|
|
||||||
let title = document.getElementById('system');
|
|
||||||
title.textContent = "All Systems"
|
|
||||||
|
|
||||||
let table = document.createElement(`table`);
|
|
||||||
let tableBody = document.createElement(`tbody`);
|
|
||||||
table.appendChild(tableBody);
|
|
||||||
let tr = document.createElement(`tr`);
|
|
||||||
tableBody.appendChild(tr)
|
|
||||||
|
|
||||||
create_table_element(
|
|
||||||
tr,
|
|
||||||
"",
|
|
||||||
["Name", "OS", "Uptime", "Total Ram", "Used Ram",
|
|
||||||
"Available Ram", "Ram Usage", "Total Swap", "Used Swap",
|
|
||||||
"Available Swap", "Swap Usage"]
|
|
||||||
);
|
|
||||||
|
|
||||||
tableBody.appendChild(tr);
|
|
||||||
tr = document.createElement(`tr`);
|
|
||||||
|
|
||||||
for (let i = 0; i < systems.length; i++) {
|
|
||||||
let system = systems[i];
|
|
||||||
create_table_element(
|
|
||||||
tr,
|
|
||||||
"",
|
|
||||||
[`${system.host_name}`, `${system.os}`, `${system.uptime}`, `${system.total_ram}`,
|
|
||||||
`${system.used_ram}`, `${system.available_ram}`, `${system.ram_usage}%`, `${system.total_swap}`,
|
|
||||||
`${system.used_swap}`, `${system.available_swap}`, `${system.swap_usage}%`]
|
|
||||||
)
|
|
||||||
tableBody.appendChild(tr);
|
|
||||||
tr = document.createElement(`tr`);
|
|
||||||
}
|
|
||||||
div.appendChild(table);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
function createSystemInfo(pJson) {
|
|
||||||
let div = document.getElementById(`systemInfo`);
|
|
||||||
|
|
||||||
while (div.firstChild) {
|
|
||||||
div.removeChild(div.firstChild)
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!sysinfo) return;
|
|
||||||
|
|
||||||
let table = document.createElement(`table`);
|
|
||||||
|
|
||||||
let tableBody = document.createElement('tbody');
|
|
||||||
table.appendChild(tableBody);
|
|
||||||
let tr = document.createElement('tr');
|
|
||||||
tableBody.appendChild(tr);
|
|
||||||
|
|
||||||
create_table_element(
|
|
||||||
tr,
|
|
||||||
"",
|
|
||||||
["Name", "OS", "Uptime", "Total Ram", "Used Ram",
|
|
||||||
"Available Ram", "Ram Usage", "Total Swap", "Used Swap",
|
|
||||||
"Available Swap", "Swap Usage"]
|
|
||||||
);
|
|
||||||
tableBody.appendChild(tr);
|
|
||||||
tr = document.createElement('tr');
|
|
||||||
|
|
||||||
create_table_element(
|
|
||||||
tr,
|
|
||||||
"",
|
|
||||||
[`${pJson.host_name}`, `${pJson.os}`, `${pJson.uptime}`, `${pJson.total_ram}`,
|
|
||||||
`${pJson.used_ram}`, `${pJson.available_ram}`, `${pJson.ram_usage}%`, `${pJson.total_swap}`,
|
|
||||||
`${pJson.used_swap}`, `${pJson.available_swap}`, `${pJson.swap_usage}%`]
|
|
||||||
);
|
|
||||||
tableBody.appendChild(tr);
|
|
||||||
tr = document.createElement('tr');
|
|
||||||
|
|
||||||
div.appendChild(table);
|
|
||||||
};
|
|
||||||
|
|
||||||
function createProcesses(pJson) {
|
|
||||||
let div = document.getElementById(`processes`);
|
|
||||||
|
|
||||||
while (div.firstChild) {
|
|
||||||
div.removeChild(div.firstChild)
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!processes) return;
|
|
||||||
|
|
||||||
let table = document.createElement(`table`);
|
|
||||||
|
|
||||||
let tableBody = document.createElement('tbody');
|
|
||||||
table.appendChild(tableBody);
|
|
||||||
let tr = document.createElement('tr');
|
|
||||||
tableBody.appendChild(tr);
|
|
||||||
|
|
||||||
create_table_element(
|
|
||||||
tr,
|
|
||||||
"",
|
|
||||||
["Name", "Memory", "Run Time", "Process ID",
|
|
||||||
"User ID", "Virtual Memory"]
|
|
||||||
);
|
|
||||||
|
|
||||||
tableBody.appendChild(tr);
|
|
||||||
tr = document.createElement('tr');
|
|
||||||
|
|
||||||
for (let i = 0; i < pJson.processes.length; i++) {
|
|
||||||
let process = pJson.processes[i];
|
|
||||||
create_table_element(
|
|
||||||
tr,
|
|
||||||
"",
|
|
||||||
[`${process.name}`, `${process.memory}`, `${process.run_time}`, `${process.id}`,
|
|
||||||
`${process.user_id}`, `${process.virtual_memory}`]
|
|
||||||
)
|
|
||||||
|
|
||||||
tableBody.appendChild(tr);
|
|
||||||
tr = document.createElement('tr');
|
|
||||||
}
|
|
||||||
div.appendChild(table);
|
|
||||||
};
|
|
||||||
|
|
||||||
function createDisks(pJson) {
|
|
||||||
let div = document.getElementById(`disks`);
|
|
||||||
|
|
||||||
while (div.firstChild) {
|
|
||||||
div.removeChild(div.firstChild)
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!disks) return;
|
|
||||||
|
|
||||||
let table = document.createElement(`table`);
|
|
||||||
|
|
||||||
let tableBody = document.createElement('tbody');
|
|
||||||
table.appendChild(tableBody);
|
|
||||||
let tr = document.createElement('tr');
|
|
||||||
tableBody.appendChild(tr);
|
|
||||||
|
|
||||||
|
|
||||||
create_table_element(
|
|
||||||
tr,
|
|
||||||
"",
|
|
||||||
["Name", "Type", "Total Space", "Available Space",
|
|
||||||
"Usage","File System"]
|
|
||||||
);
|
|
||||||
|
|
||||||
tableBody.appendChild(tr);
|
|
||||||
tr = document.createElement('tr');
|
|
||||||
|
|
||||||
for (let i = 0; i < pJson.disks.length; i++) {
|
|
||||||
let disk = pJson.disks[i];
|
|
||||||
create_table_element(
|
|
||||||
tr,
|
|
||||||
"",
|
|
||||||
[`${disk.name}`, `${disk.disk_type}`, `${disk.total_space}`,
|
|
||||||
`${disk.available_space}`, `${disk.usage}%`, `${disk.file_system}`]
|
|
||||||
)
|
|
||||||
tableBody.appendChild(tr);
|
|
||||||
tr = document.createElement('tr');
|
|
||||||
}
|
|
||||||
div.appendChild(table);
|
|
||||||
};
|
|
||||||
|
|
||||||
function create_table_element(tr, string, elements) {
|
|
||||||
if (elements.length > 0) {
|
|
||||||
for (let i = 0; i < elements.length; i++) {
|
|
||||||
let td = document.createElement('td');
|
|
||||||
td.appendChild(document.createTextNode(elements[i]));
|
|
||||||
tr.appendChild(td);
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
let td = document.createElement('td');
|
|
||||||
td.appendChild(document.createTextNode(string));
|
|
||||||
tr.appendChild(td);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
b = document.getElementById("Processes Header");
|
|
||||||
b.addEventListener("click", () => {
|
|
||||||
reset_tables();
|
|
||||||
processes = true;
|
|
||||||
createElements(json);
|
|
||||||
});
|
|
||||||
|
|
||||||
c = document.getElementById("systeminfo");
|
|
||||||
c.addEventListener("click", () => {
|
|
||||||
reset_tables();
|
|
||||||
sysinfo = true;
|
|
||||||
createElements(json);
|
|
||||||
});
|
|
||||||
let button = document.getElementById
|
|
||||||
|
|
||||||
e = document.getElementById("Disks Header");
|
|
||||||
e.addEventListener("click", () => {
|
|
||||||
reset_tables();
|
|
||||||
disks = true;
|
|
||||||
createElements(json);
|
|
||||||
});
|
|
||||||
|
|
||||||
f = document.getElementById("allSystemsButton");
|
|
||||||
f.addEventListener("click", () => {
|
|
||||||
reset_tables();
|
|
||||||
allSysInfo = true;
|
|
||||||
createElements(json);
|
|
||||||
})
|
|
||||||
|
|
||||||
function createButtons(pJson) {
|
|
||||||
let div = document.getElementById("systems");
|
|
||||||
|
|
||||||
while (div.firstChild) {
|
|
||||||
div.removeChild(div.firstChild)
|
|
||||||
}
|
|
||||||
|
|
||||||
for (let i = 0; i < pJson.length; i++) {
|
|
||||||
let system = pJson[i];
|
|
||||||
|
|
||||||
let button = document.createElement("button");
|
|
||||||
button.textContent = system.host_name;
|
|
||||||
button.id = i;
|
|
||||||
button.addEventListener("click", () => {
|
|
||||||
reset_tables();
|
|
||||||
sysinfo = true;
|
|
||||||
server = button.id
|
|
||||||
createElements(json);
|
|
||||||
});
|
|
||||||
div.appendChild(button);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Loading…
Reference in New Issue
Block a user