Improved webinterface
This commit is contained in:
		| @@ -1,2 +0,0 @@ | ||||
| #!/bin/sh | ||||
| youtube-dl --no-progress --output - https://www.pornhub.com/view_video.php?viewkey=${3} -f best | ffmpeg -re -i - -pix_fmt rgb24 -vf "transpose=1,scale=${1}x${2}" -sws_flags bicubic -sws_dither bayer -vcodec rawvideo -f image2pipe - | ||||
| @@ -1,2 +0,0 @@ | ||||
| #!/bin/sh | ||||
| youtube-dl --no-progress --output - https://www.youtube.com/watch?v=${3} -f best[height=360] | ffmpeg -f alsa default -re -i - -pix_fmt rgb24 -vf "transpose=1,scale=${1}x${2}" -sws_flags bicubic -sws_dither bayer -vcodec rawvideo -f image2pipe - | ||||
							
								
								
									
										2
									
								
								apps/youtubedl.sh
									
									
									
									
									
										Executable file
									
								
							
							
						
						
									
										2
									
								
								apps/youtubedl.sh
									
									
									
									
									
										Executable file
									
								
							| @@ -0,0 +1,2 @@ | ||||
| #!/bin/sh | ||||
| youtube-dl --no-progress --output - ${3} -f best[height=360] | ffmpeg -f alsa default -re -i - -pix_fmt rgb24 -vf "transpose=1,scale=${1}x${2}" -sws_flags bicubic -sws_dither bayer -vcodec rawvideo -f image2pipe - | ||||
| @@ -20,8 +20,7 @@ WebPort = 8000 | ||||
|  | ||||
| # first app is always running in IDLE     | ||||
| Apps = [ | ||||
|     {"name": "pixelflut", "cmd": "apps/idle.py", "persistent": True}, | ||||
|     {"guiname": "IDLE", "name": "pixelflut", "cmd": "apps/idle.py", "persistent": True}, | ||||
|     {"guiname": "YoutubeDL", "name": "youtubedl", "cmd": "apps/youtubedl.sh"}, | ||||
|     {"name": "framebuffer", "cmd": ["apps/fbcp", "/dev/fb0"]}, | ||||
|     {"name": "fdtd", "cmd": "apps/main"}, | ||||
|     {"name": "play_youtube", "cmd": "apps/play_youtube.sh"} | ||||
| ] | ||||
|   | ||||
							
								
								
									
										149
									
								
								html/index.html
									
									
									
									
									
								
							
							
						
						
									
										149
									
								
								html/index.html
									
									
									
									
									
								
							| @@ -1,84 +1,113 @@ | ||||
| <html> | ||||
|     <head> | ||||
|         <meta charset="utf-8">  | ||||
| 		<style type="text/css"> | ||||
| 			textarea { | ||||
| 				width: 500px; | ||||
| 				height: 500px; | ||||
| 			} | ||||
|  | ||||
|  | ||||
|  | ||||
| 		</style> | ||||
|         <title>Pixelserver Interface</title> | ||||
|     </head> | ||||
|      | ||||
|  | ||||
|  | ||||
|  | ||||
|     <body> | ||||
| 		<div id='container'> | ||||
| 			<form id='in'> | ||||
|         <h1>Pixelserver</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> | ||||
| 		<div id='log'> | ||||
| 			<textarea id='logs'> | ||||
|  | ||||
| 			</textarea> | ||||
|         <h2>Log:</h2> | ||||
|         <div id='log'> | ||||
|             <textarea id='logs' style="width: 500px; height: 500px;"></textarea> | ||||
|         </div> | ||||
|         <script> | ||||
|  | ||||
| 			function generateInput(parameters){ | ||||
|  			 	let container = document.getElementById('in'); | ||||
|  | ||||
|  			 	let list = document.createElement("select"); | ||||
|  			 	list.id = "list_"; | ||||
|  			 	container.appendChild(list); | ||||
|  			 	 | ||||
|  | ||||
| 	 			//let json = JSON.parse(parameters); | ||||
| 				parameters.map ( e => { | ||||
| 					let element = document.createElement("option"); | ||||
| 					element.value = e; | ||||
| 					element.innerHTML = e; | ||||
| 					list.appendChild(element); | ||||
| 				}) | ||||
|  | ||||
| 				let arguments = document.createElement("input"); | ||||
| 				arguments.id = "args"; | ||||
| 				container.appendChild(arguments); | ||||
|  | ||||
| 				let button = document.createElement("Button"); | ||||
| 				button.innerHTML = "Execute"; | ||||
| 				container.appendChild(button); | ||||
| 				button.onclick = request; | ||||
|  | ||||
|  			 	//container.appendChild(foo); | ||||
|             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) { | ||||
|                         //callback(xhttp.responseText); | ||||
|                     } | ||||
|                 }; | ||||
|                 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; | ||||
|                     console.log(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.querySelector('#list_'); | ||||
|                 let app = document.getElementById('list'); | ||||
|                 let val = app.options[app.selectedIndex].value; | ||||
|                 let parameter = document.getElementById('args').value; | ||||
| 			 	console.log(parameter); | ||||
| 				fetch("/apps/start/" + val + "/" + parameter).then(console.log); | ||||
|  | ||||
|                 let url = "/apps/start/" + val; | ||||
|                 /*if (parameter != ""){ | ||||
|                     url += "/" + parameter; | ||||
|                 }*/ | ||||
|                 post(url, {"param": parameter}); | ||||
|                 //console.log(url); | ||||
|                 //getRaw("GET", url, function(){}); | ||||
|                 return false; | ||||
|             } | ||||
|  | ||||
|             function updateLog(){ | ||||
|                 getRaw("/apps/log", function(text){ | ||||
|                     document.getElementById('logs').innerText = text; | ||||
|                 }); | ||||
|             } | ||||
|  | ||||
| 			//async function initLog(){ | ||||
| 			//	socket = new WebSocket ( "/logs" ); | ||||
| 	    	//	socket.onmessage = function ( evt ) { document.getElementById('logs').innerHTML += evt.data; }; | ||||
| 			//} | ||||
|             /*updateLog(); | ||||
|             setInterval(updateLog, 1000);*/ | ||||
|  | ||||
| 			var sleep = time => new Promise(resolve => setTimeout(resolve, time)) | ||||
| 			var poll = (promiseFn, time) => promiseFn().then( | ||||
|             	sleep(time).then(() => poll(promiseFn, time))) | ||||
| 			poll(() => new Promise(() => fetch("/apps/log").then(res => res.text().then(e => { document.getElementById('logs').innerHTML = e;}))      ), 1000) | ||||
|  | ||||
| 			let apps = fetch("/apps/list").then(res => res.json().then(generateInput)); | ||||
|  | ||||
| 			//generateInput("[ \"bla\", \"foo\", \"baz\" ]"); | ||||
|             getJSON("/apps/list", populateForm); | ||||
|  | ||||
|         </script> | ||||
|     </body> | ||||
|   | ||||
							
								
								
									
										37
									
								
								main.py
									
									
									
									
									
								
							
							
						
						
									
										37
									
								
								main.py
									
									
									
									
									
								
							| @@ -4,7 +4,8 @@ import os | ||||
| import serial | ||||
| import threading | ||||
| import json | ||||
| from bottle import route, run | ||||
| import bottle | ||||
| from bottle import route, run, request, post | ||||
| import time | ||||
| import sys | ||||
| import signal | ||||
| @@ -238,8 +239,7 @@ class AppRunner(threading.Thread): | ||||
|         if self.currentApp in self.persistent_apps.keys(): | ||||
|             self.app = self.persistent_apps[self.currentApp] | ||||
|         else: | ||||
|             persistent = ("persistent" in config.Apps[self.requestedApp].keys() and  | ||||
|                           config.Apps[self.requestedApp]["persistent"]) | ||||
|             persistent = config.Apps[self.requestedApp]["persistent"] | ||||
|          | ||||
|             logging.info("Starting app "+config.Apps[self.requestedApp]["name"]) | ||||
|             cmd = config.Apps[self.requestedApp]["cmd"] | ||||
| @@ -277,6 +277,14 @@ class AppRunner(threading.Thread): | ||||
|  | ||||
|  | ||||
|  | ||||
|  | ||||
| #normalize config | ||||
| for app in config.Apps: | ||||
|     if "persistent" not in app.keys(): | ||||
|         app["persistent"] = False | ||||
|     if "guiname" not in app.keys(): | ||||
|         app["guiname"] = app["name"] | ||||
|  | ||||
| runner = AppRunner() | ||||
| runner.start() | ||||
|  | ||||
| @@ -284,17 +292,31 @@ runner.start() | ||||
| def apps_list(): | ||||
|     s = [] | ||||
|     for app in config.Apps: | ||||
|         s.append(app["name"]) | ||||
|         s.append({ | ||||
|             "name": app["name"], | ||||
|             "guiname": app["guiname"], | ||||
|             "persistent": app["persistent"], | ||||
|         }) | ||||
|     return json.dumps(s) | ||||
|      | ||||
| @route("/apps/start/<name>") | ||||
| def apps_start(name): | ||||
| def apps_start_param(name): | ||||
|     for i in range(len(config.Apps)): | ||||
|         if config.Apps[i]["name"] == name: | ||||
|             runner.requestApp(i) | ||||
|             return "ok" | ||||
|     return "not_found" | ||||
|  | ||||
| @post("/apps/start/<name>") | ||||
| def apps_start_post(name): | ||||
|     param = request.forms.get('param') | ||||
|     for i in range(len(config.Apps)): | ||||
|         if config.Apps[i]["name"] == name: | ||||
|             runner.requestApp(i, param) | ||||
|             return "ok" | ||||
|     return "not_found" | ||||
|      | ||||
|  | ||||
| @route("/apps/start/<name>/<param>") | ||||
| def apps_start(name, param): | ||||
|     for i in range(len(config.Apps)): | ||||
| @@ -315,8 +337,9 @@ def  apps_running(): | ||||
|  | ||||
| @route("/") | ||||
| def index(): | ||||
|     return open("html/index.html").read() | ||||
|     return bottle.static_file("index.html", root='html') | ||||
|     #return open("html/index.html").read() | ||||
|  | ||||
| run(host="0.0.0.0", port=8000) | ||||
| run(host=config.WebHost, port=config.WebPort) | ||||
| running = False | ||||
| runner.join() | ||||
|   | ||||
		Reference in New Issue
	
	Block a user
	 a_voel02
					a_voel02