Improved webinterface

This commit is contained in:
a_voel02 2018-08-26 22:07:06 +02:00
parent 5e4c5bc24a
commit d38a6b9ea8
6 changed files with 136 additions and 87 deletions

View File

@ -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 -

View File

@ -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
View 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 -

View File

@ -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"}
]

View File

@ -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
View File

@ -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()