GUI redesign

This commit is contained in:
Kristjan Komlosi
2020-02-15 15:56:28 +01:00
parent a3f3558f7c
commit 1457655f16
+32 -21
View File
@@ -6,20 +6,39 @@
<link rel="stylesheet" href="lib/bootstrap.min.css"> <link rel="stylesheet" href="lib/bootstrap.min.css">
<link rel="stylesheet" href="stylesheet.css"> <link rel="stylesheet" href="stylesheet.css">
<title>TeraHz</title> <title>TeraHz</title>
<script src="lib/bootstrap.bundle.min.js"></script>
<script src="lib/jquery-3.4.1.min.js"></script>
<script src="lib/flot/jquery.flot.js"></script>
<script src="frontend.js"></script>
<script src="lib/flot/jquery.canvaswrapper.js"></script>
<script src="lib/flot/jquery.colorhelpers.js"></script>
<script src="lib/flot/jquery.flot.js"></script>
<script src="lib/flot/jquery.flot.saturated.js"></script>
<script src="lib/flot/jquery.flot.browser.js"></script>
<script src="lib/flot/jquery.flot.drawSeries.js"></script>
<script src="lib/flot/jquery.flot.uiConstants.js"></script>
</head> </head>
<body> <body>
<div class="container text-center"> <div class="container text-center">
<h1><img src="lib/logo-sq.png" height="64px">TeraHz</h1> <h1><img src="lib/logo-sq.png" height="64px">TeraHz</h1>
</div> </div>
<div class="container"> <div class="container">
<button id="update" class="btn btn-primary m-1 float-right">Get data</button> <button id="update" class="btn btn-primary">Get data</button>
<p id="debug"> <button id="download" class="btn btn-primary">Download</button>
</p> <button id="debug" class="btn btn-danger">DEBUG</button>
<h3>Spectrogram</h3> </div>
<div class="container">
<div class="row">
<div class="col-sm">
<h4>Spectrogram</h4>
<div id="graph" style="height:480px;width:720px"></div> <div id="graph" style="height:480px;width:720px"></div>
<h3>Spectral readings</h3> </div>
<div class="col-sm">
<h4>Visible+IR spectrum</h4>
<table class="table table-dark table-sm" id="specter"> <table class="table table-dark table-sm" id="specter">
<thead class="thead-dark"> <thead class="thead-dark">
<tr> <tr>
@@ -119,9 +138,11 @@
<td id="L">---</td> <td id="L">---</td>
</tr> </tr>
</table> </table>
<br> </div>
<h3>Lux and UV readings</h3>
<table class="table-dark table" id="luxuv"> <div class="col-sm">
<h4>UV+Illuminance</h4>
<table class="table-dark table table-sm" id="luxuv">
<thead class="thead-dark"> <thead class="thead-dark">
<tr> <tr>
<th>Parameter</th> <th>Parameter</th>
@@ -146,17 +167,7 @@
</tr> </tr>
</table> </table>
</div> </div>
<script src="lib/bootstrap.bundle.min.js"></script> </div>
<script src="lib/jquery-3.4.1.min.js"></script> </div>
<script src="lib/flot/jquery.flot.js"></script>
<script src="frontend.js"></script>
<script src="lib/flot/jquery.canvaswrapper.js"></script>
<script src="lib/flot/jquery.colorhelpers.js"></script>
<script src="lib/flot/jquery.flot.js"></script>
<script src="lib/flot/jquery.flot.saturated.js"></script>
<script src="lib/flot/jquery.flot.browser.js"></script>
<script src="lib/flot/jquery.flot.drawSeries.js"></script>
<script src="lib/flot/jquery.flot.uiConstants.js"></script>
</body> </body>
</html> </html>