promiset/litsimaja
1
0
Fork 0
forked from andreeuuetoa/litsimaja
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add tempo, live status

Browse Source
This commit is contained in:
siinus
2021-03-19 19:00:41 +02:00
parent 57559ea70a
commit 76759f986b
8 changed files with 143 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
pyleds/templates/custom.css
View File

@@ -27,4 +27,12 @@ select {
.spacer-row {
height: 2rem;
}
}
button.region {
padding: 0 15;
}
button.region_off {
background-color: gray !important
}

34
pyleds/templates/index.html
View File

@@ -21,9 +21,11 @@
show_loading(true);
var http = new XMLHttpRequest();
http.open('GET', url, true);
http.setRequestHeader('accept', 'application/json');
http.onreadystatechange = function() {
if (http.readyState == 4 && http.status == 200) {
show_loading(false);
updateStatus(http.responseText);
}
};
http.send();
@@ -34,6 +36,7 @@
var http = new XMLHttpRequest();
http.open('POST', url, true);
http.setRequestHeader('Content-Type', 'application/json');
http.setRequestHeader('accept', 'application/json');
http.onreadystatechange = function() {
if (http.readyState == 4 && http.status == 200) {
show_loading(false);
@@ -43,6 +46,20 @@
http.send(json);
}
function updateStatus(json) {
let status = JSON.parse(json);
document.getElementById('tempo').value = status.features.tempo.bpm;
let regions = status.features.region;
let regLen = regions.length;
for(i = 0; i < regLen; i++) {
if (regions[i]) {
document.getElementById('region_' + i).classList.remove('region_off');
} else {
document.getElementById('region_' + i).classList.add('region_off');
}
}
}
function getProgramSelection() {
let select = document.getElementById('program');
return select.value;
@@ -81,16 +98,24 @@
<div class="spacer-row"></div>
<div class="container">
<div class="row">
<button onclick="send_get('/status')">get</button>
<button onclick="doInit()">intro</button>
<button onclick="doCancel()">halt</button>
<button onclick="doBlind()">leds off</button>
<label><input type="checkbox" id="looping" /><b> loop</b></label>
<label><input type="checkbox" id="looping" checked/><b> loop</b></label>
</div>
<div class="row">
<input id="tempo" type="number" step="0.1" onchange="send_get('/tempo/set/' + parseFloat(this.value).toFixed(2))" value="{{ status.features.tempo.bpm }}">
<button onclick="send_get('/tempo/sync')">sync</button>
</div>
<div class="row">
<p>Zone switch</p>
{% for region in regions %}
<button onclick="switchRegion({{ region }})">zone {{ region }}</button>
{% set region_off = '' %}
{% if not status.features.region[region] %}
{% set region_off = ' region_off' %}
{% endif %}
<button id="region_{{ region }}" class="region{{ region_off }}" onclick="switchRegion({{ region }})">zone {{ region }}</button>
{% endfor %}
</div>
<div class="row" id='loading' style="visibility: hidden"><b>LOADING!</b></div>
@@ -111,8 +136,9 @@
</div>
<div class="row">
<div class ="one-third column">
<input class="colorpicker" type="color" value="#ff0000" oninput="isChanged(this.value)">
<input id="colorpicker" class="colorpicker" type="color" value="#ff0000" oninput="isChanged(this.value)">
</div>
<button onclick="isChanged(document.getElementById('colorpicker').value)">Set</button>
</div>
</div>
</body>