site-progress-bar/content/operator.md

55 lines
2.4 KiB
Markdown

---
title: Operator Panel
description: This is a page that operates the progress bar
---
This is a page that controls the progress bar's contents.
<script>
function addJS(name) {
var node=document.createElement('script');
node.setAttribute('type','text/javascript');
node.setAttribute('src', name);
document.head.appendChild(node);
}
function addCSS(name) {
var node=document.createElement('link');
node.setAttribute('rel', 'stylesheet');
node.setAttribute('type', 'text/css');
node.setAttribute('href', name);
document.head.appendChild(node);
}
addCSS('/css/control.css');
addJS('/js/sharedWebSocket.js');
addJS('/js/control.js');
var qr;
function keepQrCodeUpdated(){
if(!window.QRCode) setTimeout(keepQrCodeUpdated, 10);
else {
qr = new QRCode(document.getElementById('qrcode'));
qr.makeCode(window.document.location.toString());
}
}
setTimeout(keepQrCodeUpdated, 10);
</script>
## Content
<form class="form" class="black-80 sans-serif w-100" onsubmit="return false;">
<label for="currentValueVisible" class="f6 b db mb1 mt3 sans-serif mid-gray">
Current value
</label>
<input id="currentValueVisible" name="currentValueVisible" type="number" class="w-100 f5 pv3 ph3 bg-light-gray bn" value="0" onkeyup="compareDisplayContent()" onkeydown="compareDisplayContent()" onchange="compareDisplayContent()" step="0.01" readonly>
<input type="hidden" id="currentValue" name="currentValue" style="display: none;" class="lazyInput">
<input type="hidden" id="targetValueVisible" name="targetValueVisible" style="display: none;">
<input type="hidden" id="targetValue" name="targetValue" style="display: none;" class="lazyInput">
<input id="btn-update-internal" type="button" class="w-100 mv2 white pa3 bn hover-shadow hover-bg-black bg-animate bg-black" style="display: none;" value="Send changes to screen" style="cursor: pointer;" onclick="return updateInternalDisplayContent();">
</form>
### Incremental change
<form class="form" class="black-80 sans-serif w-100" onsubmit="doIncrement(); return false;">
<input id="incrementValue" name="incrementValue" type="number" class="w-50 f5 pv3 ph3 bg-light-gray bn unsynced" value="0" step="0.01">
<input id="btn-update-internal" type="button" class="w-40 mv2 white pa3 bn hover-shadow hover-bg-black bg-animate bg-black" value="Increment" style="cursor: pointer;" onclick="return doIncrement();">
</form>