diff --git a/Jenkinsfile b/Jenkinsfile
index a62f56f..fa6b688 100644
--- a/Jenkinsfile
+++ b/Jenkinsfile
@@ -11,6 +11,7 @@
// harbor-devops-tools-push-pull-access — Harbor devops-tools (robot)
// docker-hub — Docker Hub (inecs)
// ssh-gitea-key — SCM checkout Gitea
+// gitea-jenkins-token — Gitea PAT; для статусов коммита: write:repository
// k3s-kubeconfig — в job Deploy (Jenkinsfile.deploy)
//
// Deploy job: devops-tools/wrapped/wrapped-deploy/main
diff --git a/README.md b/README.md
index e2d79dd..3271997 100644
--- a/README.md
+++ b/README.md
@@ -338,16 +338,27 @@ services:
Ключ в `#fragment` не уходит на сервер в запросе страницы.
+### UX (v0.1.3+)
+
+- После создания: **QR** на share-link, **скачать QR (PNG)**, **Web Share** (если есть `navigator.share`), чеклист и trust-строка про `#key`; отдельные кнопки Copy для ссылки / токена / пароля; пароль не советуется слать в той же переписке.
+- Create: счётчик размера `≈ used / max` и предупреждение near-limit (сверх лимита — `create.tooLarge`).
+- Unwrap: Enter в поле пароля отправляет форму; после `password_required` / `bad_password` — focus+select; при ≥2 элементах — **скачать всё** (zip через JSZip); trust-строка на результате; спокойный экран «ссылка недоступна» для already used / expired (anti-enumeration); отдельные состояния для `password_locked`, rate limit, CAPTCHA, ошибки расшифровки.
+- Картинки после unwrap: inline-превью и **lightbox** (тап/клик).
+- Тема при первом визите следует `prefers-color-scheme` (пока нет выбора в `localStorage`); лёгкий haptic после успешного Copy.
+- Минимальный **PWA**: `manifest.webmanifest` (без Service Worker для API).
+- UI строки EN/RU через `i18n.js`.
+- Статика (`/static/...`) отдаётся с `?v=версия.mtime` (cache-bust после деплоя).
+
---
## Админка
-Логин: `/admin/login`. После входа — **Статистика** (`/admin/stats`).
+Логин: `/admin/login`. После входа — **Статистика** (`/admin/stats`). На мобиле меню — через гамбургер.
| Раздел | URL | Что делает |
|--------|-----|------------|
-| **Статистика** | `/admin/stats` | MinIO: объём и число объектов нерасшифрованного ciphertext; расшифровано / pending; загрузки и items за всё время; таблица по статусам wraps; с паролем; создано за 24ч/7д; счётчики audit (create/unwrap ok/fail) |
-| **Настройки** | `/admin/settings` | Limits (upload, TTL, retention audit), rate limits, MIME allowlist, пароль (режим + лимит попыток), CAPTCHA |
+| **Статистика** | `/admin/stats` | MinIO pending ciphertext; успешные unwrap vs сожжения паролем; pending / uploads; таблица статусов (count/size/items); with password; 24h/7d creates; audit create/unwrap; разбивка fail-причин unwrap (all-time и 24h) |
+| **Настройки** | `/admin/settings` | Limits (upload, TTL, retention audit), rate limits, MIME allowlist (в т.ч. YAML / `application/octet-stream` для kubeconfig и неизвестных типов), пароль, CAPTCHA |
| **Аудит** | `/admin/audit` | Фильтры, пагинация (10/25/50/100), номера страниц, кнопка **Очистить** (с подтверждением; пишется событие `admin.audit_clear`) |
| **Опасная зона** | `/admin/danger` | Полная очистка wraps и объектов в MinIO (`PURGE`) |
@@ -452,7 +463,7 @@ Credentials (Global, как в job’ах):
| ID | Тип | Назначение |
|----|-----|------------|
| `ssh-gitea-key` | SSH Username with private key | SCM checkout |
-| `gitea-jenkins-token` | Secret text / token | API Gitea (webhook/API при необходимости) |
+| `gitea-jenkins-token` | Secret text (Gitea PAT) | SCM/API Gitea. Для commit status из Multibranch нужен scope **`write:repository`** (сейчас при read-only в логе: `Could not send notifications` / 403/405). Checkout достаточно `read:repository` |
| `harbor-devops-tools-push-pull-access` | Username/password | Harbor `devops-tools` (robot) |
| `docker-hub` | Username/password | Docker Hub `inecs` |
| `k3s-kubeconfig` | Secret file | Helm/kubectl deploy в K3S |
diff --git a/VERSION b/VERSION
index d917d3e..845639e 100644
--- a/VERSION
+++ b/VERSION
@@ -1 +1 @@
-0.1.2
+0.1.4
diff --git a/app/main.py b/app/main.py
index f3dfcaa..6ff2e3b 100644
--- a/app/main.py
+++ b/app/main.py
@@ -14,6 +14,7 @@ from app.config import get_settings
from app.db import SessionLocal
from app.services.settings_service import get_or_create_settings
from app.services.storage import storage
+from app.static_url import static_url
from app.version import get_app_version, get_app_version_label
OPENAPI_TAGS = [
@@ -102,8 +103,10 @@ def create_app() -> FastAPI:
# Callables so Jinja re-reads VERSION (dev mount / after bump) on each render
templates.env.globals["app_version"] = get_app_version
templates.env.globals["app_version_label"] = get_app_version_label
+ templates.env.globals["static_url"] = static_url
admin.templates.env.globals["app_version"] = get_app_version
admin.templates.env.globals["app_version_label"] = get_app_version_label
+ admin.templates.env.globals["static_url"] = static_url
@app.get("/health", tags=["System"], summary="Health check", include_in_schema=docs_on)
async def health():
diff --git a/app/models.py b/app/models.py
index e15ad09..6cc3eb7 100644
--- a/app/models.py
+++ b/app/models.py
@@ -138,6 +138,10 @@ DEFAULT_MIME_ALLOWLIST = [
"text/javascript",
"application/json",
"application/xml",
+ "application/yaml",
+ "application/x-yaml",
+ "text/yaml",
+ "application/octet-stream",
"application/pdf",
"application/zip",
"application/x-zip-compressed",
diff --git a/app/services/stats.py b/app/services/stats.py
index c5d50d0..e0656ba 100644
--- a/app/services/stats.py
+++ b/app/services/stats.py
@@ -117,6 +117,49 @@ async def collect_stats(db: AsyncSession) -> dict[str, Any]:
else:
bucket["fail"] += int(count or 0)
+ reason_col = AuditEvent.details.op("->>")("reason")
+
+ password_burns = int(
+ (
+ await db.execute(
+ select(func.count())
+ .select_from(AuditEvent)
+ .where(
+ AuditEvent.event_type == "wrap.unwrap",
+ AuditEvent.success.is_(False),
+ reason_col == "password_attempts_exceeded",
+ )
+ )
+ ).scalar_one()
+ or 0
+ )
+
+ async def unwrap_fail_reasons(since: datetime | None = None) -> list[dict[str, Any]]:
+ filters = [
+ AuditEvent.event_type == "wrap.unwrap",
+ AuditEvent.success.is_(False),
+ ]
+ if since is not None:
+ filters.append(AuditEvent.created_at >= since)
+ rows = (
+ await db.execute(
+ select(
+ func.coalesce(reason_col, "unknown"),
+ func.count(AuditEvent.id),
+ )
+ .where(*filters)
+ .group_by(func.coalesce(reason_col, "unknown"))
+ .order_by(func.count(AuditEvent.id).desc())
+ )
+ ).all()
+ return [
+ {"reason": str(reason or "unknown"), "count": int(count or 0)}
+ for reason, count in rows
+ ]
+
+ unwrap_fail_reasons_all = await unwrap_fail_reasons()
+ unwrap_fail_reasons_24h = await unwrap_fail_reasons(day_ago)
+
# MinIO live objects under wraps/
try:
minio = await storage.prefix_stats("wraps/")
@@ -128,6 +171,7 @@ async def collect_stats(db: AsyncSession) -> dict[str, Any]:
pending = by_status["pending"]
consumed = by_status["consumed"]
expired = by_status["expired"]
+ audit_unwraps_ok = audit.get("wrap.unwrap", {}).get("ok", 0)
return {
"wraps_total": int(total_wraps or 0),
@@ -137,6 +181,8 @@ async def collect_stats(db: AsyncSession) -> dict[str, Any]:
"wraps_with_password": int(with_password or 0),
"items_total": int(total_items or 0),
"items_pending": pending["items"],
+ "items_consumed": consumed["items"],
+ "items_expired": expired["items"],
"size_total_bytes": int(total_size or 0),
"size_pending_bytes": pending["size_bytes"],
"size_consumed_bytes": consumed["size_bytes"],
@@ -144,13 +190,18 @@ async def collect_stats(db: AsyncSession) -> dict[str, Any]:
"size_total_human": format_bytes(int(total_size or 0)),
"size_pending_human": format_bytes(pending["size_bytes"]),
"size_consumed_human": format_bytes(consumed["size_bytes"]),
+ "size_expired_human": format_bytes(expired["size_bytes"]),
"created_24h": created_24h,
"created_7d": created_7d,
"consumed_24h": consumed_24h,
"audit_creates_ok": audit.get("wrap.create", {}).get("ok", 0),
"audit_creates_fail": audit.get("wrap.create", {}).get("fail", 0),
- "audit_unwraps_ok": audit.get("wrap.unwrap", {}).get("ok", 0),
+ "audit_unwraps_ok": audit_unwraps_ok,
"audit_unwraps_fail": audit.get("wrap.unwrap", {}).get("fail", 0),
+ "unwraps_success": audit_unwraps_ok,
+ "password_burns": password_burns,
+ "unwrap_fail_reasons": unwrap_fail_reasons_all,
+ "unwrap_fail_reasons_24h": unwrap_fail_reasons_24h,
"minio_objects": int(minio.get("objects") or 0),
"minio_bytes": int(minio.get("bytes") or 0),
"minio_human": format_bytes(int(minio.get("bytes") or 0)),
diff --git a/app/static/css/app.css b/app/static/css/app.css
index 4bbb20d..2760bea 100644
--- a/app/static/css/app.css
+++ b/app/static/css/app.css
@@ -113,6 +113,7 @@ html[data-theme="light"] body {
display: flex;
align-items: center;
justify-content: space-between;
+ gap: 0.75rem;
padding: 0.85rem 0.75rem;
max-width: none;
width: 100%;
@@ -262,6 +263,14 @@ html[data-theme="dark"] .icon-btn:hover {
.result-panel > .success-callout {
justify-self: stretch;
}
+.result-actions {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 0.5rem;
+}
+.result-panel > .success-trust {
+ margin: 0;
+}
.success-panel {
justify-items: stretch;
text-align: left;
@@ -273,6 +282,149 @@ html[data-theme="dark"] .icon-btn:hover {
.success-panel > .btn.ghost {
justify-self: center;
}
+.success-layout {
+ display: grid;
+ grid-template-columns: minmax(0, 1fr) auto;
+ gap: 1.25rem 1.5rem;
+ align-items: start;
+ min-width: 0;
+}
+.success-main {
+ display: grid;
+ gap: 0.55rem;
+ min-width: 0;
+}
+.success-main > label {
+ margin-top: 0.35rem;
+}
+.success-password-block {
+ display: grid;
+ gap: 0.45rem;
+ margin-bottom: 0.35rem;
+}
+.success-password-badge {
+ display: inline-flex;
+ align-items: center;
+ gap: 0.45rem;
+ width: fit-content;
+ max-width: 100%;
+ margin: 0;
+ padding: 0.4rem 0.7rem;
+ border-radius: 10px;
+ border: 1px solid rgba(61, 214, 198, 0.35);
+ background: rgba(61, 214, 198, 0.1);
+ color: var(--accent-2);
+ font-size: 0.82rem;
+ font-weight: 650;
+}
+.success-password-hint {
+ margin: 0;
+ font-size: 0.84rem;
+ line-height: 1.4;
+}
+.success-checklist {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ display: grid;
+ gap: 0.35rem;
+}
+.success-checklist li {
+ position: relative;
+ padding-left: 1.35rem;
+ color: var(--muted);
+ font-size: 0.88rem;
+ line-height: 1.4;
+}
+.success-checklist li::before {
+ content: "";
+ position: absolute;
+ left: 0;
+ top: 0.35rem;
+ width: 0.55rem;
+ height: 0.55rem;
+ border-radius: 2px;
+ border: 1.5px solid var(--accent-2);
+ opacity: 0.85;
+}
+.success-trust {
+ margin: 0;
+ font-size: 0.84rem;
+ line-height: 1.45;
+}
+.success-actions {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 0.5rem;
+ margin-top: 0.35rem;
+}
+.success-actions .btn {
+ flex: 1 1 auto;
+ min-width: 8rem;
+}
+.size-meter {
+ margin: 0;
+ font-variant-numeric: tabular-nums;
+}
+.size-meter.is-warn {
+ color: #e8a838;
+}
+.size-meter.is-over {
+ color: var(--danger);
+}
+.success-qr {
+ display: grid;
+ justify-items: center;
+ gap: 0.45rem;
+ padding: 0.85rem;
+ border: 1px solid var(--line);
+ border-radius: 16px;
+ background: var(--panel);
+ min-width: 0;
+}
+.share-qr {
+ width: 180px;
+ height: 180px;
+ display: grid;
+ place-items: center;
+ background: #fff;
+ border-radius: 12px;
+ padding: 0.5rem;
+ box-sizing: border-box;
+}
+.share-qr img,
+.share-qr canvas {
+ display: block;
+ max-width: 100%;
+ height: auto;
+}
+.success-qr-hint {
+ margin: 0;
+ text-align: center;
+ font-size: 0.78rem;
+ max-width: 11rem;
+ line-height: 1.35;
+}
+@media (max-width: 860px) {
+ .success-layout {
+ grid-template-columns: 1fr;
+ }
+ .success-qr {
+ order: -1;
+ justify-self: center;
+ width: min(100%, 280px);
+ }
+ .share-qr {
+ width: min(220px, 70vw);
+ height: min(220px, 70vw);
+ }
+ .copy-row {
+ grid-template-columns: 1fr;
+ }
+ .copy-row .btn {
+ width: 100%;
+ }
+}
.success-callout {
display: flex;
align-items: center;
@@ -441,12 +593,28 @@ input, select, textarea, .code-input {
}
.lang-modal-panel {
width: min(480px, 100%);
+ display: flex;
+ flex-direction: column;
+ overflow: hidden;
+}
+.lang-modal-panel .modal-title,
+.lang-modal-panel .modal-message,
+.lang-modal-panel .modal-actions {
+ flex-shrink: 0;
+}
+.lang-modal-panel .modal-message {
+ margin-bottom: 0.75rem;
}
.lang-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.45rem;
- margin-bottom: 1rem;
+ margin-bottom: 0.85rem;
+ flex: 1 1 auto;
+ min-height: 0;
+ overflow-y: auto;
+ -webkit-overflow-scrolling: touch;
+ overscroll-behavior: contain;
}
@media (max-width: 520px) {
.lang-grid { grid-template-columns: 1fr; }
@@ -947,6 +1115,110 @@ html[data-theme="light"] .about-version {
transform: none;
}
+.item-card img,
+.item-preview-img {
+ display: block;
+ max-width: 100%;
+ width: auto;
+ height: auto;
+ border-radius: 10px;
+ margin-top: 0.65rem;
+ cursor: zoom-in;
+}
+.item-preview-hint {
+ margin: 0.4rem 0 0;
+ font-size: 0.78rem;
+}
+
+.unwrap-state {
+ display: grid;
+ justify-items: center;
+ gap: 0.75rem;
+ text-align: center;
+ padding: 1.5rem 0.5rem 0.5rem;
+ min-width: 0;
+}
+.unwrap-state.hidden {
+ display: none;
+}
+.unwrap-state-icon {
+ width: 64px;
+ height: 64px;
+ display: grid;
+ place-items: center;
+ border-radius: 18px;
+ border: 1px solid rgba(110, 168, 255, 0.25);
+ background: linear-gradient(160deg, rgba(110, 168, 255, 0.14), rgba(13, 20, 32, 0.35));
+ color: var(--accent-2);
+ font-size: 1.45rem;
+}
+html[data-theme="light"] .unwrap-state-icon {
+ background: linear-gradient(160deg, rgba(47, 111, 237, 0.12), rgba(255, 255, 255, 0.9));
+}
+.unwrap-state h2 {
+ margin: 0;
+ font-size: 1.35rem;
+ font-weight: 650;
+ max-width: 22rem;
+ line-height: 1.25;
+}
+.unwrap-state .lede {
+ margin: 0;
+ max-width: 28rem;
+}
+.unwrap-state .btn {
+ margin-top: 0.35rem;
+}
+
+.image-lightbox {
+ position: fixed;
+ inset: 0;
+ z-index: 1100;
+ display: grid;
+ grid-template-rows: auto 1fr auto;
+ align-items: center;
+ justify-items: center;
+ gap: 0.75rem;
+ padding: max(0.75rem, env(safe-area-inset-top, 0px))
+ max(0.75rem, env(safe-area-inset-right, 0px))
+ max(0.75rem, env(safe-area-inset-bottom, 0px))
+ max(0.75rem, env(safe-area-inset-left, 0px));
+ background: rgba(6, 10, 18, 0.88);
+ backdrop-filter: blur(6px);
+}
+.image-lightbox.hidden {
+ display: none;
+}
+.image-lightbox-close {
+ justify-self: end;
+ width: 42px;
+ height: 42px;
+ border-radius: 12px;
+ border: 1px solid rgba(255, 255, 255, 0.18);
+ background: rgba(20, 28, 42, 0.7);
+ color: #fff;
+ cursor: pointer;
+ display: grid;
+ place-items: center;
+}
+.image-lightbox img {
+ max-width: min(100%, 960px);
+ max-height: min(78dvh, 78vh);
+ width: auto;
+ height: auto;
+ object-fit: contain;
+ border-radius: 12px;
+ cursor: default;
+}
+.image-lightbox-caption {
+ margin: 0;
+ color: rgba(255, 255, 255, 0.85);
+ font-size: 0.9rem;
+ text-align: center;
+ max-width: 90vw;
+ word-break: break-word;
+}
+
.items {
display: grid;
gap: 1rem;
@@ -1000,11 +1272,6 @@ html[data-theme="light"] .item-card pre,
html[data-theme="light"] .item-card .item-text-pre {
background: rgba(16, 32, 56, 0.05);
}
-.item-card img {
- max-width: 100%;
- border-radius: 8px;
- margin-top: 0.6rem;
-}
/* Admin */
.admin-body { min-height: 100vh; }
@@ -1074,6 +1341,15 @@ html[data-theme="light"] .item-card .item-text-pre {
margin: 0;
font-size: 0.82rem;
}
+.admin-top-tools {
+ display: flex;
+ align-items: center;
+ gap: 0.45rem;
+ flex-shrink: 0;
+}
+.admin-nav-toggle {
+ display: none;
+}
.admin-top-right {
display: flex;
align-items: center;
@@ -1099,6 +1375,10 @@ html[data-theme="light"] .item-card .item-text-pre {
backdrop-filter: blur(12px);
box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12);
}
+.admin-nav-logout-form {
+ display: inline;
+ margin: 0;
+}
.admin-nav-link {
display: inline-flex;
align-items: center;
@@ -1142,6 +1422,113 @@ html[data-theme="light"] .item-card .item-text-pre {
html[data-theme="light"] .admin-nav {
box-shadow: 0 8px 24px rgba(20, 40, 70, 0.08);
}
+
+@media (max-width: 860px) {
+ .admin-top {
+ display: grid;
+ grid-template-columns: minmax(0, 1fr) auto;
+ grid-template-areas:
+ "brand tools"
+ "nav nav";
+ align-items: center;
+ gap: 0.55rem 0.65rem;
+ padding: 0.7rem 0.65rem;
+ }
+ .admin-top > .brand {
+ grid-area: brand;
+ min-width: 0;
+ }
+ .admin-top-tools {
+ grid-area: tools;
+ }
+ .admin-top .brand-tagline {
+ max-width: 42vw;
+ }
+ .admin-nav-toggle {
+ display: grid;
+ }
+ .admin-nav {
+ grid-area: nav;
+ display: none;
+ flex-direction: column;
+ flex-wrap: nowrap;
+ align-items: stretch;
+ width: 100%;
+ max-height: min(70dvh, 28rem);
+ overflow-y: auto;
+ -webkit-overflow-scrolling: touch;
+ overscroll-behavior: contain;
+ padding: 0.4rem;
+ gap: 0.2rem;
+ }
+ .admin-top.is-nav-open .admin-nav {
+ display: flex;
+ }
+ .admin-nav-link {
+ width: 100%;
+ justify-content: flex-start;
+ padding: 0.7rem 0.85rem;
+ font-size: 0.92rem;
+ }
+ .admin-nav-logout-form {
+ display: block;
+ width: 100%;
+ }
+ .admin-nav-logout-form .admin-nav-link {
+ width: 100%;
+ }
+ .admin-shell {
+ padding: 0 0.65rem 2rem;
+ }
+ .admin-shell > h1 {
+ font-size: 1.35rem;
+ margin-bottom: 0.75rem;
+ }
+ .admin-tablist {
+ flex-wrap: nowrap;
+ overflow-x: auto;
+ -webkit-overflow-scrolling: touch;
+ overscroll-behavior-x: contain;
+ scrollbar-width: thin;
+ }
+ .admin-tab {
+ flex: 0 0 auto;
+ }
+ .admin-tabpanel {
+ padding: 0.9rem;
+ }
+ .audit-filters {
+ display: grid;
+ grid-template-columns: 1fr;
+ align-items: stretch;
+ }
+ .audit-field,
+ .audit-field-grow {
+ min-width: 0;
+ width: 100%;
+ }
+ .audit-filter-btn {
+ width: 100%;
+ height: auto;
+ min-height: 42px;
+ }
+ .audit-table {
+ min-width: 720px;
+ }
+ .admin-login-toggles {
+ top: max(0.75rem, env(safe-area-inset-top, 0px));
+ right: max(0.75rem, env(safe-area-inset-right, 0px));
+ }
+}
+
+@media (min-width: 861px) {
+ .admin-top > .brand {
+ flex: 0 0 auto;
+ }
+ .admin-nav {
+ margin-left: auto;
+ }
+}
.danger-page {
max-width: 520px;
}
@@ -1262,12 +1649,9 @@ html[data-theme="light"] .admin-nav {
}
.stats-grid {
display: grid;
- grid-template-columns: repeat(4, minmax(0, 1fr));
+ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 0.75rem;
}
-@media (max-width: 1100px) {
- .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
-}
@media (max-width: 620px) {
.stats-grid { grid-template-columns: 1fr; }
}
@@ -1643,6 +2027,11 @@ body.modal-open {
display: grid;
place-items: center;
padding: 1.25rem;
+ /* iOS: безопасные отступы от notch / home indicator */
+ padding: max(0.75rem, env(safe-area-inset-top, 0px))
+ max(0.75rem, env(safe-area-inset-right, 0px))
+ max(0.75rem, env(safe-area-inset-bottom, 0px))
+ max(0.75rem, env(safe-area-inset-left, 0px));
}
.modal-root.hidden {
display: none;
@@ -1659,6 +2048,10 @@ html[data-theme="light"] .modal-backdrop {
.modal-panel {
position: relative;
width: min(420px, 100%);
+ max-height: calc(100vh - 1.5rem);
+ overflow-y: auto;
+ -webkit-overflow-scrolling: touch;
+ overscroll-behavior: contain;
background: var(--panel);
border: 1px solid var(--line);
border-radius: 16px;
@@ -1666,6 +2059,17 @@ html[data-theme="light"] .modal-backdrop {
padding: 1.35rem 1.4rem 1.25rem;
animation: modal-in 0.18s ease-out;
}
+@supports (height: 100dvh) {
+ .modal-panel {
+ max-height: calc(100dvh - 1.5rem);
+ }
+}
+/* Список языков: скролл внутри сетки, заголовок и Cancel остаются на экране */
+.modal-panel.lang-modal-panel {
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
+}
@keyframes modal-in {
from { opacity: 0; transform: translateY(8px) scale(0.98); }
to { opacity: 1; transform: none; }
diff --git a/app/static/js/admin-nav.js b/app/static/js/admin-nav.js
new file mode 100644
index 0000000..be39e29
--- /dev/null
+++ b/app/static/js/admin-nav.js
@@ -0,0 +1,52 @@
+(() => {
+ const top = document.getElementById("admin-top");
+ const toggle = document.getElementById("admin-nav-toggle");
+ const nav = document.getElementById("admin-nav");
+ if (!top || !toggle || !nav) return;
+
+ const mq = window.matchMedia("(max-width: 860px)");
+
+ const syncLabel = () => {
+ const open = top.classList.contains("is-nav-open");
+ const key = open ? "admin.nav.closeMenu" : "admin.nav.openMenu";
+ const label = window.WrappedI18n?.t(key) || (open ? "Close menu" : "Menu");
+ toggle.setAttribute("aria-label", label);
+ toggle.setAttribute("title", label);
+ };
+
+ const setOpen = (open) => {
+ top.classList.toggle("is-nav-open", open);
+ toggle.setAttribute("aria-expanded", open ? "true" : "false");
+ const icon = toggle.querySelector("i");
+ if (icon) {
+ icon.className = open ? "fa-solid fa-xmark" : "fa-solid fa-bars";
+ }
+ syncLabel();
+ };
+
+ toggle.addEventListener("click", () => {
+ setOpen(!top.classList.contains("is-nav-open"));
+ });
+
+ nav.addEventListener("click", (e) => {
+ if (!mq.matches) return;
+ if (e.target.closest("a.admin-nav-link")) setOpen(false);
+ });
+
+ document.addEventListener("keydown", (e) => {
+ if (e.key === "Escape" && top.classList.contains("is-nav-open")) {
+ setOpen(false);
+ toggle.focus();
+ }
+ });
+
+ mq.addEventListener("change", () => {
+ if (!mq.matches) setOpen(false);
+ else syncLabel();
+ });
+
+ if (window.WrappedI18n?.onChange) {
+ window.WrappedI18n.onChange(syncLabel);
+ }
+ syncLabel();
+})();
diff --git a/app/static/js/create.js b/app/static/js/create.js
index 496add8..086a213 100644
--- a/app/static/js/create.js
+++ b/app/static/js/create.js
@@ -25,8 +25,15 @@
composer: document.querySelector(".composer"),
shareLink: document.getElementById("share-link"),
shareToken: document.getElementById("share-token"),
+ sharePassword: document.getElementById("share-password"),
+ passwordBlock: document.getElementById("success-password-block"),
+ shareQr: document.getElementById("share-qr"),
expiresMeta: document.getElementById("expires-meta"),
captchaSlot: document.getElementById("captcha-slot"),
+ sizeMeter: document.getElementById("size-meter"),
+ checkPasswordItem: document.getElementById("check-password-item"),
+ shareNative: document.getElementById("share-native"),
+ downloadQr: document.getElementById("download-qr"),
};
function showError(msg) {
@@ -100,6 +107,34 @@
document.body.classList.remove("modal-open");
}
+ function estimatePayloadBytes() {
+ const textBytes = new TextEncoder().encode(els.text?.value || "").length;
+ const fileBytes = files.reduce((sum, f) => sum + (Number(f.size) || 0), 0);
+ return textBytes + fileBytes;
+ }
+
+ function refreshSizeMeter() {
+ if (!els.sizeMeter || !settings) return;
+ const used = estimatePayloadBytes();
+ const max = Number(settings.max_upload_bytes) || 0;
+ if (!max) {
+ els.sizeMeter.textContent = "";
+ els.sizeMeter.classList.remove("is-warn", "is-over");
+ return;
+ }
+ const fmt = window.WrappedUI.formatBytes;
+ let text = t("create.sizeMeter", {
+ used: fmt(used),
+ max: fmt(max),
+ });
+ const near = used > max * 0.85 && used <= max;
+ const over = used > max;
+ if (near) text = `${text} · ${t("create.sizeNearLimit")}`;
+ els.sizeMeter.textContent = text;
+ els.sizeMeter.classList.toggle("is-over", over);
+ els.sizeMeter.classList.toggle("is-warn", near);
+ }
+
function renderFiles() {
els.fileList.innerHTML = "";
files.forEach((f, idx) => {
@@ -115,6 +150,7 @@
li.appendChild(btn);
els.fileList.appendChild(li);
});
+ refreshSizeMeter();
}
function addFiles(list) {
@@ -207,6 +243,8 @@
loadCaptcha();
setLanguage("plaintext", { silent: true });
refreshHighlight();
+ refreshSizeMeter();
+ syncShareControls();
}
els.dropzone.addEventListener("click", () => els.fileInput.click());
@@ -243,6 +281,7 @@
els.text.addEventListener("input", () => {
refreshHighlight();
+ refreshSizeMeter();
});
els.text.addEventListener("scroll", () => {
const pre = els.highlight.parentElement;
@@ -260,19 +299,104 @@
}
});
+ function renderShareQr(link) {
+ if (!els.shareQr) return;
+ els.shareQr.innerHTML = "";
+ if (!link || typeof QRCode === "undefined") return;
+ const size = window.matchMedia("(max-width: 860px)").matches ? 200 : 164;
+ // eslint-disable-next-line no-new
+ new QRCode(els.shareQr, {
+ text: link,
+ width: size,
+ height: size,
+ colorDark: "#0d1420",
+ colorLight: "#ffffff",
+ correctLevel: QRCode.CorrectLevel.M,
+ });
+ }
+
+ function syncShareControls() {
+ if (els.shareNative) {
+ const canShare = typeof navigator.share === "function";
+ els.shareNative.classList.toggle("hidden", !canShare);
+ els.shareNative.setAttribute("aria-label", t("create.share"));
+ }
+ if (els.downloadQr) {
+ els.downloadQr.setAttribute("aria-label", t("create.downloadQr"));
+ }
+ }
+
+ function showSuccess({ link, token, password, expiresAt }) {
+ els.shareLink.value = link;
+ els.shareToken.value = token;
+ lastExpiresAt = expiresAt;
+ refreshExpiresMeta();
+ if (password) {
+ els.sharePassword.value = password;
+ els.passwordBlock.classList.remove("hidden");
+ els.checkPasswordItem?.classList.remove("hidden");
+ } else {
+ els.sharePassword.value = "";
+ els.passwordBlock.classList.add("hidden");
+ els.checkPasswordItem?.classList.add("hidden");
+ }
+ renderShareQr(link);
+ syncShareControls();
+ els.composer.classList.add("hidden");
+ els.success.classList.remove("hidden");
+ els.success.scrollIntoView({ behavior: "smooth", block: "start" });
+ }
+
async function copyFrom(input, btn) {
- await navigator.clipboard.writeText(input.value);
+ try {
+ await window.WrappedUI.copyText(input.value);
+ } catch {
+ await navigator.clipboard.writeText(input.value);
+ }
const old = btn.textContent;
btn.textContent = t("common.copied");
setTimeout(() => (btn.textContent = old), 1200);
}
+ function downloadQrPng() {
+ if (!els.shareQr) return;
+ const canvas = els.shareQr.querySelector("canvas");
+ const img = els.shareQr.querySelector("img");
+ let href = "";
+ if (canvas && canvas.toDataURL) {
+ href = canvas.toDataURL("image/png");
+ } else if (img?.src) {
+ href = img.src;
+ }
+ if (!href) return;
+ const a = document.createElement("a");
+ a.href = href;
+ a.download = "wrapped-qr.png";
+ a.click();
+ }
+
document.getElementById("copy-link").addEventListener("click", () => {
copyFrom(els.shareLink, document.getElementById("copy-link"));
});
document.getElementById("copy-token").addEventListener("click", () => {
copyFrom(els.shareToken, document.getElementById("copy-token"));
});
+ document.getElementById("copy-password")?.addEventListener("click", () => {
+ copyFrom(els.sharePassword, document.getElementById("copy-password"));
+ });
+ els.shareNative?.addEventListener("click", async () => {
+ if (typeof navigator.share !== "function" || !els.shareLink.value) return;
+ try {
+ await navigator.share({
+ title: t("create.shareTitle"),
+ text: t("create.shareText"),
+ url: els.shareLink.value,
+ });
+ } catch {
+ /* user cancelled or unsupported */
+ }
+ });
+ els.downloadQr?.addEventListener("click", downloadQrPng);
document.getElementById("create-another").addEventListener("click", () => {
location.reload();
});
@@ -346,12 +470,12 @@
const data = await resp.json();
const token = window.WrappedCrypto.buildToken(data.wrap_id, keyB64url);
const link = `${location.origin}${data.share_path}#${keyB64url}`;
- els.shareLink.value = link;
- els.shareToken.value = token;
- lastExpiresAt = data.expires_at;
- refreshExpiresMeta();
- els.composer.classList.add("hidden");
- els.success.classList.remove("hidden");
+ showSuccess({
+ link,
+ token,
+ password,
+ expiresAt: data.expires_at,
+ });
} catch {
showError(t("common.error"));
} finally {
@@ -380,6 +504,8 @@
window.WrappedI18n.onChange(() => {
fillTtl();
refreshExpiresMeta();
+ refreshSizeMeter();
+ syncShareControls();
setLanguage(els.lang.value, { silent: true });
refreshHighlight();
if (els.langChipText) els.langChipText.textContent = langLabel(els.lang.value);
diff --git a/app/static/js/i18n.js b/app/static/js/i18n.js
index 1226699..b39cf6f 100644
--- a/app/static/js/i18n.js
+++ b/app/static/js/i18n.js
@@ -39,6 +39,20 @@
"create.successTitle": "Token issued",
"create.successWarnTitle": "One-time unwrap",
"create.successWarnHint": "After opening, ciphertext is deleted on the server.",
+ "create.passwordProtected": "Password protected",
+ "create.sharePassword": "Password",
+ "create.passwordSeparateHint": "Do not send the password in the same chat as the link.",
+ "create.qrHint": "Scan to open the share link",
+ "create.share": "Share",
+ "create.shareTitle": "Wrapped link",
+ "create.shareText": "One-time secure link from Wrapped",
+ "create.downloadQr": "Download QR",
+ "create.checkLink": "Copy the share link",
+ "create.checkPassword": "Send the password in a separate message",
+ "create.checkExpires": "Note the expiry time",
+ "create.trustKey": "The encryption key lives only in the link #fragment — the server never sees it.",
+ "create.sizeMeter": "≈ {used} / {max}",
+ "create.sizeNearLimit": "Approaching size limit",
"create.shareLink": "Share link",
"create.token": "Wrapped token",
"create.another": "Create another",
@@ -78,17 +92,36 @@
"unwrap.password": "Password (if set)",
"unwrap.submit": "Unwrap",
"unwrap.working": "Decrypting…",
+ "unwrap.workingFetch": "Downloading…",
+ "unwrap.workingDecrypt": "Decrypting…",
"unwrap.destroyedTitle": "Server copy destroyed",
"unwrap.destroyedHint": "Preview lives only in this browser session.",
"unwrap.needKey": "Missing encryption key. Open the full share link (with #key) or paste the full wrapped token.",
+ "unwrap.badToken": "Invalid token",
+ "unwrap.badTokenHint": "Paste a full wrapped token or open a valid share link.",
"unwrap.badPassword": "Wrong password",
"unwrap.badPasswordHint": "Check the password and try again.",
"unwrap.passwordRequired": "Password required",
"unwrap.passwordRequiredHint": "This wrap is password-protected.",
"unwrap.attemptsLeft": "{n} of {max} attempts left",
"unwrap.passwordLocked": "Too many wrong passwords",
- "unwrap.passwordLockedHint": "This wrap has been destroyed.",
- "unwrap.unavailable": "Unavailable (already used, expired, or invalid).",
+ "unwrap.passwordLockedHint": "This wrap has been destroyed after too many failed attempts.",
+ "unwrap.unavailable": "Unavailable",
+ "unwrap.unavailableHint": "Already used, expired, or invalid.",
+ "unwrap.goneTitle": "This link is no longer available",
+ "unwrap.goneHint": "Wrapped links are one-time and can expire. The ciphertext is gone from the server.",
+ "unwrap.rateLimited": "Too many requests",
+ "unwrap.rateLimitedHint": "Wait a minute and try again.",
+ "unwrap.captchaFailed": "CAPTCHA failed",
+ "unwrap.captchaFailedHint": "Complete the CAPTCHA and try again.",
+ "unwrap.storageError": "Temporary storage error",
+ "unwrap.storageErrorHint": "Try again in a moment.",
+ "unwrap.decryptFailed": "Could not decrypt",
+ "unwrap.decryptFailedHint": "The key in the link may be wrong. Ciphertext was already removed from the server.",
+ "unwrap.createOwn": "Create your own wrap",
+ "unwrap.tapPreview": "Tap image to enlarge",
+ "unwrap.downloadAll": "Download all",
+ "unwrap.trustKey": "The key was only in the link #fragment and was never sent to the server.",
"common.copy": "Copy",
"common.copied": "Copied",
"common.download": "Download",
@@ -100,6 +133,8 @@
"admin.nav.danger": "Danger",
"admin.nav.site": "Site",
"admin.nav.logout": "Logout",
+ "admin.nav.openMenu": "Menu",
+ "admin.nav.closeMenu": "Close menu",
"admin.brand.tagline": "Admin console",
"admin.settings.title": "Settings",
"admin.stats.title": "Statistics",
@@ -107,14 +142,21 @@
"admin.stats.minioTitle": "MinIO (pending ciphertext)",
"admin.stats.objects": "object(s)",
"admin.stats.dbPending": "DB pending",
- "admin.stats.unwrappedTitle": "Unwrapped (all time)",
+ "admin.stats.unwrappedTitle": "Successful unwraps",
"admin.stats.auditOk": "audit ok",
+ "admin.stats.dbConsumed": "DB consumed",
"admin.stats.last24h": "24h",
"admin.stats.pendingTitle": "Not unwrapped",
"admin.stats.items": "item(s)",
"admin.stats.uploadedTitle": "Uploaded (all time)",
+ "admin.stats.passwordBurnsTitle": "Burned by password",
+ "admin.stats.passwordBurnsHint": "Destroyed after too many wrong passwords",
"admin.stats.wrapsSection": "Wraps by status",
"admin.stats.extraSection": "More",
+ "admin.stats.failReasonsSection": "Unwrap fail reasons (all time)",
+ "admin.stats.failReasons24hSection": "Unwrap fail reasons (24h)",
+ "admin.stats.col.reason": "Reason",
+ "admin.stats.noFailReasons": "No failed unwraps yet.",
"admin.stats.col.status": "Status",
"admin.stats.col.count": "Count",
"admin.stats.col.size": "Size",
@@ -257,6 +299,20 @@
"create.successTitle": "Токен выдан",
"create.successWarnTitle": "Расшифруй один раз",
"create.successWarnHint": "После открытия ciphertext удаляется на сервере.",
+ "create.passwordProtected": "Защищено паролем",
+ "create.sharePassword": "Пароль",
+ "create.passwordSeparateHint": "Не отправляйте пароль в той же переписке, что и ссылку.",
+ "create.qrHint": "Отсканируйте, чтобы открыть ссылку",
+ "create.share": "Поделиться",
+ "create.shareTitle": "Ссылка Wrapped",
+ "create.shareText": "Одноразовая защищённая ссылка из Wrapped",
+ "create.downloadQr": "Скачать QR",
+ "create.checkLink": "Скопируйте ссылку",
+ "create.checkPassword": "Отправьте пароль отдельным сообщением",
+ "create.checkExpires": "Учтите срок действия",
+ "create.trustKey": "Ключ шифрования только во фрагменте ссылки #… — сервер его не видит.",
+ "create.sizeMeter": "≈ {used} / {max}",
+ "create.sizeNearLimit": "Близко к лимиту размера",
"create.shareLink": "Ссылка",
"create.token": "Wrapped-токен",
"create.another": "Создать ещё",
@@ -296,17 +352,36 @@
"unwrap.password": "Пароль (если задан)",
"unwrap.submit": "Расшифровать",
"unwrap.working": "Расшифровка…",
+ "unwrap.workingFetch": "Скачивание…",
+ "unwrap.workingDecrypt": "Расшифровка…",
"unwrap.destroyedTitle": "Копия на сервере уничтожена",
"unwrap.destroyedHint": "Превью только в этой сессии браузера.",
"unwrap.needKey": "Нет ключа шифрования. Открой полную ссылку (с #key) или вставь полный wrapped-токен.",
+ "unwrap.badToken": "Неверный токен",
+ "unwrap.badTokenHint": "Вставьте полный wrapped-токен или откройте корректную ссылку.",
"unwrap.badPassword": "Неверный пароль",
"unwrap.badPasswordHint": "Проверьте пароль и попробуйте снова.",
"unwrap.passwordRequired": "Нужен пароль",
"unwrap.passwordRequiredHint": "Этот wrap защищён паролем.",
"unwrap.attemptsLeft": "Осталось попыток: {n} из {max}",
"unwrap.passwordLocked": "Слишком много неверных паролей",
- "unwrap.passwordLockedHint": "Этот wrap уничтожен.",
- "unwrap.unavailable": "Недоступно (уже использовано, истекло или неверно).",
+ "unwrap.passwordLockedHint": "Wrap уничтожен после исчерпания попыток.",
+ "unwrap.unavailable": "Недоступно",
+ "unwrap.unavailableHint": "Уже использовано, истекло или неверно.",
+ "unwrap.goneTitle": "Ссылка больше недоступна",
+ "unwrap.goneHint": "Wrapped-ссылки одноразовые и могут истекать. Ciphertext уже удалён с сервера.",
+ "unwrap.rateLimited": "Слишком много запросов",
+ "unwrap.rateLimitedHint": "Подождите минуту и попробуйте снова.",
+ "unwrap.captchaFailed": "CAPTCHA не пройдена",
+ "unwrap.captchaFailedHint": "Пройдите CAPTCHA и попробуйте снова.",
+ "unwrap.storageError": "Временная ошибка хранилища",
+ "unwrap.storageErrorHint": "Попробуйте чуть позже.",
+ "unwrap.decryptFailed": "Не удалось расшифровать",
+ "unwrap.decryptFailedHint": "Ключ в ссылке может быть неверным. Ciphertext уже удалён с сервера.",
+ "unwrap.createOwn": "Создать свой wrap",
+ "unwrap.tapPreview": "Нажмите на изображение, чтобы увеличить",
+ "unwrap.downloadAll": "Скачать всё",
+ "unwrap.trustKey": "Ключ был только во фрагменте ссылки #… и не уходил на сервер.",
"common.copy": "Копировать",
"common.copied": "Скопировано",
"common.download": "Скачать",
@@ -318,6 +393,8 @@
"admin.nav.danger": "Опасная зона",
"admin.nav.site": "Сайт",
"admin.nav.logout": "Выйти",
+ "admin.nav.openMenu": "Меню",
+ "admin.nav.closeMenu": "Закрыть меню",
"admin.brand.tagline": "Консоль администратора",
"admin.settings.title": "Настройки",
"admin.stats.title": "Статистика",
@@ -325,14 +402,21 @@
"admin.stats.minioTitle": "MinIO (нерасшифрованный ciphertext)",
"admin.stats.objects": "объект(ов)",
"admin.stats.dbPending": "в БД pending",
- "admin.stats.unwrappedTitle": "Расшифровано (за всё время)",
+ "admin.stats.unwrappedTitle": "Успешные unwrap",
"admin.stats.auditOk": "audit ok",
+ "admin.stats.dbConsumed": "в БД consumed",
"admin.stats.last24h": "за 24ч",
"admin.stats.pendingTitle": "Не расшифровано",
"admin.stats.items": "элемент(ов)",
"admin.stats.uploadedTitle": "Загружено (за всё время)",
+ "admin.stats.passwordBurnsTitle": "Сожжено паролем",
+ "admin.stats.passwordBurnsHint": "Уничтожено после слишком многих неверных паролей",
"admin.stats.wrapsSection": "Wraps по статусу",
"admin.stats.extraSection": "Ещё",
+ "admin.stats.failReasonsSection": "Причины ошибок unwrap (всё время)",
+ "admin.stats.failReasons24hSection": "Причины ошибок unwrap (24ч)",
+ "admin.stats.col.reason": "Причина",
+ "admin.stats.noFailReasons": "Пока нет неудачных unwrap.",
"admin.stats.col.status": "Статус",
"admin.stats.col.count": "Кол-во",
"admin.stats.col.size": "Размер",
diff --git a/app/static/js/theme.js b/app/static/js/theme.js
index 2aabd44..a35d3b1 100644
--- a/app/static/js/theme.js
+++ b/app/static/js/theme.js
@@ -1,8 +1,14 @@
(() => {
const KEY = "wrapped.theme";
+ function systemTheme() {
+ return window.matchMedia("(prefers-color-scheme: light)").matches ? "light" : "dark";
+ }
+
function preferred() {
- return localStorage.getItem(KEY) || "dark";
+ const stored = localStorage.getItem(KEY);
+ if (stored === "light" || stored === "dark") return stored;
+ return systemTheme();
}
function apply(theme) {
@@ -16,7 +22,8 @@
}
function toggle() {
- const next = preferred() === "dark" ? "light" : "dark";
+ const current = document.documentElement.getAttribute("data-theme") || preferred();
+ const next = current === "dark" ? "light" : "dark";
localStorage.setItem(KEY, next);
apply(next);
}
diff --git a/app/static/js/ui.js b/app/static/js/ui.js
index fc817b6..45040e9 100644
--- a/app/static/js/ui.js
+++ b/app/static/js/ui.js
@@ -8,10 +8,13 @@
busyEl.className = "busy-overlay hidden";
busyEl.setAttribute("aria-live", "polite");
busyEl.setAttribute("aria-busy", "true");
+ const favicon =
+ document.querySelector('link[rel="icon"][type="image/svg+xml"]')?.href ||
+ "/static/favicon.svg";
busyEl.innerHTML = `
- 
+ 
@@ -48,5 +51,18 @@
return `${gb.toFixed(2)} GB`;
}
- window.WrappedUI = { showBusy, hideBusy, formatBytes };
+ function hapticLight() {
+ try {
+ navigator.vibrate?.(12);
+ } catch {
+ /* ignore */
+ }
+ }
+
+ async function copyText(text) {
+ await navigator.clipboard.writeText(text || "");
+ hapticLight();
+ }
+
+ window.WrappedUI = { showBusy, hideBusy, formatBytes, hapticLight, copyText };
})();
diff --git a/app/static/js/unwrap.js b/app/static/js/unwrap.js
index 3b8a0f0..ed4d9aa 100644
--- a/app/static/js/unwrap.js
+++ b/app/static/js/unwrap.js
@@ -1,6 +1,7 @@
(() => {
const t = (k, vars) => window.WrappedI18n.t(k, vars);
let settings = null;
+ const objectUrls = [];
const els = {
token: document.getElementById("token-input"),
@@ -11,11 +12,24 @@
errorHint: document.getElementById("form-error-hint"),
errorAttempts: document.getElementById("form-error-attempts"),
form: document.getElementById("unwrap-form"),
+ head: document.getElementById("unwrap-head"),
+ state: document.getElementById("unwrap-state"),
+ stateTitle: document.getElementById("unwrap-state-title"),
+ stateHint: document.getElementById("unwrap-state-hint"),
+ stateFa: document.getElementById("unwrap-state-fa"),
result: document.getElementById("result-panel"),
items: document.getElementById("items"),
captchaSlot: document.getElementById("captcha-slot"),
+ lightbox: document.getElementById("image-lightbox"),
+ lightboxImg: document.getElementById("lightbox-img"),
+ lightboxCaption: document.getElementById("lightbox-caption"),
+ lightboxClose: document.getElementById("lightbox-close"),
+ downloadAll: document.getElementById("download-all"),
};
+ let lastPack = null;
+ let lastWrapId = null;
+
function showError(title, hint, attempts) {
if (!els.error) return;
if (els.errorTitle) els.errorTitle.textContent = title || "";
@@ -37,7 +51,6 @@
els.errorAttempts.classList.add("hidden");
}
}
- // Fallback if structured nodes missing
if (!els.errorTitle) els.error.textContent = [title, hint, attempts].filter(Boolean).join(" ");
els.error.classList.remove("hidden");
}
@@ -56,6 +69,17 @@
}
}
+ function showState({ title, hint, icon = "fa-link-slash" }) {
+ clearError();
+ els.form?.classList.add("hidden");
+ els.head?.classList.add("hidden");
+ els.result?.classList.add("hidden");
+ if (els.stateFa) els.stateFa.className = `fa-solid ${icon}`;
+ if (els.stateTitle) els.stateTitle.textContent = title || "";
+ if (els.stateHint) els.stateHint.textContent = hint || "";
+ els.state?.classList.remove("hidden");
+ }
+
function attemptsLabel(detail) {
const n = Number(detail?.attempts_remaining);
const max = Number(detail?.attempts_max);
@@ -63,6 +87,41 @@
return t("unwrap.attemptsLeft", { n, max });
}
+ function trackUrl(url) {
+ objectUrls.push(url);
+ return url;
+ }
+
+ function revokeAllUrls() {
+ while (objectUrls.length) {
+ try {
+ URL.revokeObjectURL(objectUrls.pop());
+ } catch {
+ /* ignore */
+ }
+ }
+ }
+
+ function closeLightbox() {
+ if (!els.lightbox) return;
+ els.lightbox.classList.add("hidden");
+ document.body.classList.remove("modal-open");
+ if (els.lightboxImg) {
+ els.lightboxImg.removeAttribute("src");
+ els.lightboxImg.alt = "";
+ }
+ if (els.lightboxCaption) els.lightboxCaption.textContent = "";
+ }
+
+ function openLightbox(src, caption) {
+ if (!els.lightbox || !els.lightboxImg) return;
+ els.lightboxImg.src = src;
+ els.lightboxImg.alt = caption || "";
+ if (els.lightboxCaption) els.lightboxCaption.textContent = caption || "";
+ els.lightbox.classList.remove("hidden");
+ document.body.classList.add("modal-open");
+ }
+
function loadCaptcha() {
els.captchaSlot.innerHTML = "";
const provider = settings.captcha_provider;
@@ -105,10 +164,11 @@
function downloadBlob(name, blob) {
const a = document.createElement("a");
- a.href = URL.createObjectURL(blob);
+ const url = URL.createObjectURL(blob);
+ a.href = url;
a.download = name;
a.click();
- setTimeout(() => URL.revokeObjectURL(a.href), 2000);
+ setTimeout(() => URL.revokeObjectURL(url), 2000);
}
function makeDownloadBtn(onClick) {
@@ -120,6 +180,12 @@
return btn;
}
+ function focusPassword({ select = false } = {}) {
+ if (!els.password) return;
+ els.password.focus();
+ if (select) els.password.select?.();
+ }
+
function makeCopyBtn(getText) {
const btn = document.createElement("button");
btn.className = "btn copy-btn";
@@ -129,7 +195,11 @@
btn.innerHTML = label();
btn.addEventListener("click", async () => {
try {
- await navigator.clipboard.writeText(getText() || "");
+ if (window.WrappedUI?.copyText) {
+ await window.WrappedUI.copyText(getText() || "");
+ } else {
+ await navigator.clipboard.writeText(getText() || "");
+ }
btn.innerHTML = `${t("common.copied")}`;
setTimeout(() => {
btn.innerHTML = label();
@@ -141,7 +211,71 @@
return btn;
}
+ function itemToBlob(item) {
+ if (item.type === "text") {
+ const lang = item.language || "plaintext";
+ return {
+ name: `wrapped-${lang}.txt`,
+ blob: new Blob([item.content || ""], { type: "text/plain" }),
+ };
+ }
+ if (item.type === "file") {
+ const bytes = window.WrappedCrypto.base64ToBytes(item.data_b64);
+ const mime = item.mime || "application/octet-stream";
+ return {
+ name: item.name || "file",
+ blob: new Blob([bytes], { type: mime }),
+ };
+ }
+ return null;
+ }
+
+ function uniqueZipName(name, used) {
+ let base = name || "file";
+ if (!used.has(base)) {
+ used.add(base);
+ return base;
+ }
+ const dot = base.lastIndexOf(".");
+ const stem = dot > 0 ? base.slice(0, dot) : base;
+ const ext = dot > 0 ? base.slice(dot) : "";
+ let i = 2;
+ let candidate = `${stem}-${i}${ext}`;
+ while (used.has(candidate)) {
+ i += 1;
+ candidate = `${stem}-${i}${ext}`;
+ }
+ used.add(candidate);
+ return candidate;
+ }
+
+ async function downloadAllZip() {
+ if (!lastPack || typeof JSZip === "undefined") return;
+ const items = lastPack.items || [];
+ if (items.length < 2) return;
+ const zip = new JSZip();
+ const used = new Set();
+ for (const item of items) {
+ const entry = itemToBlob(item);
+ if (!entry) continue;
+ zip.file(uniqueZipName(entry.name, used), entry.blob);
+ }
+ const blob = await zip.generateAsync({ type: "blob" });
+ const id = lastWrapId || "pack";
+ downloadBlob(`wrapped-${id}.zip`, blob);
+ }
+
+ function syncDownloadAll() {
+ if (!els.downloadAll) return;
+ const count = lastPack?.items?.length || 0;
+ const show = count >= 2 && typeof JSZip !== "undefined";
+ els.downloadAll.classList.toggle("hidden", !show);
+ els.downloadAll.setAttribute("aria-label", t("unwrap.downloadAll"));
+ }
+
function renderPackage(pack) {
+ revokeAllUrls();
+ lastPack = pack;
els.items.innerHTML = "";
for (const item of pack.items || []) {
const card = document.createElement("div");
@@ -151,7 +285,16 @@
const text = item.content || "";
const head = document.createElement("div");
head.className = "item-card-head";
- head.innerHTML = `text · ${lang}
`;
+ const meta = document.createElement("div");
+ const strong = document.createElement("strong");
+ strong.textContent = "text";
+ meta.appendChild(strong);
+ meta.appendChild(document.createTextNode(" · "));
+ const langEl = document.createElement("span");
+ langEl.className = "mono";
+ langEl.textContent = lang;
+ meta.appendChild(langEl);
+ head.appendChild(meta);
const actions = document.createElement("div");
actions.className = "item-card-actions";
actions.appendChild(makeCopyBtn(() => text));
@@ -170,28 +313,86 @@
window.WrappedHighlight.highlightElement(code, text, lang);
} else if (item.type === "file") {
const bytes = window.WrappedCrypto.base64ToBytes(item.data_b64);
- const blob = new Blob([bytes], { type: item.mime || "application/octet-stream" });
+ const mime = item.mime || "application/octet-stream";
+ const blob = new Blob([bytes], { type: mime });
+ const name = item.name || "file";
const head = document.createElement("div");
head.className = "item-card-head";
- head.innerHTML = `${item.name} · ${item.mime} · ${window.WrappedUI.formatBytes(bytes.length)}
`;
- head.appendChild(makeDownloadBtn(() => downloadBlob(item.name || "file", blob)));
+ const meta = document.createElement("div");
+ const strong = document.createElement("strong");
+ strong.textContent = name;
+ meta.appendChild(strong);
+ meta.appendChild(document.createTextNode(" · "));
+ const mimeEl = document.createElement("span");
+ mimeEl.className = "mono";
+ mimeEl.textContent = mime;
+ meta.appendChild(mimeEl);
+ meta.appendChild(document.createTextNode(` · ${window.WrappedUI.formatBytes(bytes.length)}`));
+ head.appendChild(meta);
+ head.appendChild(makeDownloadBtn(() => downloadBlob(name, blob)));
card.appendChild(head);
- if ((item.mime || "").startsWith("image/")) {
+ if (mime.startsWith("image/")) {
+ const url = trackUrl(URL.createObjectURL(blob));
const img = document.createElement("img");
- img.alt = item.name;
- img.src = URL.createObjectURL(blob);
+ img.alt = name;
+ img.src = url;
+ img.className = "item-preview-img";
+ img.loading = "lazy";
+ img.addEventListener("click", () => openLightbox(url, name));
card.appendChild(img);
+ const tip = document.createElement("p");
+ tip.className = "hint item-preview-hint";
+ tip.textContent = t("unwrap.tapPreview");
+ card.appendChild(tip);
}
}
els.items.appendChild(card);
}
+ syncDownloadAll();
}
+ function mapHttpError(resp, detail) {
+ if (resp.status === 429 || detail === "rate_limited") {
+ showError(t("unwrap.rateLimited"), t("unwrap.rateLimitedHint"));
+ return;
+ }
+ if (detail === "captcha_failed" || resp.status === 400) {
+ if (detail === "captcha_failed") {
+ showError(t("unwrap.captchaFailed"), t("unwrap.captchaFailedHint"));
+ return;
+ }
+ }
+ if (resp.status === 500 || detail === "storage_error") {
+ showError(t("unwrap.storageError"), t("unwrap.storageErrorHint"));
+ return;
+ }
+ if (resp.status === 410 || detail === "unavailable") {
+ showState({
+ title: t("unwrap.goneTitle"),
+ hint: t("unwrap.goneHint"),
+ icon: "fa-link-slash",
+ });
+ return;
+ }
+ showError(t("unwrap.unavailable"), t("unwrap.unavailableHint"));
+ }
+
+ els.lightboxClose?.addEventListener("click", closeLightbox);
+ els.lightbox?.addEventListener("click", (e) => {
+ if (e.target === els.lightbox) closeLightbox();
+ });
+ document.addEventListener("keydown", (e) => {
+ if (e.key === "Escape" && els.lightbox && !els.lightbox.classList.contains("hidden")) {
+ closeLightbox();
+ }
+ });
+ window.addEventListener("pagehide", revokeAllUrls);
+
els.btn.addEventListener("click", async () => {
clearError();
const parsed = window.WrappedCrypto.parseToken(els.token.value);
if (!parsed) {
- showError(t("unwrap.unavailable"));
+ showError(t("unwrap.badToken"), t("unwrap.badTokenHint"));
return;
}
const key = resolveKey(parsed);
@@ -201,7 +402,7 @@
}
els.btn.disabled = true;
- window.WrappedUI.showBusy(t("unwrap.working"));
+ window.WrappedUI.showBusy(t("unwrap.workingFetch"));
try {
const resp = await fetch(`/api/v1/wraps/${encodeURIComponent(parsed.wrapId)}/unwrap`, {
method: "POST",
@@ -216,10 +417,11 @@
const detail = err.detail;
if (detail && typeof detail === "object") {
if (detail.code === "password_locked") {
- showError(
- t("unwrap.passwordLocked"),
- t("unwrap.passwordLockedHint")
- );
+ showState({
+ title: t("unwrap.passwordLocked"),
+ hint: t("unwrap.passwordLockedHint"),
+ icon: "fa-shield-halved",
+ });
return;
}
if (detail.code === "password_required") {
@@ -228,7 +430,7 @@
t("unwrap.passwordRequiredHint"),
attemptsLabel(detail)
);
- els.password?.focus();
+ focusPassword({ select: true });
return;
}
if (detail.code === "bad_password") {
@@ -237,19 +439,21 @@
t("unwrap.badPasswordHint"),
attemptsLabel(detail)
);
- els.password?.focus();
- els.password?.select?.();
+ focusPassword({ select: true });
return;
}
}
showError(t("unwrap.badPassword"), t("unwrap.badPasswordHint"));
+ focusPassword({ select: true });
return;
}
if (!resp.ok) {
- showError(t("unwrap.unavailable"));
+ const err = await resp.json().catch(() => ({}));
+ mapHttpError(resp, err.detail);
return;
}
const data = await resp.json();
+ window.WrappedUI.showBusy(t("unwrap.workingDecrypt"));
const ciphertext = window.WrappedCrypto.base64ToBytes(data.ciphertext_b64);
let pack;
try {
@@ -261,17 +465,22 @@
} catch (err) {
if (err.message === "password_required") {
showError(t("unwrap.passwordRequired"), t("unwrap.passwordRequiredHint"));
+ focusPassword({ select: true });
return;
}
if (err.message === "bad_password") {
showError(t("unwrap.badPassword"), t("unwrap.badPasswordHint"));
+ focusPassword({ select: true });
return;
}
- showError(t("common.error"));
+ showError(t("unwrap.decryptFailed"), t("unwrap.decryptFailedHint"));
return;
}
+ lastWrapId = parsed.wrapId;
renderPackage(pack);
els.form.classList.add("hidden");
+ els.head?.classList.add("hidden");
+ els.state?.classList.add("hidden");
els.result.classList.remove("hidden");
history.replaceState(null, "", location.pathname);
} catch {
@@ -282,6 +491,23 @@
}
});
+ els.password?.addEventListener("keydown", (e) => {
+ if (e.key === "Enter") {
+ e.preventDefault();
+ els.btn?.click();
+ }
+ });
+
+ els.downloadAll?.addEventListener("click", () => {
+ downloadAllZip().catch(() => {});
+ });
+
+ if (window.WrappedI18n.onChange) {
+ window.WrappedI18n.onChange(() => {
+ syncDownloadAll();
+ });
+ }
+
async function init() {
const resp = await fetch("/api/v1/settings");
settings = await resp.json();
@@ -295,4 +521,3 @@
init().catch(() => showError(t("common.error")));
})();
-
diff --git a/app/static/manifest.webmanifest b/app/static/manifest.webmanifest
new file mode 100644
index 0000000..081ab98
--- /dev/null
+++ b/app/static/manifest.webmanifest
@@ -0,0 +1,17 @@
+{
+ "name": "Wrapped",
+ "short_name": "Wrapped",
+ "description": "Zero-knowledge one-time encrypted drop for text and files.",
+ "start_url": "/",
+ "display": "standalone",
+ "background_color": "#0b1020",
+ "theme_color": "#0b1020",
+ "icons": [
+ {
+ "src": "/static/favicon.svg",
+ "sizes": "any",
+ "type": "image/svg+xml",
+ "purpose": "any"
+ }
+ ]
+}
diff --git a/app/static_url.py b/app/static_url.py
new file mode 100644
index 0000000..825ab19
--- /dev/null
+++ b/app/static_url.py
@@ -0,0 +1,25 @@
+from __future__ import annotations
+
+from pathlib import Path
+
+from app.version import get_app_version
+
+_STATIC_ROOT = Path(__file__).resolve().parent / "static"
+
+
+def static_url(path: str) -> str:
+ """URL for a file under app/static with cache-busting query (?v=...).
+
+ Stamp = app version + file mtime so CSS/JS updates apply even when VERSION
+ is unchanged (compose bind-mount / same-tag redeploy).
+ """
+ rel = path.lstrip("/")
+ if rel.startswith("static/"):
+ rel = rel[len("static/") :]
+ stamp = get_app_version()
+ try:
+ mtime = int((_STATIC_ROOT / rel).stat().st_mtime)
+ stamp = f"{stamp}.{mtime}"
+ except OSError:
+ pass
+ return f"/static/{rel}?v={stamp}"
diff --git a/app/templates/admin_audit.html b/app/templates/admin_audit.html
index 6750e4f..de93176 100644
--- a/app/templates/admin_audit.html
+++ b/app/templates/admin_audit.html
@@ -140,5 +140,5 @@
{% endblock %}
{% block admin_scripts %}
-
+
{% endblock %}
diff --git a/app/templates/admin_base.html b/app/templates/admin_base.html
index 9d02b99..4ac0da0 100644
--- a/app/templates/admin_base.html
+++ b/app/templates/admin_base.html
@@ -7,15 +7,17 @@
-
-
-
-
+
+
+
+
+
+
-