oimwiodev/youtube-auto-dub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add Guardio web UI

Browse Source
This commit is contained in:
oimwiodev
2026-05-22 19:42:08 +01:00
parent c6363dfa84
commit 82718e5e84
8 changed files with 810 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

127
templates/index.html Normal file
View File

@@ -0,0 +1,127 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Guardio | YouTube Auto Dub</title>
<link rel="stylesheet" href="{{ url_for('static', filename='guardio.css') }}">
</head>
<body>
<main class="shell">
<section class="hero">
<div>
<p class="eyebrow">Guardio</p>
<h1>YouTube Auto Dub</h1>
<p class="lede">Launch local dubbing jobs, watch the pipeline log, and collect finished videos from one quiet control surface.</p>
</div>
<div class="status-strip" aria-live="polite">
<span id="active-count">0 running</span>
<span id="last-state">Ready</span>
</div>
</section>
<section class="workspace">
<form id="job-form" class="panel">
<div class="panel-heading">
<h2>New Dub</h2>
<button type="submit">Start</button>
</div>
<label>
YouTube URL
<input name="url" type="url" placeholder="https://www.youtube.com/watch?v=..." required>
</label>
<div class="grid">
<label>
Target Language
<input name="lang" value="es" maxlength="12">
</label>
<label>
Whisper Model
<select name="whisper_model">
<option value="">Auto</option>
<option>tiny</option>
<option>base</option>
<option>small</option>
<option>medium</option>
<option>large-v3</option>
</select>
</label>
</div>
<div class="grid">
<label>
Mix Mode
<select name="mix_mode">
<option value="instrumental-only">Instrumental only</option>
<option value="dub-only">Dub only</option>
<option value="original-audio">Original audio</option>
</select>
</label>
<label>
Browser Cookies
<select name="browser">
<option value="">None</option>
<option>chrome</option>
<option>edge</option>
<option>firefox</option>
<option>brave</option>
</select>
</label>
</div>
<label>
Cookies File
<input name="cookies" placeholder="C:\path\to\cookies.txt">
</label>
<details>
<summary>Translation Settings</summary>
<div class="grid">
<label>
LM Studio URL
<input name="lmstudio_base_url" placeholder="http://127.0.0.1:1234/v1">
</label>
<label>
Model
<input name="lmstudio_model" placeholder="gemma-3-4b-it">
</label>
</div>
<label class="check">
<input name="gpu" type="checkbox">
<span>Prefer GPU</span>
</label>
</details>
</form>
<section class="panel monitor">
<div class="panel-heading">
<h2>Run Log</h2>
<button id="refresh" type="button">Refresh</button>
</div>
<div id="jobs" class="jobs"></div>
<pre id="log">No jobs yet.</pre>
</section>
</section>
<section class="outputs">
<div class="section-heading">
<h2>Outputs</h2>
<button id="reload-outputs" type="button">Reload</button>
</div>
<div id="outputs" class="output-grid">
{% for output in outputs %}
<a class="output-card" href="{{ url_for('download_output', filename=output.name) }}">
<strong>{{ output.name }}</strong>
<span>{{ output.size_mb }} MB</span>
</a>
{% else %}
<p class="empty">Finished videos will appear here.</p>
{% endfor %}
</div>
</section>
</main>
<script src="{{ url_for('static', filename='guardio.js') }}"></script>
</body>
</html>