Files
jellybit/web/templates/index.html
T
avandClaude Opus 4.8 4e2593ac31 Перенос дизайна в server-rendered веб-UI (web-ui)
Новая capability web-ui: презентационный перенос готового дизайна
(семантический HTML + единый jellybit.css, тёмная тема по настройке ОС)
в html/template без шага сборки.

- Встроенная (go:embed) отдача статики под /static с Cache-Control и
  cache-busting (?v=<hash> по содержимому css/js).
- Шрифты IBM Plex self-hosted (@font-face, cyrillic+latin), без CDN.
- Наколеночный менеджер зависимостей: вендор (htmx + шрифты) не хранится
  в репо (gitignore), идемпотентно добывается `task assets` по
  web/assets.manifest с проверкой sha256; task build/run зависят от assets.
- Общие партиалы: шапка, бейдж статуса (карта всех 14 состояний),
  виджет «файл источника → раскладка» (общий для review и download).
- Страницы: список с фильтром/поиском, ревью, новая страница просмотра
  загрузки (/download/{id}). deleted скрыт по умолчанию.
- Превью раскладки берётся из единой логики internal/layout
  (buildFileRows), без дублирования правил имён в шаблонах.
- Убраны meta-refresh и инлайн-стили; copyHash на vanilla с fallback
  на execCommand и честной индикацией (целевой деплой — HTTP LAN).

Вне scope (отдельный change): живые обновления прогресса и раздел
раздачи, клиентский режим ручной раскладки файл→серия (с Alpine.js).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-30 19:59:19 +03:00

103 lines
4.8 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jellybit — загрузки</title>
<link rel="stylesheet" href="{{asset "css/jellybit.css"}}">
<script src="{{asset "vendor/htmx.min.js"}}" defer></script>
<script src="{{asset "js/app.js"}}" defer></script>
</head>
<body>
{{template "header" "downloads"}}
<main class="main">
<h1 class="page-title">Загрузки</h1>
<p class="page-sub">Кинь magnet, ссылку, .torrent или сообщение бота — остальное jellybit сделает сам.</p>
{{if .Error}}<div class="result-banner" style="background:var(--st-err-bg);border-color:color-mix(in srgb,var(--st-err) 35%,transparent)"><h2 style="color:var(--st-err)">{{.Error}}</h2></div>{{end}}
<!-- Единое окно добавления -->
<form class="add-box" method="post" action="/ui/downloads">
<div class="add-row">
<input class="input" type="text" name="source" autocomplete="off" required
placeholder="magnet:?xt=urn:btih:… · ссылка · .torrent · или вставь текст бота">
<button class="btn btn-primary btn-lg" type="submit">Добавить</button>
</div>
<p class="add-hint">Можно вставить целиком сообщение трекер-бота — magnet и контекст разберутся автоматически.</p>
</form>
{{if .Downloads}}
<!-- Панель фильтров -->
<div class="toolbar" id="list-toolbar">
<div class="search">
<span class="ico"></span>
<input class="input" type="search" placeholder="Поиск по названию или infohash…" oninput="applyFilters()">
</div>
<div class="filter-chips" id="chips">
<button class="chip active" type="button" data-f="all" onclick="setFilter(this)">Все</button>
<button class="chip" type="button" data-f="review" onclick="setFilter(this)">Ждут меня</button>
<button class="chip" type="button" data-f="active" onclick="setFilter(this)">В работе</button>
<button class="chip" type="button" data-f="done" onclick="setFilter(this)">Готово</button>
<button class="chip" type="button" data-f="problem" onclick="setFilter(this)">Проблемы</button>
</div>
</div>
<div class="toggle-line">
<label><input type="checkbox" id="showAll" onchange="applyFilters()"> Показать всё, включая удалённые</label>
</div>
<!-- Список карточек -->
<div id="list">
{{range .Downloads}}
<article class="card" data-group="{{.Group}}" data-text="{{.SearchText}}"{{if .Deleted}} data-deleted="1"{{end}}>
<div class="card-top">
<div>
<div class="card-title"><a href="/download/{{.ID}}" style="color:inherit">{{.Title}}</a></div>
{{if .Infohash}}
<div class="hash-row">
<span class="hash">{{.InfohashShort}}</span>
<button class="copy-btn" type="button" onclick="copyHash(this,'{{.Infohash}}')">⧉ копировать</button>
</div>
{{end}}
</div>
{{template "status_badge" .State}}
</div>
{{if .Context}}
<details class="spoiler">
<summary>контекст</summary>
<div class="spoiler-body">«{{.Context}}»</div>
</details>
{{end}}
<div class="card-foot">
<span class="card-meta">{{if .Note}}{{.Note}}{{else if .Error}}{{.Error}}{{end}}</span>
<div class="card-acts">
{{if .Reviewable}}<a class="btn btn-primary btn-sm" href="/review/{{.ID}}">Ревью →</a>{{end}}
{{if .Undoable}}<form method="post" action="/ui/downloads/{{.ID}}/undo"><button class="btn btn-sm btn-ghost" type="submit">Откатить</button></form>{{end}}
{{if .Relinkable}}<form method="post" action="/ui/downloads/{{.ID}}/relink"><button class="btn btn-sm" type="submit">Привязать заново</button></form>{{end}}
{{if .Retriable}}<form method="post" action="/ui/downloads/{{.ID}}/retry"><button class="btn btn-sm" type="submit">Повторить</button></form>{{end}}
{{if not .Terminal}}<form method="post" action="/ui/downloads/{{.ID}}/cancel"><button class="btn btn-sm btn-danger" type="submit">{{if .Reviewable}}Отклонить{{else}}Отменить{{end}}</button></form>{{end}}
</div>
</div>
</article>
{{end}}
</div>
<div class="empty-state" id="empty" style="display:none">
<div class="big">🍿</div>
Ничего не найдено. Поменяй фильтр или запрос.
</div>
{{else}}
<div class="empty-state">
<div class="big">🍿</div>
Пока пусто. Добавь первую загрузку выше.
</div>
{{end}}
</main>
</body>
</html>