nmelone/Pond-Level-Sensor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Completely finishes MAXH2O-51. Shows gauge and trend of pond_volume

Browse Source
This commit is contained in:
Patrick McDonagh
2017-12-01 18:47:00 -06:00
parent dc13d8cc7d
commit 2d93d78a7f
2 changed files with 34 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
html_templates/Overview.html
View File

@@ -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">

2
html_templates/Trends.html
View File

@@ -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;