{% extends 'layout.html' %}

{% block title %} Device Data: {% endblock %}

{% block content %}

<div class="row">
	<div class="col-md-6 col-md-offset-3">
		<div class="panel panel-success">
			<div class="panel-heading">
				<h2><center> {{ devname }} data </center></h2>
			</div>
			<div class="panel-body">
				{% if data %}
				<p>Last {{ lastctr }} messages:</p>
		
				<table class="table">
					<thead>
						<th>Time</th>
						<th>Content</th>
					</thead>
					<tbody>
					{% for d in data %}
						<tr>
							<th> {{ d[1] }} </th>
							<th>
							{% for k in d[2] %}
							{{ k }} : {{ d[2][k] }} <br>
							{% endfor %}
							</th>
						</tr>
					{% endfor %}
					</tbody>
				</table>

				<p>Total: <strong>{{ total }}</strong> messages.</p>

				<center>
				<a href="/data-csv"><button type="submit" class="btn btn-primary">Download CSV</button></a>
				</center>
				{% else %}
				<h3><center>Device have not sent any data yet.</center></h3>
				{% endif %}
	</div>
</div>

<script type="text/javascrypt">
function conf() {
	return confirm("Are you sure? It will remove all device data.")
}
</script>

{% endblock %}