mirror of
https://gitlab.silvrtree.co.uk/martind2000/mdot_server.git
synced 2025-01-25 21:46:20 +00:00
186 lines
4.8 KiB
HTML
186 lines
4.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Title</title>
|
|
<link href="css/mui.css" rel="stylesheet"
|
|
type="text/css"/>
|
|
<script src="lib/notification.js"></script>
|
|
<link rel="stylesheet" href="css/notification.css">
|
|
</head>
|
|
<body>
|
|
|
|
<div id="main"></div>
|
|
<div id="graph"></div>
|
|
<div id="output"></div>
|
|
<script type="text/template" id="main-template">
|
|
<div class="mui-container">
|
|
|
|
<div class="mui-row">
|
|
|
|
<div class="mui-select mui-col-md-6">
|
|
<select id="device" name="device">
|
|
<option>
|
|
|
|
</option>
|
|
<option>
|
|
HIE-mobile-1
|
|
</option>
|
|
<option>
|
|
HIE-demo
|
|
</option>
|
|
<option>
|
|
HIE-mobile-2
|
|
</option>
|
|
<option>
|
|
HIE-smart-campus-1
|
|
</option>
|
|
<option>
|
|
HIE-smart-campus-2
|
|
</option>
|
|
<option>
|
|
HIE-smart-campus-3
|
|
</option>
|
|
<option>
|
|
HIE-smart-campus-4
|
|
</option>
|
|
<option>
|
|
HIE-smart-campus-5
|
|
</option>
|
|
<option>
|
|
HIE-smart-campus-6
|
|
</option>
|
|
<option>
|
|
HIE-smart-campus-7
|
|
</option>
|
|
|
|
<option>
|
|
CENSIS-LoRa-1
|
|
</option>
|
|
|
|
<option>
|
|
CENSIS-LoRa-2
|
|
</option>
|
|
|
|
<option>
|
|
CENSIS-LoRa-3
|
|
</option>
|
|
|
|
<option>
|
|
CENSIS-LoRa-4
|
|
</option>
|
|
<option>
|
|
HIE-mDot-1
|
|
</option>
|
|
|
|
</select> <label>Device</label>
|
|
</div>
|
|
|
|
<div class="mui-col-md-3">
|
|
<div class="mui-textfield">
|
|
<input type="date" placeholder="" id='from' name="from" /> <label>From</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mui-col-md-3">
|
|
<div class="mui-textfield">
|
|
<input type="date" placeholder="" id='to' name="to" /> <label>To</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="mui-row">
|
|
<button id='refresh' class="mui-btn mui-btn--small mui-btn--primary">Refresh</button>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<script type="text/template" id="list-template">
|
|
<ul></ul>
|
|
</script>
|
|
<script type="text/template" id="item-template">
|
|
<div class="mui-row">
|
|
<div class="mui-col-md-2"><%= item.timestamp %></div>
|
|
<div class="mui-col-md-2"><%= item.lux %></div>
|
|
<div class="mui-col-md-2"><%= item.co2 %></div>
|
|
<div class="mui-col-md-2"><%= item.temp %></div>
|
|
<div class="mui-col-md-2"><%= item.humidity %></div>
|
|
<div class="mui-col-md-2"><%= item.sound %></div>
|
|
</div>
|
|
</script>
|
|
|
|
<script type="text/template" id="graph-template">
|
|
<div class="mui-container">
|
|
<div class="mui-row">
|
|
<div class="mui-select mui-col-md-6">
|
|
<select id="displaymode" name="displaymode">
|
|
<option value="0"></option>
|
|
<option value="1">
|
|
Light
|
|
</option>
|
|
|
|
<option value="2">
|
|
Temp
|
|
</option>
|
|
<option value="3">
|
|
Co2
|
|
</option>
|
|
|
|
<option value="4">
|
|
Humidity
|
|
</option>
|
|
<option value="5">
|
|
Noise
|
|
</option>
|
|
|
|
</select> <label>Graph</label>
|
|
|
|
</div>
|
|
<div class="mui-col-md-6">
|
|
<svg id="graphSVG" width="300" height="150" fill="blue">
|
|
<line x1="46" y1="12" x2="280" y2="12"
|
|
style="stroke:#004c6d;stroke-width:2;"></line>
|
|
<text id="maxY" x="36" y="15" text-anchor="end">--</text>
|
|
<line x1="46" y1="136" x2="280" y2="136"
|
|
style="stroke:#004c6d;stroke-width:2;"></line>
|
|
<text id="MinY" x="36" y="139" text-anchor="end">0</text>
|
|
|
|
<polyline id="line" fill="none" stroke="#2196F3"
|
|
text-anchor="end" stroke-width="1"
|
|
points=""></polyline>
|
|
<g id="datapoints"></g>
|
|
<g id="baseline">
|
|
|
|
</g>
|
|
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</script>
|
|
|
|
|
|
<script src="lib/jquery.js"
|
|
integrity="sha256-laXWtGydpwqJ8JA+X9x2miwmaiKhn8tVmOVEigRNtP4="
|
|
crossorigin="anonymous"></script>
|
|
<script src="lib/base64.js"></script>
|
|
<script src="lib/underscore.js"></script>
|
|
<script src="lib/backbone.js"></script>
|
|
<script src="lib/sugar-date.js"></script>
|
|
|
|
<script src="lib/amcharts.js"></script>
|
|
<script src="lib/serial.js"></script>
|
|
<script src="lib/amstock.js"></script>
|
|
|
|
|
|
<script src="js/mdot.js"></script>
|
|
|
|
|
|
</body>
|
|
</html>
|