Improved webinterface
This commit is contained in:
a_voel02
parent
5e4c5bc24a
commit
d38a6b9ea8
@ -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"}
|
||||
]
|
||||
|
||||
175
html/index.html
175
html/index.html
@ -1,87 +1,116 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<style type="text/css">
|
||||
textarea {
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
}
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Pixelserver Interface</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<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>
|
||||
|
||||
<h2>Log:</h2>
|
||||
<div id='log'>
|
||||
<textarea 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();
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
|
||||
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";
|
||||
}
|
||||
|
||||
<body>
|
||||
<div id='container'>
|
||||
<form id='in'>
|
||||
</form>
|
||||
</div>
|
||||
<div id='log'>
|
||||
<textarea id='logs'>
|
||||
|
||||
</textarea>
|
||||
</div>
|
||||
<script>
|
||||
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;
|
||||
/*if (parameter != ""){
|
||||
url += "/" + parameter;
|
||||
}*/
|
||||
post(url, {"param": parameter});
|
||||
//console.log(url);
|
||||
//getRaw("GET", url, function(){});
|
||||
return false;
|
||||
}
|
||||
|
||||
function generateInput(parameters){
|
||||
let container = document.getElementById('in');
|
||||
function updateLog(){
|
||||
getRaw("/apps/log", function(text){
|
||||
document.getElementById('logs').innerText = text;
|
||||
});
|
||||
}
|
||||
|
||||
let list = document.createElement("select");
|
||||
list.id = "list_";
|
||||
container.appendChild(list);
|
||||
|
||||
/*updateLog();
|
||||
setInterval(updateLog, 1000);*/
|
||||
|
||||
//let json = JSON.parse(parameters);
|
||||
parameters.map ( e => {
|
||||
let element = document.createElement("option");
|
||||
element.value = e;
|
||||
element.innerHTML = e;
|
||||
list.appendChild(element);
|
||||
})
|
||||
getJSON("/apps/list", populateForm);
|
||||
|
||||
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 request(){
|
||||
let app = document.querySelector('#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);
|
||||
|
||||
}
|
||||
|
||||
|
||||
//async function initLog(){
|
||||
// socket = new WebSocket ( "/logs" );
|
||||
// socket.onmessage = function ( evt ) { document.getElementById('logs').innerHTML += evt.data; };
|
||||
//}
|
||||
|
||||
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\" ]");
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</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()
|
||||
|
||||
Loading…
Reference in New Issue
Block a user