72 lines
3.5 KiB
HTML
Executable File
72 lines
3.5 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>IAQ dash</title>
|
|
<link rel='shortcut icon' type='image/ico' href='static/favicon.ico'>
|
|
<link rel='stylesheet' href='static/styles/style.css'>
|
|
<link rel='stylesheet' href='static/styles/Chart.min.css'>
|
|
<script type='text/javascript' src='static/js/moment.min.js'></script>
|
|
<script type='text/javascript' src='static/js/Chart.min.js'></script>
|
|
<script type='text/javascript' src='static/js/jquery.min.js'></script>
|
|
<script type='text/javascript' src='static/js/raphael.min.js'></script>
|
|
<script type='text/javascript' src='static/js/justgage.min.js'></script>
|
|
</head>
|
|
<body>
|
|
<div id='header_bar'>
|
|
<h2 id='uberschrift'>Indoor enviro data</h2>
|
|
</div>
|
|
<div id='content_wrapper' class='column'>
|
|
<div id='content_left' class='column'>
|
|
<h3 id='recent_vals'>Most recent values</h3>
|
|
<h4 id='timestamp'></h4>
|
|
<div class='gauge_container'>
|
|
<div class='gauge_container_top'>
|
|
<div class='gauge_block'>
|
|
<div id='temp_gauge' class='gauge' align='center'></div>
|
|
<h5 align='center' class='gauge_desc'>Temperature</h5>
|
|
</div>
|
|
<div class='gauge_block'>
|
|
<div id='hum_gauge' class='gauge' align='center'></div>
|
|
<h5 align='center' class='gauge_desc'>Relative humidity</h5>
|
|
</div>
|
|
</div>
|
|
<div class='gauge_container_bottom'>
|
|
<div class='gauge_block'>
|
|
<div id='pres_gauge' class='gauge' align='center'></div>
|
|
<h5 align='center' class='gauge_desc'>Pressure</h5>
|
|
</div>
|
|
<div class='gauge_block'>
|
|
<div id='co2_gauge' class='gauge' align='center'></div>
|
|
<h5 align='center' class='gauge_desc'>CO2 concentration</h5>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id='sample_select'>
|
|
<form id='sample_select_form' action='/'>
|
|
<p>Show last <input type='number' min=1 max=10800 name='samples' placeholder='120' size=8> minutes.
|
|
<input type='submit' value='Select'/></p>
|
|
</form>
|
|
<p><input type='button' id='refresh' value='Refresh all'/></p>
|
|
</div>
|
|
</div>
|
|
<div id='content_center' class='column'>
|
|
<h3 class='graph_name'>Temperature</h3>
|
|
<canvas class='graph_canvas' id='tempchart'></canvas>
|
|
<h3 class='graph_name'>Humidity</h3>
|
|
<canvas class='graph_canvas' id='humchart'></canvas>
|
|
</div>
|
|
<div id='content_right' class='column'>
|
|
<h3 class='graph_name'>Combined</h3>
|
|
<canvas class='graph_canvas' id='multichart'></canvas>
|
|
<h3 class='graph_name'>CO2 concentration</h3>
|
|
<canvas class='graph_canvas' id='co2chart'></canvas>
|
|
</div>
|
|
</div>
|
|
<div id='footer_bar'>
|
|
<p id='footer_text'>Source not online, live update disabled. Showing latest available data.</p>
|
|
</div>
|
|
|
|
<script type='text/javascript' src='static/js/main.js'></script>
|
|
</body>
|
|
</html>
|