Noratrieb/haesli
1
0
Fork 0
mirror of https://github.com/Noratrieb/haesli.git synced 2026-01-15 12:15:02 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

add dashboard

Browse source
This commit is contained in:
nora 2022-02-19 21:53:02 +01:00
parent 077b6fd633
commit dc8efd4e4e
13 changed files with 777 additions and 33 deletions
Download patch file Download diff file Expand all files Collapse all files

19
amqp_dashboard/assets/index.html Normal file
View file

@ -0,0 +1,19 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>AMQP Data</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>AMQP Data</h1>
<h2>Connections</h2>
<div id="connection-wrapper">
</div>
<script src="script.js"></script>
</body>
</html>

41
amqp_dashboard/assets/script.js Normal file
View file

@ -0,0 +1,41 @@
const renderTable = (colNames, rows) => {
const table = document.createElement("table");
const headerRow = document.createElement("tr");
colNames.forEach((name) => {
const th = document.createElement("th");
th.innerText = name;
headerRow.append(th);
});
table.append(headerRow);
rows.forEach((row) => {
const contentRow = document.createElement("tr");
row.forEach((cell) => {
const td = document.createElement("td");
td.innerText = cell;
contentRow.append(td);
});
table.append(contentRow);
})
return table;
}
const renderConnections = (connections) => {
const wrapper = document.getElementById("connection-wrapper");
const table = renderTable(['Connection ID', 'Client Address'], connections.map((conn) =>
[conn.id, conn.peer_addr]));
wrapper.replaceChildren(table)
}
const refresh = async () => {
const fetched = await fetch('http://localhost:3000/api/data');
const data = await fetched.json();
renderConnections(data.connections);
}
setInterval(refresh, 1000);

10
amqp_dashboard/assets/style.css Normal file
View file

@ -0,0 +1,10 @@
html {
font-family: arial, sans-serif;
margin: 10px;
}
table, th, td {
border: 1px solid black;
border-collapse: collapse;
padding: 10px;
}