Files
Multi-Sensor/POCloud/html-templates/Inputs0-1.html
2018-08-17 14:54:50 -05:00

454 lines
24 KiB
HTML

<div class='row'>
<div class='col-xs-12'>
<div style="height:300px"
id="chart-overview"
data-chart="chart"
data-nodename1="multisensor.an0val"
data-datalabel1="Analog 0 Value"
data-nodename2="multisensor.an1val"
data-datalabel2="Analog 1 Value"
<% if (channels["multisensor.an0ispond"].value === "true"){ %>
data-nodename3="multisensor.pond0volume"
data-datalabel3="Pond 0 Volume"
<% } %>
<% if (channels["multisensor.an1ispond"].value === "true"){ %>
data-nodename4="multisensor.pond1volume"
data-datalabel4="Pond 1 Volume"
<% } %>
data-daysofhistory="2"
data-chartlabel="Last 48 Hours"
data-ylabel=""
data-xlabel="Date"
data-units="">
</div>
</div>
</div>
<div class="row" style="margin-bottom: 10px">
<div class="col-md-6 align-center">
<h2>Input 0</h2>
<% if (channels["multisensor.an0ispond"].value === "true"){ %>
<a href="#"
data-confirm-message="Are you sure you want to do this?"
data-refreshpause="1"
data-command=""
data-staticsend="{'tag': 'input0_cfg.isPondLevel', 'value': 0}"
data-channelId="<%= channels["multisensor.writeplctag"].channelId %>"
data-techname="<%=channels["multisensor.writeplctag"].techName %>"
data-name="<%= channels["multisensor.writeplctag"].name%>"
data-nodechannelcurrentId="<%= channels["multisensor.writeplctag"].nodechannelcurrentId %>"
id="<%= channels["multisensor.writeplctag"].channelId %>"
class="btn btn-large btn-danger animated setstatic">Disable Pond Volume</a>
<% } else { %>
<a href="#"
data-confirm-message="Are you sure you want to do this?"
data-refreshpause="1"
data-command=""
data-staticsend="{'tag': 'input0_cfg.isPondLevel', 'value': 1}"
data-channelId="<%= channels["multisensor.writeplctag"].channelId %>"
data-techname="<%=channels["multisensor.writeplctag"].techName %>"
data-name="<%= channels["multisensor.writeplctag"].name%>"
data-nodechannelcurrentId="<%= channels["multisensor.writeplctag"].nodechannelcurrentId %>"
id="<%= channels["multisensor.writeplctag"].channelId %>"
class="btn btn-large btn-success animated setstatic">Enable Pond Volume</a>
<% } %>
<hr style="margin-top: 10px; margin-bottom:10px;" />
<h2>Scaling</h2>
<form class="form-inline">
<div class="form-group">
<label for="min-scaling-0">Min Value</label>
<input class="form-control setpoint"
id="min-scaling-0"
type="number"
step="0.1"
value="<%= channels["multisensor.an0min"].value %>" />
<a href="#"
data-confirm-message="Are you sure you want to do this?"
data-refreshpause="1"
data-command=""
data-staticsend="{'tag': 'input0_cfg.scalingConfig.euMin', 'value': 4.0}"
data-channelId="<%= channels["multisensor.writeplctag"].channelId %>"
data-techname="<%=channels["multisensor.writeplctag"].techName %>"
data-name="<%= channels["multisensor.writeplctag"].name%>"
data-nodechannelcurrentId="<%= channels["multisensor.writeplctag"].nodechannelcurrentId %>"
id="<%= channels["multisensor.an0min"].channelId %>"
class="btn btn-large btn-theme animated setstatic material-icons">send</a>
</div>
</form>
<form class="form-inline">
<div class="form-group">
<label for="max-scaling-0">Max Value</label>
<input class="form-control setpoint"
id="max-scaling-0"
type="number"
step="0.1"
value="<%= channels["multisensor.an0max"].value %>" />
<a href="#"
data-confirm-message="Are you sure you want to do this?"
data-refreshpause="1"
data-command=""
data-staticsend="{'tag': 'input0_cfg.scalingConfig.euMax', 'value': 20.0}"
data-channelId="<%= channels["multisensor.writeplctag"].channelId %>"
data-techname="<%=channels["multisensor.writeplctag"].techName %>"
data-name="<%= channels["multisensor.writeplctag"].name%>"
data-nodechannelcurrentId="<%= channels["multisensor.writeplctag"].nodechannelcurrentId %>"
id="<%= channels["multisensor.an0max"].channelId %>"
class="btn btn-large btn-theme animated setstatic material-icons">send</a>
</div>
</form>
<hr style="margin-top: 10px; margin-bottom:10px;" />
<form class="form-inline">
<div class="form-group">
<label for="name-0">Name</label>
<input class="form-control setpoint"
id="name-0"
type="text"
value="<%= channels["multisensor.an0name"].value %>" />
<a href="#"
data-confirm-message="Are you sure you want to do this?"
data-refreshpause="1"
data-command=""
data-staticsend="<%= channels["multisensor.an0name"].value %>"
data-channelId="<%= channels["multisensor.an0name"].channelId %>"
data-techname="<%=channels["multisensor.an0name"].techName %>"
data-name="<%= channels["multisensor.an0name"].name%>"
data-nodechannelcurrentId="<%= channels["multisensor.an0name"].nodechannelcurrentId %>"
id="<%= channels["multisensor.an0name"].channelId %>"
class="btn btn-large btn-theme animated setstatic material-icons">send</a>
</div>
</form>
<hr style="margin-top: 10px; margin-bottom:10px;" />
<form class="form-inline">
<div class="form-group">
<label for="units-0">Units</label>
<input class="form-control setpoint"
id="units-0"
type="text"
value="<%= channels["multisensor.an0units"].value %>" />
<a href="#"
data-confirm-message="Are you sure you want to do this?"
data-refreshpause="1"
data-command=""
data-staticsend="<%= channels["multisensor.an0units"].value %>"
data-channelId="<%= channels["multisensor.an0units"].channelId %>"
data-techname="<%=channels["multisensor.an0units"].techName %>"
data-name="<%= channels["multisensor.an0units"].name%>"
data-nodechannelcurrentId="<%= channels["multisensor.an0units"].nodechannelcurrentId %>"
id="<%= channels["multisensor.an0units"].channelId %>"
class="btn btn-large btn-theme animated setstatic material-icons">send</a>
</div>
</form>
</div>
<div class="col-md-6 align-center">
<h2>Input 1</h2>
<% if (channels["multisensor.an1ispond"].value === "true"){ %>
<a href="#"
data-confirm-message="Are you sure you want to do this?"
data-refreshpause="1"
data-command=""
data-staticsend="{'tag': 'input1_cfg.isPondLevel', 'value': 0}"
data-channelId="<%= channels["multisensor.writeplctag"].channelId %>"
data-techname="<%=channels["multisensor.writeplctag"].techName %>"
data-name="<%= channels["multisensor.writeplctag"].name%>"
data-nodechannelcurrentId="<%= channels["multisensor.writeplctag"].nodechannelcurrentId %>"
id="<%= channels["multisensor.writeplctag"].channelId %>"
class="btn btn-large btn-danger animated setstatic">Disable Pond Volume</a>
<% } else { %>
<a href="#"
data-confirm-message="Are you sure you want to do this?"
data-refreshpause="1"
data-command=""
data-staticsend="{'tag': 'input1_cfg.isPondLevel', 'value': 1}"
data-channelId="<%= channels["multisensor.writeplctag"].channelId %>"
data-techname="<%=channels["multisensor.writeplctag"].techName %>"
data-name="<%= channels["multisensor.writeplctag"].name%>"
data-nodechannelcurrentId="<%= channels["multisensor.writeplctag"].nodechannelcurrentId %>"
id="<%= channels["multisensor.writeplctag"].channelId %>"
class="btn btn-large btn-success animated setstatic">Enable Pond Volume</a>
<% } %>
<hr style="margin-top: 10px; margin-bottom:10px;" />
<h2>Scaling</h2>
<form class="form-inline">
<div class="form-group">
<label for="min-scaling-1">Min Value</label>
<input class="form-control setpoint"
id="min-scaling-1"
type="number"
step="0.1"
value="<%= channels["multisensor.an1min"].value %>" />
<a href="#"
data-confirm-message="Are you sure you want to do this?"
data-refreshpause="1"
data-command=""
data-staticsend="{'tag': 'input1_cfg.scalingConfig.euMin', 'value': 4.0}"
data-channelId="<%= channels["multisensor.writeplctag"].channelId %>"
data-techname="<%=channels["multisensor.writeplctag"].techName %>"
data-name="<%= channels["multisensor.writeplctag"].name%>"
data-nodechannelcurrentId="<%= channels["multisensor.writeplctag"].nodechannelcurrentId %>"
id="<%= channels["multisensor.an1min"].channelId %>"
class="btn btn-large btn-theme animated setstatic material-icons">send</a>
</div>
</form>
<form class="form-inline">
<div class="form-group">
<label for="max-scaling-1">Max Value</label>
<input class="form-control setpoint"
id="max-scaling-1"
type="number"
step="0.1"
value="<%= channels["multisensor.an1max"].value %>" />
<a href="#"
data-confirm-message="Are you sure you want to do this?"
data-refreshpause="1"
data-command=""
data-staticsend="{'tag': 'input1_cfg.scalingConfig.euMax', 'value': 20.0}"
data-channelId="<%= channels["multisensor.writeplctag"].channelId %>"
data-techname="<%=channels["multisensor.writeplctag"].techName %>"
data-name="<%= channels["multisensor.writeplctag"].name%>"
data-nodechannelcurrentId="<%= channels["multisensor.writeplctag"].nodechannelcurrentId %>"
id="<%= channels["multisensor.an1max"].channelId %>"
class="btn btn-large btn-theme animated setstatic material-icons">send</a>
</div>
</form>
<hr style="margin-top: 10px; margin-bottom:10px;" />
<form class="form-inline">
<div class="form-group">
<label for="name-1">Name</label>
<input class="form-control setpoint"
id="name-1"
type="text"
value="<%= channels["multisensor.an1name"].value %>" />
<a href="#"
data-confirm-message="Are you sure you want to do this?"
data-refreshpause="1"
data-command=""
data-staticsend="<%= channels["multisensor.an1name"].value %>"
data-channelId="<%= channels["multisensor.an1name"].channelId %>"
data-techname="<%=channels["multisensor.an1name"].techName %>"
data-name="<%= channels["multisensor.an1name"].name%>"
data-nodechannelcurrentId="<%= channels["multisensor.an1name"].nodechannelcurrentId %>"
id="<%= channels["multisensor.an1name"].channelId %>"
class="btn btn-large btn-theme animated setstatic material-icons">send</a>
</div>
</form>
<hr style="margin-top: 10px; margin-bottom:10px;" />
<form class="form-inline">
<div class="form-group">
<label for="units-1">Units</label>
<input class="form-control setpoint"
id="units-1"
type="text"
value="<%= channels["multisensor.an1units"].value %>" />
<a href="#"
data-confirm-message="Are you sure you want to do this?"
data-refreshpause="1"
data-command=""
data-staticsend="<%= channels["multisensor.an1units"].value %>"
data-channelId="<%= channels["multisensor.an1units"].channelId %>"
data-techname="<%=channels["multisensor.an1units"].techName %>"
data-name="<%= channels["multisensor.an1units"].name%>"
data-nodechannelcurrentId="<%= channels["multisensor.an1units"].nodechannelcurrentId %>"
id="<%= channels["multisensor.an1units"].channelId %>"
class="btn btn-large btn-theme animated setstatic material-icons">send</a>
</div>
</form>
</div>
</div>
<hr />
<div class="row row-flex">
<% if (channels["multisensor.an0ispond"].value === "true") { %>
<div class="col-xs-6">
<h2>Pond 0 Calibration</h2>
<table id="calibration-data-table-0" class="table">
<thead>
<tr>
<th>Level (Ft.)</th>
<th>Volume</th>
<th></th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<% } %>
<% if (channels["multisensor.an1ispond"].value === "true") { %>
<div class="col-xs-6">
<h2>Pond 1 Calibration</h2>
<table id="calibration-data-table-1" class="table">
<thead>
<tr>
<th>Level (Ft.)</th>
<th>Volume</th>
<th></th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<% } %>
</div>
<hr />
<% if (channels["multisensor.an0ispond"].value === "true" || channels["multisensor.an1ispond"].value === "true") { %>
<div class="row pad15">
<div class="col-md-12 entry-top-level" id="new-entry">
<h2>Add a new Calibration Point</h2>
<form>
<div class="form-group">
<label for="input-select">Pond Number</label>
<select class="form-control" id="input-select">
<option value=0 >0</option>
<option value=1 >1</option>
</select>
</div>
<div class="form-group">
<label for="height-box">Height</label>
<input class="form-control height_box"
id="height-box"
type="number"
step="any"
value="0">
</div>
<div class="form-group">
<label for="volume-box">Volume</label>
<input class="form-control volume_box"
id="volume-box"
type="number"
step="any"
value="0">
</div>
<a href="#"
data-confirm-message="Are you sure you want to do this?"
data-refreshpause="1"
data-command=""
data-staticsend="{'input':0, 'height':0.0, 'volume':0.0}"
data-channelId="<%= channels["multisensor.addcalibrationpoint"].channelId %>"
data-techname="<%=channels["multisensor.addcalibrationpoint"].techName %>"
data-name="<%= channels["multisensor.addcalibrationpoint"].name%>"
data-nodechannelcurrentId="<%= channels["multisensor.addcalibrationpoint"].nodechannelcurrentId %>"
id="<%= channels["multisensor.addcalibrationpoint"].channelId %>"
class="btn btn-large btn-theme animated setstatic material-icons">send</a>
</form>
</div>
</div>
<% } %>
<script type="text/javascript">
String.prototype.replaceAll = function(search, replacement) {
var target = this;
return target.replace(new RegExp(search, 'g'), replacement);
};
var config0raw = "<%= channels["multisensor.pond0calibration"].value %>";
var config1raw = "<%= channels["multisensor.pond1calibration"].value %>";
var config0 = JSON.parse(config0raw.replaceAll("'", '"'));
var config1 = JSON.parse(config1raw.replaceAll("'", '"'));
var table0Rows = [];
var table1Rows = [];
for (var i = 0; i < config0.length; i++){
var ptIndex = i + 1;
var thisHtml = "<tr><td>" + config0[i].height + "</td><td>" + config0[i].volume + '</td><td><a href="#" data-confirm-message="Are you sure you want to do this?" data-refreshpause="1" data-command="" data-staticsend="{\'input\': 0, \'point\': '+ ptIndex +'}" data-channelId="<%= channels["multisensor.deletecalibrationpoint"].channelId %>" data-techname="<%=channels["multisensor.deletecalibrationpoint"].techName %>" data-name="<%= channels["multisensor.deletecalibrationpoint"].name%>" data-nodechannelcurrentId="<%= channels["multisensor.deletecalibrationpoint"].nodechannelcurrentId %>" id="<%= channels["multisensor.deletecalibrationpoint"].channelId %>" class="btn btn-large btn-theme animated setstatic">Delete</a></tr>';
table0Rows.push(thisHtml);
}
$("#calibration-data-table-0 > tbody").html(table0Rows);
for (var i = 0; i < config1.length; i++){
var ptIndex = i + 1;
var thisHtml = "<tr><td>" + config1[i].height + "</td><td>" + config1[i].volume + '</td><td><a href="#" data-confirm-message="Are you sure you want to do this?" data-refreshpause="1" data-command="" data-staticsend="{\'input\': 1, \'point\': '+ ptIndex +'}" data-channelId="<%= channels["multisensor.deletecalibrationpoint"].channelId %>" data-techname="<%=channels["multisensor.deletecalibrationpoint"].techName %>" data-name="<%= channels["multisensor.deletecalibrationpoint"].name%>" data-nodechannelcurrentId="<%= channels["multisensor.deletecalibrationpoint"].nodechannelcurrentId %>" id="<%= channels["multisensor.deletecalibrationpoint"].channelId %>" class="btn btn-large btn-theme animated setstatic">Delete</a></tr>';
table1Rows.push(thisHtml);
}
$("#calibration-data-table-1 > tbody").html(table1Rows);
$("#height-box").change(function(){
var currentNewPoint = JSON.parse($("#<%= channels["multisensor.addcalibrationpoint"].channelId %>").attr('data-staticsend').replaceAll("'", '"'));
currentNewPoint['height'] = $("#height-box").val();
$("#<%= channels["multisensor.addcalibrationpoint"].channelId %>").attr('data-staticsend', JSON.stringify(currentNewPoint).replaceAll('"', "'"));
})
$("#volume-box").change(function(){
var currentNewPoint = JSON.parse($("#<%= channels["multisensor.addcalibrationpoint"].channelId %>").attr('data-staticsend').replaceAll("'", '"'));
currentNewPoint['volume'] = $("#volume-box").val();
$("#<%= channels["multisensor.addcalibrationpoint"].channelId %>").attr('data-staticsend', JSON.stringify(currentNewPoint).replaceAll('"', "'"));
})
$("#input-select").change(function(){
var currentNewPoint = JSON.parse($("#<%= channels["multisensor.addcalibrationpoint"].channelId %>").attr('data-staticsend').replaceAll("'", '"'));
currentNewPoint['input'] = $("#input-select").val();
$("#<%= channels["multisensor.addcalibrationpoint"].channelId %>").attr('data-staticsend', JSON.stringify(currentNewPoint).replaceAll('"', "'"));
})
$("#min-scaling-0").change(function(){
$("#<%= channels["multisensor.an0min"].channelId %>").attr('data-staticsend', "{'tag': 'input0_cfg.scalingConfig.euMin', 'value': "+ $("#min-scaling-0").val() +"}");
})
$("#max-scaling-0").change(function(){
$("#<%= channels["multisensor.an0max"].channelId %>").attr('data-staticsend', "{'tag': 'input0_cfg.scalingConfig.euMax', 'value': "+ $("#max-scaling-0").val() +"}");
})
$("#name-0").change(function(){
$("#<%= channels["multisensor.an0name"].channelId %>").attr('data-staticsend', $("#name-0").val());
})
$("#units-0").change(function(){
$("#<%= channels["multisensor.an0units"].channelId %>").attr('data-staticsend', $("#units-0").val());
})
$("#min-scaling-1").change(function(){
$("#<%= channels["multisensor.an1min"].channelId %>").attr('data-staticsend', "{'tag': 'input1_cfg.scalingConfig.euMin', 'value': "+ $("#min-scaling-1").val() +"}");
})
$("#max-scaling-1").change(function(){
$("#<%= channels["multisensor.an1max"].channelId %>").attr('data-staticsend', "{'tag': 'input1_cfg.scalingConfig.euMax', 'value': "+ $("#max-scaling-1").val() +"}");
})
$("#name-1").change(function(){
$("#<%= channels["multisensor.an1name"].channelId %>").attr('data-staticsend', $("#name-1").val());
})
$("#units-1").change(function(){
$("#<%= channels["multisensor.an1units"].channelId %>").attr('data-staticsend', $("#units-1").val());
})
</script>
<style>
.align-center {
text-align: center;
}
</style>