feat(webui): add ffmpeg path specifier
This commit is contained in:
parent
620587e79b
commit
45d9625827
4
build
Executable file
4
build
Executable file
@ -0,0 +1,4 @@
|
|||||||
|
#!/usr/bin/env bash
|
||||||
|
|
||||||
|
# Use nuitka from the virtual environment to prevent bloat
|
||||||
|
python -m nuitka --follow-stdlib --python-flag=-OO --standalone --lto=yes --module-name-choice=original --include-data-dir=web=web --show-anti-bloat-changes --enable-console --clang explorers
|
@ -63,6 +63,18 @@ def set_token():
|
|||||||
return "OK"
|
return "OK"
|
||||||
|
|
||||||
|
|
||||||
|
@app.route("/api/v1/ffmpeg-path", methods=["POST"])
|
||||||
|
def set_ffmpeg_path():
|
||||||
|
global ffmpeg_bin
|
||||||
|
# set token from query parameter
|
||||||
|
ffmpeg_path = request.data.decode("utf-8")
|
||||||
|
if ffmpeg_path == "" or ffmpeg_path == "system":
|
||||||
|
ffmpeg_bin = which("ffmpeg")
|
||||||
|
else:
|
||||||
|
ffmpeg_bin = ffmpeg_path
|
||||||
|
return "OK"
|
||||||
|
|
||||||
|
|
||||||
@app.route("/assets/<path:filename>")
|
@app.route("/assets/<path:filename>")
|
||||||
def get_assets(filename):
|
def get_assets(filename):
|
||||||
# Ensure the filename is secure to prevent potential security issues
|
# Ensure the filename is secure to prevent potential security issues
|
||||||
|
@ -1,9 +1,13 @@
|
|||||||
const tokenInput = document.querySelector('#token');
|
const tokenInput = document.querySelector('#token');
|
||||||
|
const ffmpegPathInput = document.querySelector('#ffmpeg-path');
|
||||||
const rememberTokenCheckbox = document.querySelector('#remember-token');
|
const rememberTokenCheckbox = document.querySelector('#remember-token');
|
||||||
const setTokenButton = document.querySelector('#set-token');
|
const setTokenButton = document.querySelector('#set-token');
|
||||||
|
const rememberFFmpegPathCheckbox = document.querySelector('#remember-ffmpeg-path');
|
||||||
|
const setFFmpegPathButton = document.querySelector('#set-ffmpeg-path');
|
||||||
const lessonInput = document.querySelector('#lesson-query');
|
const lessonInput = document.querySelector('#lesson-query');
|
||||||
const getLessonButton = document.querySelector('#get-lesson');
|
const getLessonButton = document.querySelector('#get-lesson');
|
||||||
let token = localStorage.getItem('token') || '';
|
let token = localStorage.getItem('token') || '';
|
||||||
|
let ffmpegPath = localStorage.getItem('ffmpegPath') || '';
|
||||||
|
|
||||||
if (token !== '') {
|
if (token !== '') {
|
||||||
tokenInput.value = token;
|
tokenInput.value = token;
|
||||||
@ -18,12 +22,25 @@ if (token !== '') {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (ffmpegPath !== '') {
|
||||||
|
ffmpegPathInput.value = token;
|
||||||
|
rememberFFmpegPathCheckbox.checked = true;
|
||||||
|
fetch("/api/v1/ffmpeg-path", {
|
||||||
|
method: 'POST',
|
||||||
|
body: token,
|
||||||
|
}).then(rsp => {
|
||||||
|
if (rsp.status !== 200) {
|
||||||
|
setTokenButton.innerHTML = `:( (${rsp.status})`;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function randomString(length) {
|
function randomString(length) {
|
||||||
return `a${Math.random().toString(36).slice(2, length + 2)}`;
|
return `a${Math.random().toString(36).slice(2, length + 2)}`;
|
||||||
}
|
}
|
||||||
|
|
||||||
// React simulator
|
// React simulator
|
||||||
function getResult(id) {
|
function getResult() {
|
||||||
const element = document.createElement("div");
|
const element = document.createElement("div");
|
||||||
element.className = "block";
|
element.className = "block";
|
||||||
document.body.appendChild(document.createElement("br"));
|
document.body.appendChild(document.createElement("br"));
|
||||||
@ -48,6 +65,23 @@ setTokenButton.addEventListener('click', async () => {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
setFFmpegPathButton.addEventListener('click', async () => {
|
||||||
|
ffmpegPath = ffmpegPathInput.value;
|
||||||
|
const rsp = await fetch("/api/v1/ffmpeg-path", {
|
||||||
|
method: 'POST',
|
||||||
|
body: ffmpegPath,
|
||||||
|
});
|
||||||
|
if (rsp.status !== 200) {
|
||||||
|
setFFmpegPathButton.innerHTML = `:( (${rsp.status})`;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (rememberFFmpegPathCheckbox.checked) {
|
||||||
|
localStorage.setItem('ffmpegPath', ffmpegPath);
|
||||||
|
} else {
|
||||||
|
localStorage.removeItem('ffmpegPath');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
getLessonButton.addEventListener('click', async () => {
|
getLessonButton.addEventListener('click', async () => {
|
||||||
const input = lessonInput.value;
|
const input = lessonInput.value;
|
||||||
let id = Number.parseInt(input);
|
let id = Number.parseInt(input);
|
||||||
@ -57,7 +91,7 @@ getLessonButton.addEventListener('click', async () => {
|
|||||||
id = Number.parseInt(url.pop());
|
id = Number.parseInt(url.pop());
|
||||||
}
|
}
|
||||||
const rsp = await fetch(`/api/v1/lessons/${id}`);
|
const rsp = await fetch(`/api/v1/lessons/${id}`);
|
||||||
const result = getResult("lesson");
|
const result = getResult();
|
||||||
const data = await rsp.json();
|
const data = await rsp.json();
|
||||||
const ids = {};
|
const ids = {};
|
||||||
// React :nerd:
|
// React :nerd:
|
||||||
|
@ -15,6 +15,11 @@ header {
|
|||||||
background-color: #ffffff50;
|
background-color: #ffffff50;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
header h5 {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
footer {
|
footer {
|
||||||
padding: 20px 0px;
|
padding: 20px 0px;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
|
@ -9,11 +9,18 @@
|
|||||||
</head>
|
</head>
|
||||||
<body class="theme-dark">
|
<body class="theme-dark">
|
||||||
<header>
|
<header>
|
||||||
Explorers
|
Explorers<h5>Web UI</h5>
|
||||||
</header>
|
</header>
|
||||||
<br>
|
<br>
|
||||||
<div class="main">
|
<div class="main">
|
||||||
<div class="block">
|
<div class="block">
|
||||||
|
FFmpeg Path
|
||||||
|
<input id="ffmpeg-path" type="text" name="ffmpeg-path" placeholder="system">
|
||||||
|
<button id="set-ffmpeg-path">Set</button>
|
||||||
|
<br>
|
||||||
|
<input type="checkbox" id="remember-ffmpeg-path" name="remember-ffmpeg-path" value="remember-ffmpeg-path">
|
||||||
|
<label for="remember-ffmpeg-path">Remember this path</label>
|
||||||
|
<br>
|
||||||
Token
|
Token
|
||||||
<input id="token" type="password" name="token" placeholder="Put your token here">
|
<input id="token" type="password" name="token" placeholder="Put your token here">
|
||||||
<button id="set-token">Set</button>
|
<button id="set-token">Set</button>
|
||||||
|
Loading…
Reference in New Issue
Block a user