Define a unique URL for individual plots

app/routes.py

@@ -102,6 +102,12 @@ def index():
     return render_template('plots.html', plots=expand_wildcards(PLOTS))
 
 
+@app.route('/plot_<plot>.html')
+@requires_auth
+def single_plot(plot):
+    return render_template('plot.html', plot=plot)
+
+
 @app.route('/ahrs.html')
 @requires_auth
 def ahrs():

app/static/css/main.css

@@ -33,3 +33,7 @@ img.plot {
 #logs a {
     margin: 5px;
 }
+
+#plot img {
+    margin: 0 auto
+}

app/templates/plot.html

+{% extends "base.html" %}
+
+{% block main %}
+
+    <div class="container-fluid" id="plot">
+                <a href="plots/{{ plot }}.png">
+                    <img 
+                         class="img-responsive"
+                         src="plots/{{ plot }}.png"
+                         alt="{{ plot }}"/>
+                </a>
+    </div>
+
+    <script type = "text/javascript">
+        $(document).ready(function(){
+            setInterval(function(){
+                $("#plot").attr("src", "plots/{{ plot }}.png?"+new Date().getTime());
+            }, 45000);
+        });
+    </script>
+
+{% endblock %}

app/templates/plots.html

@@ -13,7 +13,7 @@
         <div class="row">
             {% for plot in row %}
             <div class="col-md-{{ (12/(row|length))|int }} plot-container">
-                <a href="plots/{{ plot }}.png">
+                <a href="plot_{{ plot }}.html">
                     <img id="{{ plot }}"
                          class="plot img-responsive"
                          src="plots/{{ plot }}.png"