bot/ytdlp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add dark source inspection interface

Browse Source
This commit is contained in:
bot
2026-08-12 18:42:03 +03:00
parent db75f2c4f8
commit 277aa8a568
9 changed files with 1090 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/templates/index.html
+128
View File
@@ -0,0 +1,128 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="color-scheme" content="dark">
<meta name="theme-color" content="#0a0b0d">
<title>Media Ingest</title>
<link rel="stylesheet" href="{{ url_for('static', path='/styles.css') }}">
<script src="{{ url_for('static', path='/app.js') }}" defer></script>
</head>
<body>
<header class="site-header">
<a class="brand" href="/" aria-label="Media Ingest home">
<span class="brand-mark" aria-hidden="true"></span>
<span>Media Ingest</span>
</a>
<span class="environment">Local</span>
</header>
<main class="page-shell">
<section class="hero" aria-labelledby="page-title">
<p class="eyebrow">Source inspection</p>
<h1 id="page-title">Bring the source.<br>See what is available.</h1>
<p class="intro">
Inspect public video sources before choosing what enters your workflow.
Nothing is downloaded at this stage.
</p>
<form class="inspect-form" id="inspect-form">
<label class="sr-only" for="source-url">Public video URL</label>
<div class="input-shell">
<input
id="source-url"
name="url"
type="url"
inputmode="url"
autocomplete="url"
maxlength="2048"
placeholder="Paste a public video URL"
required
>
<button id="inspect-button" type="submit">
<span class="button-label">Inspect source</span>
<span class="button-progress" aria-hidden="true"></span>
</button>
</div>
<p class="form-note">HTTP and HTTPS sources only. Playlists are not supported.</p>
</form>
<div class="notice error-notice" id="error-notice" role="alert" hidden>
<span class="notice-label">Inspection failed</span>
<span id="error-message"></span>
</div>
</section>
<section class="result" id="result" aria-live="polite" hidden>
<div class="result-heading">
<div>
<p class="eyebrow">Source found</p>
<h2 id="result-title"></h2>
</div>
<div class="result-actions">
<button class="text-button" id="new-source" type="button">New source</button>
<a id="source-link" class="source-link" target="_blank" rel="noreferrer">Open source</a>
</div>
</div>
<div class="source-card">
<div class="thumbnail-shell" id="thumbnail-shell">
<img id="thumbnail" alt="" referrerpolicy="no-referrer">
<span class="duration" id="duration"></span>
</div>
<dl class="metadata">
<div>
<dt>Platform</dt>
<dd id="extractor"></dd>
</div>
<div>
<dt>Publisher</dt>
<dd id="uploader"></dd>
</div>
<div>
<dt>Published</dt>
<dd id="upload-date"></dd>
</div>
<div>
<dt>Top quality</dt>
<dd id="top-quality"></dd>
</div>
</dl>
</div>
<div class="formats-heading">
<div>
<p class="eyebrow">Output choices</p>
<h3>Choose the outcome</h3>
</div>
<p>Technical stream selection happens automatically.</p>
</div>
<div class="output-options" id="output-options">
<article class="output-option" id="best-option">
<div class="option-index">01</div>
<div class="option-copy">
<h4>Best available</h4>
<p>Keep the highest source quality. Container and codec may vary.</p>
</div>
<dl class="option-specs" id="best-specs"></dl>
</article>
<article class="output-option" id="compatible-option">
<div class="option-index">02</div>
<div class="option-copy">
<h4>Compatible MP4</h4>
<p>Prefer H.264 video and AAC audio for editing and playback.</p>
</div>
<dl class="option-specs" id="compatible-specs"></dl>
</article>
</div>
</section>
</main>
<footer>
<span>Private media workflow</span>
<span>Inspection only</span>
</footer>
</body>
</html>