First try AJAX

This commit is contained in:
d3m1g0d
2019-04-06 15:18:43 +02:00
parent 2e4c7e2683
commit fc112d997b
3 changed files with 147 additions and 137 deletions
+6 -3
View File
@@ -1,4 +1,7 @@
function kebab () { $('#update').click(updateData())
$('#values').html('kebab'); function updateData () {
console.log('yeet'); const url = 'http:' + window.location.hostname + ':5000/data'
$.get(url, function (data, status) {
$('#debug').text(data)
})
} }
+18 -18
View File
@@ -1,56 +1,56 @@
#A { #A {
background-color: #7e00db; background-color: #7e00db;
color: white; color: white;
} }
#B { #B {
background-color: #2300ff; background-color: #2300ff;
color: white; color: white;
} }
#C { #C {
background-color: #007bff; background-color: #007bff;
color: white; color: white;
} }
#D { #D {
background-color: #00eaff; background-color: #00eaff;
} }
#E { #E {
background-color: #00ff00; background-color: #00ff00;
} }
#F { #F {
background-color: #70ff00; background-color: #70ff00;
} }
#G { #G {
background-color: #c3ff00; background-color: #c3ff00;
} }
#H { #H {
background-color: #ffef00; background-color: #ffef00;
} }
#R { #R {
background-color: #ff9b00; background-color: #ff9b00;
} }
#I, #S { #I, #S {
background-color: #ff0000; background-color: #ff0000;
} }
#J { #J {
background-color: #f60000; background-color: #f60000;
} }
#T { #T {
background-color: #c80000; background-color: #c80000;
color: white; color: white;
} }
#U { #U {
background-color: #8d0000; background-color: #8d0000;
color: white; color: white;
} }
+123 -116
View File
@@ -1,119 +1,126 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head>
<meta charset="utf8"> <head>
<link rel="stylesheet" href="lib/bootstrap.min.css"> <meta charset="utf8">
<link rel="stylesheet" href="stylesheet.css"> <link rel="stylesheet" href="lib/bootstrap.min.css">
<title>TeraHz</title> <link rel="stylesheet" href="stylesheet.css">
</head> <title>TeraHz</title>
<body> </head>
<div class="container text-center"><h1>TeraHz</h1></div>
<div class="container"> <body>
<h3>Vrednosti:</h3><br> <div class="container text-center">
<button class="btn btn-primary m-1 float-right">Get data</button> <h1>TeraHz</h1>
<table class="table table-sm"> </div>
<thead class="thead-dark"> <div class="container">
<tr> <h3>Vrednosti:</h3><br>
<th>Band</th> <button id="update" class="btn btn-primary m-1 float-right">Get data</button>
<th>Wavelength [nm]</th> <p id="debug">
<th>Irradiance [μW/cm²]</th> </p>
</tr> <table class="table table-sm">
</thead> <thead class="thead-dark">
<tr> <tr>
<td>A</td> <th>Band</th>
<td>410 nm</td> <th>Wavelength [nm]</th>
<td id="A">---</td> <th>Irradiance [μW/cm²]</th>
</tr> </tr>
<tr> </thead>
<td>B</td> <tr>
<td>435 nm</td> <td>A</td>
<td id="B">---</td> <td>410 nm</td>
</tr> <td id="A">---</td>
<tr> </tr>
<td>C</td> <tr>
<td>460 nm</td> <td>B</td>
<td id="C">---</td> <td>435 nm</td>
</tr> <td id="B">---</td>
<tr> </tr>
<td>D</td> <tr>
<td>485 nm</td> <td>C</td>
<td id="D">---</td> <td>460 nm</td>
</tr> <td id="C">---</td>
<tr> </tr>
<td>E</td> <tr>
<td>510 nm</td> <td>D</td>
<td id="E">---</td> <td>485 nm</td>
</tr> <td id="D">---</td>
<tr> </tr>
<td>F</td> <tr>
<td>535 nm</td> <td>E</td>
<td id="F">---</td> <td>510 nm</td>
</tr> <td id="E">---</td>
<tr> </tr>
<td>G</td> <tr>
<td>560 nm</td> <td>F</td>
<td id="G">---</td> <td>535 nm</td>
</tr> <td id="F">---</td>
<tr> </tr>
<td>H</td> <tr>
<td>585 nm</td> <td>G</td>
<td id="H">---</td> <td>560 nm</td>
</tr> <td id="G">---</td>
<tr> </tr>
<td>R</td> <tr>
<td>610 nm</td> <td>H</td>
<td id="R">---</td> <td>585 nm</td>
</tr> <td id="H">---</td>
<tr> </tr>
<td>I</td> <tr>
<td>645 nm</td> <td>R</td>
<td id="I">---</td> <td>610 nm</td>
</tr> <td id="R">---</td>
<tr> </tr>
<td>S</td> <tr>
<td>680 nm</td> <td>I</td>
<td id="S">---</td> <td>645 nm</td>
</tr> <td id="I">---</td>
<tr> </tr>
<td>J</td> <tr>
<td>705 nm</td> <td>S</td>
<td id="J">---</td> <td>680 nm</td>
</tr> <td id="S">---</td>
<tr> </tr>
<td>T</td> <tr>
<td>730 nm</td> <td>J</td>
<td id="T">---</td> <td>705 nm</td>
</tr> <td id="J">---</td>
<tr> </tr>
<td>U</td> <tr>
<td>760 nm</td> <td>T</td>
<td id="U">---</td> <td>730 nm</td>
</tr> <td id="T">---</td>
<tr class="table-secondary"> </tr>
<td>V</td> <tr>
<td>810 nm</td> <td>U</td>
<td id="V">---</td> <td>760 nm</td>
</tr> <td id="U">---</td>
<tr class="table-secondary"> </tr>
<td>W</td> <tr class="table-secondary">
<td>860 nm</td> <td>V</td>
<td id="W">---</td> <td>810 nm</td>
</tr> <td id="V">---</td>
<tr class="table-secondary"> </tr>
<td>K</td> <tr class="table-secondary">
<td>900 nm</td> <td>W</td>
<td id="K">---</td> <td>860 nm</td>
</tr> <td id="W">---</td>
<tr class="table-secondary"> </tr>
<td>L</td> <tr class="table-secondary">
<td>940 nm</td> <td>K</td>
<td id="L">---</td> <td>900 nm</td>
</tr> <td id="K">---</td>
</table> </tr>
<tr class="table-secondary">
</div> <td>L</td>
<script src="lib/bootstrap.bundle.min.js"></script> <td>940 nm</td>
<script src="lib/jquery-3.3.1.min.js"></script> <td id="L">---</td>
<script src="frontend.js"></script> </tr>
</body> </table>
</div>
<script src="lib/bootstrap.bundle.min.js"></script>
<script src="lib/jquery-3.3.1.min.js"></script>
<script src="frontend.js"></script>
</body>
</html> </html>