sam/photo-pipeline
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Pagination (200/page), batched+checkpointed ingest (batch_size, resume-safe), quality max_files slicing, upload page; Caddy routes for prefect/photo-filter

Browse Source
This commit is contained in:
Sam Rolfe
2026-08-08 13:36:00 +10:00
parent 1814b5c5c4
commit 0d20c29f35
7 changed files with 309 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
dashboard/templates/upload.html Normal file
View File

@@ -0,0 +1,80 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Upload — photo-pipeline</title>
<style>
:root { color-scheme: dark; }
body { font-family: system-ui, sans-serif; margin: 0; background: #111; color: #eee; }
header { padding: 1rem 1.5rem; border-bottom: 1px solid #333; display: flex; gap: 1.5rem; align-items: baseline; }
header h1 { font-size: 1.2rem; margin: 0; }
header a { color: #6cf; text-decoration: none; }
main { padding: 1.5rem; max-width: 700px; margin: 0 auto; }
.drop { border: 2px dashed #444; border-radius: 12px; padding: 3rem 2rem; text-align: center; color: #888; }
.drop.dragover { border-color: #6cf; background: #16222a; }
input[type=file] { margin: 1rem 0; }
button { background: #1d4; color: #031; border: 0; border-radius: 8px; padding: .6rem 1.2rem; font-size: 1rem; cursor: pointer; font-weight: 600; }
.hint { color: #666; font-size: .85rem; margin-top: 1.5rem; }
.hint code { background: #222; padding: .1rem .4rem; border-radius: 4px; }
</style>
</head>
<body>
<header>
<h1>📸 photo-pipeline</h1>
<a href="/">Overview</a>
<a href="/review">Review queue</a>
<a href="/pipeline">Pipeline</a>
<a href="/upload">Upload</a>
</header>
<main>
<h2>Upload to pipeline</h2>
<p>Drop Takeout archives (<code>.zip</code>/<code>.tgz</code>) or manifest files here.
They land in <code>/mnt/data/takeout/incoming/</code> — the watch flow picks them up
within 15 minutes and runs the pipeline automatically.</p>
<form id="upform" method="post" action="/upload" enctype="multipart/form-data">
<div class="drop" id="drop">
<p>Drag &amp; drop files here, or click to browse</p>
<input type="file" id="fileinput" name="files" multiple>
</div>
<p><button type="submit">Upload</button></p>
<p id="status" style="color:#6cf;"></p>
</form>
<div class="hint">
<p>What can go here:</p>
<ul>
<li><code>*.txt</code> — a manifest of Takeout download URLs (one per line). The pipeline downloads them itself.</li>
<li><code>*.zip</code> / <code>*.tgz</code> — an already-downloaded Takeout archive.</li>
</ul>
</div>
</main>
<script>
const drop = document.getElementById('drop');
const input = document.getElementById('fileinput');
const status = document.getElementById('status');
drop.addEventListener('dragover', e => { e.preventDefault(); drop.classList.add('dragover'); });
drop.addEventListener('dragleave', () => drop.classList.remove('dragover'));
drop.addEventListener('drop', e => {
e.preventDefault();
drop.classList.remove('dragover');
input.files = e.dataTransfer.files;
status.textContent = input.files.length + ' file(s) selected';
});
input.addEventListener('change', () => {
status.textContent = input.files.length + ' file(s) selected';
});
document.getElementById('upform').addEventListener('submit', async e => {
e.preventDefault();
status.textContent = 'Uploading…';
const fd = new FormData(document.getElementById('upform'));
const resp = await fetch('/upload', { method: 'POST', body: fd });
const data = await resp.json();
status.textContent = `Done: ${data.saved} file(s) saved to incoming. Watch flow will process them.`;
});
</script>
</body>
</html>