Rebuild: the web interface, from voyager 1
Voyager 1's page (search, sort, filters, poster filter, detail drawer, NZB download; no framework, Usenet text only as textContent) on the new catalog. Gone for now, as voyager 2 doesn't know them yet: passwords, encrypted containers, spots, par2 lists, archive contents, the extension filter (phase 2). New: a category filter, 'Collecting' for releases not settled yet, history and live-tail progress in the header, a release's files from its chunks. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Daan MeijerandClaude Opus 5.5 committed
1 parent
8e52bff213
commit
b97edf02c5
3 files changed
+1412
No files matched your search
@@ -0,0 +1,113 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Voyager 2</title>
|
||||
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='7' fill='%232f6fed'/%3E%3Cpath d='M9 10h14M9 16h14M9 22h9' stroke='white' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E" />
|
||||
<link rel="stylesheet" href="/app.css" />
|
||||
</head>
|
||||
<body>
|
||||
<header class="topbar">
|
||||
<a class="brand" href="/" aria-label="Voyager 2, home">
|
||||
<span class="brand-mark" aria-hidden="true"></span>
|
||||
<span>Voyager 2</span>
|
||||
</a>
|
||||
<dl class="stats" id="stats" aria-label="Index statistics"></dl>
|
||||
</header>
|
||||
|
||||
<main class="layout">
|
||||
<section class="search" aria-label="Search">
|
||||
<div class="search-row">
|
||||
<label class="search-box">
|
||||
<svg aria-hidden="true" viewBox="0 0 24 24"><circle cx="11" cy="11" r="7" /><path d="m20 20-3.5-3.5" /></svg>
|
||||
<input id="q" type="search" autocomplete="off" spellcheck="false"
|
||||
placeholder="Search release names…" aria-label="Search" />
|
||||
<kbd aria-hidden="true">/</kbd>
|
||||
</label>
|
||||
<label class="select">
|
||||
<span class="visually-hidden">Sort</span>
|
||||
<select id="sort">
|
||||
<option value="newest">Newest</option>
|
||||
<option value="oldest">Oldest</option>
|
||||
<option value="largest">Largest</option>
|
||||
<option value="files">Most files</option>
|
||||
<option value="name">Name</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
<div class="filters" role="group" aria-label="Filters">
|
||||
<button class="chip" type="button" data-filter="readable" aria-pressed="false">Readable names</button>
|
||||
<button class="chip" type="button" data-filter="complete" aria-pressed="false">Complete</button>
|
||||
<label class="select select-small">
|
||||
<span class="visually-hidden">Category</span>
|
||||
<select id="cat">
|
||||
<option value="">Any category</option>
|
||||
</select>
|
||||
</label>
|
||||
<label class="select select-small">
|
||||
<span class="visually-hidden">Recognised by</span>
|
||||
<select id="source">
|
||||
<option value="">Any source</option>
|
||||
<option value="stem">Filename</option>
|
||||
<option value="subject">Subject</option>
|
||||
<option value="post">Post id</option>
|
||||
</select>
|
||||
</label>
|
||||
<span class="field-chip" title="Release size in MB">
|
||||
<label for="min_size">Size</label>
|
||||
<input type="number" id="min_size" min="0" step="any" inputmode="decimal" placeholder="min" aria-label="Minimum size in MB" />
|
||||
<span aria-hidden="true">–</span>
|
||||
<input type="number" id="max_size" min="0" step="any" inputmode="decimal" placeholder="max" aria-label="Maximum size in MB" />
|
||||
<span class="unit">MB</span>
|
||||
</span>
|
||||
<span class="chip chip-active" id="poster-filter" hidden>
|
||||
<span id="poster-filter-label"></span>
|
||||
<button type="button" id="poster-clear" aria-label="Remove poster filter">×</button>
|
||||
</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="results" aria-live="polite">
|
||||
<p class="summary" id="summary"></p>
|
||||
<ol class="release-list" id="list"></ol>
|
||||
<div class="more">
|
||||
<button type="button" class="button" id="more" hidden>Load more</button>
|
||||
</div>
|
||||
<p class="empty" id="empty" hidden>No releases match. Try fewer words or turn off a filter.</p>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<div class="scrim" id="scrim" hidden></div>
|
||||
<aside class="drawer" id="drawer" aria-labelledby="detail-name" hidden>
|
||||
<div class="drawer-head">
|
||||
<div class="drawer-title">
|
||||
<p class="eyebrow" id="detail-source"></p>
|
||||
<h2 id="detail-name"></h2>
|
||||
</div>
|
||||
<button type="button" class="icon-button" id="close" aria-label="Close details">
|
||||
<svg aria-hidden="true" viewBox="0 0 24 24"><path d="M6 6l12 12M18 6 6 18" /></svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="drawer-body" id="detail"></div>
|
||||
</aside>
|
||||
|
||||
<template id="row-template">
|
||||
<li class="release">
|
||||
<button type="button" class="release-main">
|
||||
<span class="release-name"></span>
|
||||
<span class="release-meta"></span>
|
||||
</button>
|
||||
<div class="release-side">
|
||||
<span class="badges"></span>
|
||||
<span class="release-size"></span>
|
||||
<a class="icon-button nzb" title="Download NZB" aria-label="Download NZB">
|
||||
<svg aria-hidden="true" viewBox="0 0 24 24"><path d="M12 4v11m0 0 4-4m-4 4-4-4M5 19h14" /></svg>
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
</template>
|
||||
|
||||
<script src="/app.js" type="module"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in new issue
Block a user