Adds auto/manual and flow set points
This commit is contained in:
Patrick McDonagh
@@ -18,7 +18,7 @@
|
||||
data-nodechannelcurrentId="<%= channels["transferstation.writeplctag"].nodechannelcurrentId %>"
|
||||
id="<%= channels["transferstation.writeplctag"].channelId %>"
|
||||
class="btn btn-large btn-theme animated confirmstatic pad15">
|
||||
Start</a>
|
||||
Auto Start</a>
|
||||
</div>
|
||||
<div class='col-xs-6 text-center box-me'>
|
||||
<a href="#"
|
||||
@@ -32,7 +32,109 @@
|
||||
data-nodechannelcurrentId="<%= channels["transferstation.writeplctag"].nodechannelcurrentId %>"
|
||||
id="<%= channels["transferstation.writeplctag"].channelId %>"
|
||||
class="btn btn-large btn-theme animated confirmstatic pad15">
|
||||
Stop</a>
|
||||
Auto Stop</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row row-flex">
|
||||
<div class="col-md-4 box-me">
|
||||
<div class="m flowTarget">
|
||||
<h3>Flow Target</h3>
|
||||
<hr />
|
||||
<br />
|
||||
|
||||
<div class="entry-top-level" id="flowTarget">
|
||||
<form class="form-inline">
|
||||
<div class="form-group">
|
||||
<input class="form-control val_box"
|
||||
type="number"
|
||||
step="any"
|
||||
value="<%=channels['transferstation.flow_target_station'].value %>">
|
||||
</div>
|
||||
<a href="#"
|
||||
data-confirm-message="Are you sure you want to do this?"
|
||||
data-refreshpause="1"
|
||||
data-command=""
|
||||
data-staticsend="{'tag': 'par_SystemFlowrate[0]', 'val': <%=channels['transferstation.flow_target_station'].value %>}"
|
||||
data-channelId="<%= channels["transferstation.writeplctag"].channelId %>"
|
||||
data-techname="<%=channels["transferstation.writeplctag"].techName %>"
|
||||
data-name="<%= channels["transferstation.writeplctag"].name%>"
|
||||
data-nodechannelcurrentId="<%= channels["transferstation.writeplctag"].nodechannelcurrentId %>"
|
||||
id="<%= channels["transferstation.writeplctag"].channelId %>"
|
||||
class="btn btn-large btn-theme animated setstatic material-icons">send</a>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
$('.val_box').each(function(topLevel){
|
||||
$(this).change(function(){
|
||||
var id = "#" + $(this).closest(".entry-top-level").attr('id');
|
||||
if (id !== "#undefined"){
|
||||
// console.log("before parse", $(id).find('.setstatic').attr('data-staticsend').replace(/'/g, '"'));
|
||||
var jsobj = JSON.parse($(id).find('.setstatic').attr('data-staticsend').replace(/'/g, '"'));
|
||||
// console.log("after parse", jsobj)
|
||||
// var tagStart = $(id).find('.setstatic').attr('data-staticsend').indexOf("tag") + 3;
|
||||
// var tagStop = $(id).find('.setstatic').attr('data-staticsend').indexOf("] ]");
|
||||
// var tag = $(id).find('.setstatic').attr('data-staticsend').substring(tagStart, tagStop).split(',')[0].replace(/'/g,"");
|
||||
var val = $(id).find('.val_box').val();
|
||||
var newData = "{'tag': '" + jsobj.tag +"', 'val': " + val.toString() + "}"
|
||||
var tag = $(id).find('.setstatic').attr('data-staticsend', newData);
|
||||
console.log($(id).find('.setstatic').attr('data-staticsend'));
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.uppercase {
|
||||
text-transform: uppercase;
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
font-weight: 400;
|
||||
letter-spacing: 1px;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.box-me {
|
||||
position: relative;
|
||||
padding: 0.5em;
|
||||
padding-bottom: 1.5em;
|
||||
border: 1px solid #eee;
|
||||
/*margin: 1em 0;*/
|
||||
}
|
||||
.row-flex {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.row-flex > [class*='col-'] {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.m {
|
||||
text-align: center;
|
||||
}
|
||||
.val_box {
|
||||
width:75% !important;
|
||||
}
|
||||
|
||||
.setstatic {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@@ -3,6 +3,7 @@
|
||||
</div>
|
||||
<div class='col-xs-6'>
|
||||
<h3><%= node.vanityname %></h3>
|
||||
<h3><%= channels["transferstation.auto_manual"].value %> Mode</h3>
|
||||
</div>
|
||||
<div class='col-xs-2'>
|
||||
<h3><%= channels["transferstation.cmd_run"].value %></h3>
|
||||
|
||||
@@ -7,8 +7,8 @@
|
||||
</div>
|
||||
<div class="col-md-2 box-me">
|
||||
<div class="m levelSensor">
|
||||
<h3>Pond Level</h3>
|
||||
<h3>LT<%= i %>1</h3>
|
||||
<h3 class="uppercase">Pond Level</h3>
|
||||
<h3 class="uppercase">LT<%= i %>1</h3>
|
||||
<hr />
|
||||
<br />
|
||||
<p><span data-valueupdate="lt<%=i %>1_level" data-refreshonupdate=true>
|
||||
@@ -19,8 +19,8 @@
|
||||
|
||||
<div class="col-md-2 box-me">
|
||||
<div class="m chargePump">
|
||||
<h3>Charge Pump</h3>
|
||||
<h3>MC<%= i %>1</h3>
|
||||
<h3 class="uppercase">Charge Pump</h3>
|
||||
<h3 class="uppercase">MC<%= i %>1</h3>
|
||||
<hr />
|
||||
<br />
|
||||
<p><span data-valueupdate="mc<%=i %>1_frequency" data-refreshonupdate=true>
|
||||
@@ -34,8 +34,8 @@
|
||||
|
||||
<div class="col-md-2 box-me">
|
||||
<div class="m boosterPumpIntakePressure">
|
||||
<h3>BP Intake</h3>
|
||||
<h3>PT<%= i %>1</h3>
|
||||
<h3 class="uppercase">BP Intake</h3>
|
||||
<h3 class="uppercase">PT<%= i %>1</h3>
|
||||
<hr />
|
||||
<br />
|
||||
<p><span data-valueupdate="pt<%=i %>1_pressure" data-refreshonupdate=true>
|
||||
@@ -46,8 +46,8 @@
|
||||
|
||||
<div class="col-md-2 box-me">
|
||||
<div class="m boosterPump">
|
||||
<h3>Charge Pump</h3>
|
||||
<h3>MC<%= i %>1</h3>
|
||||
<h3 class="uppercase">Charge Pump</h3>
|
||||
<h3 class="uppercase">MC<%= i %>1</h3>
|
||||
<hr />
|
||||
<br />
|
||||
<p><span data-valueupdate="mc<%=i %>2_frequency" data-refreshonupdate=true>
|
||||
@@ -61,8 +61,8 @@
|
||||
|
||||
<div class="col-md-2 box-me">
|
||||
<div class="m boosterPumpDischargePressure">
|
||||
<h3>BP Discharge</h3>
|
||||
<h3>PT<%= i %>2</h3>
|
||||
<h3 class="uppercase">BP Discharge</h3>
|
||||
<h3 class="uppercase">PT<%= i %>2</h3>
|
||||
<hr />
|
||||
<br />
|
||||
<p><span data-valueupdate="pt<%=i %>2_pressure" data-refreshonupdate=true>
|
||||
@@ -73,8 +73,8 @@
|
||||
|
||||
<div class="col-md-2 box-me">
|
||||
<div class="m flowSensor">
|
||||
<h3>Flow</h3>
|
||||
<h3>FT<%= i %>1</h3>
|
||||
<h3 class="uppercase">Flow</h3>
|
||||
<h3 class="uppercase">FT<%= i %>1</h3>
|
||||
<hr />
|
||||
<br />
|
||||
<p><span data-valueupdate="ft<%=i %>1_flow" data-refreshonupdate=true>
|
||||
@@ -87,7 +87,7 @@
|
||||
<div class="row row-flex">
|
||||
<div class="col-md-2 box-me">
|
||||
<div class="m priority">
|
||||
<h3>Priority</h3>
|
||||
<h3 class="uppercase">Priority</h3>
|
||||
<hr />
|
||||
<br />
|
||||
|
||||
@@ -115,9 +115,69 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-2 box-me">
|
||||
<div class="m boosterPumpIntakePressureTarget">
|
||||
<h3 class="uppercase">BP Pressure SP</h3>
|
||||
<hr />
|
||||
<br />
|
||||
|
||||
<div class="entry-top-level" id="boosterPumpIntakePressureTarget">
|
||||
<form class="form-inline">
|
||||
<div class="form-group">
|
||||
<input class="form-control val_box"
|
||||
type="number"
|
||||
step="any"
|
||||
value="<%=channels['transferstation.booster_pump_intake_target_' + i].value %>">
|
||||
</div>
|
||||
<a href="#"
|
||||
data-confirm-message="Are you sure you want to do this?"
|
||||
data-refreshpause="1"
|
||||
data-command=""
|
||||
data-staticsend="{'tag': 'par_BoosterPumpIntakePressure[<%=i %>]', 'val': <%=channels['transferstation.booster_pump_intake_target_' + i].value %>}"
|
||||
data-channelId="<%= channels["transferstation.writeplctag"].channelId %>"
|
||||
data-techname="<%=channels["transferstation.writeplctag"].techName %>"
|
||||
data-name="<%= channels["transferstation.writeplctag"].name%>"
|
||||
data-nodechannelcurrentId="<%= channels["transferstation.writeplctag"].nodechannelcurrentId %>"
|
||||
id="<%= channels["transferstation.writeplctag"].channelId %>"
|
||||
class="btn btn-large btn-theme animated setstatic material-icons">send</a>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-2 box-me">
|
||||
<div class="m flowTarget">
|
||||
<h3 class="uppercase">Flow Target</h3>
|
||||
<hr />
|
||||
<br />
|
||||
|
||||
<div class="entry-top-level" id="flowTarget">
|
||||
<form class="form-inline">
|
||||
<div class="form-group">
|
||||
<input class="form-control val_box"
|
||||
type="number"
|
||||
step="any"
|
||||
value="<%=channels['transferstation.flow_target_' + i].value %>">
|
||||
</div>
|
||||
<a href="#"
|
||||
data-confirm-message="Are you sure you want to do this?"
|
||||
data-refreshpause="1"
|
||||
data-command=""
|
||||
data-staticsend="{'tag': 'par_SystemFlowrate[<%=i %>]', 'val': <%=channels['transferstation.flow_target_' + i].value %>}"
|
||||
data-channelId="<%= channels["transferstation.writeplctag"].channelId %>"
|
||||
data-techname="<%=channels["transferstation.writeplctag"].techName %>"
|
||||
data-name="<%= channels["transferstation.writeplctag"].name%>"
|
||||
data-nodechannelcurrentId="<%= channels["transferstation.writeplctag"].nodechannelcurrentId %>"
|
||||
id="<%= channels["transferstation.writeplctag"].channelId %>"
|
||||
class="btn btn-large btn-theme animated setstatic material-icons">send</a>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-2 box-me">
|
||||
<div class="m getHelpFrequency">
|
||||
<h3>Get Help Freq.</h3>
|
||||
<h3 class="uppercase">Get Help Freq.</h3>
|
||||
<hr />
|
||||
<br />
|
||||
|
||||
@@ -147,7 +207,7 @@
|
||||
|
||||
<div class="col-md-2 box-me">
|
||||
<div class="m takeoverFrequency">
|
||||
<h3>Takeover Freq.</h3>
|
||||
<h3 class="uppercase">Takeover Freq.</h3>
|
||||
<hr />
|
||||
<br />
|
||||
|
||||
@@ -175,11 +235,45 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="col-md-2 box-me">
|
||||
<div class="m takeoverFrequency">
|
||||
<h3 class="uppercase">Manual Mode</h3>
|
||||
<hr />
|
||||
<br />
|
||||
<% if (channels['transferstation.auto_manual'].value === "Manual"){ %>
|
||||
<a href="#"
|
||||
data-confirm-message="Are you sure you want to remotely start the transfer station?"
|
||||
data-refreshpause="1"
|
||||
data-command=""
|
||||
data-staticsend="{'tag': 'cmd_ManualStart[<%= i %>]', 'val': 1}"
|
||||
data-channelId="<%= channels["transferstation.writeplctag"].channelId %>"
|
||||
data-techname="<%=channels["transferstation.writeplctag"].techName %>"
|
||||
data-name="<%= channels["transferstation.writeplctag"].name%>"
|
||||
data-nodechannelcurrentId="<%= channels["transferstation.writeplctag"].nodechannelcurrentId %>"
|
||||
id="<%= channels["transferstation.writeplctag"].channelId %>"
|
||||
class="btn btn-large btn-success animated confirmstatic"
|
||||
style="width:90%;">
|
||||
Start</a>
|
||||
<br />
|
||||
<a href="#"
|
||||
data-confirm-message="Are you sure you want to remotely start the transfer station?"
|
||||
data-refreshpause="1"
|
||||
data-command=""
|
||||
data-staticsend="{'tag': 'cmd_ManualStop[<%= i %>]', 'val': 1}"
|
||||
data-channelId="<%= channels["transferstation.writeplctag"].channelId %>"
|
||||
data-techname="<%=channels["transferstation.writeplctag"].techName %>"
|
||||
data-name="<%= channels["transferstation.writeplctag"].name%>"
|
||||
data-nodechannelcurrentId="<%= channels["transferstation.writeplctag"].nodechannelcurrentId %>"
|
||||
id="<%= channels["transferstation.writeplctag"].channelId %>"
|
||||
class="btn btn-large btn-danger animated confirmstatic"
|
||||
style="width:90%;margin-top:10px;">
|
||||
Stop</a>
|
||||
<% } else { %>
|
||||
<p>Commands not available in auto mode.</p>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<% } %>
|
||||
<% } %>
|
||||
|
||||
@@ -206,7 +300,7 @@ $('.val_box').each(function(topLevel){
|
||||
</script>
|
||||
|
||||
<style>
|
||||
h3 {
|
||||
.uppercase {
|
||||
text-transform: uppercase;
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
@@ -245,4 +339,8 @@ $('.val_box').each(function(topLevel){
|
||||
.setstatic {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 1.25em;
|
||||
}
|
||||
</style>
|
||||
|
||||
143
POCloud/Totals.html
Normal file
143
POCloud/Totals.html
Normal file
@@ -0,0 +1,143 @@
|
||||
<div class="row">
|
||||
<div class="col-md-12" style="text-align:center">
|
||||
<h1>Flow Totals</h1>
|
||||
</div>
|
||||
<div class="col-xs-6 text-center">
|
||||
<h2>Flow Today</h2>
|
||||
<div class="gauge-box">
|
||||
<div data-labelheight="10"
|
||||
style="height: 170px; background: transparent; margin: 0 auto;"
|
||||
id="gauge-flow_total_today"
|
||||
data-chart="solidgauge"
|
||||
data-nodename="transferstation.flow_total_today"
|
||||
data-units="BBL"
|
||||
data-min="0"
|
||||
data-max="100000"
|
||||
data-decimalplaces="2"
|
||||
data-colors="0.1:#DF5353,0.5:#DDDF0D,0.9:#55BF3B"
|
||||
data-valuefontsize="18px">
|
||||
</div>
|
||||
<div class- "timestamp-box">
|
||||
<a href="#" data-channelId="<%= channels["transferstation.flow_total_today"].channelId %>" class="data-table" title="Download Channel History">
|
||||
<i class="fa fa-download"></i>
|
||||
</a>
|
||||
</div>
|
||||
<span data-timeupdate="flow_total_today">
|
||||
<%= channels["transferstation.flow_total_today"].timestamp %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 text-center">
|
||||
<h2>Flow Yesterday</h2>
|
||||
<div class="gauge-box">
|
||||
<div data-labelheight="10"
|
||||
style="height: 170px; background: transparent; margin: 0 auto;"
|
||||
id="gauge-flow_total_yesterday"
|
||||
data-chart="solidgauge"
|
||||
data-nodename="transferstation.flow_total_yesterday"
|
||||
data-units="BBL"
|
||||
data-min="0"
|
||||
data-max="100000"
|
||||
data-decimalplaces="2"
|
||||
data-colors="0.1:#DF5353,0.5:#DDDF0D,0.9:#55BF3B"
|
||||
data-valuefontsize="18px">
|
||||
</div>
|
||||
<div class- "timestamp-box">
|
||||
<a href="#" data-channelId="<%= channels["transferstation.flow_total_yesterday"].channelId %>" class="data-table" title="Download Channel History">
|
||||
<i class="fa fa-download"></i>
|
||||
</a>
|
||||
</div>
|
||||
<span data-timeupdate="flow_total_yesterday">
|
||||
<%= channels["transferstation.flow_total_yesterday"].timestamp %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class='col-xs-12'>
|
||||
<div style="height:300px"
|
||||
id="chart-flow_total_yesterday"
|
||||
data-chart="chart"
|
||||
data-nodename1="transferstation.flow_total_yesterday"
|
||||
data-datalabel1="Flow Total (Yesterday)"
|
||||
data-daysofhistory="7"
|
||||
data-chartlabel="Flow Total"
|
||||
data-ylabel=""
|
||||
data-xlabel="Date"
|
||||
data-units=" BBL"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<hr />
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12" style="text-align:center">
|
||||
<h1>Energy Totals</h1>
|
||||
</div>
|
||||
<div class="col-xs-6 text-center">
|
||||
<h2>Energy Today</h2>
|
||||
<div class="gauge-box">
|
||||
<div data-labelheight="10"
|
||||
style="height: 170px; background: transparent; margin: 0 auto;"
|
||||
id="gauge-energy_total_today"
|
||||
data-chart="solidgauge"
|
||||
data-nodename="transferstation.energy_total_today"
|
||||
data-units="kWh"
|
||||
data-min="0"
|
||||
data-max="100000"
|
||||
data-decimalplaces="2"
|
||||
data-colors="0.1:#DF5353,0.5:#DDDF0D,0.9:#55BF3B"
|
||||
data-valuefontsize="18px">
|
||||
</div>
|
||||
<div class- "timestamp-box">
|
||||
<a href="#" data-channelId="<%= channels["transferstation.energy_total_today"].channelId %>" class="data-table" title="Download Channel History">
|
||||
<i class="fa fa-download"></i>
|
||||
</a>
|
||||
</div>
|
||||
<span data-timeupdate="energy_total_today">
|
||||
<%= channels["transferstation.energy_total_today"].timestamp %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 text-center">
|
||||
<h2>Energy Yesterday</h2>
|
||||
<div class="gauge-box">
|
||||
<div data-labelheight="10"
|
||||
style="height: 170px; background: transparent; margin: 0 auto;"
|
||||
id="gauge-energy_total_yesterday"
|
||||
data-chart="solidgauge"
|
||||
data-nodename="transferstation.energy_total_yesterday"
|
||||
data-units="kWh"
|
||||
data-min="0"
|
||||
data-max="100000"
|
||||
data-decimalplaces="2"
|
||||
data-colors="0.1:#DF5353,0.5:#DDDF0D,0.9:#55BF3B"
|
||||
data-valuefontsize="18px">
|
||||
</div>
|
||||
<div class- "timestamp-box">
|
||||
<a href="#" data-channelId="<%= channels["transferstation.energy_total_yesterday"].channelId %>" class="data-table" title="Download Channel History">
|
||||
<i class="fa fa-download"></i>
|
||||
</a>
|
||||
</div>
|
||||
<span data-timeupdate="energy_total_yesterday">
|
||||
<%= channels["transferstation.energy_total_yesterday"].timestamp %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class='col-xs-12'>
|
||||
<div style="height:300px"
|
||||
id="chart-flow_total_today"
|
||||
data-chart="chart"
|
||||
data-nodename1="transferstation.energy_total_yesterday"
|
||||
data-datalabel1="Energy Total (Yesterday)"
|
||||
data-daysofhistory="7"
|
||||
data-chartlabel="Energy Total"
|
||||
data-ylabel=""
|
||||
data-xlabel="Date"
|
||||
data-units=" kWh"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
Reference in New Issue
Block a user