136 lines
4.7 KiB
HTML
136 lines
4.7 KiB
HTML
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Pixelserver Interface</title>
|
|
</head>
|
|
|
|
<body>
|
|
<h1>Andreas <i>DEBUG</i> Interface</h1>
|
|
|
|
<h2>Kommando:</h2>
|
|
<form id='in' onSubmit="return request()">
|
|
<select id="list"></select>
|
|
<input id="args" />
|
|
<button id="execute">Ausführen</button>
|
|
</form>
|
|
|
|
<h2>Intensität:</h2>
|
|
<form id='brightnessform' onSubmit="return setbrightness()">
|
|
<input id="brightness" value=1.0 /><br/>
|
|
<button id="sendbrightness">Setzen</button>
|
|
</form>
|
|
|
|
<h2>Gamma:</h2>
|
|
<form id='gammeform' onSubmit="return setgamma()">
|
|
Rot: <input id="gammar" value=2.8 /><br/>
|
|
Grün: <input id="gammag" value=2.65 /><br/>
|
|
Blau: <input id="gammab" value=2.65 /><br/>
|
|
<button id="sendgamma">Setzen</button>
|
|
</form>
|
|
|
|
<h2>Log:</h2>
|
|
<textarea readonly id='logs' style="width: 500px; height: 500px;"></textarea>
|
|
<script>
|
|
function getRaw(from, callback){
|
|
var xhttp = new XMLHttpRequest();
|
|
xhttp.onreadystatechange = function() {
|
|
if (this.readyState == 4 && this.status == 200) {
|
|
callback(xhttp.responseText);
|
|
}
|
|
};
|
|
xhttp.open("GET", from, true);
|
|
xhttp.send();
|
|
}
|
|
|
|
function getJSON(from, callback){
|
|
getRaw(from, function(text){
|
|
callback(JSON.parse(text));
|
|
});
|
|
}
|
|
|
|
function post(from, data){
|
|
var formdata = new FormData();
|
|
for (var key in data) {
|
|
formdata.append(key, data[key]);
|
|
}
|
|
let xhttp = new XMLHttpRequest();
|
|
xhttp.onreadystatechange = function() {
|
|
if (this.readyState == 4 && this.status == 200) {
|
|
}
|
|
};
|
|
xhttp.open("POST", from, true);
|
|
xhttp.send(formdata);
|
|
}
|
|
|
|
function populateForm(parameters){
|
|
let list = document.getElementById("list");
|
|
|
|
parameters.map ( e => {
|
|
})
|
|
for (var i in parameters) {
|
|
let app = parameters[i];
|
|
let name = app["name"];
|
|
let guiname = app["guiname"];
|
|
let persistent = app["persistent"];
|
|
let element = document.createElement("option");
|
|
element.value = name;
|
|
element.innerHTML = guiname;
|
|
element.dataset.persistent = persistent;
|
|
list.appendChild(element);
|
|
}
|
|
|
|
list.onchange = function(){
|
|
let app = document.getElementById('list');
|
|
let persistent = app.options[app.selectedIndex].dataset.persistent;
|
|
if (persistent == "true"){
|
|
document.getElementById("args").style.display = "none";
|
|
}else{
|
|
document.getElementById("args").style.display = "inline";
|
|
}
|
|
}
|
|
list.onchange();
|
|
document.getElementById("container").style.display = "block";
|
|
}
|
|
|
|
function request(){
|
|
let app = document.getElementById('list');
|
|
let val = app.options[app.selectedIndex].value;
|
|
let parameter = document.getElementById('args').value;
|
|
let url = "/apps/start/" + val;
|
|
post(url, {"param": parameter});
|
|
return false;
|
|
}
|
|
|
|
function setgamma(){
|
|
let r = document.getElementById('gammar').value;
|
|
let g = document.getElementById('gammag').value;
|
|
let b = document.getElementById('gammab').value;
|
|
let url = "/setgamma/" + r+"/"+g+"/"+b;
|
|
getRaw(url, function test(){});
|
|
return false;
|
|
}
|
|
|
|
function setbrightness(){
|
|
let i = document.getElementById('brightness').value;
|
|
let url = "/setbrightness/" + i;
|
|
getRaw(url, function test(){});
|
|
return false;
|
|
}
|
|
|
|
function updateLog(){
|
|
getRaw("/apps/log", function(text){
|
|
document.getElementById('logs').innerText = text;
|
|
});
|
|
}
|
|
updateLog();
|
|
setInterval(updateLog, 1000);
|
|
|
|
getJSON("/apps/list", populateForm);
|
|
|
|
</script>
|
|
</body>
|
|
|
|
|
|
|
|
</html>
|