diff options
Diffstat (limited to 'snag/templates')
| -rw-r--r-- | snag/templates/dashboard/dashboard.html | 43 | ||||
| -rw-r--r-- | snag/templates/interactive.html | 39 | ||||
| -rw-r--r-- | snag/templates/layout.html | 29 | ||||
| -rw-r--r-- | snag/templates/show_entries.html | 44 |
4 files changed, 155 insertions, 0 deletions
diff --git a/snag/templates/dashboard/dashboard.html b/snag/templates/dashboard/dashboard.html new file mode 100644 index 0000000..c061b66 --- /dev/null +++ b/snag/templates/dashboard/dashboard.html @@ -0,0 +1,43 @@ +{% extends 'layout.html' %} + +{% block headline %}{% block title %}Dashboard{% endblock %}{% endblock %} + +{% block content %} +<main> + {% if deviceList|length == 0 %} +Hmmm nothing seems to be logged yet + {% endif %} + {% for entry in deviceList %} + + <h2> {{ entry.name }} | {{ entry.location }} </h2> + <table> + <tr> + {% if entry.location != "status" %} + <td> + <figure> + <embed type="image/png" src="/graph/humidity-temperature.png?deviceId={{ entry.deviceId }}&type={{ entry.location}}" /> + </figure> + </td> + + <td> + <figure> + <embed type="image/png" src="/graph/pressure.png?deviceId={{ entry.deviceId }}&type={{ entry.location}}" /> + </figure> + </td> + {% else %} + <td> + <figure> + <embed type="image/png" src="/graph/battery.png?deviceId={{ entry.deviceId }}" /> + </figure> + </td> + {% endif %} + </tr> + + </table> + + {% endfor %} + +</main> +{% endblock %} + +{% block footer %} Best by: {{ generatedAt }} {% endblock %} diff --git a/snag/templates/interactive.html b/snag/templates/interactive.html new file mode 100644 index 0000000..1756865 --- /dev/null +++ b/snag/templates/interactive.html @@ -0,0 +1,39 @@ +{% extends "layout.html" %} +{% block body %} + <form id="query"> + <p> + <label>Location</label> + <select id="deviceId" name="deviceId"> + <option value="1">Bedroom</option> + <option value="2">Mainfloor</option> + </select> + </p> + <p> + <label>Graph Type</label> + <select id="graph" name="graph"> + <option value="htgraph.png">Humidity & Temperature</option> + <option value="tgraph.png">Temperature</option> + <option value="hgraph.png">Humidity</option> + <option value="pgraph.png">Pressure</option> + <option value="bgraph.png">Battery</option> + </select> + </p> + <p> + <label>Start Date</label> + <input type="date" name="sd" id="sd"> + <input type="time" name="st" id="st"> + </p> + <p> + <label>End Date</label> + <input type="date" name="ed" id="ed"> + <input type="time" name="et" id="et"> + </p> + </form> + <button id='submit'>Submit</button> + + <figure> + <embed id="figure" type="image/png" src="/htgraph.png?deviceId=2" /> + </figure> + + <script src="static/interactive.js"></script> +{% endblock %} diff --git a/snag/templates/layout.html b/snag/templates/layout.html new file mode 100644 index 0000000..50ad57b --- /dev/null +++ b/snag/templates/layout.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html lang="en-US"> + <head> + <meta charset="utf-8"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <title>snag | {% block title %}{% endblock %}</title> + <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='pagedown.css') }}"> + </head> + + <body> + <header> + <nav> + <a href="/">Dashboard</a> <a href="interactive">Interactive</a> + </nav> + <hr> + </header> + <h1> {% block headline %}{% endblock %} </h1> + <hr> + + {% block content %}{% endblock %} + + <footer> + <hr> + <p> + {% block footer %}{% endblock %} + </p> + </footer> + </body> +</html> diff --git a/snag/templates/show_entries.html b/snag/templates/show_entries.html new file mode 100644 index 0000000..86451df --- /dev/null +++ b/snag/templates/show_entries.html @@ -0,0 +1,44 @@ +{% extends "layout.html" %} +{% block body %} + <aside> + <b>{% if devId == 1 %}Bedroom + {% else %}Mainfloor + {% endif %}Currently:</b> + <ul class=current> + <li>{{ current.temperature }}°F</li> + <li>{{ current.humidity }}% humidity</li> + </ul> + </aside> + <figure> + <embed type="image/png" src="/htgraph.png?deviceId={{ devId }}" /> + </figure> + <figure> + <embed type="image/png" src="/pgraph.png?deviceId={{ devId }}" /> + </figure> + {% if devId == 2 %} + <figure> + <embed type="image/png" src="/bgraph.png?deviceId={{ devId }}" /> + </figure> + {% endif %} + + <hr> + <h2>Readings from the past 24 hours</h2> + <p> + <table class=log> + <tr> + <th>Timestamp</th> + <th>Temperature (C)</th> + <th>Humidity (%)</th> + <th>Pressure (hPa)</th> + </tr> + {% for entry in log %} + <tr> + <td>{{ entry.date }}</td> + <td>{{ entry.temperature }}</td> + <td>{{ entry.humidity }}</td> + <td>{{ entry.pressure }}</td> + </tr> + {% endfor %} + </table> + </p> +{% endblock %} |