Files
POC-Java-www/pocwww/templates/setpoints.jinja2
2017-03-09 18:12:18 -06:00

128 lines
4.3 KiB
Django/Jinja

{% extends "layout.jinja2" %}
{% block content %}
<div class="content">
<div class="container">
<div class="row">
<div class="col-xs-12 well" style="text-align:center;">
<h1>Run Mode: <span id="runMode">Loading...</span></h1>
<button class="btn btn-lg btn-warning runModeBtn" data-mode="POC">POC</button>
<button class="btn btn-lg btn-warning runModeBtn" data-mode="MANUAL">Manual</button>
<button class="btn btn-lg btn-warning runModeBtn" data-mode="TIMER">Timer</button>
<br/><br/>
<p>Set by <span id="runModeSetBy">Loading...</span> at <span id="runModeSetTime">Loading...</span>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<h1>POC Setpoints</h1>
<div class="table table-responsive">
<table class="table">
<thead>
<tr>
<td>Name</td>
<td>Value</td>
<td></td>
<td>Stored By</td>
<td>Last Time Stored</td>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<script>
function updateRunMode(data){
$('#runMode').text(runModeToString(data.updated.value));
$('#runModeSetBy').text(data.updated.storedBy);
$('#runModeSetTime').text(data.updated.lastStored);
}
function makeFormForSetpoint(i, s){
if(s.name == "runMode"){
$('#runMode').text(runModeToString(s.value));
$('#runModeSetBy').text(s.storedBy);
$('#runModeSetTime').text(s.lastStored);
return;
}
var row = '<tr>';
row += '<td>' + s.name +'</td>';
row += '<td><input type="number" class="form-control" id="' + s.name + '" value="' + s.value + '"></td>';
row += '<td><button class="btn btn-default setbtn" data-setpoint="'+ s.name + '">Update</button></td>';
row += '<td><input disabled type="text" class="form-control" id="' + s.name + '-storedBy" value="' + s.storedBy + '"></td>';
row += '<td><input disabled type="text" class="form-control" id="' + s.name + '-lastStored" value="' + s.lastStored + '"></td>';
row += '</tr>';
$('tbody').append(row);
}
function runModeToString(rm){
if (rm == 0){
return "POC";
} else if (rm == 1) {
return "MANUAL";
} else if (rm == 2) {
return "TIMER";
}
}
function runModeFromString(rm){
if (rm == "POC"){
return 0;
} else if (rm == "MANUAL") {
return 1;
} else if (rm == "TIMER") {
return 2;
}
}
function updateSingleRow(data){
var name = data.updated.name;
var storedBy = data.updated.storedBy;
var value = data.updated.value;
$("#"+ name).val(value);
}
function getSetpoints(){
$('tbody').empty();
$.get("/json/setpoints", {}, function(data){
$.each(data.setpoints, makeFormForSetpoint);
$('.setbtn').click(function(e){
e.preventDefault();
var setpoint = $(this).data('setpoint');
var value = $("#"+ setpoint).val();
$.post({
dataType: 'json',
data: JSON.stringify({name: setpoint, value: value}),
contentType: "application/json; charset=utf-8",
url: "/json/setpoints",
success: updateSingleRow
});
});
});
}
getSetpoints();
$('.runModeBtn').click(function(e){
e.preventDefault();
var modeStr = $(this).data('mode');
var mode = runModeFromString(modeStr);
$.post({
dataType: 'json',
data: JSON.stringify({mode: mode}),
contentType: "application/json; charset=utf-8",
url: "/json/mode",
success: updateRunMode
});
});
</script>
{% endblock content %}