66 lines
		
	
	
		
			2.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			66 lines
		
	
	
		
			2.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!DOCTYPE html>
 | |
| <html lang="en">
 | |
| <head>
 | |
| 	<title>Status</title>
 | |
| 	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
 | |
| </head>
 | |
| <body>
 | |
| 	<div class="container my-3 bg-light rounded p-4 border shadow">
 | |
| 		<div class="text-center mb-3">
 | |
| 			<div class="display-4">Status</div>
 | |
| 		</div>
 | |
| 		<div class="table-responsive">
 | |
| 			<table class="table">
 | |
| 				<thead>
 | |
| 					<tr>
 | |
| 						<th scope="col">Name</th>
 | |
| 						<th scope="col">Status</th>
 | |
| 						<th scope="col">Hostname</th>
 | |
| 						<th scope="col">Response time</th>
 | |
| 					</tr>
 | |
| 				</thead>
 | |
| 				<tbody id="results">
 | |
| 				</tbody>
 | |
| 			</table>
 | |
| 		</div>
 | |
| 	</div>
 | |
| 
 | |
| 	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 | |
| 	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
 | |
| 	<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
 | |
| 
 | |
| 	<script>
 | |
| 		const OK = "<span class=\"badge badge-success\">✓</span> ";
 | |
| 		const NOK = "<span class=\"badge badge-danger\">X</span> ";
 | |
| 
 | |
| 		function refreshTable() {
 | |
| 			$.getJSON("/api/v1/results", function (data) {
 | |
| 				let tableBody = "";
 | |
| 				for (let serviceName in data) {
 | |
| 					let serviceStatus = "";
 | |
| 					let hostname =data[serviceName][data[serviceName].length-1].hostname 
 | |
| 					for (let key in data[serviceName]) {
 | |
| 						let entry = data[serviceName][key];
 | |
| 						console.log(data[serviceName][key]);
 | |
| 						serviceStatus = (entry.success ? OK : NOK) + serviceStatus;
 | |
| 					}
 | |
| 					tableBody += ""
 | |
| 						+ "<tr>"
 | |
| 						+ "  <td>" + serviceName + "</td>"
 | |
| 						+ "  <td>" + serviceStatus + "</td>"
 | |
| 						+ "  <td><a href=\"//" + hostname + "\">" + hostname + "</a></td>"
 | |
| 						+ "  <td>" + parseInt(data[serviceName][data[serviceName].length-1].duration / 1000000) + "ms </td>"
 | |
| 						+ "</tr>";
 | |
| 				}
 | |
| 				$("#results").html(tableBody);
 | |
| 			});
 | |
| 		}
 | |
| 
 | |
| 		refreshTable();
 | |
| 		setInterval(function() {
 | |
| 			refreshTable();
 | |
| 		}, 3000);
 | |
| 	</script>
 | |
| </body>
 | |
| </html>
 |