kristjank/TeraHz
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

removed old utils virtualenv

Browse Source
This commit is contained in:
Kristjan Komlosi
2019-11-12 19:56:22 +01:00
parent 8e7435ff8f
commit 665cf6050b
66 changed files with 1260 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
frontend/frontend.js Normal file
View File

@@ -0,0 +1,46 @@
// All code in this file is licensed under the ISC license, provided in LICENSE.txt
$('#update').click(function () {
updateData();
});
// jQuery event binder
function updateData () {
const url = 'http://' + window.location.hostname + ':5000/data';
$.ajax({ // spawn an AJAX request
url: url,
success: function (data, status) {
console.log(data);
graphSpectralData(data[0], 0);
fillTableData(data);
},
timeout: 2500 // this should be a pretty sane timeout
});
}
function graphSpectralData (obj, dom) {
// graph spectral data in obj into dom
var graphPoints = [];
var graphXTicks = [];
Object.keys(obj).forEach((element, index) => {
graphPoints.push([index, obj[element]]); // build array of points
graphXTicks.push([index, element]); // build array of axis labels
});
// console.log(graphPoints);
const options = {
grid: {color: 'white'},
xaxis: {ticks: graphXTicks}
};
$.plot('#graph', [graphPoints], options);
// flot expects an array of arrays (lines) of 2-element arrays (points)
}
function fillTableData (obj) {
// fill the obj data into HTML tables
Object.keys(obj[0])
.forEach((element) => { $('#' + element).text(obj[0][element]); });
$('#lx').text(obj[1]);
$('#uva').text(obj[2][0]);
$('#uvb').text(obj[2][1]);
$('#uvi').text(obj[2][2]);
}

162
frontend/index.html Normal file
View File

@@ -0,0 +1,162 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf8">
<link rel="stylesheet" href="lib/bootstrap.min.css">
<link rel="stylesheet" href="stylesheet.css">
<title>TeraHz</title>
</head>
<body>
<div class="container text-center">
<h1><img src="lib/logo-sq.png" height="64px">TeraHz</h1>
</div>
<div class="container">
<button id="update" class="btn btn-primary m-1 float-right">Get data</button>
<p id="debug">
</p>
<h3>Spectrogram</h3>
<div id="graph" style="height:480px;width:720px"></div>
<h3>Spectral readings</h3>
<table class="table table-dark table-sm" id="specter">
<thead class="thead-dark">
<tr>
<th>Band</th>
<th>Wavelength [nm]</th>
<th>Irradiance [μW/cm²]</th>
</tr>
</thead>
<tr>
<td>A</td>
<td>410 nm</td>
<td id="A">---</td>
</tr>
<tr>
<td>B</td>
<td>435 nm</td>
<td id="B">---</td>
</tr>
<tr>
<td>C</td>
<td>460 nm</td>
<td id="C">---</td>
</tr>
<tr>
<td>D</td>
<td>485 nm</td>
<td id="D">---</td>
</tr>
<tr>
<td>E</td>
<td>510 nm</td>
<td id="E">---</td>
</tr>
<tr>
<td>F</td>
<td>535 nm</td>
<td id="F">---</td>
</tr>
<tr>
<td>G</td>
<td>560 nm</td>
<td id="G">---</td>
</tr>
<tr>
<td>H</td>
<td>585 nm</td>
<td id="H">---</td>
</tr>
<tr>
<td>R</td>
<td>610 nm</td>
<td id="R">---</td>
</tr>
<tr>
<td>I</td>
<td>645 nm</td>
<td id="I">---</td>
</tr>
<tr>
<td>S</td>
<td>680 nm</td>
<td id="S">---</td>
</tr>
<tr>
<td>J</td>
<td>705 nm</td>
<td id="J">---</td>
</tr>
<tr>
<td>T</td>
<td>730 nm</td>
<td id="T">---</td>
</tr>
<tr>
<td>U</td>
<td>760 nm</td>
<td id="U">---</td>
</tr>
<tr class="table-secondary">
<td>V</td>
<td>810 nm</td>
<td id="V">---</td>
</tr>
<tr class="table-secondary">
<td>W</td>
<td>860 nm</td>
<td id="W">---</td>
</tr>
<tr class="table-secondary">
<td>K</td>
<td>900 nm</td>
<td id="K">---</td>
</tr>
<tr class="table-secondary">
<td>L</td>
<td>940 nm</td>
<td id="L">---</td>
</tr>
</table>
<br>
<h3>Lux and UV readings</h3>
<table class="table-dark table" id="luxuv">
<thead class="thead-dark">
<tr>
<th>Parameter</th>
<th>Value</th>
</tr>
</thead>
<tr>
<td>Illuminance [lx]</td>
<td id="lx">---</td>
</tr>
<tr>
<td>UVA irradiance [μW/cm²]</td>
<td id="uva">---</td>
</tr>
<tr>
<td>UVB irradiance [μW/cm²]</td>
<td id="uvb">---</td>
</tr>
<tr>
<td>UVA/UVB average [μW/cm²]</td>
<td id="uvi">---</td>
</tr>
</table>
</div>
<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>
</body>
</html>

69
frontend/stylesheet.css Normal file
View File

@@ -0,0 +1,69 @@
body {
background: rgb(2,0,36);
background: linear-gradient(138deg, rgba(2,0,36,1) 0%, rgba(5,5,209,1) 51%, rgba(0,212,255,1) 100%);
color: white;
}
#A {
background-color: #7e00db;
color: white;
}
#B {
background-color: #2300ff;
color: white;
}
#C {
background-color: #007bff;
color: white;
}
#D {
background-color: #00eaff;
}
#E {
background-color: #00ff00;
}
#F {
background-color: #70ff00;
}
#G {
background-color: #c3ff00;
}
#H {
background-color: #ffef00;
}
#R {
background-color: #ff9b00;
}
#I, #S {
background-color: #ff0000;
}
#J {
background-color: #f60000;
}
#T {
background-color: #c80000;
color: white;
}
#U {
background-color: #8d0000;
color: white;
}
.table-secondary {
color: black;
}
.flot-tick-label {
fill: white;
}