Add 5 latest readings to the bottom of the page

influx_frontend.py

@@ -16,7 +16,10 @@ def success():
 
 @app.route('/', methods=['GET', 'POST'])
 def main_page():
-    return render_template('index.html')
+    client = InfluxDBClient('localhost', 8086, 'root', 'root', 'gas')
+    query = 'select TOP(odometer, 5) from odyssey'
+    data = client.query(query)
+    return render_template('index.html', data=data)
 
 @app.route('/add_time', methods=['POST', 'GET'])
 def add_time():
@@ -32,6 +35,8 @@ def add_time():
         time = now
     odometer = request.form['odometer']
     oilhealth= request.form['oilhealth']
+    if oilhealth != '':
+        oilhealth = float(oilhealth)
     fuel = request.form['fuel']
     if fuel != '':
         fuel = float(fuel)

templates/index.html

@@ -27,21 +27,21 @@
     <div class="row">
       <div class="col-xs-4">
         <label for="odometer">Odometer:</label>
-        <input type=text name="odometer" class="form-control" placeholder="Ex: 3008">
+        <input type=number name="odometer" class="form-control" placeholder="Ex: 3008">
       </div>
       <div class="col-xs-4">
         <label for="oilhealth">Oil Health:</label>
-        <input type=text name="oilhealth" class="form-control" placeholder="Ex: 80">
+        <input type=number name="oilhealth" class="form-control" placeholder="Ex: 80">
       </div>
     </div>
     <div class="row">
       <div class="col-xs-4">
         <label for="fuel">Fuel (L):</label>
-        <input type=text name="fuel" class="form-control" placeholder="Ex: 70.175">
+        <input type=number name="fuel" class="form-control" placeholder="Ex: 70.175">
       </div>
       <div class="col-xs-4">
         <label for="fuelcost">Fuel Cost ($/L):</label>
-        <input type=text name="fuelcost" class="form-control" placeholder="Ex: 1.059">
+        <input type=number name="fuelcost" class="form-control" placeholder="Ex: 1.059">
       </div>
     </div>
     <div class="row">
@@ -52,10 +52,19 @@
           <option value="false">False</option>
 	</select>
       </div>
-    </div>
+    </div><br>
     <input type="submit" value="Go">
   </div>
 </form>
-
+<br>
+Last Mileage
+<ul>
+{% for point in data %}
+  {% for item in point %}
+    <li>
+    {{ item['top'] }}
+    </li>
+  {% endfor %}
+{% endfor %}
 {% endblock %}
-
+</ul>