129 lines
		
	
	
		
			4.4 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			129 lines
		
	
	
		
			4.4 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <html>
 | |
|     <head>
 | |
|         <meta charset="utf-8"> 
 | |
|         <title>Pixelserver Interface</title>
 | |
|     </head>
 | |
|     
 | |
|     <body>
 | |
|         <h1>Andreas <i>DEBUG</i> Interface</h1>
 | |
| 
 | |
|         <h2>Kommando:</h2>
 | |
|         <div id='container' style="display: none;">
 | |
|             <form id='in' onSubmit="return request()">
 | |
|                 <select id="list"></select>
 | |
|                 <input id="args" />
 | |
|                 <button id="execute">Ausführen</button>
 | |
|             </form>
 | |
|         </div>
 | |
| 
 | |
|         <h2>Gamma:</h2>
 | |
|         <div id='container'>
 | |
|             <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>
 | |
|         </div>
 | |
| 
 | |
|         <h2>Log:</h2>
 | |
|         <div id='log'>
 | |
|             <textarea readonly id='logs' style="width: 500px; height: 500px;"></textarea>
 | |
|         </div>
 | |
|         <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 updateLog(){
 | |
|                 getRaw("/apps/log", function(text){
 | |
|                     document.getElementById('logs').innerText = text;
 | |
|                 });
 | |
|             }
 | |
|             updateLog();
 | |
|             setInterval(updateLog, 1000);
 | |
| 
 | |
|             getJSON("/apps/list", populateForm);
 | |
| 
 | |
|         </script>
 | |
|     </body>
 | |
| 
 | |
| 
 | |
| 
 | |
| </html>
 | 
