From 2d93d78a7f80f569ab7d7fc356dfb15d27b6092f Mon Sep 17 00:00:00 2001
From: Patrick McDonagh <patrickjmcd@gmail.com>
Date: Fri, 1 Dec 2017 18:47:00 -0600
Subject: [PATCH] Completely finishes MAXH2O-51. Shows gauge and trend of
 pond_volume

---
 html_templates/Overview.html | 33 +++++++++++++++++++++++++++++++++
 html_templates/Trends.html   |  2 +-
 2 files changed, 34 insertions(+), 1 deletion(-)

diff --git a/html_templates/Overview.html b/html_templates/Overview.html
index 599975e..d7eaf67 100644
--- a/html_templates/Overview.html
+++ b/html_templates/Overview.html
@@ -32,6 +32,39 @@
         <div style="height:300px" id="chart-pond_level" data-chart="chart" data-nodename1="pondlevel.pond_level" data-datalabel1="Pond Level" data-daysofhistory="2"  data-chartlabel="Pond Level" data-ylabel="" data-xlabel="Date" data-units=" ft"></div>
     </div>
 </div>
+<% if (channels["pondlevel.pond_volume"].value > 0.0){ %>
+    <div class="row row-flex box-me">
+        <div class='col-xs-4 text-center'>
+            <h2>Pond Volume</h2>
+            <div class="gauge-box">
+                <div data-labelheight="10"
+                style="height: 170px; background: transparent; margin: 0 auto;"
+                id="gauge-pond_volume"
+                data-chart="solidgauge"
+                data-nodename="pondlevel.pond_volume"
+                data-units="BBL"
+                data-min="0"
+                data-max="1000000"
+                data-decimalplaces="0"
+                data-colors="0.1:#DF5353,0.5:#DDDF0D,0.9:#55BF3B"
+                data-valuefontsize="18px">
+                </div>
+                <div class- "timestamp-box">
+                    <a href="#" data-channelId="<%= channels['pondlevel.pond_volume'].channelId %>" class="data-table" title="Download Channel History">
+                        <i class="fa fa-download"></i>
+                    </a>
+                </div>
+                <span data-timeupdate="pond_level">
+                    <%= channels["pondlevel.pond_volume"].timestamp %>
+                </span>
+            </div>
+        </div>
+
+        <div class='col-xs-8'>
+            <div style="height:300px" id="chart-pond_volume" data-chart="chart" data-nodename1="pondlevel.pond_volume" data-datalabel1="Pond Volume" data-daysofhistory="2"  data-chartlabel="Pond Volume" data-ylabel="" data-xlabel="Date" data-units=" BBL"></div>
+        </div>
+    </div>
+<% } %>
 <h1 class="pad15">Configuration</h1>
 <div class="row row-flex">
     <div class="col-md-6 box-me entry-top-level" id="low_level_limit">
diff --git a/html_templates/Trends.html b/html_templates/Trends.html
index f046914..20120e3 100644
--- a/html_templates/Trends.html
+++ b/html_templates/Trends.html
@@ -9,7 +9,7 @@
     </div>
 </div>
 <hr>
-<div class='clearfix col-xs-12' style='height: 450px' id="dynamicChart" data-chart="dynamicchart" data-daysofhistory="7"  data-chartlabel="Data" data-ylabel="" data-xlabel="Date" data-units=""  data-channelnames="pondlevel.pond_level"></div>
+<div class='clearfix col-xs-12' style='height: 450px' id="dynamicChart" data-chart="dynamicchart" data-daysofhistory="7"  data-chartlabel="Data" data-ylabel="" data-xlabel="Date" data-units=""  data-channelnames="pondlevel.pond_level,pondlevel.pond_volume"></div>
 <style>
 .dynamic-chart-form {
     background-color: whiteSmoke;