Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
 hnzio
|
4fe61971e4 | ||
|
hnzio
|
c3033479b5 | ||
|
hnzio
|
2851c7d936 | ||
|
hnzio
|
22ae3a68d6 | ||
|
hnzio
|
dfa236390d | ||
|
hnzio
|
b2467b87f5 | ||
|
hnzio
|
4fed048843 | ||
|
hnzio
|
f466df2c5c |
No files matched your search
@@ -0,0 +1,11 @@
|
||||
# Third-party notices
|
||||
|
||||
## Font Awesome Pro Plus 7.0.0
|
||||
|
||||
The icon metadata in `src/lib/icons/classic-regular.ts` and the SVG sprite in
|
||||
`static/icons/classic-regular.svg` are derived from Font Awesome Pro Plus 7.0.0
|
||||
Classic Regular. Font Awesome Pro is commercial software and remains subject to
|
||||
the Font Awesome Pro commercial license:
|
||||
https://fontawesome.com/license
|
||||
|
||||
The Sendewerk MIT license does not apply to that icon data.
|
||||
@@ -215,3 +215,200 @@
|
||||
Präsentationswerkzeug visuell kontrolliert; langer Titel bricht vollständig um,
|
||||
Werkzeugfläche ist opak und die Speicherleiste überdeckt mobil keine Eingaben
|
||||
- `bash -n start.sh` und `git diff --check`: erfolgreich
|
||||
|
||||
## Oberflächenrelease 0.5.4
|
||||
|
||||
| Kriterium | Nachweis | Stand |
|
||||
| ------------------------------------------ | ---------------------------------------------------------------------------------------------- | --------------------- |
|
||||
| Klare Hierarchie in beiden Themes | Eingang, Fundus, Editor, Sendungsplan und Live-Steuerung in Light/Dark visuell kontrolliert | erfüllt am 22.10.2026 |
|
||||
| Exakte heinzlive-Darkmode-Farben | berechnete Theme-Tokens und Screenshots der dunklen Arbeitsansichten geprüft | erfüllt am 22.10.2026 |
|
||||
| Responsive Darstellung ohne Seitenüberlauf | Chromium-Messung bei 1440 × 1000 und 390 × 844 Pixeln auf allen gezielt geprüften Ansichten | erfüllt am 22.10.2026 |
|
||||
| Sendungsplan-Aktionen bleiben erreichbar | drei sichtbare Aktionen einer Planzeile liegen waagerecht auf gleicher Höhe; Mobilbild geprüft | erfüllt am 22.10.2026 |
|
||||
| Fokus und reduzierte Bewegung | sichtbarer Cyan-Fokusring und bestehende `prefers-reduced-motion`-Regeln im Stylesheet geprüft | erfüllt am 22.10.2026 |
|
||||
|
||||
## Ausgeführte Prüfungen Oberflächenrelease 0.5.4
|
||||
|
||||
- `npm run check`: 0 Fehler und 0 Warnungen
|
||||
- `npm run build`: erfolgreich mit `@sveltejs/adapter-node`
|
||||
- gezielter Chromium-Lauf für Eingang, Fundus, Piece-Editor, Sendungsplan und
|
||||
Live-Steuerung bei 1440 × 1000 und 390 × 844 Pixeln in Light/Dark ohne
|
||||
Konsolenfehler oder horizontalen Seitenüberlauf
|
||||
- Desktop- und Mobilaufnahmen aller genannten Ansichten visuell kontrolliert
|
||||
- vollständige Unit- und E2E-Matrix nicht erneut ausgeführt, weil dieser Release
|
||||
ausschließlich Darstellung und redaktionelle Kurztexte verändert
|
||||
- `git diff --check`: erfolgreich
|
||||
|
||||
## Oberflächenkorrektur 0.5.5
|
||||
|
||||
| Kriterium | Nachweis | Stand |
|
||||
| ------------------------------------- | ------------------------------------------------------------------------------------------- | --------------------- |
|
||||
| Nachtblau und Glaswirkung erkennbar | berechnete Transparenz/Unschärfe und Desktop-/Mobilaufnahmen in Darkmode geprüft | erfüllt am 22.10.2026 |
|
||||
| Schreibfelder im Ruhezustand sichtbar | deckende Feldfarbe, feine Kontur, Innenabstand und Textcursor im Piece-Editor geprüft | erfüllt am 22.10.2026 |
|
||||
| Goldener Tastaturfokus | berechnete Fokusfarbe und Fokus-Schatten am Titelfeld geprüft; Cyanrahmen nicht mehr aktiv | erfüllt am 22.10.2026 |
|
||||
| Inhaltsgerechte Feldhöhen | kurze Einleitung ist niedriger als ausführliche Moderationsfläche; beide bleiben skalierbar | erfüllt am 22.10.2026 |
|
||||
| Lightmode und Smartphone erhalten | fünf Arbeitsansichten bei 1440 × 1000 und 390 × 844 Pixeln ohne Seitenüberlauf geprüft | erfüllt am 22.10.2026 |
|
||||
|
||||
## Ausgeführte Prüfungen Oberflächenkorrektur 0.5.5
|
||||
|
||||
- `npm run check`: 0 Fehler und 0 Warnungen
|
||||
- `npm run build`: erfolgreich mit `@sveltejs/adapter-node`
|
||||
- gezielter Chromium-Lauf in Light/Dark und Desktop/Mobil ohne Konsolenfehler
|
||||
oder horizontalen Seitenüberlauf; Glas-, Feld- und Fokuswerte zusätzlich
|
||||
programmatisch geprüft
|
||||
- vollständige Unit- und E2E-Matrix gemäß Auftrag nicht erneut ausgeführt
|
||||
- `git diff --check`: erfolgreich
|
||||
|
||||
## Oberflächenkorrektur 0.5.6
|
||||
|
||||
| Kriterium | Nachweis | Stand |
|
||||
| --------------------------------------------- | ------------------------------------------------------------------------------------------------- | --------------------- |
|
||||
| Gold-/Violettlicht und Glasflächen sichtbar | Fundus und Editor in Light/Dark auf Desktop und Mobil visuell sowie über berechnete Werte geprüft | erfüllt am 22.10.2026 |
|
||||
| Schreibflächen ruhig und eindeutig abgegrenzt | deckende Feldfarbe, Kontur und goldener Fokus im geöffneten Piece-Editor geprüft | erfüllt am 22.10.2026 |
|
||||
| Neuanlage und Suche unmittelbar erreichbar | sichtbare Fundusaktionen sowie geöffnete Vorlagenauswahl auf Desktop und Mobil geprüft | erfüllt am 22.10.2026 |
|
||||
| Zusatzfilter und Zeilenaktionen zugänglich | native Aufklappelemente für Filter und Aktionen per Browserinteraktion geprüft | erfüllt am 22.10.2026 |
|
||||
| Funduszeilen per Tastatur zu öffnen | erster Titeleintrag fokussiert, mit Eingabetaste geöffnet und Editoraufruf geprüft | erfüllt am 22.10.2026 |
|
||||
| Lightmode und Smartphone ohne Seitenüberlauf | Chromium-Messung bei 1440 × 1000 und 390 × 844 Pixeln in beiden Themes | erfüllt am 22.10.2026 |
|
||||
|
||||
## Ausgeführte Prüfungen Oberflächenkorrektur 0.5.6
|
||||
|
||||
- `npm run check`: 0 Fehler und 0 Warnungen
|
||||
- gezielter Chromium-Lauf für Fundus und geöffneten Piece-Editor bei
|
||||
1440 × 1000 und 390 × 844 Pixeln in Light/Dark ohne Konsolenfehler oder
|
||||
horizontalen Seitenüberlauf
|
||||
- Neuanlage, Zusatzfilter, Aktionsmenü, Tastaturöffnung, Glaswerte und goldener
|
||||
Fokus automatisiert kontrolliert; alle erzeugten Desktop-/Mobilaufnahmen
|
||||
visuell geprüft
|
||||
- Produktionsbuild sowie vollständige Unit- und E2E-Matrix gemäß Auftrag nicht
|
||||
ausgeführt
|
||||
- `git diff --check`: erfolgreich
|
||||
|
||||
## Materialkorrektur 0.5.7
|
||||
|
||||
| Kriterium | Nachweis | Stand |
|
||||
| -------------------------------------------- | ------------------------------------------------------------------------------------------------ | --------------------- |
|
||||
| Hintergrundlicht im Arbeitsbereich sichtbar | Fundus und Sendungsplanung ohne Popup in Dark/Light auf Desktop und Mobil visuell geprüft | erfüllt am 23.10.2026 |
|
||||
| Popup erhält die Lichtstimmung | Editor mit leichtem `46%`-Backdrop und `6px` Blur gegen Ansicht ohne Popup verglichen | erfüllt am 23.10.2026 |
|
||||
| Verschachtelte Ablaufkarten werden dunkler | berechnete RGBA-Werte von Außenglas, Abschnitt, Piece und Aktionsgruppe kontrolliert | erfüllt am 23.10.2026 |
|
||||
| Graue Sonderflächen entfernt | aktive Tabs, private Recherche, Quellen-/Materialflächen und Aktionsgruppen visuell geprüft | erfüllt am 23.10.2026 |
|
||||
| Schreibfelder bleiben ruhig und klar | deckende Feldfüllung, feine Kontur und unveränderter Goldfokus in beiden Editorbereichen geprüft | erfüllt am 23.10.2026 |
|
||||
| Lightmode und Smartphone ohne Seitenüberlauf | Chromium-Messung bei 1440 × 1000 und 390 × 844 Pixeln in beiden Themes | erfüllt am 23.10.2026 |
|
||||
|
||||
## Ausgeführte Prüfungen Materialkorrektur 0.5.7
|
||||
|
||||
- `npm run check`: 0 Fehler und 0 Warnungen
|
||||
- `npm run build`: erfolgreich mit `@sveltejs/adapter-node`
|
||||
- berechnete Styles vor und nach der Korrektur für App-Hintergrund, Navigation,
|
||||
Ablauf-Panel, Abschnitte, Pieces, Aktionsgruppen, Dialog, Backdrop, Tabs,
|
||||
Rechercheflächen und Schreibfelder kontrolliert
|
||||
- gezielter Chromium-Lauf für Sendungsplanung sowie Piece-Editor mit
|
||||
„Sendungstext“ und „Recherche & Quellen“ bei 1440 × 1000 und 390 × 844 Pixeln
|
||||
in Light/Dark ohne Konsolenfehler oder horizontalen Seitenüberlauf
|
||||
- Desktop-/Mobilaufnahmen mit und ohne Popup visuell verglichen
|
||||
- vollständige Funktionstests gemäß Auftrag nicht ausgeführt
|
||||
- `git diff --check`: erfolgreich
|
||||
|
||||
## Redaktionelle Arbeitsabläufe 0.5.8
|
||||
|
||||
| Kriterium | Nachweis | Stand |
|
||||
| ------------------------------------------ | ------------------------------------------------------------------------------------------------ | --------------------- |
|
||||
| Persistente unabhängige Piece-Vorlagen | Servicetests prüfen Snapshot, Revision, Neuanlage, Wiederverwendung und Löschen | erfüllt am 23.10.2026 |
|
||||
| Atomare idempotente Direktanlage | Verhaltenstests prüfen Wiederholung derselben Befehls-ID und vollständigen Rollback | erfüllt am 23.10.2026 |
|
||||
| Interner und öffentlicher Titel getrennt | Service- und Browserabläufe prüfen getrennte Werte, Snapshots und Fallback | erfüllt am 23.10.2026 |
|
||||
| Entfernen betrifft nur konkrete Verwendung | Browser prüft Bestätigung, Rückgabe in Fundus und unverändertes Original | erfüllt am 23.10.2026 |
|
||||
| Beliebige Live-Verwendung auswählbar | Verhaltenstests wählen ersten und erledigten Eintrag über stabile Usage-ID | erfüllt am 23.10.2026 |
|
||||
| Stabiler widerrufbarer OBS-Kanal | Servicetests prüfen Wiederöffnung/Rotation; anonymer Browser prüft Fragmenttausch und Cookie | erfüllt am 23.10.2026 |
|
||||
| Private Quellen und Uploads bleiben intern | HTML- und JSON-Prüfung enthält weder implizite Quellen, Uploadnamen noch interne Redaktionstexte | erfüllt am 23.10.2026 |
|
||||
| Responsive und gleichwertig bedienbar | Chromium prüft Desktop/Mobil, Light/Dark, Drag-and-drop sowie Klick- und Tastaturalternativen | erfüllt am 23.10.2026 |
|
||||
| Reale OBS- und Anbieterwiedergabe | Keine OBS-Installation und keine echten Anbieteraufrufe in der lokalen Prüfumgebung | offen |
|
||||
|
||||
## Ausgeführte Prüfungen 0.5.8
|
||||
|
||||
- `npm run lint`: nach Formatierung erfolgreich
|
||||
- `npm run check`: 0 Fehler und 0 Warnungen
|
||||
- `npm test`: 33 Tests in 6 Dateien erfolgreich
|
||||
- `npm run test:e2e`: 15 von 15 Chromium-Browsertests erfolgreich
|
||||
- Browsermatrix bei 390, 768, 960, 1280 und 1440 Pixeln einschließlich
|
||||
Light/Dark, horizontalem Überlauf, Tastaturbedienung, Planung, Live-Steuerung
|
||||
und anonymer Ausgabe geprüft; Screenshots wurden durch die Suite erzeugt
|
||||
- `npm run build`: erfolgreich mit `@sveltejs/adapter-node`
|
||||
- `npm run db:migrate`: Migrationen `0007_editorial_workflows.sql` und
|
||||
`0008_durable_planning_commands.sql` erfolgreich auf der zuvor gesicherten
|
||||
lokalen Entwicklungsdatenbank angewendet
|
||||
- `bash -n start.sh`: erfolgreich
|
||||
- reale OBS-Browserquelle und echte YouTube-/TikTok-Wiedergabe nicht ausgeführt;
|
||||
Anbieterrequests wurden in den Browsertests lokal abgefangen
|
||||
|
||||
## Live-Werkbank 0.5.9
|
||||
|
||||
| Kriterium | Nachweis | Stand |
|
||||
| ---------------------------------------------- | -------------------------------------------------------------------------------------------------- | --------------------- |
|
||||
| Favorit ist globale Originaleigenschaft | Service prüft Revision/Status; Browser prüft Stern, Sortierung und weiterhin wirksamen Planfilter | erfüllt am 23.10.2026 |
|
||||
| Werkzeugkatalog und Rechte | Barkeeper-Verwaltung serverseitig geschützt; Browser prüft Anlage, Formatbezug und Deaktivierung | erfüllt am 23.10.2026 |
|
||||
| Deaktivierte Zuordnung bleibt bearbeitbar | Browser öffnet das Piece erneut und findet Werkzeug, Arbeitslink, Notiz und Deaktivierungsstatus | erfüllt am 23.10.2026 |
|
||||
| Relationen werden unveränderlich gesnapshottet | Service ändert Quelle, Werkzeug und Thema und sieht Änderungen erst nach expliziter Aktualisierung | erfüllt am 23.10.2026 |
|
||||
| Private Live-Materialien bleiben privat | Live-Steuerung zeigt Snapshot-Quelle; anonymes HTML/JSON enthält den privaten Materiallink nicht | erfüllt am 23.10.2026 |
|
||||
| Thematische Publikum-Dachzeile | Usage-Themen werden stabil projiziert; Chromium zeigt „Gaming“ oberhalb des Präsentationstitels | erfüllt am 23.10.2026 |
|
||||
| Persistenter Abschnitts-Countdown | kontrollierte Testzeit prüft eingefrorenes Soll, Reload, Piece-Wechsel und Abschluss ohne Reset | erfüllt am 23.10.2026 |
|
||||
| Responsive Bedienung | komplette Browsermatrix und gezielter Werkzeugeditor bei 390 × 844 ohne horizontalen Überlauf | erfüllt am 23.10.2026 |
|
||||
| Reale OBS- und Anbieterwiedergabe | Keine OBS-Installation und keine echten Anbieteraufrufe in der lokalen Prüfumgebung | offen |
|
||||
|
||||
## Ausgeführte Prüfungen 0.5.9
|
||||
|
||||
- `npm run lint`: erfolgreich
|
||||
- `npm run check`: 0 Fehler und 0 Warnungen
|
||||
- `npm test`: 37 Tests in 7 Dateien erfolgreich
|
||||
- `npm run test:e2e`: 16 von 16 Chromium-Browsertests erfolgreich
|
||||
- zusätzlicher gezielter Chromium-Lauf des Werkzeugeditors bei 390 × 844 Pixeln:
|
||||
1 von 1 erfolgreich, ohne horizontalen Überlauf
|
||||
- Browsermatrix bei 390, 768, 960, 1280 und 1440 Pixeln einschließlich
|
||||
Light/Dark, Planung, Live-Steuerung, anonymer Ausgabe und privater Materialien
|
||||
erfolgreich; Screenshots wurden durch die Suite erzeugt
|
||||
- `npm run build`: erfolgreich mit `@sveltejs/adapter-node`
|
||||
- lokale Entwicklungsdatenbank vorab nach
|
||||
`.data/backups/0.5.9-pre-migration/sendewerk.sqlite` gesichert;
|
||||
`npm run db:migrate` hat `0009_live_workbench.sql` erfolgreich angewendet
|
||||
- `bash -n start.sh` und `git diff --check`: erfolgreich
|
||||
- reale OBS-Browserquelle und echte YouTube-/TikTok-Wiedergabe nicht ausgeführt;
|
||||
Anbieterrequests wurden in den Browsertests lokal abgefangen
|
||||
|
||||
## Editor-Erlebnis 0.5.10
|
||||
|
||||
| Kriterium | Nachweis | Stand |
|
||||
| ------------------------------------------- | ------------------------------------------------------------------------------------------------- | --------------------- |
|
||||
| Titel direkt und per Tastatur bearbeitbar | Chromium prüft Vorlage, Inline-Titel, Autosave, Schließen und erneutes Öffnen | erfüllt am 23.10.2026 |
|
||||
| Gemeinsame Themen- und Werkzeugauswahl | Browser prüft Auswahl, Speicherung und deaktivierte Werkzeugzuordnung; Svelte-Check ist warnfrei | erfüllt am 23.10.2026 |
|
||||
| Themenicons lokal und persistent | Migration und Servicetests prüfen Iconwert und Snapshot; Verwaltung nutzt lokalen Iconpicker | erfüllt am 23.10.2026 |
|
||||
| Präsentationsbild ausdrücklich gewählt | Browser lädt Bild hoch, aktualisiert Usage und sieht nur dieses Bild in anonymer Ausgabe | erfüllt am 23.10.2026 |
|
||||
| Medien- und Usage-Snapshots bleiben stabil | Servicetest entfernt Originalmedium und erhält bestehende Usage-Ausgabe | erfüllt am 23.10.2026 |
|
||||
| Piece-Löschen ist wiederherstellbar | Servicetest prüft Revision, Soft Delete, Listenausblendung, Medienzugriff und Wiederherstellung | erfüllt am 23.10.2026 |
|
||||
| Live-Verwendungen sicher entfernbar | Servicetests erlauben nur offene, nie gelaufene, nicht aktuelle oder präsentierte Verwendungen | erfüllt am 23.10.2026 |
|
||||
| Leere OBS-Ausgabe ist transparent | Chromium prüft leeren Renderer vor und nach Präsentation sowie versteckten Verbindungsstatus | erfüllt am 23.10.2026 |
|
||||
| Responsive Bedienung | vollständige Browsermatrix prüft 390 bis 1440 Pixel, Light/Dark und horizontalen Überlauf | erfüllt am 23.10.2026 |
|
||||
| Reales OBS, reale Anbieter und echtes iOS | In der lokalen Prüfumgebung nicht verfügbar | offen |
|
||||
| Werkzeugkatalog entspricht Themenverwaltung | Kompakte Iconzeilen und gemeinsamer Anlegen-/Bearbeitendialog wurden auf Desktop/Mobil verglichen | erfüllt am 23.10.2026 |
|
||||
| Vollständige Classic-Regular-Auswahl | Generierung liefert 3.671 Icons; seltenes Icon wurde gesucht, gespeichert und im Piece angezeigt | erfüllt am 23.10.2026 |
|
||||
| Formatwahl nutzt gemeinsamen Picker | Browser ordnet Quiz im Dialog zu und erhält Format sowie Deaktivierungszustand nach Reload | erfüllt am 23.10.2026 |
|
||||
|
||||
## Ausgeführte Prüfungen 0.5.10
|
||||
|
||||
- `npm run lint`: erfolgreich
|
||||
- `npm run check`: 0 Fehler und 0 Warnungen
|
||||
- `npm test`: 40 Tests in 7 Dateien erfolgreich
|
||||
- `npm run test:e2e`: 16 von 16 Chromium-Browsertests erfolgreich
|
||||
- Browsermatrix bei 390, 768, 960, 1280 und 1440 Pixeln einschließlich
|
||||
Light/Dark, mobiler Navigation, Dialogen, Planung, Live-Steuerung, anonymer
|
||||
Ausgabe, Medienauswahl und privater Datenfilterung erfolgreich; Screenshots
|
||||
wurden durch die Suite erzeugt
|
||||
- `npm run build`: erfolgreich mit `@sveltejs/adapter-node`
|
||||
- lokale Entwicklungsdatenbank vorab nach
|
||||
`.data/backups/0.5.10-pre-migration/sendewerk.sqlite` gesichert;
|
||||
`npm run db:migrate` hat `0010_editor_experience.sql` erfolgreich angewendet
|
||||
- vor der Werkzeugmigration zusätzlich nach
|
||||
`.data/backups/0.5.10-tool-icons-pre-migration/sendewerk.sqlite` gesichert;
|
||||
`npm run db:migrate` hat `0011_tool_icons.sql` erfolgreich angewendet
|
||||
- Werkzeugkatalog, Anlegen-/Bearbeitendialog, geöffnete Iconauswahl und
|
||||
Piece-Werkzeugauswahl bei 1280 × 720 und 390 × 844 Pixeln visuell direkt mit
|
||||
der Themenverwaltung verglichen; keine horizontale Überlauffläche festgestellt
|
||||
- `bash -n start.sh`: erfolgreich
|
||||
- reale OBS-Browserquelle, echte YouTube-/TikTok-Wiedergabe und Safari auf einem
|
||||
iOS-Gerät nicht ausgeführt; Anbieterrequests wurden lokal abgefangen
|
||||
+69
-19
@@ -37,18 +37,18 @@ Die ersten fünf Etappen materialisieren Identität, Inhaltsverwaltung,
|
||||
Sendungsplanung und Live-Durchführung. Folgende Grenzen gelten für umgesetzte
|
||||
und spätere Bereiche.
|
||||
|
||||
| Bereich | Geplante Entitäten und Beziehungen |
|
||||
| ----------- | ----------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| Identität | `users`, Rollen, Sessions, Einladungen, Reset-Tokens und Sperren sind umgesetzt; technische Zugänge folgen später |
|
||||
| Taxonomie | getrennte `section_categories`, `formats`, `topics`; Pieces und Vorschläge über Zuordnungstabellen mehrfach verknüpft |
|
||||
| Inhalt | `pieces` mit Status, Dauer, Revision, getrennten Textbereichen, Quellen und privaten Medien; Vorlagen sind definierte Startwerte |
|
||||
| Sendungsbau | `shows`, geordnete `show_sections`, kopierte `piece_usages`, Reservebank und Sendungsvorlagen sind umgesetzt; Original-ID bleibt Referenz |
|
||||
| Live | expliziter Live-Stand, aktuelles Element, Status je Verwendung, tatsächliche Zeiten und getrennte Präsentationsausgabe |
|
||||
| Historie | unveränderliche Abschluss-Snapshots und Verwendungshistorie; Übersprungenes zählt nicht als gesendet |
|
||||
| Freigaben | widerrufbare, gehashte Lesetokens mit Sendung, Umfang, Passwortoption und Ablaufzeit |
|
||||
| RSS | Feedquellen, Abrufläufe und externe Einträge mit stabiler Herkunfts-ID sowie Status neu/übernommen/verworfen |
|
||||
| API/Audit | technische Berechtigungen, Idempotenzschlüssel und Audit-Ereignisse mit Akteur, Aktion und Ziel |
|
||||
| Betrieb | Anwendungseinstellungen und spätere Job-Zustände, keine Geheimnisse im Klartext ohne begründete Schutzstrategie |
|
||||
| Bereich | Geplante Entitäten und Beziehungen |
|
||||
| ----------- | ----------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| Identität | `users`, Rollen, Sessions, Einladungen, Reset-Tokens und Sperren sind umgesetzt; technische Zugänge folgen später |
|
||||
| Taxonomie | getrennte `section_categories`, `formats`, `topics` samt optionalem Themenicon; Pieces und Vorschläge mehrfach verknüpft |
|
||||
| Inhalt | `pieces` mit Status, Soft Delete, Favorit, Revision, Texten, Quellen, Werkzeugen und privaten Medien; Vorlagen speichern Snapshots |
|
||||
| Sendungsbau | `shows`, geordnete `show_sections`, `piece_usages` samt Quellen-/Werkzeug-/Themen-/Mediensnapshots, Reservebank und Vorlagen |
|
||||
| Live | expliziter Live-Stand, aktuelles Element, tatsächliche Piece-Zeiten, persistente Abschnittstimer und getrennte Präsentationsausgabe |
|
||||
| Historie | unveränderliche Abschluss-Snapshots und Verwendungshistorie; Übersprungenes zählt nicht als gesendet |
|
||||
| Freigaben | widerrufbare, gehashte Lesetokens mit Sendung, Umfang, Passwortoption und Ablaufzeit |
|
||||
| RSS | Feedquellen, Abrufläufe und externe Einträge mit stabiler Herkunfts-ID sowie Status neu/übernommen/verworfen |
|
||||
| API/Audit | technische Berechtigungen, Idempotenzschlüssel und Audit-Ereignisse mit Akteur, Aktion und Ziel |
|
||||
| Betrieb | Anwendungseinstellungen und spätere Job-Zustände, keine Geheimnisse im Klartext ohne begründete Schutzstrategie |
|
||||
|
||||
### Historien- und Kopierregel
|
||||
|
||||
@@ -64,6 +64,11 @@ oder eine explizite Abschnittsdauer. Beides wird nie addiert. Reserveelemente
|
||||
zählen erst nach dem Einplanen. Geplante und tatsächliche Dauer bleiben
|
||||
getrennt.
|
||||
|
||||
Ein Live-Abschnittstimer entsteht ausschließlich beim tatsächlichen Eintritt in
|
||||
einen Abschnitt mit positiver expliziter Dauer. Er speichert dieses Soll als
|
||||
unveränderlichen Wert und summiert eigene Laufintervalle; Piece-Wechsel im
|
||||
selben Abschnitt erzeugen deshalb weder Reset noch doppelte Piece-Laufzeit.
|
||||
|
||||
## Anmeldung und Rechte
|
||||
|
||||
Etappe 2 ergänzt lokale Konten mit den festen Rollen `barkeeper` und
|
||||
@@ -97,11 +102,25 @@ erhalten ausschließlich kompakte Piece-Daten; private Recherche und vollständi
|
||||
Redaktionstexte werden nur an den angemeldeten Editor ausgeliefert. Themen und
|
||||
Abschnittskategorien sind Mehrfachzuordnungen, das Format bleibt eine einzelne
|
||||
unabhängige Zuordnung. Quellen werden gemeinsam mit einem Piece atomar ersetzt.
|
||||
`is_favorite` ist eine globale Eigenschaft des Originals und keine Nutzung oder
|
||||
Historienmarkierung. Der Werkzeugkatalog liegt getrennt von Formaten; Formate
|
||||
sind nur Eignungszuordnungen. `piece_tools` hält pro Piece den privaten
|
||||
Arbeitslink und eine Notiz, während Deaktivierung das Katalogobjekt und alle
|
||||
bestehenden Zuordnungen erhält. Ein serverseitig validiertes `icon_name` gehört
|
||||
zum Werkzeugkatalog und wird im Originaleditor angezeigt, ohne bestehende
|
||||
Usage-Snapshots nachträglich zu verändern.
|
||||
Ein Piece kann für die Präsentation Text oder genau eine vorhandene Quelle als
|
||||
Linkkarte beziehungsweise Video auswählen. Abgerufene Metadaten und Kennzeichen
|
||||
für manuell korrigierte Felder liegen am Piece; ein erneuter Abruf überschreibt
|
||||
diese Felder nicht.
|
||||
|
||||
Piece-Vorlagen liegen als validierte JSON-Snapshots in `piece_templates`. Jeder
|
||||
Speichervorgang kopiert den vollständigen Vorlageninhalt tief und erhöht bei
|
||||
einer Aktualisierung die Revision; spätere Änderungen am Ausgangs-Piece wirken
|
||||
nicht auf die Vorlage zurück. Die leere Vorlage bleibt virtuell. Interner Titel
|
||||
und optionaler Präsentationstitel sind getrennte Felder; ohne öffentlichen Titel
|
||||
verwendet die Präsentationsprojektion den internen Titel als Fallback.
|
||||
|
||||
Jedes Piece besitzt eine ganzzahlige Revision. Speichern, Archivieren und
|
||||
Medienänderungen verwenden ein bedingtes Update auf die erwartete Revision.
|
||||
Eine veraltete Bearbeitung liefert einen Konflikt und verändert weder Piece noch
|
||||
@@ -119,6 +138,15 @@ sind zufällige IDs; Originalnamen werden nie als Pfad verwendet. `/media/[id]`
|
||||
prüft die Anmeldung und liefert private Antworten mit `no-store`, `nosniff`,
|
||||
Same-Origin-Ressourcenrichtlinie und restriktiver CSP aus.
|
||||
|
||||
Ein Piece kann genau eines seiner aktiven Medien ausdrücklich als
|
||||
Präsentationsbild auswählen. Die Auswahl liegt in `piece_presentation_media`;
|
||||
das Entfernen setzt am Medium einen Zeitstempel statt die Datei zu löschen.
|
||||
Damit bleiben bereits erzeugte `usage_media_snapshots` auflösbar, während neue
|
||||
Einplanungen und der Originaleditor nur aktive Medien berücksichtigen. Das
|
||||
Soft Delete eines Pieces setzt ebenfalls nur `deleted_at_utc`: normale Listen
|
||||
und neue Einplanungen schließen es aus, bestehende Verwendungsreferenzen und
|
||||
Snapshots bleiben unverändert erhalten.
|
||||
|
||||
## Sendungsbau
|
||||
|
||||
Etappe 4 bündelt alle Planungsmutationen in `src/lib/server/shows.ts`. Eine
|
||||
@@ -130,7 +158,10 @@ weitere Bearbeitung geschützt.
|
||||
Beim Einplanen werden Titel, Dauer, Einleitung, Recherche, Moderation,
|
||||
Überleitung und der vollständige Präsentationszustand aus dem sendefertigen
|
||||
Piece kopiert. Dazu gehören Modus, ausgewählte Quelladresse samt Zeitmarke,
|
||||
Metadaten und validierte Anbieter-ID. Eigene Notizen liegen ausschließlich an
|
||||
Metadaten und validierte Anbieter-ID. Zusätzlich speichern eigene geordnete
|
||||
Tabellen alle Quellen, Werkzeugnamen samt Start-/Arbeitslink und Notiz, die
|
||||
Themennamen samt Icon sowie das ausdrücklich ausgewählte Präsentationsmedium.
|
||||
Eigene Notizen liegen ausschließlich an
|
||||
der Verwendung. Die Referenz zum Original bleibt für Historie und
|
||||
Nachvollziehbarkeit erhalten, wird aber nicht live gespiegelt. Eine explizite
|
||||
Aktualisierung aus dem Fundus ersetzt Titel, Dauer, alle fünf Redaktionstexte
|
||||
@@ -161,6 +192,11 @@ Sendungsvorlagen und ihre Abschnitte sind eigene Tabellen. Beim Anlegen werden
|
||||
die Abschnitte mit neuen IDs kopiert; spätere Änderungen an der Sendung können
|
||||
die Vorlage deshalb nicht verändern.
|
||||
|
||||
Die Direktanlage aus einer Sendung erzeugt Piece und Verwendung innerhalb einer
|
||||
verschachtelbaren SQLite-Transaktion. `planning_commands` speichert die
|
||||
Befehls-ID und das Ergebnis, sodass ein wiederholter Request dieselben IDs
|
||||
zurückgibt und weder ein zweites Piece noch eine zweite Einplanung erzeugt.
|
||||
|
||||
Die Editorformulare bleiben progressive SvelteKit-Form-Actions, werden im
|
||||
Browser aber mit `use:enhance` gesendet. Der Verwendungseditor liegt in einem
|
||||
nativen Dialog, den ein beschrifteter Icon-Button öffnet. Dadurch bleibt das
|
||||
@@ -191,12 +227,20 @@ Zurückgehen, Wiederaufnahme und bereits abgeschlossene Laufzeit getrennt von de
|
||||
geplanten Dauer nachvollziehbar.
|
||||
|
||||
Die interne Route `/live` benötigt weiterhin eine aktive Sitzung und darf
|
||||
Recherche, Moderation und eigene Arbeitsdaten lesen. Die separate Ausgabe
|
||||
`/heinzlive/[token]` liegt dagegen in einem reduzierten Layout ohne Navigation
|
||||
oder Nutzerdaten. In SQLite liegt nur der SHA-256-Hash des 256-Bit-Tokens; ein
|
||||
neu erzeugter Ausgabezugang widerruft den vorherigen. Page, Polling-JSON und
|
||||
Medienroute leiten ihre Daten aus einer eigenen Positivliste ab. Bilder werden
|
||||
nur ausgeliefert, wenn sie zum aktuell ausdrücklich präsentierten Piece gehören.
|
||||
Recherche, Moderation und eigene Arbeitsdaten lesen. Die separate Ausgabe nutzt
|
||||
den stabilen Kanal `/heinzlive/default` in einem reduzierten Layout ohne
|
||||
Navigation oder Nutzerdaten. Der geheime 256-Bit-Schlüssel steht nur im
|
||||
URL-Fragment und wird per POST gegen ein `HttpOnly`-, `SameSite=Strict`-Cookie
|
||||
getauscht. SQLite speichert seinen SHA-256-Hash für die Zugangsprüfung sowie den
|
||||
rohen Schlüssel, weil die angemeldete Steuerung dieselbe stabile OBS-Adresse
|
||||
erneut ausgeben können muss. Datenbank und Sicherungen sind deshalb Teil der
|
||||
Geheimnisgrenze. Eine Rotation widerruft den bisherigen Schlüssel, normales
|
||||
erneutes Öffnen behält ihn bei.
|
||||
Page, Polling-JSON und Proxyrouten leiten ihre Daten aus einer eigenen
|
||||
Positivliste ab. Private Quellen-/Werkzeug-Snapshots, Arbeitslinks, Notizen und
|
||||
Uploads werden nicht veröffentlicht; nur Themennamen sowie die ausdrücklich
|
||||
gewählte Link- oder Videoquelle und deren erlaubte Vorschau-URL können die
|
||||
Grenze passieren.
|
||||
Normale Auswahl, Fortschaltung oder Wiederaufnahme verändern den
|
||||
Präsentationsstand nicht. Die öffentliche Projektion liest ausschließlich den
|
||||
gespeicherten Verwendungssnapshot; spätere Änderungen am Original erscheinen
|
||||
@@ -239,6 +283,12 @@ Der Live-Modus ist eine eigene, fokussierte Arbeitsansicht. Die
|
||||
Präsentationsausgabe verwendet eine separate, strikt reduzierte Datenansicht
|
||||
ohne interne Anwendungsnavigation.
|
||||
|
||||
Icons werden aus dem lokalen Font-Awesome-Classic-Regular-Sprite unter
|
||||
`static/icons` gerendert. Die Verwaltung lädt zusätzlich die durchsuchbaren
|
||||
Metadaten aller 3.671 Icons, zeigt je Suchergebnis aber höchstens 120 Einträge
|
||||
gleichzeitig. Allgemeine Seiten wie Login oder Navigation laden den Katalog
|
||||
nicht in ihren Client-Chunk.
|
||||
|
||||
Der eigenständige Piece-Editor ordnet denselben Formvertrag als redaktionelles
|
||||
Arbeitsblatt an. Titel, Fundstück, private Recherche sowie Einleitung,
|
||||
Moderationsstichpunkte und Überleitung bilden die primäre Schreibfläche.
|
||||
|
||||
@@ -276,3 +276,87 @@ Quellen:
|
||||
- <https://developers.tiktok.com/doc/embed-player>
|
||||
- <https://developers.tiktok.com/doc/embed-videos>
|
||||
- <https://owasp.org/www-community/attacks/Server_Side_Request_Forgery>
|
||||
|
||||
## D-020: Stabile Ausgabekanal-Adresse mit Fragment-Schlüssel
|
||||
|
||||
OBS soll eine dauerhaft konfigurierte Adresse verwenden können, ohne dass ein
|
||||
Zugangsschlüssel in HTTP-Requests, Serverlogs oder Referer-Headern erscheint.
|
||||
Darum bleibt die Kanaladresse `/heinzlive/default` stabil und trägt den
|
||||
zufälligen Schlüssel ausschließlich als URL-Fragment. Ein kleiner Browser-POST
|
||||
tauscht ihn gegen ein `HttpOnly`-, `SameSite=Strict`-Cookie; danach greifen
|
||||
Seite, Polling und erlaubte Proxys nur mit diesem Cookie zu. Für die Prüfung
|
||||
liegt ein SHA-256-Hash vor. Der rohe Schlüssel muss zusätzlich in SQLite
|
||||
gespeichert werden, weil die angemeldete Steuerung dieselbe stabile OBS-Adresse
|
||||
nach einem Neustart erneut ausgeben können muss. Damit sind Datenbank und
|
||||
Sicherungen bewusst Teil der Geheimnisgrenze. Wiederholtes Öffnen behält den
|
||||
Schlüssel, eine ausdrückliche Rotation widerruft ihn sofort.
|
||||
|
||||
Die öffentliche Projektion folgt einer engeren Positivliste als der interne
|
||||
Piece-Snapshot. Weder private Uploads noch alle Piece-Quellen werden implizit
|
||||
veröffentlicht. Passieren dürfen nur öffentlicher Text, Präsentationstitel sowie
|
||||
die ausdrücklich gewählte und erneut validierte Link- oder Videoquelle mit
|
||||
erlaubten Vorschaufeldern.
|
||||
|
||||
## D-021: Vorlagen-Snapshots und idempotente Direktanlage
|
||||
|
||||
Persistente Piece-Vorlagen speichern validierte, tief kopierte JSON-Snapshots
|
||||
mit eigener Revision. Damit bleiben sie unabhängig von späteren Änderungen am
|
||||
Ausgangs-Piece, ohne für jedes optionale Piece-Feld eine zweite Tabellenstruktur
|
||||
zu benötigen. Die virtuelle leere Vorlage wird nicht persistiert.
|
||||
|
||||
Eine Direktanlage im Sendungsplan ist ein einzelner fachlicher Befehl. Piece,
|
||||
Verwendung und Sendungsrevision werden in derselben SQLite-Transaktion
|
||||
geschrieben. `planning_commands` macht die Befehls-ID eindeutig und speichert
|
||||
das Ergebnis, damit Wiederholungen nach Verbindungsabbrüchen keine Dubletten
|
||||
erzeugen. Interner und öffentlicher Titel werden getrennt gespeichert und beim
|
||||
Einplanen getrennt in den Verwendungssnapshot kopiert.
|
||||
|
||||
## D-022: Werkzeuge und Live-Abschnittszeit als eigene Snapshot-Grenzen
|
||||
|
||||
Favoriten bleiben ein boolesches Merkmal des Fundus-Originals. Sie ändern weder
|
||||
Revision, Status noch Verwendungshistorie und werden nicht pro Konto
|
||||
dupliziert. Der Werkzeugkatalog ist eine eigene Entität: Formatbeziehungen
|
||||
beschreiben nur die Eignung, während Piece-Zuordnungen den privaten Arbeitslink
|
||||
und die Notiz tragen. Katalogeinträge werden deaktiviert statt gelöscht, damit
|
||||
bestehende Piece- und Sendungsbezüge lesbar bleiben.
|
||||
|
||||
Beim Einplanen kopieren eigene Relationstabellen alle Quellen, Werkzeuge und
|
||||
sortierten Themennamen an die Verwendung. Damit können Katalognamen, URLs,
|
||||
Themen und Originalzuordnungen später geändert werden, ohne eine vorbereitete
|
||||
Sendung still umzuschreiben. Nur die bewusste Aktion **Aus Fundus aktualisieren**
|
||||
ersetzt diese Snapshots. Die öffentliche Positivliste darf daraus ausschließlich
|
||||
die Themen-Dachzeile übernehmen; private Materiallinks und Werkzeugdaten bleiben
|
||||
auf der authentifizierten Live-Route.
|
||||
|
||||
Der Abschnitts-Countdown verwendet von den Piece-Laufintervallen getrennte
|
||||
`live_section_timers` und `live_section_timer_runs`. Beim ersten tatsächlichen
|
||||
Eintritt wird eine positive explizite Abschnittsdauer eingefroren. Weitere
|
||||
Pieces desselben Abschnitts nutzen denselben Timer; Abschnittswechsel schließen
|
||||
ihn. So bleiben Reload und Wiederaufnahme persistent, ohne die vorhandene
|
||||
Piece-Zeiterfassung doppelt zu zählen.
|
||||
|
||||
## D-023: Ausdrückliche Medienauswahl und wiederherstellbares Entfernen
|
||||
|
||||
Ein privater Piece-Upload wird nicht allein durch seine Existenz öffentlich.
|
||||
Das Original verweist ausdrücklich auf höchstens ein aktives
|
||||
Präsentationsmedium. Beim Einplanen oder bewussten Aktualisieren wird diese
|
||||
Auswahl mit Medium-ID und Alternativtext an die Verwendung kopiert. Die
|
||||
öffentliche Route akzeptiert nur das Medium des aktuell präsentierten
|
||||
Usage-Snapshots; Originalname, interner Speicherpfad und andere Uploads bleiben
|
||||
außerhalb der Projektion.
|
||||
|
||||
Medien und Pieces werden nicht physisch gelöscht, solange bestehende
|
||||
Sendungsfassungen auf ihre unveränderlichen Snapshots angewiesen sein können.
|
||||
Zeitstempel blenden sie aus aktuellen Arbeitslisten und neuen Einplanungen aus,
|
||||
erhalten aber Referenzen und ermöglichen die Wiederherstellung von Pieces. Eine
|
||||
Verwendung oder ein Abschnitt darf dagegen nur entfernt werden, solange keine
|
||||
betroffene Verwendung jemals live gelaufen ist und weder aktuell noch
|
||||
präsentiert wird.
|
||||
|
||||
Der lokale Iconkatalog enthält die vollständige Classic-Regular-Familie mit
|
||||
3.671 Icons. Ein generierter Metadatenkatalog ermöglicht Suche und serverseitige
|
||||
Validierung, während ein statischer SVG-Sprite über den gemeinsamen
|
||||
`currentColor`-Renderer dargestellt wird. So lädt die Navigation nicht sämtliche
|
||||
Pfaddaten in ihren JavaScript-Chunk. Es gibt weder einen externen Laufzeitabruf
|
||||
noch eine Laufzeitabhängigkeit vom benachbarten Quellverzeichnis; Herkunft und
|
||||
Lizenz stehen in `THIRD_PARTY_NOTICES.md`.
|
||||
@@ -0,0 +1,55 @@
|
||||
# Release Notes
|
||||
|
||||
## 0.5.10 - Editor-Erlebnis
|
||||
|
||||
### Redaktion und Verwaltung
|
||||
|
||||
- Titel von Fundus- und Sendungsfassungen lassen sich direkt und per Tastatur
|
||||
bearbeiten.
|
||||
- Themen und Werkzeuge verwenden gemeinsame kompakte Auswahlflächen.
|
||||
- Der Werkzeugkatalog entspricht der Themenverwaltung: kompakte Glasfläche,
|
||||
Icon, Name, Status und Bearbeitungsaktion statt dauerhaft offener Formulare.
|
||||
- Anlegen und Bearbeiten eines Werkzeugs verwenden denselben responsiven Dialog
|
||||
für Name, Start-URL, Beschreibung, Icon, passende Formate und Aktivstatus.
|
||||
- Die Formatzuordnung nutzt dieselbe durchsuchbare Mehrfachauswahl wie andere
|
||||
Zuordnungen. Deaktivierte Werkzeuge und bestehende Piece-Zuordnungen bleiben
|
||||
erhalten.
|
||||
- Alle 3.671 Icons aus Font Awesome Pro Plus 7.0.0 Classic Regular stehen lokal
|
||||
und durchsuchbar zur Verfügung. Ein lokaler SVG-Sprite hält den allgemeinen
|
||||
Anwendungs-Chunk klein; es gibt keine externe Laufzeitabhängigkeit.
|
||||
|
||||
### Pieces und Präsentation
|
||||
|
||||
- Präsentationsbilder werden ausdrücklich aus aktiven Piece-Medien ausgewählt
|
||||
und unveränderlich an Sendungsfassungen kopiert.
|
||||
- Entfernte Medien bleiben für bestehende Sendungsfassungen verfügbar, werden
|
||||
aber nicht mehr für neue Einplanungen angeboten.
|
||||
- Pieces können wiederherstellbar gelöscht werden. Offene, nie live gelaufene
|
||||
Verwendungen und Abschnitte lassen sich unter geschützten Bedingungen
|
||||
entfernen.
|
||||
- Fundus, Eingang, Archiv, Vorlagen und Sendungsansichten sind kompakter und
|
||||
bleiben per Klick, Touch und Tastatur bedienbar.
|
||||
|
||||
### Live-Ausgabe
|
||||
|
||||
- Eine leere heinzlive-Ausgabe ist vollständig transparent und zeigt weder
|
||||
Renderer noch Verbindungsstatus.
|
||||
- Eine aktive Präsentation lässt sich unabhängig vom aktuell laufenden Piece
|
||||
leeren.
|
||||
|
||||
### Datenbank und Kompatibilität
|
||||
|
||||
- `0010_editor_experience.sql` ergänzt Themenicons, Medien-Snapshots und Soft
|
||||
Delete.
|
||||
- `0011_tool_icons.sql` ergänzt persistente Werkzeugicons mit einem sicheren
|
||||
Standardwert. Werkzeug-IDs, Formatbeziehungen, Piece-Zuordnungen und
|
||||
Deaktivierungszustände bleiben erhalten.
|
||||
|
||||
### Prüfung
|
||||
|
||||
- 40 Unit- und Verhaltenstests sowie 16 Chromium-E2E-Abläufe erfolgreich.
|
||||
- Werkzeugverwaltung, Iconauswahl und Piece-Werkzeugauswahl wurden zusätzlich
|
||||
bei 1280 × 720 und 390 × 844 Pixeln visuell mit der Themenverwaltung
|
||||
verglichen.
|
||||
- Reales OBS, echte YouTube-/TikTok-Wiedergabe und Safari auf einem iOS-Gerät
|
||||
standen nicht zur Verfügung.
|
||||
+181
-10
@@ -7,6 +7,165 @@ Anmeldung, Rollen, persistente Inhaltsbearbeitung, Sendungsplanung,
|
||||
Live-Steuerung, Präsentationsausgabe und lokaler Betriebsweg sind dokumentiert.
|
||||
Etappe 6 wurde nicht begonnen.
|
||||
|
||||
## Editor-Erlebnis 0.5.10
|
||||
|
||||
- direkte, tastaturbedienbare Titelbearbeitung in Fundus- und Sendungsfassungen
|
||||
sowie gemeinsame kompakte Auswahlflächen für Themen und Werkzeuge
|
||||
- vollständiger lokaler Classic-Regular-Katalog mit 3.671 Icons für Navigation,
|
||||
Aktionen sowie frei wählbare Themen- und Werkzeugicons; durchsuchbare
|
||||
Metadaten und SVG-Sprite vermeiden externe Laufzeitabhängigkeiten
|
||||
- kompakter Werkzeugkatalog nach dem Muster der Themenverwaltung; Anlegen und
|
||||
Bearbeiten teilen einen responsiven Dialog mit gestalteter Icon- und
|
||||
Formatauswahl, bestehende Zuordnungen und Deaktivierung bleiben erhalten
|
||||
- Präsentationsbilder werden bewusst aus aktiven Piece-Medien ausgewählt und als
|
||||
unveränderlicher Usage-Snapshot eingeplant; private Bilder werden dadurch
|
||||
weder implizit noch nach späterer Originaländerung öffentlich
|
||||
- entfernte Medien bleiben für bestehende Sendungsfassungen erhalten, während
|
||||
neue Einplanungen nur aktive Medien übernehmen
|
||||
- wiederherstellbares Soft Delete für Pieces sowie geschütztes Entfernen offener,
|
||||
nie live gelaufener Verwendungen und Abschnitte
|
||||
- kompaktere Fundus-, Eingangs-, Archiv-, Vorlagen- und Sendungsansichten mit
|
||||
mobilen, touch- und tastaturbedienbaren Alternativen
|
||||
- transparente leere heinzlive-Ausgabe ohne sichtbaren Renderer oder
|
||||
Verbindungsstatus; die Steuerung kann eine aktive Präsentation unabhängig vom
|
||||
aktuellen Piece leeren
|
||||
|
||||
Etappe 6 bleibt unverändert unbegonnen. Die lokale Prüfmatrix umfasst 40
|
||||
Verhaltenstests und 16 Chromium-Abläufe. Reales OBS, echte
|
||||
YouTube-/TikTok-Wiedergabe sowie Safari auf einem iOS-Gerät bleiben mangels
|
||||
verfügbarer Umgebung offen.
|
||||
|
||||
## Live-Werkbank 0.5.9
|
||||
|
||||
- globale Favoriten am Fundus-Original mit stabiler Vorsortierung; verwendete
|
||||
Favoriten bleiben sichtbar, geplante Favoriten respektieren weiterhin den
|
||||
Einplanungsfilter
|
||||
- Barkeeper-Werkzeugkatalog mit Start-URL, Beschreibung, passenden Formaten und
|
||||
verlustfreier Deaktivierung; Arbeitslink und Notiz bleiben für die gesamte
|
||||
Thekencrew im gemeinsamen Piece- und Verwendungseditor bearbeitbar
|
||||
- vollständige, voneinander unabhängige Usage-Snapshots für Quellen, Werkzeuge
|
||||
und alphabetisch stabilisierte Themen; spätere Original- oder
|
||||
Katalogänderungen wirken erst nach bewusster Aktualisierung aus dem Fundus
|
||||
- kompakte private Materialliste in der Live-Steuerung mit Arbeitslink vor
|
||||
Start-URL und verständlichem Zustand ohne URL
|
||||
- responsive Themen-Dachzeile in der Publikumsausgabe; ohne Thema bleibt sie
|
||||
vollständig aus, während Präsentations- und interner Titel getrennt bleiben
|
||||
- persistenter Abschnitts-Countdown für positive explizite Abschnittsdauern mit
|
||||
eingefrorenem Soll, sekündlicher Anzeige, Goldwarnung ab zwei Minuten und
|
||||
roter Überziehung ohne Ton, Blinken oder automatische Weiterschaltung
|
||||
|
||||
Etappe 6 bleibt unverändert unbegonnen. Reales OBS und echte
|
||||
YouTube-/TikTok-Wiedergabe bleiben mangels verfügbarer Umgebung offen.
|
||||
|
||||
Die lokale Prüfmatrix umfasst 37 Verhaltenstests und 16 Chromium-Abläufe.
|
||||
Desktop, Smartphone, Light/Dark, Favoritenfilter, Werkzeug-Deaktivierung,
|
||||
Snapshot-Stabilität, private Live-Materialien, öffentliche Themenprojektion und
|
||||
persistente Abschnittszeit wurden geprüft.
|
||||
|
||||
## Redaktionelle Arbeitsabläufe 0.5.8
|
||||
|
||||
- persistente Piece-Vorlagen als unabhängige, revisionierte Snapshots; eigene
|
||||
Vorlagen lassen sich aus Fundus-Pieces speichern, erneut verwenden und löschen
|
||||
- atomare, idempotente Piece-Neuanlage direkt in einer Sendung einschließlich
|
||||
Einplanung; fehlgeschlagene Schritte hinterlassen weder Piece noch Verwendung
|
||||
- getrennte interne und öffentliche Titel an Piece und Verwendung; ein leerer
|
||||
Präsentationstitel fällt kontrolliert auf den internen Titel zurück
|
||||
- präzises Entfernen einzelner Verwendungen mit Bestätigung sowie zusätzlicher
|
||||
Drag-and-drop-Rückgabe in den Fundusbereich
|
||||
- Auswahl jedes konkreten Ablauf-Pieces in der Live-Steuerung, einschließlich
|
||||
erstem und bereits erledigtem Eintrag
|
||||
- stabiler OBS-Ausgabekanal `/heinzlive/default` mit geheimem URL-Fragment,
|
||||
HttpOnly-Cookie-Austausch und ausdrücklicher Schlüsselrotation
|
||||
- öffentliche Ausgabe als Positivliste: implizite Piece-Quellen und private
|
||||
Uploads werden nicht mehr veröffentlicht; nur ausdrücklich gewählte
|
||||
Link-/Videoquellen und deren erlaubte Vorschau bleiben sichtbar
|
||||
|
||||
Die vollständige lokale Prüfmatrix umfasst 33 Verhaltenstests und 15
|
||||
Chromium-Abläufe. Desktop, Mobil, Light/Dark, Tastatur- und Touchalternativen,
|
||||
Planung, Live-Ausgabe sowie anonyme Ausgabedaten wurden geprüft. Reales OBS und
|
||||
echte YouTube-/TikTok-Wiedergabe bleiben mangels verfügbarer Umgebung offen.
|
||||
|
||||
## Materialkorrektur 0.5.7
|
||||
|
||||
- statische Gold-/Blauviolettlichter so positioniert und verstärkt, dass sie im
|
||||
eigentlichen Arbeitsbereich statt fast ausschließlich hinter der Navigation
|
||||
sichtbar werden
|
||||
- gemeinsame Materialtokens auf Außenglas, dunkle Innenfläche und tiefe
|
||||
Ablaufkarte reduziert; verschachtelte Abschnitte, Pieces und Aktionsgruppen
|
||||
werden nach innen dunkler statt heller und blaugrau
|
||||
- aktive Editortabs transparent goldgetönt und private Recherche sowie
|
||||
Quellen-/Materialbereiche auf transparente Nachtblauflächen zurückgeführt
|
||||
- Dialog-Backdrop von starker Abdunklung und Unschärfe auf eine leichtere
|
||||
Trennung reduziert, sodass die Lichtstimmung bei geöffnetem Editor erhalten
|
||||
bleibt
|
||||
- deckende Schreibfelder, Goldfokus, Lightmode, Mobilansicht und lesbare
|
||||
Komponentenfüllungen ohne verfügbaren Blur bleiben erhalten
|
||||
|
||||
Die berechneten Hintergründe, Transparenzen, Filter und Begrenzungseigenschaften
|
||||
wurden vor und nach der Korrektur in Chromium kontrolliert. Sendungsplanung,
|
||||
Sendungstext und Recherche wurden bei 1440 × 1000 und 390 × 844 Pixeln in beiden
|
||||
Themes visuell geprüft.
|
||||
|
||||
## Oberflächenkorrektur 0.5.6
|
||||
|
||||
- sichtbare statische Gold- und Blauviolettlichter hinter den halbtransparenten
|
||||
Navigations- und Editorflächen
|
||||
- klarere Glaswirkung in Navigation sowie Kopf, Tabs und Fuß des Piece-Editors;
|
||||
Schreibflächen bleiben deckend, ruhig und goldfokussiert
|
||||
- Fundus mit dauerhaft sichtbarer Suche und Neuanlage, aufklappbaren Zusatzfiltern
|
||||
und inhaltsorientierten, vollständig anklickbaren Zeilen
|
||||
- vorhandene Vorschaubilder beziehungsweise kleine Symbolplatzhalter sowie
|
||||
gebündelte Menüs für Duplizieren und Archivieren
|
||||
- bestehende Server-Actions, Filterlogik und Editor-Bereiche unverändert
|
||||
|
||||
Geprüft wurden `npm run check` sowie Fundus und geöffneter Piece-Editor in
|
||||
Chromium bei 1440 × 1000 und 390 × 844 Pixeln in Light/Dark. Die gezielte
|
||||
Kontrolle umfasste Tastaturöffnung, Menüs, Fokus, Glaswerte, Seitenüberlauf und
|
||||
visuell geprüfte Screenshots. Produktionsbuild und vollständige Testmatrix wurden
|
||||
gemäß Auftrag nicht ausgeführt.
|
||||
|
||||
## Oberflächenkorrektur 0.5.5
|
||||
|
||||
- dunkle Grundfläche mit sehr zurückhaltenden Gold-/Cyan-Lichtfeldern innerhalb
|
||||
der Anwendung statt gleichmäßig deckender Blauflächen
|
||||
- Navigation, große Arbeitsflächen und Piece-Dialog als dunkles beziehungsweise
|
||||
helles Glas mit feiner Lichtkante, Unschärfe und ruhigem Schatten
|
||||
- Gold für Dialogkontur, Fokus, aktive Zustände und Hauptaktionen; Cyan nur noch
|
||||
für ergänzende redaktionelle Hinweise und Links
|
||||
- klar abgegrenzte, weitgehend deckende Schreibfelder mit Goldfokus, Platzhaltern
|
||||
und nach Textrolle abgestuften Höhen
|
||||
- bestehende nachträgliche CSS-Override-Schicht entfernt und die Gestaltung in
|
||||
gemeinsame Tokens und ursprüngliche Komponentenregeln zurückgeführt
|
||||
|
||||
Geprüft wurden Typen, Produktionsbuild sowie gezielte Chromium-Ansichten von
|
||||
Eingang, Fundus, Piece-Editor, Sendungsplanung und Live-Steuerung bei 1440 × 1000
|
||||
und 390 × 844 Pixeln in beiden Themes. Die vollständige Unit- und E2E-Matrix
|
||||
bleibt wie beauftragt Schritt 3 vorbehalten.
|
||||
|
||||
## Oberflächenrelease 0.5.4
|
||||
|
||||
- gemeinsame Light-/Dark-Tokens für ruhige Arbeitsflächen, Cyan als
|
||||
Interaktionsfarbe und Gold für die jeweilige Hauptaktion
|
||||
- Darkmode im heinzlive-Farbraum mit Hintergrund `#0B1220`, Flächen `#152238`,
|
||||
Text `#FFF7E8`, Sekundärtext `#A9B6C8`, Gold `#E7B957`, Cyan `#67DDE8` und
|
||||
Grenzen `#30435C`
|
||||
- vereinheitlichte Navigation, Formulare, Meldungen, Listen, Sendungsplan,
|
||||
Live-Steuerung und Piece-Dialoge ohne Änderung der Bedienlogik
|
||||
- kompaktere Planzeilen mit sichtbarem Drag-Griff und waagerechter Aktionsgruppe;
|
||||
Klick-, Touch- und Tastaturalternativen bleiben erhalten
|
||||
- verständliche Kontextnamen „Fundusfassung“ und „Sendungsfassung“ sowie weniger
|
||||
technische Erläuterungen im redaktionellen Arbeitsfluss
|
||||
- dezente Speicheraktion im gespeicherten Zustand und hervorgehobene Aktion bei
|
||||
ungespeicherten Änderungen, Fehlern oder Konflikten
|
||||
|
||||
Für diesen Design-Release wurden `npm run check`, `npm run build` und gezielte
|
||||
Chromium-Sichtkontrollen auf Eingang, Fundus, Piece-Editor, Sendungsplan und
|
||||
Live-Steuerung bei 1440 × 1000 sowie 390 × 844 Pixeln in Light/Dark ausgeführt.
|
||||
Konsolenfehler und horizontaler Seitenüberlauf traten dabei nicht auf. Die
|
||||
vollständige Unit- und E2E-Matrix wurde für die rein visuelle Änderung bewusst
|
||||
nicht erneut ausgeführt; die fachlichen Nachweise der Etappen 1 bis 5 bleiben
|
||||
unverändert.
|
||||
|
||||
## Umgesetzter Stand Etappe 1
|
||||
|
||||
- SvelteKit-/TypeScript-Monolith mit Node-Adapter
|
||||
@@ -71,16 +230,28 @@ als bereits implementiert verstanden werden.
|
||||
Verwendungshistorie; gesendet bedeutet erledigt in abgeschlossener Sendung
|
||||
- standardmäßig ausgeblendete Pieces, die in mindestens einer noch nicht
|
||||
abgeschlossenen Sendung eingeplant sind, mit unabhängigem Sofortfilter
|
||||
- der eigenständige Piece-Editor ist als redaktionelles Arbeitsblatt aufgebaut:
|
||||
Titel, Fundstück, private Recherche und die getrennt gespeicherten
|
||||
Sendungstexte stehen im Schreibfluss; Quellen, Einordnung, Präsentation und
|
||||
Bilder begleiten ihn als Desktop-Kontextleiste oder mobile Werkzeuge
|
||||
- Markdown-Felder wechseln einzeln zwischen Lesen und Bearbeiten, sodass mehrere
|
||||
Textbereiche gleichzeitig offen bleiben; Autosave, Konfliktschutz und
|
||||
sichtbare Speicherfehler verwenden unverändert die Piece-Revision
|
||||
- die Schnellaufnahme „Aufnehmen und öffnen“ leitet nach erfolgreicher Anlage
|
||||
direkt zum neuen Piece weiter, statt den SvelteKit-Redirect als
|
||||
Validierungsfehler abzufangen
|
||||
- Fundus-Originale und sendungsspezifische Verwendungen nutzen denselben
|
||||
großzügigen Dialograhmen mit den Bereichen „Sendungstext“, „Recherche &
|
||||
Quellen“ und „Präsentation“; der jeweilige Speicherkontext ist sichtbar und
|
||||
Original sowie Verwendung bleiben getrennte Revisionsgrenzen
|
||||
- Titel, Einleitung, Moderationsstichpunkte und Überleitung sind ohne
|
||||
vorgeschaltete Lese-/Bearbeitungsschalter direkt beschreibbar; eine kleine
|
||||
Markdown-Leiste ergänzt Formatierung ohne Änderung des Speicherformats
|
||||
- Recherche, Quellen, verwendungseigene Notizen und Material sind in einem
|
||||
Bereich gebündelt; öffentliche Texte, Darstellungswahl und tatsächliche
|
||||
Vorschau stehen gemeinsam im Präsentationsbereich
|
||||
- der Dialog bleibt innerhalb der Desktop-Fensterhöhe, hält Kopf,
|
||||
Bereichsnavigation und Aktionen sichtbar und nutzt mobil die volle
|
||||
Bildschirmfläche; Bereichswechsel hängen Eingaben nicht aus und merken die
|
||||
jeweilige Scrollposition
|
||||
- die Schnellaufnahme akzeptiert Gedanke oder URL, bleibt nach dem Ablegen im
|
||||
Eingang und öffnet die Ausarbeitung erst über eine bewusste Aktion
|
||||
|
||||
Für diese gezielte Überarbeitung wurden `npm run check` sowie kurze
|
||||
Chromium-Sichtkontrollen des Original- und Verwendungseditors bei 1440 × 1000
|
||||
und 390 × 844 Pixeln ausgeführt. Dabei waren Dialoggrenzen, feste Bedienbereiche,
|
||||
alle drei Arbeitsbereiche und horizontaler Überlauf unauffällig. Die vollständige
|
||||
Unit-, E2E- und Build-Matrix ist gemäß Auftrag noch offen.
|
||||
|
||||
## Umgesetzter Stand Etappe 4
|
||||
|
||||
|
||||
@@ -0,0 +1,58 @@
|
||||
ALTER TABLE pieces ADD COLUMN output_title TEXT NOT NULL DEFAULT '';
|
||||
ALTER TABLE piece_usages ADD COLUMN output_title_snapshot TEXT NOT NULL DEFAULT '';
|
||||
|
||||
CREATE TABLE piece_templates (
|
||||
id TEXT PRIMARY KEY,
|
||||
name TEXT NOT NULL UNIQUE,
|
||||
description TEXT NOT NULL DEFAULT '',
|
||||
snapshot_json TEXT NOT NULL CHECK (json_valid(snapshot_json)),
|
||||
revision INTEGER NOT NULL DEFAULT 1 CHECK (revision >= 1),
|
||||
created_at_utc TEXT NOT NULL,
|
||||
updated_at_utc TEXT NOT NULL
|
||||
);
|
||||
|
||||
INSERT INTO piece_templates (
|
||||
id, name, description, snapshot_json, revision, created_at_utc, updated_at_utc
|
||||
) VALUES
|
||||
(
|
||||
'talk', 'Gespräch',
|
||||
'Leitfragen, Recherche und eine klare Überleitung.',
|
||||
'{"title":"Unbenanntes Gespräch","formatId":"format-talk","moderationNotes":"## Leitfragen\n\n- ","categoryIds":["cat-jc"]}',
|
||||
1, '2026-10-23T00:00:00.000Z', '2026-10-23T00:00:00.000Z'
|
||||
),
|
||||
(
|
||||
'find', 'Reaction / Fundstück',
|
||||
'Quelle, Einordnung und präsentierbare Kernaussage.',
|
||||
'{"title":"Neues Fundstück","formatId":"format-find","presentationText":"## Kernaussage\n\n","categoryIds":["cat-reaction"]}',
|
||||
1, '2026-10-23T00:00:00.000Z', '2026-10-23T00:00:00.000Z'
|
||||
),
|
||||
(
|
||||
'interaction', 'Interaktion',
|
||||
'Quiz, Publikumsfrage oder kleines Spiel.',
|
||||
'{"title":"Neue Interaktion","formatId":"format-quiz","moderationNotes":"## Ablauf\n\n1. ","categoryIds":["cat-game"]}',
|
||||
1, '2026-10-23T00:00:00.000Z', '2026-10-23T00:00:00.000Z'
|
||||
);
|
||||
|
||||
CREATE TABLE planning_commands (
|
||||
show_id TEXT NOT NULL REFERENCES shows(id) ON DELETE CASCADE,
|
||||
command_id TEXT NOT NULL,
|
||||
piece_id TEXT NOT NULL REFERENCES pieces(id) ON DELETE CASCADE,
|
||||
usage_id TEXT NOT NULL REFERENCES piece_usages(id) ON DELETE CASCADE,
|
||||
result_revision INTEGER NOT NULL CHECK (result_revision >= 1),
|
||||
created_at_utc TEXT NOT NULL,
|
||||
PRIMARY KEY (show_id, command_id)
|
||||
);
|
||||
|
||||
CREATE TABLE presentation_channels (
|
||||
id TEXT PRIMARY KEY,
|
||||
name TEXT NOT NULL,
|
||||
access_key TEXT NOT NULL,
|
||||
key_hash TEXT NOT NULL UNIQUE,
|
||||
show_id TEXT REFERENCES shows(id) ON DELETE SET NULL,
|
||||
revision INTEGER NOT NULL DEFAULT 0 CHECK (revision >= 0),
|
||||
created_at_utc TEXT NOT NULL,
|
||||
updated_at_utc TEXT NOT NULL
|
||||
);
|
||||
|
||||
UPDATE presentation_access_tokens
|
||||
SET revoked_at_utc = COALESCE(revoked_at_utc, '2026-10-23T00:00:00.000Z');
|
||||
@@ -0,0 +1,18 @@
|
||||
CREATE TABLE planning_commands_durable (
|
||||
show_id TEXT NOT NULL REFERENCES shows(id) ON DELETE CASCADE,
|
||||
command_id TEXT NOT NULL,
|
||||
piece_id TEXT NOT NULL,
|
||||
usage_id TEXT NOT NULL,
|
||||
result_revision INTEGER NOT NULL CHECK (result_revision >= 1),
|
||||
created_at_utc TEXT NOT NULL,
|
||||
PRIMARY KEY (show_id, command_id)
|
||||
);
|
||||
|
||||
INSERT INTO planning_commands_durable (
|
||||
show_id, command_id, piece_id, usage_id, result_revision, created_at_utc
|
||||
)
|
||||
SELECT show_id, command_id, piece_id, usage_id, result_revision, created_at_utc
|
||||
FROM planning_commands;
|
||||
|
||||
DROP TABLE planning_commands;
|
||||
ALTER TABLE planning_commands_durable RENAME TO planning_commands;
|
||||
@@ -0,0 +1,102 @@
|
||||
ALTER TABLE pieces ADD COLUMN is_favorite INTEGER NOT NULL DEFAULT 0
|
||||
CHECK (is_favorite IN (0, 1));
|
||||
|
||||
CREATE TABLE tools (
|
||||
id TEXT PRIMARY KEY,
|
||||
name TEXT NOT NULL UNIQUE,
|
||||
start_url TEXT NOT NULL DEFAULT '',
|
||||
description TEXT NOT NULL DEFAULT '',
|
||||
is_active INTEGER NOT NULL DEFAULT 1 CHECK (is_active IN (0, 1)),
|
||||
created_at_utc TEXT NOT NULL,
|
||||
updated_at_utc TEXT NOT NULL
|
||||
);
|
||||
|
||||
CREATE TABLE tool_formats (
|
||||
tool_id TEXT NOT NULL REFERENCES tools(id) ON DELETE CASCADE,
|
||||
format_id TEXT NOT NULL REFERENCES formats(id) ON DELETE CASCADE,
|
||||
PRIMARY KEY (tool_id, format_id)
|
||||
);
|
||||
|
||||
CREATE TABLE piece_tools (
|
||||
id TEXT PRIMARY KEY,
|
||||
piece_id TEXT NOT NULL REFERENCES pieces(id) ON DELETE CASCADE,
|
||||
tool_id TEXT NOT NULL REFERENCES tools(id) ON DELETE RESTRICT,
|
||||
work_url TEXT NOT NULL DEFAULT '',
|
||||
note TEXT NOT NULL DEFAULT '',
|
||||
position INTEGER NOT NULL CHECK (position >= 0),
|
||||
UNIQUE (piece_id, tool_id),
|
||||
UNIQUE (piece_id, position)
|
||||
);
|
||||
|
||||
CREATE TABLE usage_source_snapshots (
|
||||
id TEXT PRIMARY KEY,
|
||||
usage_id TEXT NOT NULL REFERENCES piece_usages(id) ON DELETE CASCADE,
|
||||
label TEXT NOT NULL,
|
||||
url TEXT NOT NULL,
|
||||
timecode_seconds INTEGER CHECK (timecode_seconds IS NULL OR timecode_seconds >= 0),
|
||||
position INTEGER NOT NULL CHECK (position >= 0),
|
||||
UNIQUE (usage_id, position)
|
||||
);
|
||||
|
||||
CREATE TABLE usage_tool_snapshots (
|
||||
id TEXT PRIMARY KEY,
|
||||
usage_id TEXT NOT NULL REFERENCES piece_usages(id) ON DELETE CASCADE,
|
||||
original_tool_id TEXT REFERENCES tools(id) ON DELETE SET NULL,
|
||||
name TEXT NOT NULL,
|
||||
start_url TEXT NOT NULL DEFAULT '',
|
||||
work_url TEXT NOT NULL DEFAULT '',
|
||||
note TEXT NOT NULL DEFAULT '',
|
||||
position INTEGER NOT NULL CHECK (position >= 0),
|
||||
UNIQUE (usage_id, position)
|
||||
);
|
||||
|
||||
CREATE TABLE usage_topic_snapshots (
|
||||
usage_id TEXT NOT NULL REFERENCES piece_usages(id) ON DELETE CASCADE,
|
||||
name TEXT NOT NULL,
|
||||
position INTEGER NOT NULL CHECK (position >= 0),
|
||||
PRIMARY KEY (usage_id, position)
|
||||
);
|
||||
|
||||
CREATE TABLE live_section_timers (
|
||||
id TEXT PRIMARY KEY,
|
||||
show_id TEXT NOT NULL REFERENCES shows(id) ON DELETE CASCADE,
|
||||
section_id TEXT NOT NULL REFERENCES show_sections(id) ON DELETE CASCADE,
|
||||
planned_duration_seconds INTEGER NOT NULL CHECK (planned_duration_seconds > 0),
|
||||
started_at_utc TEXT NOT NULL,
|
||||
ended_at_utc TEXT,
|
||||
CHECK (ended_at_utc IS NULL OR ended_at_utc >= started_at_utc)
|
||||
);
|
||||
|
||||
CREATE TABLE live_section_timer_runs (
|
||||
id TEXT PRIMARY KEY,
|
||||
timer_id TEXT NOT NULL REFERENCES live_section_timers(id) ON DELETE CASCADE,
|
||||
started_at_utc TEXT NOT NULL,
|
||||
ended_at_utc TEXT,
|
||||
CHECK (ended_at_utc IS NULL OR ended_at_utc >= started_at_utc)
|
||||
);
|
||||
|
||||
CREATE INDEX idx_piece_tools_piece ON piece_tools(piece_id, position);
|
||||
CREATE INDEX idx_tool_formats_format ON tool_formats(format_id, tool_id);
|
||||
CREATE INDEX idx_usage_sources_usage ON usage_source_snapshots(usage_id, position);
|
||||
CREATE INDEX idx_usage_tools_usage ON usage_tool_snapshots(usage_id, position);
|
||||
CREATE UNIQUE INDEX idx_one_open_section_timer_per_show
|
||||
ON live_section_timers(show_id) WHERE ended_at_utc IS NULL;
|
||||
CREATE UNIQUE INDEX idx_one_open_run_per_section_timer
|
||||
ON live_section_timer_runs(timer_id) WHERE ended_at_utc IS NULL;
|
||||
|
||||
INSERT INTO usage_source_snapshots (
|
||||
id, usage_id, label, url, timecode_seconds, position
|
||||
)
|
||||
SELECT lower(hex(randomblob(16))), u.id, ps.label, ps.url, ps.timecode_seconds, ps.position
|
||||
FROM piece_usages u
|
||||
JOIN piece_sources ps ON ps.piece_id = u.original_piece_id;
|
||||
|
||||
INSERT INTO usage_topic_snapshots (usage_id, name, position)
|
||||
SELECT usage_id, name, position
|
||||
FROM (
|
||||
SELECT u.id AS usage_id, t.name,
|
||||
row_number() OVER (PARTITION BY u.id ORDER BY t.name, t.id) - 1 AS position
|
||||
FROM piece_usages u
|
||||
JOIN piece_topics pt ON pt.piece_id = u.original_piece_id
|
||||
JOIN topics t ON t.id = pt.topic_id
|
||||
);
|
||||
@@ -0,0 +1,49 @@
|
||||
ALTER TABLE topics ADD COLUMN icon_name TEXT NOT NULL DEFAULT '';
|
||||
|
||||
ALTER TABLE pieces ADD COLUMN deleted_at_utc TEXT;
|
||||
|
||||
ALTER TABLE piece_media ADD COLUMN removed_at_utc TEXT;
|
||||
|
||||
CREATE TABLE piece_presentation_media (
|
||||
piece_id TEXT PRIMARY KEY REFERENCES pieces(id) ON DELETE CASCADE,
|
||||
media_id TEXT NOT NULL UNIQUE REFERENCES piece_media(id) ON DELETE RESTRICT
|
||||
);
|
||||
|
||||
CREATE TRIGGER validate_piece_presentation_media_insert
|
||||
BEFORE INSERT ON piece_presentation_media
|
||||
WHEN NOT EXISTS (
|
||||
SELECT 1 FROM piece_media
|
||||
WHERE id = NEW.media_id AND piece_id = NEW.piece_id AND removed_at_utc IS NULL
|
||||
)
|
||||
BEGIN
|
||||
SELECT RAISE(ABORT, 'presentation media does not belong to piece');
|
||||
END;
|
||||
|
||||
CREATE TRIGGER validate_piece_presentation_media_update
|
||||
BEFORE UPDATE ON piece_presentation_media
|
||||
WHEN NOT EXISTS (
|
||||
SELECT 1 FROM piece_media
|
||||
WHERE id = NEW.media_id AND piece_id = NEW.piece_id AND removed_at_utc IS NULL
|
||||
)
|
||||
BEGIN
|
||||
SELECT RAISE(ABORT, 'presentation media does not belong to piece');
|
||||
END;
|
||||
|
||||
ALTER TABLE usage_topic_snapshots ADD COLUMN icon_name TEXT NOT NULL DEFAULT '';
|
||||
|
||||
CREATE TABLE usage_media_snapshots (
|
||||
id TEXT PRIMARY KEY,
|
||||
usage_id TEXT NOT NULL REFERENCES piece_usages(id) ON DELETE CASCADE,
|
||||
original_media_id TEXT NOT NULL REFERENCES piece_media(id) ON DELETE RESTRICT,
|
||||
alt_text TEXT NOT NULL DEFAULT '',
|
||||
position INTEGER NOT NULL CHECK (position >= 0),
|
||||
is_presentation INTEGER NOT NULL DEFAULT 0 CHECK (is_presentation IN (0, 1)),
|
||||
UNIQUE (usage_id, position)
|
||||
);
|
||||
|
||||
CREATE INDEX idx_pieces_deleted_at ON pieces(deleted_at_utc);
|
||||
CREATE INDEX idx_piece_media_active ON piece_media(piece_id, position)
|
||||
WHERE removed_at_utc IS NULL;
|
||||
CREATE INDEX idx_usage_media_usage ON usage_media_snapshots(usage_id, position);
|
||||
CREATE UNIQUE INDEX idx_one_presentation_media_per_usage
|
||||
ON usage_media_snapshots(usage_id) WHERE is_presentation = 1;
|
||||
@@ -0,0 +1 @@
|
||||
ALTER TABLE tools ADD COLUMN icon_name TEXT NOT NULL DEFAULT 'wrench';
|
||||
Generated
+2
-2
@@ -1,12 +1,12 @@
|
||||
{
|
||||
"name": "sendewerk",
|
||||
"version": "0.5.2",
|
||||
"version": "0.5.10",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "sendewerk",
|
||||
"version": "0.5.2",
|
||||
"version": "0.5.10",
|
||||
"dependencies": {
|
||||
"@node-rs/argon2": "^2.2.2",
|
||||
"better-sqlite3": "^13.0.3",
|
||||
|
||||
+1
-1
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "sendewerk",
|
||||
"private": true,
|
||||
"version": "0.5.2",
|
||||
"version": "0.5.10",
|
||||
"type": "module",
|
||||
"engines": {
|
||||
"node": ">=22.17 <25"
|
||||
|
||||
@@ -0,0 +1,51 @@
|
||||
import { copyFileSync, mkdirSync, readFileSync, writeFileSync } from 'node:fs';
|
||||
import path from 'node:path';
|
||||
|
||||
const sourceRoot = process.argv[2];
|
||||
if (!sourceRoot) {
|
||||
throw new Error('Usage: node scripts/generate-classic-regular-icons.mjs <font-awesome-web-root>');
|
||||
}
|
||||
|
||||
const javascript = readFileSync(path.join(sourceRoot, 'js', 'regular.js'), 'utf8');
|
||||
const metadata = JSON.parse(readFileSync(path.join(sourceRoot, 'metadata', 'icons.json'), 'utf8'));
|
||||
const start = javascript.indexOf(' var icons = ') + ' var icons = '.length;
|
||||
const end = javascript.indexOf('\n };', start) + '\n }'.length;
|
||||
if (start < ' var icons = '.length || end < start)
|
||||
throw new Error('Classic Regular icons not found');
|
||||
|
||||
const definitions = JSON.parse(javascript.slice(start, end));
|
||||
const icons = Object.keys(definitions)
|
||||
.map((name) => {
|
||||
const details = metadata[name];
|
||||
return {
|
||||
name,
|
||||
label: details?.label ?? name.replaceAll('-', ' '),
|
||||
terms: details?.search?.terms ?? []
|
||||
};
|
||||
})
|
||||
.sort((left, right) => left.label.localeCompare(right.label, 'en'));
|
||||
|
||||
const output = `// Generated from Font Awesome Pro Plus 7.0.0 Classic Regular metadata.
|
||||
// Covered by the Font Awesome Pro commercial license; see THIRD_PARTY_NOTICES.md.
|
||||
export type ClassicRegularIcon = {
|
||||
\tname: string;
|
||||
\tlabel: string;
|
||||
\tterms: readonly string[];
|
||||
};
|
||||
|
||||
export const classicRegularIcons: readonly ClassicRegularIcon[] = ${JSON.stringify(icons)};
|
||||
|
||||
export type IconName = string;
|
||||
|
||||
export const classicRegularIconNames = new Set<string>(
|
||||
classicRegularIcons.map((icon) => icon.name)
|
||||
);
|
||||
`;
|
||||
|
||||
writeFileSync('src/lib/icons/classic-regular.ts', output);
|
||||
mkdirSync('static/icons', { recursive: true });
|
||||
copyFileSync(
|
||||
path.join(sourceRoot, 'sprites-full', 'regular.svg'),
|
||||
'static/icons/classic-regular.svg'
|
||||
);
|
||||
console.log(`Generated ${icons.length} Classic Regular icons.`);
|
||||
@@ -425,6 +425,28 @@ export function seed(databasePath = getPaths().database) {
|
||||
]
|
||||
]
|
||||
);
|
||||
database.prepare('DELETE FROM usage_source_snapshots').run();
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO usage_source_snapshots
|
||||
(id, usage_id, label, url, timecode_seconds, position)
|
||||
SELECT 'seed-source-' || u.id || '-' || ps.position, u.id, ps.label, ps.url,
|
||||
ps.timecode_seconds, ps.position
|
||||
FROM piece_usages u JOIN piece_sources ps ON ps.piece_id = u.original_piece_id`
|
||||
)
|
||||
.run();
|
||||
database.prepare('DELETE FROM usage_topic_snapshots').run();
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO usage_topic_snapshots (usage_id, name, position)
|
||||
SELECT usage_id, name, position FROM (
|
||||
SELECT u.id AS usage_id, t.name,
|
||||
row_number() OVER (PARTITION BY u.id ORDER BY t.name, t.id) - 1 AS position
|
||||
FROM piece_usages u JOIN piece_topics pt ON pt.piece_id = u.original_piece_id
|
||||
JOIN topics t ON t.id = pt.topic_id
|
||||
)`
|
||||
)
|
||||
.run();
|
||||
});
|
||||
|
||||
seedDatabase();
|
||||
|
||||
+2048
-158
File diff suppressed because it is too large.
Load diff
@@ -0,0 +1,23 @@
|
||||
<script lang="ts">
|
||||
let { name, label, size = '1em' }: { name: string; label?: string; size?: string } = $props();
|
||||
</script>
|
||||
|
||||
<svg
|
||||
width={size}
|
||||
height={size}
|
||||
role={label ? 'img' : undefined}
|
||||
aria-label={label}
|
||||
aria-hidden={label ? undefined : 'true'}
|
||||
class="app-icon"
|
||||
>
|
||||
<use href={`/icons/classic-regular.svg#${name || 'circle'}`} />
|
||||
</svg>
|
||||
|
||||
<style>
|
||||
.app-icon {
|
||||
display: inline-block;
|
||||
flex: none;
|
||||
fill: currentColor;
|
||||
vertical-align: -0.125em;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,90 @@
|
||||
<script lang="ts">
|
||||
import AppIcon from './AppIcon.svelte';
|
||||
|
||||
type Item = {
|
||||
id: string;
|
||||
name: string;
|
||||
iconName?: string;
|
||||
description?: string;
|
||||
meta?: string;
|
||||
};
|
||||
|
||||
let {
|
||||
items,
|
||||
selectedIds,
|
||||
label,
|
||||
fieldName,
|
||||
onselectionchange
|
||||
}: {
|
||||
items: Item[];
|
||||
selectedIds: string[];
|
||||
label: string;
|
||||
fieldName?: string;
|
||||
onselectionchange: (ids: string[]) => void;
|
||||
} = $props();
|
||||
let query = $state('');
|
||||
let menu: HTMLDetailsElement;
|
||||
let filtered = $derived(
|
||||
items.filter((item) =>
|
||||
`${item.name} ${item.description ?? ''} ${item.meta ?? ''}`
|
||||
.toLocaleLowerCase('de')
|
||||
.includes(query.trim().toLocaleLowerCase('de'))
|
||||
)
|
||||
);
|
||||
let selected = $derived(items.filter((item) => selectedIds.includes(item.id)));
|
||||
|
||||
function toggle(id: string) {
|
||||
onselectionchange(
|
||||
selectedIds.includes(id)
|
||||
? selectedIds.filter((selectedId) => selectedId !== id)
|
||||
: [...selectedIds, id]
|
||||
);
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="choice-picker">
|
||||
{#if fieldName}
|
||||
{#each selectedIds as id (id)}<input type="hidden" name={fieldName} value={id} />{/each}
|
||||
{/if}
|
||||
{#if selected.length}
|
||||
<div class="choice-picker-selected" aria-label={`${label}: ausgewählt`}>
|
||||
{#each selected as item (item.id)}
|
||||
<span
|
||||
>{#if item.iconName}<AppIcon name={item.iconName} />{/if}{item.name}</span
|
||||
>
|
||||
{/each}
|
||||
</div>
|
||||
{/if}
|
||||
<details bind:this={menu} class="choice-picker-menu">
|
||||
<summary>{selected.length ? `${label} ändern` : `${label} auswählen`}</summary>
|
||||
<div class="choice-picker-popover">
|
||||
<label class="choice-picker-search">
|
||||
<span class="sr-only">{label} durchsuchen</span>
|
||||
<AppIcon name="magnifying-glass" />
|
||||
<input type="search" placeholder={`${label} durchsuchen`} bind:value={query} />
|
||||
</label>
|
||||
<div class="choice-picker-options">
|
||||
{#each filtered as item (item.id)}
|
||||
<label class:active={selectedIds.includes(item.id)}>
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={selectedIds.includes(item.id)}
|
||||
onchange={() => toggle(item.id)}
|
||||
/>
|
||||
{#if item.iconName}<AppIcon name={item.iconName} size="1.2em" />{/if}
|
||||
<span
|
||||
><strong>{item.name}</strong>{#if item.description}<small>{item.description}</small
|
||||
>{/if}</span
|
||||
>
|
||||
{#if item.meta}<small>{item.meta}</small>{/if}
|
||||
</label>
|
||||
{:else}<p>Keine Treffer.</p>{/each}
|
||||
</div>
|
||||
<button
|
||||
class="choice-picker-close text-button"
|
||||
type="button"
|
||||
onclick={() => (menu.open = false)}>Auswahl schließen</button
|
||||
>
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
@@ -1,60 +0,0 @@
|
||||
<script lang="ts">
|
||||
import MarkdownPreview from './MarkdownPreview.svelte';
|
||||
|
||||
let {
|
||||
name,
|
||||
label,
|
||||
inputLabel = label,
|
||||
hint = '',
|
||||
emptyText,
|
||||
value = $bindable(),
|
||||
html,
|
||||
privateField = false,
|
||||
rows = 7
|
||||
}: {
|
||||
name: string;
|
||||
label: string;
|
||||
inputLabel?: string;
|
||||
hint?: string;
|
||||
emptyText: string;
|
||||
value: string;
|
||||
html: string;
|
||||
privateField?: boolean;
|
||||
rows?: number;
|
||||
} = $props();
|
||||
|
||||
let editing = $state(false);
|
||||
</script>
|
||||
|
||||
<section class:private-field={privateField} class:empty={!value.trim()} class="editorial-field">
|
||||
<header>
|
||||
<div>
|
||||
<h3>{label}</h3>
|
||||
{#if hint}<p>{hint}</p>{/if}
|
||||
</div>
|
||||
<button
|
||||
class="text-button editorial-edit-button"
|
||||
type="button"
|
||||
aria-expanded={editing}
|
||||
onclick={() => (editing = !editing)}
|
||||
>
|
||||
{editing ? 'Lesen' : value.trim() ? 'Bearbeiten' : 'Schreiben'}
|
||||
</button>
|
||||
</header>
|
||||
|
||||
{#if editing}
|
||||
<label class="editorial-input">
|
||||
<span class="sr-only">{inputLabel}</span>
|
||||
<textarea aria-label={inputLabel} {name} {rows} maxlength="50000" bind:value></textarea>
|
||||
</label>
|
||||
{:else}
|
||||
<input type="hidden" {name} {value} />
|
||||
{#if value.trim()}
|
||||
<MarkdownPreview {html} />
|
||||
{:else}
|
||||
<button class="editorial-empty" type="button" onclick={() => (editing = true)}>
|
||||
<span>{emptyText}</span><small>Zum Schreiben öffnen</small>
|
||||
</button>
|
||||
{/if}
|
||||
{/if}
|
||||
</section>
|
||||
@@ -0,0 +1,50 @@
|
||||
<script lang="ts">
|
||||
import { classicRegularIcons } from '#lib/icons/classic-regular.js';
|
||||
import AppIcon from './AppIcon.svelte';
|
||||
|
||||
let { name = $bindable(), inputName = 'iconName' }: { name: string; inputName?: string } =
|
||||
$props();
|
||||
let query = $state('');
|
||||
let menu: HTMLDetailsElement;
|
||||
let filtered = $derived(
|
||||
classicRegularIcons.filter((icon) =>
|
||||
`${icon.name} ${icon.label} ${icon.terms.join(' ')}`
|
||||
.toLocaleLowerCase('de')
|
||||
.includes(query.trim().toLocaleLowerCase('de'))
|
||||
)
|
||||
);
|
||||
let visible = $derived(filtered.slice(0, 120));
|
||||
</script>
|
||||
|
||||
<div class="icon-picker">
|
||||
<input type="hidden" name={inputName} value={name} />
|
||||
<details bind:this={menu}>
|
||||
<summary><AppIcon name={name || 'circle'} /> Icon auswählen</summary>
|
||||
<div class="icon-picker-popover">
|
||||
<label
|
||||
><span class="sr-only">Icons durchsuchen</span><input
|
||||
type="search"
|
||||
placeholder="Icon suchen"
|
||||
bind:value={query}
|
||||
/></label
|
||||
>
|
||||
<div class="icon-picker-grid">
|
||||
{#each visible as icon (icon.name)}
|
||||
<button
|
||||
type="button"
|
||||
class:active={name === icon.name}
|
||||
title={icon.label}
|
||||
onclick={() => {
|
||||
name = icon.name;
|
||||
menu.open = false;
|
||||
}}><AppIcon name={icon.name} /><span>{icon.label}</span></button
|
||||
>
|
||||
{/each}
|
||||
</div>
|
||||
{#if filtered.length > visible.length}<p class="icon-picker-hint">
|
||||
{visible.length} von {filtered.length} Icons sichtbar. Suche verwenden, um weitere Icons zu
|
||||
finden.
|
||||
</p>{/if}
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
@@ -0,0 +1,70 @@
|
||||
<script lang="ts">
|
||||
import { tick } from 'svelte';
|
||||
import AppIcon from './AppIcon.svelte';
|
||||
|
||||
let {
|
||||
value = $bindable(),
|
||||
form,
|
||||
name = 'title',
|
||||
label = 'Titel',
|
||||
oncommit
|
||||
}: {
|
||||
value: string;
|
||||
form: string;
|
||||
name?: string;
|
||||
label?: string;
|
||||
oncommit?: () => void;
|
||||
} = $props();
|
||||
|
||||
let editing = $state(false);
|
||||
let original = $state('');
|
||||
let input = $state<HTMLInputElement>();
|
||||
let trigger = $state<HTMLButtonElement>();
|
||||
|
||||
async function edit() {
|
||||
original = value;
|
||||
editing = true;
|
||||
await tick();
|
||||
input?.focus();
|
||||
input?.select();
|
||||
}
|
||||
|
||||
async function finish(commit: boolean) {
|
||||
if (!editing) return;
|
||||
if (!commit) value = original;
|
||||
editing = false;
|
||||
if (commit && value !== original) oncommit?.();
|
||||
await tick();
|
||||
trigger?.focus();
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="inline-title-editor">
|
||||
<input type="hidden" {form} {name} {value} />
|
||||
{#if editing}
|
||||
<label>
|
||||
<span class="sr-only">{label}</span>
|
||||
<input
|
||||
bind:this={input}
|
||||
bind:value
|
||||
maxlength="200"
|
||||
required
|
||||
onkeydown={(event) => {
|
||||
if (event.key === 'Enter') {
|
||||
event.preventDefault();
|
||||
void finish(true);
|
||||
} else if (event.key === 'Escape') {
|
||||
event.preventDefault();
|
||||
void finish(false);
|
||||
}
|
||||
}}
|
||||
onblur={() => void finish(true)}
|
||||
/>
|
||||
</label>
|
||||
{:else}
|
||||
<button bind:this={trigger} type="button" class="inline-title-trigger" onclick={edit}>
|
||||
<span>{value}</span><AppIcon name="pen" size="0.9em" />
|
||||
<span class="sr-only">{label} bearbeiten</span>
|
||||
</button>
|
||||
{/if}
|
||||
</div>
|
||||
@@ -0,0 +1,85 @@
|
||||
<script lang="ts">
|
||||
import { tick } from 'svelte';
|
||||
import AppIcon from './AppIcon.svelte';
|
||||
|
||||
let {
|
||||
name,
|
||||
label,
|
||||
value = $bindable(),
|
||||
rows = 4,
|
||||
placeholder = '',
|
||||
privateField = false,
|
||||
form
|
||||
}: {
|
||||
name: string;
|
||||
label: string;
|
||||
value: string;
|
||||
rows?: number;
|
||||
placeholder?: string;
|
||||
privateField?: boolean;
|
||||
form?: string;
|
||||
} = $props();
|
||||
|
||||
let textarea: HTMLTextAreaElement;
|
||||
|
||||
async function replaceSelection(before: string, after = before, fallback = 'Text') {
|
||||
const start = textarea.selectionStart;
|
||||
const end = textarea.selectionEnd;
|
||||
const selected = value.slice(start, end) || fallback;
|
||||
value = `${value.slice(0, start)}${before}${selected}${after}${value.slice(end)}`;
|
||||
await tick();
|
||||
textarea.focus();
|
||||
textarea.setSelectionRange(start + before.length, start + before.length + selected.length);
|
||||
textarea.dispatchEvent(new Event('input', { bubbles: true }));
|
||||
}
|
||||
|
||||
async function addList() {
|
||||
const start = textarea.selectionStart;
|
||||
const end = textarea.selectionEnd;
|
||||
const selected = value.slice(start, end) || 'Stichpunkt';
|
||||
const replacement = selected
|
||||
.split('\n')
|
||||
.map((line) => `- ${line}`)
|
||||
.join('\n');
|
||||
value = `${value.slice(0, start)}${replacement}${value.slice(end)}`;
|
||||
await tick();
|
||||
textarea.focus();
|
||||
textarea.setSelectionRange(start + 2, start + replacement.length);
|
||||
textarea.dispatchEvent(new Event('input', { bubbles: true }));
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class:private-field={privateField} class="markdown-editor-field">
|
||||
<div class="markdown-editor-heading">
|
||||
<span
|
||||
>{label}{#if privateField}<small>Nur intern</small>{/if}</span
|
||||
>
|
||||
<span class="markdown-toolbar" role="toolbar" aria-label={`${label} formatieren`}>
|
||||
<button type="button" aria-label="Fett" title="Fett" onclick={() => replaceSelection('**')}
|
||||
><strong>B</strong></button
|
||||
>
|
||||
<button type="button" aria-label="Kursiv" title="Kursiv" onclick={() => replaceSelection('_')}
|
||||
><em>I</em></button
|
||||
>
|
||||
<button type="button" aria-label="Liste" title="Liste" onclick={addList}
|
||||
><AppIcon name="list-check" /> Liste</button
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
aria-label="Link"
|
||||
title="Link"
|
||||
onclick={() => replaceSelection('[', '](https://)', 'Linktext')}
|
||||
><AppIcon name="link" /> Link</button
|
||||
>
|
||||
</span>
|
||||
</div>
|
||||
<textarea
|
||||
bind:this={textarea}
|
||||
aria-label={label}
|
||||
{name}
|
||||
{rows}
|
||||
{placeholder}
|
||||
{form}
|
||||
maxlength="50000"
|
||||
bind:value></textarea>
|
||||
</div>
|
||||
@@ -1,34 +1,21 @@
|
||||
<script lang="ts">
|
||||
import AppIcon from './AppIcon.svelte';
|
||||
|
||||
let { name }: { name: string } = $props();
|
||||
const aliases: Record<string, string> = {
|
||||
library: 'folder-open',
|
||||
shows: 'calendar-days',
|
||||
archive: 'box-archive',
|
||||
settings: 'gear',
|
||||
edit: 'pen'
|
||||
};
|
||||
let iconName = $derived(aliases[name] ?? name);
|
||||
</script>
|
||||
|
||||
<svg viewBox="0 0 24 24" aria-hidden="true">
|
||||
{#if name === 'inbox'}
|
||||
<path d="M4 5.5h16v13H4zM4 14h4l1.5 2h5l1.5-2h4" />
|
||||
{:else if name === 'library'}
|
||||
<path d="M5 4.5h4v15H5zM10.5 4.5h4v15h-4zM16 5.5l3-1 3.5 14-3 1z" />
|
||||
{:else if name === 'shows'}
|
||||
<path d="M4 6.5h16v13H4zM8 3.5v6M16 3.5v6M4 10h16" />
|
||||
{:else if name === 'archive'}
|
||||
<path d="M4 7h16v13H4zM3 4h18v4H3zM9 12h6" />
|
||||
{:else if name === 'settings'}
|
||||
<circle cx="12" cy="12" r="3" />
|
||||
<path
|
||||
d="M12 3v2M12 19v2M3 12h2M19 12h2M5.6 5.6 7 7M17 17l1.4 1.4M18.4 5.6 17 7M7 17l-1.4 1.4"
|
||||
/>
|
||||
{:else if name === 'edit'}
|
||||
<path d="M4 20h4L19 9l-4-4L4 16v4zM13.5 6.5l4 4" />
|
||||
{/if}
|
||||
</svg>
|
||||
<AppIcon name={iconName} size="1.25rem" />
|
||||
|
||||
<style>
|
||||
svg {
|
||||
width: 1.25rem;
|
||||
height: 1.25rem;
|
||||
fill: none;
|
||||
stroke: currentColor;
|
||||
stroke-linecap: round;
|
||||
stroke-linejoin: round;
|
||||
stroke-width: 1.7;
|
||||
:global(.app-icon) {
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,82 @@
|
||||
<script lang="ts">
|
||||
import { tick, type Snippet } from 'svelte';
|
||||
import AppIcon from './AppIcon.svelte';
|
||||
|
||||
let {
|
||||
labelledby,
|
||||
activeSection = $bindable(),
|
||||
onrequestclose,
|
||||
header,
|
||||
children,
|
||||
footer
|
||||
}: {
|
||||
labelledby: string;
|
||||
activeSection: 'script' | 'research' | 'presentation';
|
||||
onrequestclose: () => void;
|
||||
header: Snippet;
|
||||
children: Snippet;
|
||||
footer: Snippet;
|
||||
} = $props();
|
||||
|
||||
let dialog: HTMLDialogElement;
|
||||
let workspace: HTMLDivElement;
|
||||
const scrollPositions = { script: 0, research: 0, presentation: 0 };
|
||||
|
||||
async function selectSection(section: typeof activeSection) {
|
||||
scrollPositions[activeSection] = workspace.scrollTop;
|
||||
activeSection = section;
|
||||
await tick();
|
||||
workspace.scrollTop = scrollPositions[section];
|
||||
}
|
||||
|
||||
export function showModal() {
|
||||
if (!dialog.open) dialog.showModal();
|
||||
}
|
||||
|
||||
export function close() {
|
||||
dialog.close();
|
||||
}
|
||||
</script>
|
||||
|
||||
<dialog
|
||||
bind:this={dialog}
|
||||
class="piece-editor-dialog"
|
||||
aria-labelledby={labelledby}
|
||||
oncancel={(event) => {
|
||||
event.preventDefault();
|
||||
onrequestclose();
|
||||
}}
|
||||
onclick={(event) => event.target === dialog && onrequestclose()}
|
||||
>
|
||||
<header class="piece-dialog-header">
|
||||
<div class="piece-dialog-heading">{@render header()}</div>
|
||||
<button
|
||||
class="dialog-close"
|
||||
type="button"
|
||||
aria-label="Editor schließen"
|
||||
onclick={onrequestclose}><AppIcon name="xmark" /></button
|
||||
>
|
||||
</header>
|
||||
<nav class="piece-dialog-tabs" aria-label="Editorbereiche">
|
||||
<button
|
||||
type="button"
|
||||
class:active={activeSection === 'script'}
|
||||
aria-current={activeSection === 'script' ? 'page' : undefined}
|
||||
onclick={() => selectSection('script')}>Sendungstext</button
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
class:active={activeSection === 'research'}
|
||||
aria-current={activeSection === 'research' ? 'page' : undefined}
|
||||
onclick={() => selectSection('research')}>Recherche & Quellen</button
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
class:active={activeSection === 'presentation'}
|
||||
aria-current={activeSection === 'presentation' ? 'page' : undefined}
|
||||
onclick={() => selectSection('presentation')}>Präsentation</button
|
||||
>
|
||||
</nav>
|
||||
<div bind:this={workspace} class="piece-dialog-workspace">{@render children()}</div>
|
||||
<footer class="piece-dialog-footer">{@render footer()}</footer>
|
||||
</dialog>
|
||||
@@ -41,7 +41,7 @@
|
||||
|
||||
{#if content.mode === 'text'}
|
||||
<article class="output-content output-text">
|
||||
<p class="output-kicker">heinzlive</p>
|
||||
{#if content.topics.length}<p class="output-topics">{content.topics.join(' · ')}</p>{/if}
|
||||
<h1>{content.title}</h1>
|
||||
<!-- HTML is produced exclusively by the server-side allowlist sanitizer. -->
|
||||
<!-- eslint-disable-next-line svelte/no-at-html-tags -->
|
||||
@@ -66,6 +66,7 @@
|
||||
<img src={imageSrc} alt="" onerror={() => (imageUnavailable = true)} />
|
||||
</div>{/if}
|
||||
<div class="output-link-copy">
|
||||
{#if content.topics.length}<p class="output-topics">{content.topics.join(' · ')}</p>{/if}
|
||||
<p class="output-kicker">{content.siteName || content.source?.label || 'Webseite'}</p>
|
||||
<h1>{content.previewTitle || content.title}</h1>
|
||||
{#if content.description}<p>{content.description}</p>{/if}
|
||||
@@ -79,6 +80,7 @@
|
||||
{:else}
|
||||
<article class:portrait={content.provider === 'tiktok'} class="output-content output-video">
|
||||
<header>
|
||||
{#if content.topics.length}<p class="output-topics">{content.topics.join(' · ')}</p>{/if}
|
||||
<p class="output-kicker">{content.siteName || content.source?.label || 'Video'}</p>
|
||||
<h1>{content.previewTitle || content.title}</h1>
|
||||
</header>
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
<script lang="ts">
|
||||
import { onMount } from 'svelte';
|
||||
import AppIcon from './AppIcon.svelte';
|
||||
|
||||
type Preference = 'system' | 'light' | 'dark';
|
||||
const preferences: Preference[] = ['system', 'light', 'dark'];
|
||||
@@ -42,8 +43,10 @@
|
||||
onclick={cycle}
|
||||
aria-label={`Darstellung: ${labels[preference]}`}
|
||||
>
|
||||
<span class="theme-symbol" aria-hidden="true">
|
||||
{preference === 'system' ? '◐' : preference === 'light' ? '○' : '●'}
|
||||
</span>
|
||||
<span class="theme-symbol" aria-hidden="true"
|
||||
><AppIcon
|
||||
name={preference === 'system' ? 'display' : preference === 'light' ? 'sun' : 'moon'}
|
||||
/></span
|
||||
>
|
||||
<span>{labels[preference]}</span>
|
||||
</button>
|
||||
@@ -0,0 +1,125 @@
|
||||
<script lang="ts">
|
||||
import { tick } from 'svelte';
|
||||
import AppIcon from './AppIcon.svelte';
|
||||
import ChoicePicker from './ChoicePicker.svelte';
|
||||
import IconPicker from './IconPicker.svelte';
|
||||
|
||||
type Format = { id: string; name: string };
|
||||
type Tool = {
|
||||
id: string;
|
||||
name: string;
|
||||
startUrl: string;
|
||||
description: string;
|
||||
iconName: string;
|
||||
isActive: boolean;
|
||||
formatIds: string[];
|
||||
};
|
||||
|
||||
let { formats }: { formats: Format[] } = $props();
|
||||
let dialog: HTMLDialogElement;
|
||||
let nameInput: HTMLInputElement;
|
||||
let tool = $state<Tool | null>(null);
|
||||
let name = $state('');
|
||||
let startUrl = $state('');
|
||||
let description = $state('');
|
||||
let iconName = $state('wrench');
|
||||
let isActive = $state(true);
|
||||
let formatIds = $state<string[]>([]);
|
||||
|
||||
export async function showModal(selectedTool: Tool | null = null) {
|
||||
tool = selectedTool;
|
||||
name = selectedTool?.name ?? '';
|
||||
startUrl = selectedTool?.startUrl ?? '';
|
||||
description = selectedTool?.description ?? '';
|
||||
iconName = selectedTool?.iconName || 'wrench';
|
||||
isActive = selectedTool?.isActive ?? true;
|
||||
formatIds = [...(selectedTool?.formatIds ?? [])];
|
||||
dialog.showModal();
|
||||
await tick();
|
||||
nameInput.focus();
|
||||
}
|
||||
|
||||
function close() {
|
||||
dialog.close();
|
||||
}
|
||||
</script>
|
||||
|
||||
<dialog
|
||||
bind:this={dialog}
|
||||
class="management-dialog tool-editor-dialog"
|
||||
aria-labelledby="tool-dialog-title"
|
||||
onclick={(event) => event.target === dialog && close()}
|
||||
>
|
||||
<header>
|
||||
<div class="management-dialog-title">
|
||||
<span class="management-dialog-icon"><AppIcon name={iconName || 'wrench'} /></span>
|
||||
<div>
|
||||
<p class="eyebrow">{tool ? 'Werkzeug bearbeiten' : 'Werkzeug hinzufügen'}</p>
|
||||
<h2 id="tool-dialog-title">{tool?.name || 'Neues Werkzeug'}</h2>
|
||||
</div>
|
||||
</div>
|
||||
<button class="dialog-close" type="button" aria-label="Werkzeugdialog schließen" onclick={close}
|
||||
><AppIcon name="xmark" /></button
|
||||
>
|
||||
</header>
|
||||
<form
|
||||
class="management-dialog-form"
|
||||
method="POST"
|
||||
action={tool ? '?/updateTool' : '?/createTool'}
|
||||
>
|
||||
{#if tool}<input type="hidden" name="toolId" value={tool.id} />{/if}
|
||||
<div class="management-dialog-fields">
|
||||
<label
|
||||
>Name<input
|
||||
bind:this={nameInput}
|
||||
bind:value={name}
|
||||
name="name"
|
||||
required
|
||||
maxlength="120"
|
||||
/></label
|
||||
>
|
||||
<label
|
||||
>Start-URL<input
|
||||
bind:value={startUrl}
|
||||
name="startUrl"
|
||||
type="url"
|
||||
maxlength="2000"
|
||||
placeholder="https://…"
|
||||
/></label
|
||||
>
|
||||
<label class="wide-field"
|
||||
>Beschreibung<textarea bind:value={description} name="description" rows="3" maxlength="2000"
|
||||
></textarea></label
|
||||
>
|
||||
</div>
|
||||
<div class="management-dialog-selections">
|
||||
<div>
|
||||
<span class="field-label">Icon</span>
|
||||
<IconPicker bind:name={iconName} />
|
||||
</div>
|
||||
<div>
|
||||
<span class="field-label">Passende Formate</span>
|
||||
<ChoicePicker
|
||||
items={formats}
|
||||
selectedIds={formatIds}
|
||||
label="Formate"
|
||||
fieldName="formatIds"
|
||||
onselectionchange={(ids) => (formatIds = ids)}
|
||||
/>
|
||||
</div>
|
||||
<label class="toggle-row"
|
||||
><input type="checkbox" name="isActive" value="1" bind:checked={isActive} /><span
|
||||
><strong>Aktiv</strong><small
|
||||
>Deaktivierte Werkzeuge bleiben in bestehenden Pieces erhalten.</small
|
||||
></span
|
||||
></label
|
||||
>
|
||||
</div>
|
||||
<footer>
|
||||
<button class="secondary-button" type="button" onclick={close}>Abbrechen</button>
|
||||
<button class="primary-button" type="submit"
|
||||
>{tool ? 'Änderungen speichern' : 'Werkzeug anlegen'}</button
|
||||
>
|
||||
</footer>
|
||||
</form>
|
||||
</dialog>
|
||||
@@ -1,7 +1,10 @@
|
||||
<script lang="ts">
|
||||
import { enhance, type SubmitFunction } from '$app/forms';
|
||||
import { untrack } from 'svelte';
|
||||
import MarkdownEditorField from './MarkdownEditorField.svelte';
|
||||
import InlineTitleEditor from './InlineTitleEditor.svelte';
|
||||
import NavIcon from './NavIcon.svelte';
|
||||
import PieceEditorDialog from './PieceEditorDialog.svelte';
|
||||
import type { PieceUsage } from '#lib/server/shows.js';
|
||||
|
||||
let {
|
||||
@@ -19,12 +22,35 @@
|
||||
error?: string;
|
||||
enhanceCommand: SubmitFunction;
|
||||
} = $props();
|
||||
let dialog: HTMLDialogElement;
|
||||
let presentationMode = $state(untrack(() => usage.presentationMode));
|
||||
|
||||
let formId = $derived(`usage-editor-form-${usage.id}`);
|
||||
let editor: { showModal: () => void; close: () => void };
|
||||
let activeSection = $state<'script' | 'research' | 'presentation'>('script');
|
||||
let draft = $state(
|
||||
untrack(() => ({ ...usage, tools: usage.tools.map((tool) => ({ ...tool })) }))
|
||||
);
|
||||
let dirty = $state(false);
|
||||
let selectedMedia = $derived(
|
||||
draft.media.find((media) => media.id === draft.presentationMediaId) ?? null
|
||||
);
|
||||
|
||||
function durationInMinutes(seconds: number) {
|
||||
return Number((seconds / 60).toFixed(2));
|
||||
}
|
||||
|
||||
function requestClose() {
|
||||
if (dirty && !confirm('Ungespeicherte Änderungen verwerfen und Editor schließen?')) return;
|
||||
dirty = false;
|
||||
editor.close();
|
||||
}
|
||||
|
||||
const enhanceEditor: SubmitFunction = async (input) => {
|
||||
const finish = await enhanceCommand(input);
|
||||
return async (result) => {
|
||||
if (finish) await finish(result);
|
||||
if (result.result.type === 'success') dirty = false;
|
||||
};
|
||||
};
|
||||
</script>
|
||||
|
||||
<button
|
||||
@@ -32,45 +58,66 @@
|
||||
type="button"
|
||||
aria-label={`${usage.title} bearbeiten und verschieben`}
|
||||
title="Bearbeiten und verschieben"
|
||||
onclick={() => dialog.showModal()}
|
||||
onclick={() => editor.showModal()}
|
||||
>
|
||||
<NavIcon name="edit" />
|
||||
</button>
|
||||
|
||||
<dialog
|
||||
bind:this={dialog}
|
||||
class="usage-editor-dialog"
|
||||
aria-labelledby={`usage-editor-title-${usage.id}`}
|
||||
onclick={(event) => event.target === dialog && dialog.close()}
|
||||
<PieceEditorDialog
|
||||
bind:this={editor}
|
||||
bind:activeSection
|
||||
labelledby={`usage-editor-title-${usage.id}`}
|
||||
onrequestclose={requestClose}
|
||||
>
|
||||
<header>
|
||||
<div>
|
||||
<p class="eyebrow">Sendungsspezifische Kopie</p>
|
||||
<h2 id={`usage-editor-title-${usage.id}`}>{usage.title}</h2>
|
||||
</div>
|
||||
<form method="dialog">
|
||||
<button class="dialog-close" type="submit" aria-label="Editor schließen">×</button>
|
||||
</form>
|
||||
</header>
|
||||
<div class="usage-dialog-scroll">
|
||||
{#if error}<div class="form-message error usage-dialog-message" role="alert">{error}</div>{/if}
|
||||
<form
|
||||
use:enhance={enhanceCommand}
|
||||
method="POST"
|
||||
action="?/updateUsage"
|
||||
class="usage-dialog-editor"
|
||||
>
|
||||
<input type="hidden" name="revision" value={revision} />
|
||||
<input type="hidden" name="usageId" value={usage.id} />
|
||||
<section class="editor-section">
|
||||
<div class="section-title">
|
||||
<p class="eyebrow">Grundlagen</p>
|
||||
<h3>Titel, Dauer und Notizen</h3>
|
||||
{#snippet header()}
|
||||
<p class="eyebrow">Sendungsfassung</p>
|
||||
<InlineTitleEditor form={formId} bind:value={draft.title} oncommit={() => (dirty = true)} />
|
||||
<h2 class="sr-only" id={`usage-editor-title-${usage.id}`}>{draft.title}</h2>
|
||||
{/snippet}
|
||||
|
||||
<form
|
||||
id={formId}
|
||||
use:enhance={enhanceEditor}
|
||||
method="POST"
|
||||
action="?/updateUsage"
|
||||
class="piece-dialog-form"
|
||||
oninput={() => (dirty = true)}
|
||||
onchange={() => (dirty = true)}
|
||||
>
|
||||
<input type="hidden" name="revision" value={revision} />
|
||||
<input type="hidden" name="usageId" value={usage.id} />
|
||||
|
||||
<section class="piece-editor-panel" hidden={activeSection !== 'script'}>
|
||||
<div class="piece-panel-heading">
|
||||
<div>
|
||||
<p class="eyebrow">Für die Moderation</p>
|
||||
<h3>Sendungstext</h3>
|
||||
</div>
|
||||
<div class="editor-fields two-columns">
|
||||
<label class="wide-field"
|
||||
>Titel<input name="title" required maxlength="200" value={usage.title} /></label
|
||||
>
|
||||
</div>
|
||||
<div class="piece-writing-stack">
|
||||
<MarkdownEditorField
|
||||
name="intro"
|
||||
label="Einleitung"
|
||||
placeholder="Wie beginnt dieses Thema in der Sendung?"
|
||||
bind:value={draft.intro}
|
||||
/>
|
||||
<MarkdownEditorField
|
||||
name="moderation"
|
||||
label="Moderationsstichpunkte"
|
||||
placeholder="Argumente, Fragen und Ablaufpunkte"
|
||||
rows={10}
|
||||
bind:value={draft.moderation}
|
||||
/>
|
||||
<MarkdownEditorField
|
||||
name="transition"
|
||||
label="Überleitung"
|
||||
placeholder="Wie geht es zum nächsten Thema weiter?"
|
||||
bind:value={draft.transition}
|
||||
/>
|
||||
</div>
|
||||
<details class="piece-meta-details">
|
||||
<summary>Dauer und Einplanung</summary>
|
||||
<div class="piece-meta-grid">
|
||||
<label
|
||||
>Dauer in Minuten<input
|
||||
name="durationMinutes"
|
||||
@@ -81,148 +128,279 @@
|
||||
value={durationInMinutes(usage.durationSeconds)}
|
||||
/></label
|
||||
>
|
||||
<label class="wide-field"
|
||||
>Eigene Notizen<textarea name="ownNotes" rows="3" maxlength="50000"
|
||||
>{usage.ownNotes}</textarea
|
||||
></label
|
||||
>
|
||||
</div>
|
||||
</section>
|
||||
</details>
|
||||
</section>
|
||||
|
||||
<section class="editor-section markdown-section">
|
||||
<div class="section-title">
|
||||
<p class="eyebrow">Redaktion</p>
|
||||
<h3>Getrennte Arbeitsbereiche</h3>
|
||||
<section class="piece-editor-panel" hidden={activeSection !== 'research'}>
|
||||
<div class="piece-panel-heading">
|
||||
<div>
|
||||
<p class="eyebrow">Nicht öffentlich</p>
|
||||
<h3>Recherche & Quellen</h3>
|
||||
</div>
|
||||
<div class="markdown-grid">
|
||||
<label
|
||||
><span>Einleitung</span><textarea name="intro" rows="7" maxlength="50000"
|
||||
>{usage.intro}</textarea
|
||||
></label
|
||||
>
|
||||
<label class="private-field"
|
||||
><span>Private Recherche</span><textarea name="research" rows="7" maxlength="50000"
|
||||
>{usage.research}</textarea
|
||||
></label
|
||||
>
|
||||
<label
|
||||
><span>Moderationsstichpunkte</span><textarea
|
||||
name="moderation"
|
||||
rows="7"
|
||||
maxlength="50000">{usage.moderation}</textarea
|
||||
></label
|
||||
>
|
||||
<label
|
||||
><span>Überleitung</span><textarea name="transition" rows="7" maxlength="50000"
|
||||
>{usage.transition}</textarea
|
||||
></label
|
||||
>
|
||||
<label class="wide-field"
|
||||
><span>Präsentationstext</span><textarea name="presentation" rows="7" maxlength="50000"
|
||||
>{usage.presentation}</textarea
|
||||
></label
|
||||
>
|
||||
<small>Diese Inhalte bleiben innerhalb der Redaktion.</small>
|
||||
</div>
|
||||
<div class="piece-writing-stack">
|
||||
<MarkdownEditorField
|
||||
name="research"
|
||||
label="Private Recherche"
|
||||
placeholder="Hintergrund, Prüfung und offene Fragen"
|
||||
rows={10}
|
||||
privateField
|
||||
bind:value={draft.research}
|
||||
/>
|
||||
<MarkdownEditorField
|
||||
name="ownNotes"
|
||||
label="Interne Notizen zu dieser Verwendung"
|
||||
placeholder="Absprachen und Hinweise nur für diese Sendung"
|
||||
privateField
|
||||
bind:value={draft.ownNotes}
|
||||
/>
|
||||
</div>
|
||||
<section class="piece-source-summary">
|
||||
<p class="eyebrow">Snapshot-Quellen</p>
|
||||
{#if draft.sources.length}
|
||||
{#each draft.sources as source (source.id)}<div>
|
||||
<strong>{source.label}</strong><small>{source.url}</small>
|
||||
</div>{/each}
|
||||
{:else}<p>Für diese Verwendung wurden keine Quellen kopiert.</p>{/if}
|
||||
</section>
|
||||
<section class="piece-source-editor">
|
||||
<div class="piece-subsection-heading">
|
||||
<div>
|
||||
<p class="eyebrow">Snapshot</p>
|
||||
<h3>Werkzeuge</h3>
|
||||
</div>
|
||||
<small>Name und Start-URL bleiben Teil der Sendungsfassung.</small>
|
||||
</div>
|
||||
<div class="presentation-settings">
|
||||
{#if draft.tools.length}<div class="source-list">
|
||||
{#each draft.tools as tool (tool.id)}<div class="source-row tool-assignment-row">
|
||||
<input type="hidden" name="usageToolId" value={tool.id} />
|
||||
<div class="tool-assignment-name">
|
||||
<strong>{tool.name}</strong>{#if tool.startUrl}<small>{tool.startUrl}</small>{/if}
|
||||
</div>
|
||||
<label
|
||||
>Arbeitslink<input
|
||||
name="toolWorkUrl"
|
||||
type="url"
|
||||
maxlength="2000"
|
||||
placeholder={tool.startUrl || 'https://…'}
|
||||
bind:value={tool.workUrl}
|
||||
/></label
|
||||
>
|
||||
<label>Notiz<input name="toolNote" maxlength="2000" bind:value={tool.note} /></label
|
||||
>
|
||||
</div>{/each}
|
||||
</div>{:else}<p class="context-empty">Keine Werkzeuge in dieser Sendungsfassung.</p>{/if}
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<section class="piece-editor-panel" hidden={activeSection !== 'presentation'}>
|
||||
<div class="piece-panel-heading">
|
||||
<div>
|
||||
<p class="eyebrow">Öffentliche Ausgabe</p>
|
||||
<h3>Präsentation</h3>
|
||||
</div>
|
||||
<small>Private Recherche und Notizen werden nicht ausgegeben.</small>
|
||||
</div>
|
||||
<div class="piece-presentation-layout">
|
||||
<div class="piece-presentation-controls">
|
||||
<label
|
||||
>Darstellung<select name="presentationMode" bind:value={presentationMode}>
|
||||
<option value="text">Text</option>
|
||||
<option value="link">Linkvorschau</option>
|
||||
<option value="video">Video</option>
|
||||
</select></label
|
||||
>Präsentationstitel<input
|
||||
name="outputTitle"
|
||||
maxlength="300"
|
||||
placeholder="Optional, sonst interner Titel"
|
||||
bind:value={draft.outputTitle}
|
||||
/></label
|
||||
>
|
||||
{#if presentationMode !== 'text'}
|
||||
<input
|
||||
type="hidden"
|
||||
name="presentationSourceLabel"
|
||||
value={usage.presentationSourceLabel}
|
||||
/>
|
||||
<input type="hidden" name="presentationSourceUrl" value={usage.presentationSourceUrl} />
|
||||
<input
|
||||
type="hidden"
|
||||
name="presentationSourceTimecodeSeconds"
|
||||
value={usage.presentationSourceTimecodeSeconds ?? ''}
|
||||
/>
|
||||
<input type="hidden" name="presentationSiteName" value={usage.presentationSiteName} />
|
||||
<div class="presentation-source-summary wide-field">
|
||||
<span>Ausgewählte Quelle</span>
|
||||
<strong
|
||||
>{usage.presentationSourceLabel ||
|
||||
usage.presentationSourceUrl ||
|
||||
'Keine Quelle'}</strong
|
||||
<MarkdownEditorField
|
||||
name="presentation"
|
||||
label="Öffentlicher Text"
|
||||
placeholder="Text für die Publikumsausgabe"
|
||||
bind:value={draft.presentation}
|
||||
/>
|
||||
<div class="presentation-mode-picker" role="group" aria-label="Darstellung">
|
||||
{#each [['text', 'Text'], ['link', 'Linkvorschau'], ['video', 'Video']] as mode (mode[0])}
|
||||
<label
|
||||
><input
|
||||
type="radio"
|
||||
name="presentationMode"
|
||||
value={mode[0]}
|
||||
bind:group={draft.presentationMode}
|
||||
/>{mode[1]}</label
|
||||
>
|
||||
{/each}
|
||||
</div>
|
||||
<input
|
||||
type="hidden"
|
||||
name="presentationSourceLabel"
|
||||
value={draft.presentationSourceLabel}
|
||||
/>
|
||||
<input type="hidden" name="presentationSourceUrl" value={draft.presentationSourceUrl} />
|
||||
<input
|
||||
type="hidden"
|
||||
name="presentationSourceTimecodeSeconds"
|
||||
value={draft.presentationSourceTimecodeSeconds ?? ''}
|
||||
/>
|
||||
<input type="hidden" name="presentationSiteName" value={draft.presentationSiteName} />
|
||||
<input type="hidden" name="presentationMediaId" value={draft.presentationMediaId ?? ''} />
|
||||
{#if draft.presentationMode !== 'text'}
|
||||
<div class="presentation-settings">
|
||||
<div class="presentation-source-summary wide-field">
|
||||
<span>Ausgewählte Quelle</span>
|
||||
<strong
|
||||
>{draft.presentationSourceLabel ||
|
||||
draft.presentationSourceUrl ||
|
||||
'Keine Quelle'}</strong
|
||||
>
|
||||
{#if draft.presentationSourceUrl}<small>{draft.presentationSourceUrl}</small>{/if}
|
||||
</div>
|
||||
<label
|
||||
>Kartentitel<input
|
||||
name="presentationTitle"
|
||||
maxlength="300"
|
||||
placeholder="Optionaler Anzeigetitel"
|
||||
bind:value={draft.presentationTitle}
|
||||
/></label
|
||||
>
|
||||
<label
|
||||
>Bild-URL<input
|
||||
name="presentationImageUrl"
|
||||
type="url"
|
||||
maxlength="2000"
|
||||
placeholder="https://…"
|
||||
bind:value={draft.presentationImageUrl}
|
||||
/></label
|
||||
>
|
||||
<label class="wide-field"
|
||||
>Anreißer<textarea
|
||||
name="presentationDescription"
|
||||
rows="3"
|
||||
maxlength="1000"
|
||||
placeholder="Kurzer Text zur Vorschau"
|
||||
bind:value={draft.presentationDescription}></textarea></label
|
||||
>
|
||||
{#if usage.presentationSourceUrl}<small>{usage.presentationSourceUrl}</small>{/if}
|
||||
</div>
|
||||
<label
|
||||
>Titel<input
|
||||
name="presentationTitle"
|
||||
maxlength="300"
|
||||
value={usage.presentationTitle}
|
||||
/></label
|
||||
>
|
||||
<label
|
||||
>Bild-URL<input
|
||||
name="presentationImageUrl"
|
||||
type="url"
|
||||
maxlength="2000"
|
||||
value={usage.presentationImageUrl}
|
||||
/></label
|
||||
>
|
||||
<label class="wide-field"
|
||||
>Anreißer<textarea name="presentationDescription" rows="3" maxlength="1000"
|
||||
>{usage.presentationDescription}</textarea
|
||||
></label
|
||||
>
|
||||
{:else}
|
||||
<input type="hidden" name="presentationTitle" value={draft.presentationTitle} />
|
||||
<input
|
||||
type="hidden"
|
||||
name="presentationDescription"
|
||||
value={draft.presentationDescription}
|
||||
/>
|
||||
<input type="hidden" name="presentationImageUrl" value={draft.presentationImageUrl} />
|
||||
{/if}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<button class="primary-button" type="submit">Verwendung speichern</button>
|
||||
</form>
|
||||
|
||||
<section class="usage-dialog-actions" aria-label="Weitere Aktionen">
|
||||
<div>
|
||||
<form use:enhance={enhanceCommand} method="POST" action="?/refreshUsage">
|
||||
<input type="hidden" name="revision" value={revision} />
|
||||
<input type="hidden" name="usageId" value={usage.id} />
|
||||
<button class="secondary-button" type="submit" disabled={!usage.originalPieceId}
|
||||
>Aus Fundus aktualisieren</button
|
||||
>
|
||||
</form>
|
||||
<small
|
||||
>Übernimmt Titel, Dauer und Redaktionstexte. Eigene Notizen und Live-Daten bleiben.</small
|
||||
>
|
||||
{#if draft.media.length}<fieldset class="usage-media-picker">
|
||||
<legend>Hochgeladenes Präsentationsbild</legend>
|
||||
<label
|
||||
><input
|
||||
type="radio"
|
||||
checked={!draft.presentationMediaId}
|
||||
onchange={() => {
|
||||
draft.presentationMediaId = null;
|
||||
dirty = true;
|
||||
}}
|
||||
/> Kein Bild</label
|
||||
>
|
||||
<div class="media-grid">
|
||||
{#each draft.media as media (media.id)}<label class="media-presentation-choice"
|
||||
><input
|
||||
type="radio"
|
||||
checked={draft.presentationMediaId === media.id}
|
||||
onchange={() => {
|
||||
draft.presentationMediaId = media.id;
|
||||
dirty = true;
|
||||
}}
|
||||
/><img src={`/media/${media.originalMediaId}`} alt={media.altText} /><span
|
||||
>Auswählen</span
|
||||
></label
|
||||
>{/each}
|
||||
</div>
|
||||
</fieldset>{/if}
|
||||
<aside class="piece-presentation-preview" aria-label="Präsentationsvorschau">
|
||||
<p class="output-kicker">Vorschau · {draft.presentationMode}</p>
|
||||
<h4>{draft.outputTitle || draft.title}</h4>
|
||||
{#if draft.presentationMode === 'text'}
|
||||
<p class="preview-markdown-source">
|
||||
{draft.presentation || 'Noch kein öffentlicher Text.'}
|
||||
</p>
|
||||
{#if selectedMedia}<img
|
||||
src={`/media/${selectedMedia.originalMediaId}`}
|
||||
alt={selectedMedia.altText}
|
||||
/>{/if}
|
||||
{:else}
|
||||
{#if selectedMedia}<img
|
||||
src={`/media/${selectedMedia.originalMediaId}`}
|
||||
alt={selectedMedia.altText}
|
||||
/>{:else if draft.presentationImageUrl}<img
|
||||
src={draft.presentationImageUrl}
|
||||
alt=""
|
||||
/>{/if}
|
||||
<p>
|
||||
{draft.presentationDescription ||
|
||||
draft.presentationSourceUrl ||
|
||||
'Noch keine Vorschauangaben.'}
|
||||
</p>
|
||||
{/if}
|
||||
</aside>
|
||||
</div>
|
||||
<form use:enhance={enhanceCommand} method="POST" action="?/duplicateUsage">
|
||||
</section>
|
||||
</form>
|
||||
|
||||
{#snippet footer()}
|
||||
<div class="piece-dialog-secondary-actions">
|
||||
<form use:enhance={enhanceCommand} method="POST" action="?/refreshUsage">
|
||||
<input type="hidden" name="revision" value={revision} />
|
||||
<input type="hidden" name="usageId" value={usage.id} />
|
||||
<button class="secondary-button" type="submit">Duplizieren</button>
|
||||
<button class="text-button" type="submit" disabled={!usage.originalPieceId || dirty}
|
||||
>Aus Fundus aktualisieren</button
|
||||
>
|
||||
</form>
|
||||
<form use:enhance={enhanceCommand} method="POST" action="?/duplicateUsage">
|
||||
<input type="hidden" name="revision" value={revision} /><input
|
||||
type="hidden"
|
||||
name="usageId"
|
||||
value={usage.id}
|
||||
/>
|
||||
<button class="text-button" type="submit" disabled={dirty}>Duplizieren</button>
|
||||
</form>
|
||||
<form use:enhance={enhanceCommand} method="POST" action="?/moveUsage">
|
||||
<input type="hidden" name="revision" value={revision} />
|
||||
<input type="hidden" name="usageId" value={usage.id} />
|
||||
<input type="hidden" name="position" value="9999" />
|
||||
<input type="hidden" name="revision" value={revision} /><input
|
||||
type="hidden"
|
||||
name="usageId"
|
||||
value={usage.id}
|
||||
/><input type="hidden" name="position" value="9999" />
|
||||
<label
|
||||
>Ziel<select name="sectionId">
|
||||
<option value="">Reservebank</option>
|
||||
{#each sections as target (target.id)}
|
||||
<option value={target.id} selected={target.id === sectionId}>{target.name}</option>
|
||||
{/each}
|
||||
</select></label
|
||||
><span class="sr-only">Ziel</span><select name="sectionId"
|
||||
><option value="">Reservebank</option>{#each sections as target (target.id)}<option
|
||||
value={target.id}
|
||||
selected={target.id === sectionId}>{target.name}</option
|
||||
>{/each}</select
|
||||
></label
|
||||
>
|
||||
<button class="secondary-button" type="submit">Verschieben</button>
|
||||
<button class="text-button" type="submit" disabled={dirty}>Verschieben</button>
|
||||
</form>
|
||||
<form
|
||||
use:enhance={enhanceCommand}
|
||||
method="POST"
|
||||
action="?/removeUsage"
|
||||
onsubmit={(event) =>
|
||||
!confirm('Verwendung aus der Sendung entfernen?') && event.preventDefault()}
|
||||
!confirm('Piece aus dieser Sendung entfernen?') && event.preventDefault()}
|
||||
>
|
||||
<input type="hidden" name="revision" value={revision} />
|
||||
<input type="hidden" name="usageId" value={usage.id} />
|
||||
<button class="text-button danger-text" type="submit">Entfernen</button>
|
||||
<input type="hidden" name="revision" value={revision} /><input
|
||||
type="hidden"
|
||||
name="usageId"
|
||||
value={usage.id}
|
||||
/>
|
||||
<button class="text-button danger-text" type="submit" disabled={dirty}
|
||||
>Aus Sendung entfernen</button
|
||||
>
|
||||
</form>
|
||||
</section>
|
||||
</div>
|
||||
</dialog>
|
||||
</div>
|
||||
<div class="piece-dialog-primary-action">
|
||||
{#if error}<span class="problem" role="alert">{error}</span>{/if}
|
||||
<button class="primary-button" type="submit" form={formId}>Verwendung speichern</button>
|
||||
</div>
|
||||
{/snippet}
|
||||
</PieceEditorDialog>
|
||||
File diff suppressed because it is too large.
Load diff
@@ -12,14 +12,19 @@ import {
|
||||
getMediaFile,
|
||||
getPiece,
|
||||
getTaxonomy,
|
||||
listPieceTemplates,
|
||||
listPieces,
|
||||
loadPiecePresentationMetadata,
|
||||
savePiece,
|
||||
savePieceAsTemplate,
|
||||
setPieceArchived,
|
||||
setPieceDeleted,
|
||||
setPieceFavorite,
|
||||
uploadPieceImage,
|
||||
updateTaxonomy,
|
||||
type PieceInput
|
||||
} from './content.js';
|
||||
import { closeDatabase } from './database.js';
|
||||
import { closeDatabase, getDatabase } from './database.js';
|
||||
import { renderMarkdown } from './markdown.js';
|
||||
|
||||
let directory: string;
|
||||
@@ -42,6 +47,7 @@ afterEach(() => {
|
||||
function completeInput(overrides: Partial<PieceInput> = {}): PieceInput {
|
||||
return {
|
||||
title: 'Getestetes Piece',
|
||||
outputTitle: '',
|
||||
summary: 'Eine persistente Kurzbeschreibung.',
|
||||
formatId: 'format-talk',
|
||||
status: 'ready',
|
||||
@@ -73,6 +79,57 @@ function completeInput(overrides: Partial<PieceInput> = {}): PieceInput {
|
||||
}
|
||||
|
||||
describe('content management', () => {
|
||||
it('sorts global favorites first without changing their revision', () => {
|
||||
const before = getPiece('piece-console')!;
|
||||
setPieceFavorite('piece-console', true);
|
||||
const pieces = listPieces({ statuses: ['ready'] });
|
||||
expect(pieces[0]).toMatchObject({ id: 'piece-console', isFavorite: true });
|
||||
expect(getPiece('piece-console')).toMatchObject({
|
||||
isFavorite: true,
|
||||
revision: before.revision,
|
||||
status: before.status
|
||||
});
|
||||
});
|
||||
|
||||
it('persists independently versioned templates and copies their complete snapshot', () => {
|
||||
const sourceId = createPiece('talk');
|
||||
const source = getPiece(sourceId)!;
|
||||
savePiece(
|
||||
sourceId,
|
||||
source.revision,
|
||||
completeInput({
|
||||
title: 'Interner Vorlagentitel',
|
||||
outputTitle: 'Titel für die Ausgabe',
|
||||
presentationText: 'Unveränderlicher Vorlagentext'
|
||||
})
|
||||
);
|
||||
const created = savePieceAsTemplate(sourceId, 'Eigene Vorlage', 'Redaktioneller Stand');
|
||||
const template = listPieceTemplates().find((entry) => entry.id === created.id)!;
|
||||
expect(template).toMatchObject({ name: 'Eigene Vorlage', revision: 1 });
|
||||
|
||||
const changed = getPiece(sourceId)!;
|
||||
savePiece(sourceId, changed.revision, {
|
||||
...changed,
|
||||
status: 'ready',
|
||||
presentationText: 'Spätere Änderung'
|
||||
});
|
||||
const copyId = createPiece(created.id);
|
||||
expect(getPiece(copyId)).toMatchObject({
|
||||
title: 'Interner Vorlagentitel',
|
||||
outputTitle: 'Titel für die Ausgabe',
|
||||
presentationText: 'Unveränderlicher Vorlagentext',
|
||||
sources: [
|
||||
{ label: 'Dokumentation', url: 'https://example.com/dokumentation', timecodeSeconds: 75 }
|
||||
]
|
||||
});
|
||||
|
||||
const updated = savePieceAsTemplate(sourceId, 'Eigene Vorlage', 'Neuer Stand', created.id, 1);
|
||||
expect(updated.revision).toBe(2);
|
||||
expect(() =>
|
||||
savePieceAsTemplate(sourceId, 'Eigene Vorlage', 'Veraltet', created.id, 1)
|
||||
).toThrow('CONFLICT');
|
||||
});
|
||||
|
||||
it('persists complete pieces and rejects stale revisions atomically', () => {
|
||||
const id = createPiece('talk');
|
||||
const initial = getPiece(id)!;
|
||||
@@ -143,8 +200,17 @@ describe('content management', () => {
|
||||
});
|
||||
|
||||
it('searches independent taxonomies and archives, restores and duplicates pieces', async () => {
|
||||
createTaxonomy('topic', 'Technikgeschichte');
|
||||
createTaxonomy('topic', 'Technikgeschichte', 'microchip');
|
||||
const topic = getTaxonomy().topics.find((entry) => entry.name === 'Technikgeschichte')!;
|
||||
expect(topic.iconName).toBe('microchip');
|
||||
updateTaxonomy('topic', topic.id, 'Computergeschichte', 'microchip');
|
||||
expect(getTaxonomy().topics.find((entry) => entry.id === topic.id)).toMatchObject({
|
||||
name: 'Computergeschichte',
|
||||
iconName: 'microchip'
|
||||
});
|
||||
expect(() => updateTaxonomy('topic', topic.id, 'Computergeschichte', '../unsafe')).toThrow(
|
||||
'INVALID_ICON'
|
||||
);
|
||||
const sourceId = createPiece('find');
|
||||
const source = getPiece(sourceId)!;
|
||||
savePiece(
|
||||
@@ -198,15 +264,17 @@ describe('content management', () => {
|
||||
'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNk+A8AAQUBAScY42YAAAAASUVORK5CYII=',
|
||||
'base64'
|
||||
);
|
||||
await uploadPieceImage(
|
||||
const uploaded = await uploadPieceImage(
|
||||
id,
|
||||
1,
|
||||
new File([png], '../bild.png', { type: 'text/html' }),
|
||||
'Ein heller Pixel'
|
||||
'Ein heller Pixel',
|
||||
true
|
||||
);
|
||||
const piece = getPiece(id)!;
|
||||
expect(piece.media).toHaveLength(1);
|
||||
expect(piece.media[0]).toMatchObject({ mimeType: 'image/png', altText: 'Ein heller Pixel' });
|
||||
expect(piece.presentationMediaId).toBe(uploaded.id);
|
||||
const media = await getMediaFile(piece.media[0].id);
|
||||
expect(media?.data.equals(png)).toBe(true);
|
||||
expect(existsSync(path.join(directory, 'uploads', '../bild.png'))).toBe(false);
|
||||
@@ -219,7 +287,87 @@ describe('content management', () => {
|
||||
''
|
||||
)
|
||||
).rejects.toThrow('INVALID_IMAGE_TYPE');
|
||||
const stored = getDatabase()
|
||||
.prepare('SELECT storage_name FROM piece_media WHERE id = ?')
|
||||
.get(piece.media[0].id) as { storage_name: string };
|
||||
await deletePieceImage(id, piece.media[0].id, piece.revision);
|
||||
expect(getPiece(id)?.media).toHaveLength(0);
|
||||
expect(getPiece(id)?.presentationMediaId).toBeNull();
|
||||
expect(await getMediaFile(piece.media[0].id)).toBeNull();
|
||||
expect(existsSync(path.join(directory, 'uploads', stored.storage_name))).toBe(true);
|
||||
});
|
||||
|
||||
it('selects presentation media atomically, copies active media and omits media from templates', async () => {
|
||||
const id = createPiece();
|
||||
const png = Buffer.from(
|
||||
'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNk+A8AAQUBAScY42YAAAAASUVORK5CYII=',
|
||||
'base64'
|
||||
);
|
||||
const selected = await uploadPieceImage(
|
||||
id,
|
||||
1,
|
||||
new File([png], 'auswahl.png', { type: 'image/png' }),
|
||||
'Auswahl',
|
||||
true
|
||||
);
|
||||
const second = await uploadPieceImage(
|
||||
id,
|
||||
selected.revision,
|
||||
new File([png], 'entfernt.png', { type: 'image/png' }),
|
||||
'Entfernt'
|
||||
);
|
||||
await deletePieceImage(id, second.id, second.revision);
|
||||
const source = getPiece(id)!;
|
||||
expect(() =>
|
||||
savePiece(id, source.revision, {
|
||||
...source,
|
||||
title: 'Darf nicht gespeichert werden',
|
||||
status: 'preparing',
|
||||
presentationMediaId: 'fremdes-medium'
|
||||
})
|
||||
).toThrow('presentation media does not belong to piece');
|
||||
expect(getPiece(id)).toMatchObject({
|
||||
title: 'Neues Piece',
|
||||
revision: source.revision,
|
||||
presentationMediaId: selected.id
|
||||
});
|
||||
|
||||
const duplicateId = await duplicatePiece(id);
|
||||
const duplicate = getPiece(duplicateId)!;
|
||||
expect(duplicate.media).toHaveLength(1);
|
||||
expect(duplicate.presentationMediaId).toBe(duplicate.media[0].id);
|
||||
expect(duplicate.presentationMediaId).not.toBe(selected.id);
|
||||
|
||||
const template = savePieceAsTemplate(id, 'Ohne Medienreferenz', 'Nur Inhaltsdaten');
|
||||
const snapshot = getDatabase()
|
||||
.prepare('SELECT snapshot_json FROM piece_templates WHERE id = ?')
|
||||
.get(template.id) as { snapshot_json: string };
|
||||
expect(JSON.parse(snapshot.snapshot_json)).not.toHaveProperty('presentationMediaId');
|
||||
expect(getPiece(createPiece(template.id))?.presentationMediaId).toBeNull();
|
||||
});
|
||||
|
||||
it('soft-deletes pieces behind revisions and keeps their original media private', async () => {
|
||||
const id = createPiece();
|
||||
const png = Buffer.from(
|
||||
'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNk+A8AAQUBAScY42YAAAAASUVORK5CYII=',
|
||||
'base64'
|
||||
);
|
||||
const uploaded = await uploadPieceImage(
|
||||
id,
|
||||
1,
|
||||
new File([png], 'privat.png', { type: 'image/png' }),
|
||||
'Privat'
|
||||
);
|
||||
const deleted = setPieceDeleted(id, uploaded.revision, true);
|
||||
expect(getPiece(id)).toBeNull();
|
||||
expect(listPieces({ statuses: ['preparing'] }).some((piece) => piece.id === id)).toBe(false);
|
||||
expect(await getMediaFile(uploaded.id)).toBeNull();
|
||||
expect(() => setPieceFavorite(id, true)).toThrow('NOT_FOUND');
|
||||
expect(() => savePiece(id, deleted.revision, completeInput())).toThrow('NOT_FOUND');
|
||||
expect(() => setPieceDeleted(id, uploaded.revision, false)).toThrow('CONFLICT');
|
||||
|
||||
const restored = setPieceDeleted(id, deleted.revision, false);
|
||||
expect(getPiece(id)).toMatchObject({ id, revision: restored.revision });
|
||||
expect((await getMediaFile(uploaded.id))?.data.equals(png)).toBe(true);
|
||||
});
|
||||
});
|
||||
+414
-147
@@ -1,7 +1,8 @@
|
||||
import { randomUUID } from 'node:crypto';
|
||||
import { copyFile, mkdir, readFile, rename, unlink, writeFile } from 'node:fs/promises';
|
||||
import { copyFile, mkdir, readFile, unlink, writeFile } from 'node:fs/promises';
|
||||
import path from 'node:path';
|
||||
import { fileTypeFromBuffer } from 'file-type';
|
||||
import { classicRegularIconNames } from '#lib/icons/classic-regular.js';
|
||||
import { getDatabase } from './database.js';
|
||||
import { getServerPaths } from './config.js';
|
||||
import {
|
||||
@@ -21,8 +22,23 @@ export type PieceSourceInput = {
|
||||
timecodeSeconds: number | null;
|
||||
};
|
||||
|
||||
export type PieceToolInput = {
|
||||
toolId: string;
|
||||
workUrl: string;
|
||||
note: string;
|
||||
};
|
||||
|
||||
export type PieceTool = PieceToolInput & {
|
||||
id: string;
|
||||
name: string;
|
||||
startUrl: string;
|
||||
iconName: string;
|
||||
isActive: boolean;
|
||||
};
|
||||
|
||||
export type PieceInput = {
|
||||
title: string;
|
||||
outputTitle: string;
|
||||
summary: string;
|
||||
formatId: string | null;
|
||||
status: EditablePieceStatus;
|
||||
@@ -44,9 +60,11 @@ export type PieceInput = {
|
||||
presentationDescriptionManual: boolean;
|
||||
presentationImageManual: boolean;
|
||||
presentationMetadataFetchedAtUtc: string | null;
|
||||
presentationMediaId?: string | null;
|
||||
topicIds: string[];
|
||||
categoryIds: string[];
|
||||
sources: PieceSourceInput[];
|
||||
tools?: PieceToolInput[];
|
||||
};
|
||||
|
||||
export type PieceListItem = {
|
||||
@@ -59,18 +77,22 @@ export type PieceListItem = {
|
||||
formatId: string | null;
|
||||
format: string;
|
||||
categories: { id: string; name: string; color: string }[];
|
||||
topics: { id: string; name: string }[];
|
||||
topics: { id: string; name: string; iconName: string }[];
|
||||
sourceCount: number;
|
||||
mediaId: string | null;
|
||||
isFavorite: boolean;
|
||||
};
|
||||
|
||||
export type PieceEditor = Omit<PieceInput, 'status'> & {
|
||||
export type PieceEditor = Omit<PieceInput, 'status' | 'tools' | 'presentationMediaId'> & {
|
||||
id: string;
|
||||
status: PieceStatus;
|
||||
revision: number;
|
||||
createdAtUtc: string;
|
||||
updatedAtUtc: string;
|
||||
media: PieceMedia[];
|
||||
presentationMediaId: string | null;
|
||||
isFavorite: boolean;
|
||||
tools: PieceTool[];
|
||||
};
|
||||
|
||||
export type PieceMedia = {
|
||||
@@ -85,33 +107,16 @@ export type PieceMedia = {
|
||||
export type Taxonomy = {
|
||||
categories: { id: string; name: string; color: string }[];
|
||||
formats: { id: string; name: string }[];
|
||||
topics: { id: string; name: string }[];
|
||||
topics: { id: string; name: string; iconName: string }[];
|
||||
};
|
||||
|
||||
export const pieceTemplates = [
|
||||
{
|
||||
id: 'blank',
|
||||
name: 'Leer starten',
|
||||
description: 'Ein freies Piece ohne Vorgaben.'
|
||||
},
|
||||
{
|
||||
id: 'talk',
|
||||
name: 'Gespräch',
|
||||
description: 'Leitfragen, Recherche und eine klare Überleitung.'
|
||||
},
|
||||
{
|
||||
id: 'find',
|
||||
name: 'Reaction / Fundstück',
|
||||
description: 'Quelle, Einordnung und präsentierbare Kernaussage.'
|
||||
},
|
||||
{
|
||||
id: 'interaction',
|
||||
name: 'Interaktion',
|
||||
description: 'Quiz, Publikumsfrage oder kleines Spiel.'
|
||||
}
|
||||
] as const;
|
||||
|
||||
export type PieceTemplateId = (typeof pieceTemplates)[number]['id'];
|
||||
export type PieceTemplate = {
|
||||
id: string;
|
||||
name: string;
|
||||
description: string;
|
||||
revision: number;
|
||||
iconName: string;
|
||||
};
|
||||
|
||||
const MAX_UPLOAD_BYTES = 5 * 1024 * 1024;
|
||||
const ALLOWED_IMAGES = new Map([
|
||||
@@ -131,6 +136,13 @@ function uniqueIds(values: string[]): string[] {
|
||||
return [...new Set(values.filter(Boolean))];
|
||||
}
|
||||
|
||||
function cleanIconName(value: unknown): string {
|
||||
const iconName = cleanText(value, 80, 'icon');
|
||||
if (!iconName) return '';
|
||||
if (!classicRegularIconNames.has(iconName)) throw new Error('INVALID_ICON');
|
||||
return iconName;
|
||||
}
|
||||
|
||||
function validUrl(value: string): boolean {
|
||||
try {
|
||||
const url = new URL(value);
|
||||
@@ -140,6 +152,32 @@ function validUrl(value: string): boolean {
|
||||
}
|
||||
}
|
||||
|
||||
function cleanPieceTools(values: PieceToolInput[] = []): PieceToolInput[] {
|
||||
if (values.length > 20) throw new Error('INVALID_TOOLS');
|
||||
const ids = uniqueIds(values.map((value) => value.toolId));
|
||||
if (ids.length !== values.length) throw new Error('INVALID_TOOLS');
|
||||
if (ids.length) {
|
||||
const placeholders = ids.map(() => '?').join(', ');
|
||||
const row = getDatabase()
|
||||
.prepare(`SELECT count(*) AS count FROM tools WHERE id IN (${placeholders})`)
|
||||
.get(...ids) as { count: number };
|
||||
if (row.count !== ids.length) throw new Error('INVALID_TOOLS');
|
||||
}
|
||||
return values.map((value) => {
|
||||
const workUrl = cleanText(value.workUrl, 2_000, 'tools');
|
||||
if (workUrl) {
|
||||
if (!validUrl(workUrl)) throw new Error('INVALID_TOOLS');
|
||||
const parsed = new URL(workUrl);
|
||||
if (parsed.username || parsed.password) throw new Error('INVALID_TOOLS');
|
||||
}
|
||||
return {
|
||||
toolId: value.toolId,
|
||||
workUrl,
|
||||
note: cleanText(value.note, 2_000, 'tools')
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
function requireTaxonomyIds(table: 'formats' | 'topics' | 'section_categories', ids: string[]) {
|
||||
if (!ids.length) return;
|
||||
const placeholders = ids.map(() => '?').join(', ');
|
||||
@@ -200,8 +238,13 @@ function validatePieceInput(input: PieceInput): PieceInput {
|
||||
}
|
||||
const detected =
|
||||
sourcePosition === null ? null : detectVideoProvider(sources[sourcePosition].url);
|
||||
const presentationMediaId =
|
||||
input.presentationMediaId === undefined
|
||||
? undefined
|
||||
: cleanText(input.presentationMediaId, 100, 'presentation_media') || null;
|
||||
return {
|
||||
title,
|
||||
outputTitle: cleanText(input.outputTitle, 300, 'output_title'),
|
||||
summary: cleanText(input.summary, 2_000, 'summary'),
|
||||
formatId: input.formatId || null,
|
||||
status: input.status,
|
||||
@@ -227,9 +270,11 @@ function validatePieceInput(input: PieceInput): PieceInput {
|
||||
presentationDescriptionManual: Boolean(input.presentationDescriptionManual),
|
||||
presentationImageManual: Boolean(input.presentationImageManual),
|
||||
presentationMetadataFetchedAtUtc: input.presentationMetadataFetchedAtUtc || null,
|
||||
presentationMediaId,
|
||||
topicIds,
|
||||
categoryIds,
|
||||
sources
|
||||
sources,
|
||||
tools: cleanPieceTools(input.tools)
|
||||
};
|
||||
}
|
||||
|
||||
@@ -243,7 +288,7 @@ export function getTaxonomy(): Taxonomy {
|
||||
.prepare('SELECT id, name FROM formats ORDER BY name')
|
||||
.all() as Taxonomy['formats'],
|
||||
topics: database
|
||||
.prepare('SELECT id, name FROM topics ORDER BY name')
|
||||
.prepare('SELECT id, name, icon_name AS iconName FROM topics ORDER BY name')
|
||||
.all() as Taxonomy['topics']
|
||||
};
|
||||
}
|
||||
@@ -251,6 +296,7 @@ export function getTaxonomy(): Taxonomy {
|
||||
type PieceListRow = {
|
||||
id: string;
|
||||
title: string;
|
||||
output_title: string;
|
||||
summary: string;
|
||||
status: PieceStatus;
|
||||
revision: number;
|
||||
@@ -259,6 +305,7 @@ type PieceListRow = {
|
||||
format: string;
|
||||
source_count: number;
|
||||
media_id: string | null;
|
||||
is_favorite: number;
|
||||
};
|
||||
|
||||
export function listPieces(filters: {
|
||||
@@ -267,9 +314,13 @@ export function listPieces(filters: {
|
||||
formatId?: string;
|
||||
topicId?: string;
|
||||
categoryId?: string;
|
||||
deleted?: boolean;
|
||||
}): PieceListItem[] {
|
||||
if (!filters.statuses.length) return [];
|
||||
const conditions = [`p.status IN (${filters.statuses.map(() => '?').join(', ')})`];
|
||||
const conditions = [
|
||||
`p.status IN (${filters.statuses.map(() => '?').join(', ')})`,
|
||||
filters.deleted ? 'p.deleted_at_utc IS NOT NULL' : 'p.deleted_at_utc IS NULL'
|
||||
];
|
||||
const parameters: unknown[] = [...filters.statuses];
|
||||
const query = filters.query?.trim().toLowerCase();
|
||||
if (query) {
|
||||
@@ -303,13 +354,14 @@ export function listPieces(filters: {
|
||||
const database = getDatabase();
|
||||
const rows = database
|
||||
.prepare(
|
||||
`SELECT p.id, p.title, p.summary, p.status, p.revision, p.duration_seconds,
|
||||
`SELECT p.id, p.title, p.summary, p.status, p.revision, p.duration_seconds, p.is_favorite,
|
||||
p.format_id, COALESCE(f.name, 'Ohne Format') AS format,
|
||||
(SELECT count(*) FROM piece_sources ps WHERE ps.piece_id = p.id) AS source_count,
|
||||
(SELECT pm.id FROM piece_media pm WHERE pm.piece_id = p.id ORDER BY pm.position LIMIT 1) AS media_id
|
||||
(SELECT pm.id FROM piece_media pm WHERE pm.piece_id = p.id AND pm.removed_at_utc IS NULL ORDER BY pm.position LIMIT 1) AS media_id
|
||||
FROM pieces p LEFT JOIN formats f ON f.id = p.format_id
|
||||
WHERE ${conditions.join(' AND ')}
|
||||
ORDER BY CASE p.status WHEN 'ready' THEN 0 WHEN 'preparing' THEN 1 WHEN 'inbox' THEN 2 ELSE 3 END,
|
||||
ORDER BY p.is_favorite DESC,
|
||||
CASE p.status WHEN 'ready' THEN 0 WHEN 'preparing' THEN 1 WHEN 'inbox' THEN 2 ELSE 3 END,
|
||||
p.updated_at_utc DESC, p.title`
|
||||
)
|
||||
.all(...parameters) as PieceListRow[];
|
||||
@@ -319,7 +371,7 @@ export function listPieces(filters: {
|
||||
WHERE pc.piece_id = ? ORDER BY c.sort_order, c.name`
|
||||
);
|
||||
const topicStatement = database.prepare(
|
||||
`SELECT t.id, t.name FROM piece_topics pt JOIN topics t ON t.id = pt.topic_id
|
||||
`SELECT t.id, t.name, t.icon_name AS iconName FROM piece_topics pt JOIN topics t ON t.id = pt.topic_id
|
||||
WHERE pt.piece_id = ? ORDER BY t.name`
|
||||
);
|
||||
return rows.map((row) => ({
|
||||
@@ -334,13 +386,15 @@ export function listPieces(filters: {
|
||||
categories: categoryStatement.all(row.id) as PieceListItem['categories'],
|
||||
topics: topicStatement.all(row.id) as PieceListItem['topics'],
|
||||
sourceCount: row.source_count,
|
||||
mediaId: row.media_id
|
||||
mediaId: row.media_id,
|
||||
isFavorite: row.is_favorite === 1
|
||||
}));
|
||||
}
|
||||
|
||||
type PieceRow = {
|
||||
id: string;
|
||||
title: string;
|
||||
output_title: string;
|
||||
summary: string;
|
||||
format_id: string | null;
|
||||
status: PieceStatus;
|
||||
@@ -365,26 +419,32 @@ type PieceRow = {
|
||||
revision: number;
|
||||
created_at_utc: string;
|
||||
updated_at_utc: string;
|
||||
is_favorite: number;
|
||||
presentation_media_id: string | null;
|
||||
};
|
||||
|
||||
export function getPiece(id: string): PieceEditor | null {
|
||||
const database = getDatabase();
|
||||
const row = database
|
||||
.prepare(
|
||||
`SELECT id, title, summary, format_id, status, duration_seconds, intro, research_text,
|
||||
`SELECT id, title, output_title, summary, format_id, status, duration_seconds, intro, research_text,
|
||||
moderation_notes, transition_text, presentation_text, presentation_mode,
|
||||
presentation_source_position, presentation_title, presentation_description,
|
||||
presentation_image_url, presentation_site_name, presentation_provider,
|
||||
presentation_provider_id, presentation_title_manual, presentation_description_manual,
|
||||
presentation_image_manual, presentation_metadata_fetched_at_utc,
|
||||
revision, created_at_utc, updated_at_utc
|
||||
FROM pieces WHERE id = ?`
|
||||
(SELECT ppm.media_id FROM piece_presentation_media ppm
|
||||
JOIN piece_media pm ON pm.id = ppm.media_id AND pm.removed_at_utc IS NULL
|
||||
WHERE ppm.piece_id = pieces.id) AS presentation_media_id,
|
||||
revision, created_at_utc, updated_at_utc, is_favorite
|
||||
FROM pieces WHERE id = ? AND deleted_at_utc IS NULL`
|
||||
)
|
||||
.get(id) as PieceRow | undefined;
|
||||
if (!row) return null;
|
||||
return {
|
||||
id: row.id,
|
||||
title: row.title,
|
||||
outputTitle: row.output_title,
|
||||
summary: row.summary,
|
||||
formatId: row.format_id,
|
||||
status: row.status,
|
||||
@@ -406,9 +466,11 @@ export function getPiece(id: string): PieceEditor | null {
|
||||
presentationDescriptionManual: row.presentation_description_manual === 1,
|
||||
presentationImageManual: row.presentation_image_manual === 1,
|
||||
presentationMetadataFetchedAtUtc: row.presentation_metadata_fetched_at_utc,
|
||||
presentationMediaId: row.presentation_media_id,
|
||||
revision: row.revision,
|
||||
createdAtUtc: row.created_at_utc,
|
||||
updatedAtUtc: row.updated_at_utc,
|
||||
isFavorite: row.is_favorite === 1,
|
||||
topicIds: (
|
||||
database.prepare('SELECT topic_id FROM piece_topics WHERE piece_id = ?').all(id) as {
|
||||
topic_id: string;
|
||||
@@ -434,7 +496,7 @@ export function getPiece(id: string): PieceEditor | null {
|
||||
database
|
||||
.prepare(
|
||||
`SELECT id, original_name, mime_type, byte_size, alt_text, position
|
||||
FROM piece_media WHERE piece_id = ? ORDER BY position`
|
||||
FROM piece_media WHERE piece_id = ? AND removed_at_utc IS NULL ORDER BY position`
|
||||
)
|
||||
.all(id) as {
|
||||
id: string;
|
||||
@@ -451,6 +513,33 @@ export function getPiece(id: string): PieceEditor | null {
|
||||
byteSize: media.byte_size,
|
||||
altText: media.alt_text,
|
||||
position: media.position
|
||||
})),
|
||||
tools: (
|
||||
database
|
||||
.prepare(
|
||||
`SELECT pt.id, pt.tool_id, pt.work_url, pt.note, t.name, t.start_url, t.icon_name, t.is_active
|
||||
FROM piece_tools pt JOIN tools t ON t.id = pt.tool_id
|
||||
WHERE pt.piece_id = ? ORDER BY pt.position`
|
||||
)
|
||||
.all(id) as {
|
||||
id: string;
|
||||
tool_id: string;
|
||||
work_url: string;
|
||||
note: string;
|
||||
name: string;
|
||||
start_url: string;
|
||||
icon_name: string;
|
||||
is_active: number;
|
||||
}[]
|
||||
).map((tool) => ({
|
||||
id: tool.id,
|
||||
toolId: tool.tool_id,
|
||||
workUrl: tool.work_url,
|
||||
note: tool.note,
|
||||
name: tool.name,
|
||||
startUrl: tool.start_url,
|
||||
iconName: tool.icon_name,
|
||||
isActive: tool.is_active === 1
|
||||
}))
|
||||
};
|
||||
}
|
||||
@@ -473,6 +562,32 @@ function replaceRelations(pieceId: string, input: PieceInput) {
|
||||
input.sources.forEach((source, position) =>
|
||||
addSource.run(randomUUID(), pieceId, source.label, source.url, source.timecodeSeconds, position)
|
||||
);
|
||||
database.prepare('DELETE FROM piece_tools WHERE piece_id = ?').run(pieceId);
|
||||
const addTool = database.prepare(
|
||||
`INSERT INTO piece_tools (id, piece_id, tool_id, work_url, note, position)
|
||||
VALUES (?, ?, ?, ?, ?, ?)`
|
||||
);
|
||||
(input.tools ?? []).forEach((tool, position) =>
|
||||
addTool.run(randomUUID(), pieceId, tool.toolId, tool.workUrl, tool.note, position)
|
||||
);
|
||||
}
|
||||
|
||||
function replacePresentationMedia(pieceId: string, mediaId: string | null | undefined) {
|
||||
if (mediaId === undefined) return;
|
||||
const database = getDatabase();
|
||||
database.prepare('DELETE FROM piece_presentation_media WHERE piece_id = ?').run(pieceId);
|
||||
if (mediaId) {
|
||||
database
|
||||
.prepare('INSERT INTO piece_presentation_media (piece_id, media_id) VALUES (?, ?)')
|
||||
.run(pieceId, mediaId);
|
||||
}
|
||||
}
|
||||
|
||||
export function setPieceFavorite(id: string, favorite: boolean) {
|
||||
const result = getDatabase()
|
||||
.prepare('UPDATE pieces SET is_favorite = ? WHERE id = ? AND deleted_at_utc IS NULL')
|
||||
.run(favorite ? 1 : 0, id);
|
||||
if (result.changes !== 1) throw new Error('NOT_FOUND');
|
||||
}
|
||||
|
||||
export function savePiece(id: string, expectedRevision: number, rawInput: PieceInput) {
|
||||
@@ -484,7 +599,7 @@ export function savePiece(id: string, expectedRevision: number, rawInput: PieceI
|
||||
const save = database.transaction(() => {
|
||||
const result = database
|
||||
.prepare(
|
||||
`UPDATE pieces SET title = ?, summary = ?, format_id = ?, status = ?, duration_seconds = ?,
|
||||
`UPDATE pieces SET title = ?, output_title = ?, summary = ?, format_id = ?, status = ?, duration_seconds = ?,
|
||||
intro = ?, research_text = ?, moderation_notes = ?, transition_text = ?, presentation_text = ?,
|
||||
presentation_mode = ?, presentation_source_position = ?, presentation_title = ?,
|
||||
presentation_description = ?, presentation_image_url = ?, presentation_site_name = ?,
|
||||
@@ -492,10 +607,11 @@ export function savePiece(id: string, expectedRevision: number, rawInput: PieceI
|
||||
presentation_description_manual = ?, presentation_image_manual = ?,
|
||||
presentation_metadata_fetched_at_utc = ?,
|
||||
updated_at_utc = ?, revision = revision + 1, archived_from_status = NULL
|
||||
WHERE id = ? AND revision = ? AND status != 'archived'`
|
||||
WHERE id = ? AND revision = ? AND status != 'archived' AND deleted_at_utc IS NULL`
|
||||
)
|
||||
.run(
|
||||
input.title,
|
||||
input.outputTitle,
|
||||
input.summary,
|
||||
input.formatId,
|
||||
input.status,
|
||||
@@ -522,59 +638,31 @@ export function savePiece(id: string, expectedRevision: number, rawInput: PieceI
|
||||
expectedRevision
|
||||
);
|
||||
if (result.changes !== 1) {
|
||||
const exists = database.prepare('SELECT 1 FROM pieces WHERE id = ?').get(id);
|
||||
const exists = database
|
||||
.prepare('SELECT 1 FROM pieces WHERE id = ? AND deleted_at_utc IS NULL')
|
||||
.get(id);
|
||||
throw new Error(exists ? 'CONFLICT' : 'NOT_FOUND');
|
||||
}
|
||||
replaceRelations(id, input);
|
||||
replacePresentationMedia(id, input.presentationMediaId);
|
||||
});
|
||||
save();
|
||||
return { revision: expectedRevision + 1, updatedAtUtc };
|
||||
}
|
||||
|
||||
function templateDefaults(template: PieceTemplateId): Partial<PieceInput> & { title: string } {
|
||||
if (template === 'talk') {
|
||||
return {
|
||||
title: 'Unbenanntes Gespräch',
|
||||
formatId: 'format-talk',
|
||||
categoryIds: ['cat-jc'],
|
||||
moderationNotes: '## Leitfragen\n\n- '
|
||||
};
|
||||
}
|
||||
if (template === 'find') {
|
||||
return {
|
||||
title: 'Neues Fundstück',
|
||||
formatId: 'format-find',
|
||||
categoryIds: ['cat-reaction'],
|
||||
presentationText: '## Kernaussage\n\n'
|
||||
};
|
||||
}
|
||||
if (template === 'interaction') {
|
||||
return {
|
||||
title: 'Neue Interaktion',
|
||||
formatId: 'format-quiz',
|
||||
categoryIds: ['cat-game'],
|
||||
moderationNotes: '## Ablauf\n\n1. '
|
||||
};
|
||||
}
|
||||
return { title: 'Neues Piece' };
|
||||
}
|
||||
|
||||
export function createPiece(template: PieceTemplateId = 'blank'): string {
|
||||
if (!pieceTemplates.some((entry) => entry.id === template)) throw new Error('INVALID_TEMPLATE');
|
||||
const defaults = templateDefaults(template);
|
||||
const id = randomUUID();
|
||||
const now = new Date().toISOString();
|
||||
const input = validatePieceInput({
|
||||
title: defaults.title,
|
||||
function blankPieceInput(): PieceInput {
|
||||
return {
|
||||
title: 'Neues Piece',
|
||||
outputTitle: '',
|
||||
summary: '',
|
||||
formatId: defaults.formatId ?? null,
|
||||
formatId: null,
|
||||
status: 'preparing',
|
||||
durationSeconds: 0,
|
||||
intro: '',
|
||||
researchText: '',
|
||||
moderationNotes: defaults.moderationNotes ?? '',
|
||||
moderationNotes: '',
|
||||
transitionText: '',
|
||||
presentationText: defaults.presentationText ?? '',
|
||||
presentationText: '',
|
||||
presentationMode: 'text',
|
||||
presentationSourcePosition: null,
|
||||
presentationTitle: '',
|
||||
@@ -587,21 +675,77 @@ export function createPiece(template: PieceTemplateId = 'blank'): string {
|
||||
presentationDescriptionManual: false,
|
||||
presentationImageManual: false,
|
||||
presentationMetadataFetchedAtUtc: null,
|
||||
presentationMediaId: null,
|
||||
topicIds: [],
|
||||
categoryIds: defaults.categoryIds ?? [],
|
||||
categoryIds: [],
|
||||
sources: []
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
function templateInput(templateId: string): PieceInput {
|
||||
if (templateId === 'blank') return blankPieceInput();
|
||||
const row = getDatabase()
|
||||
.prepare('SELECT snapshot_json FROM piece_templates WHERE id = ?')
|
||||
.get(templateId) as { snapshot_json: string } | undefined;
|
||||
if (!row) throw new Error('INVALID_TEMPLATE');
|
||||
try {
|
||||
const snapshot = JSON.parse(row.snapshot_json) as Partial<PieceInput>;
|
||||
delete snapshot.presentationMediaId;
|
||||
return validatePieceInput({ ...blankPieceInput(), ...snapshot, status: 'preparing' });
|
||||
} catch {
|
||||
throw new Error('INVALID_TEMPLATE');
|
||||
}
|
||||
}
|
||||
|
||||
export function listPieceTemplates(): PieceTemplate[] {
|
||||
const database = getDatabase();
|
||||
const rows = database
|
||||
.prepare('SELECT id, name, description, revision FROM piece_templates ORDER BY name')
|
||||
.all() as Omit<PieceTemplate, 'iconName'>[];
|
||||
const iconForTemplate = (templateId: string) => {
|
||||
const input = templateInput(templateId);
|
||||
if (!input.topicIds.length) return 'newspaper';
|
||||
return (
|
||||
(
|
||||
database.prepare('SELECT icon_name FROM topics WHERE id = ?').get(input.topicIds[0]) as
|
||||
{ icon_name: string } | undefined
|
||||
)?.icon_name || 'newspaper'
|
||||
);
|
||||
};
|
||||
return [
|
||||
{
|
||||
id: 'blank',
|
||||
name: 'Leer starten',
|
||||
description: 'Ein freies Piece ohne Vorgaben.',
|
||||
revision: 0,
|
||||
iconName: 'newspaper'
|
||||
},
|
||||
...rows.flatMap((template) => {
|
||||
try {
|
||||
return [{ ...template, iconName: iconForTemplate(template.id) }];
|
||||
} catch {
|
||||
return [];
|
||||
}
|
||||
})
|
||||
];
|
||||
}
|
||||
|
||||
export function createPiece(template = 'blank'): string {
|
||||
const input = templateInput(template);
|
||||
const id = randomUUID();
|
||||
const now = new Date().toISOString();
|
||||
const database = getDatabase();
|
||||
database.transaction(() => {
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO pieces (id, title, summary, format_id, status, duration_seconds, intro,
|
||||
`INSERT INTO pieces (id, title, output_title, summary, format_id, status, duration_seconds, intro,
|
||||
research_text, moderation_notes, transition_text, presentation_text, created_at_utc,
|
||||
updated_at_utc, revision) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, 1)`
|
||||
updated_at_utc, revision) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, 1)`
|
||||
)
|
||||
.run(
|
||||
id,
|
||||
input.title,
|
||||
input.outputTitle,
|
||||
input.summary,
|
||||
input.formatId,
|
||||
input.status,
|
||||
@@ -619,12 +763,69 @@ export function createPiece(template: PieceTemplateId = 'blank'): string {
|
||||
return id;
|
||||
}
|
||||
|
||||
export function savePieceAsTemplate(
|
||||
pieceId: string,
|
||||
nameValue: string,
|
||||
descriptionValue: string,
|
||||
templateId?: string,
|
||||
expectedRevision?: number
|
||||
) {
|
||||
const piece = getPiece(pieceId);
|
||||
if (!piece) throw new Error('NOT_FOUND');
|
||||
const name = cleanText(nameValue, 120, 'template_name');
|
||||
if (!name) throw new Error('INVALID_TEMPLATE_NAME');
|
||||
const description = cleanText(descriptionValue, 500, 'template_description');
|
||||
const snapshot: Partial<typeof piece> = structuredClone(piece);
|
||||
delete snapshot.id;
|
||||
delete snapshot.revision;
|
||||
delete snapshot.createdAtUtc;
|
||||
delete snapshot.updatedAtUtc;
|
||||
delete snapshot.media;
|
||||
delete snapshot.presentationMediaId;
|
||||
snapshot.status = 'preparing';
|
||||
const snapshotJson = JSON.stringify(snapshot);
|
||||
const database = getDatabase();
|
||||
const now = new Date().toISOString();
|
||||
if (!templateId) {
|
||||
const id = randomUUID();
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO piece_templates (id, name, description, snapshot_json, revision, created_at_utc, updated_at_utc)
|
||||
VALUES (?, ?, ?, ?, 1, ?, ?)`
|
||||
)
|
||||
.run(id, name, description, snapshotJson, now, now);
|
||||
return { id, revision: 1 };
|
||||
}
|
||||
if (!Number.isInteger(expectedRevision) || Number(expectedRevision) < 1) {
|
||||
throw new Error('INVALID_REVISION');
|
||||
}
|
||||
const result = database
|
||||
.prepare(
|
||||
`UPDATE piece_templates SET name = ?, description = ?, snapshot_json = ?,
|
||||
revision = revision + 1, updated_at_utc = ? WHERE id = ? AND revision = ?`
|
||||
)
|
||||
.run(name, description, snapshotJson, now, templateId, expectedRevision);
|
||||
if (result.changes !== 1) {
|
||||
const exists = database.prepare('SELECT 1 FROM piece_templates WHERE id = ?').get(templateId);
|
||||
throw new Error(exists ? 'CONFLICT' : 'NOT_FOUND');
|
||||
}
|
||||
return { id: templateId, revision: Number(expectedRevision) + 1 };
|
||||
}
|
||||
|
||||
export function deletePieceTemplate(templateId: string, expectedRevision: number) {
|
||||
const result = getDatabase()
|
||||
.prepare('DELETE FROM piece_templates WHERE id = ? AND revision = ?')
|
||||
.run(templateId, expectedRevision);
|
||||
if (result.changes !== 1) throw new Error('CONFLICT');
|
||||
}
|
||||
|
||||
export function captureInbox(titleValue: string, urlValue: string): string {
|
||||
const title = cleanText(titleValue, 200, 'title');
|
||||
if (!title) throw new Error('INVALID_TITLE');
|
||||
let title = cleanText(titleValue, 200, 'title');
|
||||
const url = cleanText(urlValue, 2_000, 'source');
|
||||
if (url && !validUrl(url)) throw new Error('INVALID_SOURCES');
|
||||
const id = createPiece('blank');
|
||||
if (!title && !url) throw new Error('INVALID_TITLE');
|
||||
if (!title) title = new URL(url).hostname;
|
||||
const id = createPiece();
|
||||
const piece = getPiece(id)!;
|
||||
savePiece(id, piece.revision, {
|
||||
...piece,
|
||||
@@ -642,18 +843,22 @@ export function setPieceArchived(id: string, expectedRevision: number, archived:
|
||||
? database
|
||||
.prepare(
|
||||
`UPDATE pieces SET archived_from_status = status, status = 'archived', revision = revision + 1,
|
||||
updated_at_utc = ? WHERE id = ? AND revision = ? AND status != 'archived'`
|
||||
updated_at_utc = ? WHERE id = ? AND revision = ? AND status != 'archived'
|
||||
AND deleted_at_utc IS NULL`
|
||||
)
|
||||
.run(now, id, expectedRevision)
|
||||
: database
|
||||
.prepare(
|
||||
`UPDATE pieces SET status = COALESCE(archived_from_status, 'preparing'), archived_from_status = NULL,
|
||||
revision = revision + 1, updated_at_utc = ?
|
||||
WHERE id = ? AND revision = ? AND status = 'archived'`
|
||||
WHERE id = ? AND revision = ? AND status = 'archived'
|
||||
AND deleted_at_utc IS NULL`
|
||||
)
|
||||
.run(now, id, expectedRevision);
|
||||
if (result.changes !== 1) {
|
||||
const exists = database.prepare('SELECT 1 FROM pieces WHERE id = ?').get(id);
|
||||
const exists = database
|
||||
.prepare('SELECT 1 FROM pieces WHERE id = ? AND deleted_at_utc IS NULL')
|
||||
.get(id);
|
||||
throw new Error(exists ? 'CONFLICT' : 'NOT_FOUND');
|
||||
}
|
||||
}
|
||||
@@ -667,7 +872,11 @@ export async function duplicatePiece(sourceId: string): Promise<string> {
|
||||
await mkdir(uploadDirectory, { recursive: true, mode: 0o700 });
|
||||
const database = getDatabase();
|
||||
const storedMedia = database
|
||||
.prepare('SELECT * FROM piece_media WHERE piece_id = ? ORDER BY position')
|
||||
.prepare(
|
||||
`SELECT pm.*, ppm.media_id IS NOT NULL AS is_presentation
|
||||
FROM piece_media pm LEFT JOIN piece_presentation_media ppm ON ppm.media_id = pm.id
|
||||
WHERE pm.piece_id = ? AND pm.removed_at_utc IS NULL ORDER BY pm.position`
|
||||
)
|
||||
.all(sourceId) as {
|
||||
id: string;
|
||||
storage_name: string;
|
||||
@@ -676,8 +885,9 @@ export async function duplicatePiece(sourceId: string): Promise<string> {
|
||||
byte_size: number;
|
||||
alt_text: string;
|
||||
position: number;
|
||||
is_presentation: number;
|
||||
}[];
|
||||
const copied: { source: (typeof storedMedia)[number]; storageName: string }[] = [];
|
||||
const copied: { id: string; source: (typeof storedMedia)[number]; storageName: string }[] = [];
|
||||
try {
|
||||
for (const media of storedMedia) {
|
||||
const extension = ALLOWED_IMAGES.get(media.mime_type)!;
|
||||
@@ -686,23 +896,24 @@ export async function duplicatePiece(sourceId: string): Promise<string> {
|
||||
path.join(uploadDirectory, media.storage_name),
|
||||
path.join(uploadDirectory, storageName)
|
||||
);
|
||||
copied.push({ source: media, storageName });
|
||||
copied.push({ id: randomUUID(), source: media, storageName });
|
||||
}
|
||||
database.transaction(() => {
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO pieces (id, title, summary, format_id, status, duration_seconds, intro,
|
||||
`INSERT INTO pieces (id, title, output_title, summary, format_id, status, duration_seconds, intro,
|
||||
research_text, moderation_notes, transition_text, presentation_text, presentation_mode,
|
||||
presentation_source_position, presentation_title, presentation_description,
|
||||
presentation_image_url, presentation_site_name, presentation_provider,
|
||||
presentation_provider_id, presentation_title_manual,
|
||||
presentation_description_manual, presentation_image_manual,
|
||||
presentation_metadata_fetched_at_utc, created_at_utc, updated_at_utc, revision)
|
||||
VALUES (?, ?, ?, ?, 'preparing', ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, 1)`
|
||||
VALUES (?, ?, ?, ?, ?, 'preparing', ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, 1)`
|
||||
)
|
||||
.run(
|
||||
id,
|
||||
`Kopie von ${source.title}`.slice(0, 200),
|
||||
source.outputTitle,
|
||||
source.summary,
|
||||
source.formatId,
|
||||
source.durationSeconds,
|
||||
@@ -733,7 +944,7 @@ export async function duplicatePiece(sourceId: string): Promise<string> {
|
||||
);
|
||||
for (const media of copied) {
|
||||
addMedia.run(
|
||||
randomUUID(),
|
||||
media.id,
|
||||
id,
|
||||
media.storageName,
|
||||
media.source.original_name,
|
||||
@@ -744,6 +955,12 @@ export async function duplicatePiece(sourceId: string): Promise<string> {
|
||||
now
|
||||
);
|
||||
}
|
||||
const presentation = copied.find((media) => media.source.is_presentation === 1);
|
||||
if (presentation) {
|
||||
database
|
||||
.prepare('INSERT INTO piece_presentation_media (piece_id, media_id) VALUES (?, ?)')
|
||||
.run(id, presentation.id);
|
||||
}
|
||||
})();
|
||||
return id;
|
||||
} catch (error) {
|
||||
@@ -770,7 +987,7 @@ export async function loadPiecePresentationMetadata(
|
||||
p.presentation_image_manual, s.url
|
||||
FROM pieces p LEFT JOIN piece_sources s ON s.piece_id = p.id
|
||||
AND s.position = p.presentation_source_position
|
||||
WHERE p.id = ? AND p.status != 'archived'`
|
||||
WHERE p.id = ? AND p.status != 'archived' AND p.deleted_at_utc IS NULL`
|
||||
)
|
||||
.get(id) as
|
||||
| {
|
||||
@@ -796,7 +1013,7 @@ export async function loadPiecePresentationMetadata(
|
||||
presentation_image_url = CASE WHEN presentation_image_manual = 1 THEN presentation_image_url ELSE ? END,
|
||||
presentation_site_name = ?, presentation_provider = ?, presentation_provider_id = ?,
|
||||
presentation_metadata_fetched_at_utc = ?, updated_at_utc = ?, revision = revision + 1
|
||||
WHERE id = ? AND revision = ? AND status != 'archived'`
|
||||
WHERE id = ? AND revision = ? AND status != 'archived' AND deleted_at_utc IS NULL`
|
||||
)
|
||||
.run(
|
||||
metadata.title,
|
||||
@@ -818,7 +1035,8 @@ export async function uploadPieceImage(
|
||||
pieceId: string,
|
||||
expectedRevision: number,
|
||||
file: File,
|
||||
altTextValue: string
|
||||
altTextValue: string,
|
||||
selectForPresentation = false
|
||||
) {
|
||||
if (!file.size || file.size > MAX_UPLOAD_BYTES) throw new Error('INVALID_IMAGE_SIZE');
|
||||
const buffer = Buffer.from(await file.arrayBuffer());
|
||||
@@ -832,85 +1050,86 @@ export async function uploadPieceImage(
|
||||
const filePath = path.join(uploadDirectory, storageName);
|
||||
await writeFile(filePath, buffer, { flag: 'wx', mode: 0o600 });
|
||||
const database = getDatabase();
|
||||
const mediaId = randomUUID();
|
||||
const now = new Date().toISOString();
|
||||
try {
|
||||
database.transaction(() => {
|
||||
const updated = database
|
||||
.prepare(
|
||||
`UPDATE pieces SET revision = revision + 1, updated_at_utc = ?
|
||||
WHERE id = ? AND revision = ? AND status != 'archived'`
|
||||
WHERE id = ? AND revision = ? AND status != 'archived' AND deleted_at_utc IS NULL`
|
||||
)
|
||||
.run(new Date().toISOString(), pieceId, expectedRevision);
|
||||
.run(now, pieceId, expectedRevision);
|
||||
if (updated.changes !== 1) throw new Error('CONFLICT');
|
||||
const count = database
|
||||
.prepare('SELECT count(*) AS count FROM piece_media WHERE piece_id = ?')
|
||||
.prepare(
|
||||
`SELECT count(*) AS count
|
||||
FROM piece_media WHERE piece_id = ? AND removed_at_utc IS NULL`
|
||||
)
|
||||
.get(pieceId) as { count: number };
|
||||
if (count.count >= 8) throw new Error('TOO_MANY_IMAGES');
|
||||
const position = (
|
||||
database
|
||||
.prepare(
|
||||
'SELECT COALESCE(max(position), -1) + 1 AS next FROM piece_media WHERE piece_id = ?'
|
||||
)
|
||||
.get(pieceId) as { next: number }
|
||||
).next;
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO piece_media (id, piece_id, storage_name, original_name, mime_type,
|
||||
byte_size, alt_text, position, created_at_utc) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)`
|
||||
)
|
||||
.run(
|
||||
randomUUID(),
|
||||
mediaId,
|
||||
pieceId,
|
||||
storageName,
|
||||
path.basename(file.name).slice(0, 200) || `bild.${extension}`,
|
||||
detected.mime,
|
||||
buffer.byteLength,
|
||||
altText,
|
||||
count.count,
|
||||
new Date().toISOString()
|
||||
position,
|
||||
now
|
||||
);
|
||||
if (selectForPresentation) replacePresentationMedia(pieceId, mediaId);
|
||||
})();
|
||||
} catch (error) {
|
||||
await unlink(filePath).catch(() => {});
|
||||
throw error;
|
||||
}
|
||||
return { id: mediaId, revision: expectedRevision + 1, updatedAtUtc: now };
|
||||
}
|
||||
|
||||
export async function deletePieceImage(pieceId: string, mediaId: string, expectedRevision: number) {
|
||||
const database = getDatabase();
|
||||
const media = database
|
||||
.prepare('SELECT storage_name FROM piece_media WHERE id = ? AND piece_id = ?')
|
||||
.get(mediaId, pieceId) as { storage_name: string } | undefined;
|
||||
if (!media) throw new Error('NOT_FOUND');
|
||||
const originalPath = path.join(getServerPaths().uploads, media.storage_name);
|
||||
const quarantinePath = `${originalPath}.deleting-${randomUUID()}`;
|
||||
await rename(originalPath, quarantinePath);
|
||||
try {
|
||||
database.transaction(() => {
|
||||
const updated = database
|
||||
.prepare(
|
||||
`UPDATE pieces SET revision = revision + 1, updated_at_utc = ?
|
||||
WHERE id = ? AND revision = ? AND status != 'archived'`
|
||||
)
|
||||
.run(new Date().toISOString(), pieceId, expectedRevision);
|
||||
if (updated.changes !== 1) throw new Error('CONFLICT');
|
||||
database.prepare('DELETE FROM piece_media WHERE id = ?').run(mediaId);
|
||||
})();
|
||||
} catch (error) {
|
||||
await rename(quarantinePath, originalPath).catch((restoreError) => {
|
||||
console.error(
|
||||
'Bilddatei konnte nach fehlgeschlagener Löschung nicht wiederhergestellt werden.',
|
||||
restoreError
|
||||
);
|
||||
});
|
||||
throw error;
|
||||
}
|
||||
try {
|
||||
await unlink(quarantinePath);
|
||||
} catch (error) {
|
||||
console.error(
|
||||
'Gelöschte Bilddatei konnte nicht aus dem Quarantänepfad entfernt werden.',
|
||||
error
|
||||
);
|
||||
throw new Error('IMAGE_CLEANUP_FAILED', { cause: error });
|
||||
}
|
||||
const now = new Date().toISOString();
|
||||
database.transaction(() => {
|
||||
const updated = database
|
||||
.prepare(
|
||||
`UPDATE pieces SET revision = revision + 1, updated_at_utc = ?
|
||||
WHERE id = ? AND revision = ? AND status != 'archived' AND deleted_at_utc IS NULL`
|
||||
)
|
||||
.run(now, pieceId, expectedRevision);
|
||||
if (updated.changes !== 1) throw new Error('CONFLICT');
|
||||
const removed = database
|
||||
.prepare(
|
||||
`UPDATE piece_media SET removed_at_utc = ?
|
||||
WHERE id = ? AND piece_id = ? AND removed_at_utc IS NULL`
|
||||
)
|
||||
.run(now, mediaId, pieceId);
|
||||
if (removed.changes !== 1) throw new Error('NOT_FOUND');
|
||||
database.prepare('DELETE FROM piece_presentation_media WHERE media_id = ?').run(mediaId);
|
||||
})();
|
||||
return { revision: expectedRevision + 1, updatedAtUtc: now };
|
||||
}
|
||||
|
||||
export async function getMediaFile(id: string) {
|
||||
const row = getDatabase()
|
||||
.prepare('SELECT storage_name, mime_type, byte_size, alt_text FROM piece_media WHERE id = ?')
|
||||
.prepare(
|
||||
`SELECT pm.storage_name, pm.mime_type, pm.byte_size, pm.alt_text
|
||||
FROM piece_media pm JOIN pieces p ON p.id = pm.piece_id
|
||||
WHERE pm.id = ? AND pm.removed_at_utc IS NULL AND p.deleted_at_utc IS NULL`
|
||||
)
|
||||
.get(id) as
|
||||
{ storage_name: string; mime_type: string; byte_size: number; alt_text: string } | undefined;
|
||||
if (!row) return null;
|
||||
@@ -922,7 +1141,12 @@ export async function getMediaFile(id: string) {
|
||||
};
|
||||
}
|
||||
|
||||
export function createTaxonomy(kind: TaxonomyKind, nameValue: string, colorValue?: string) {
|
||||
export function createTaxonomy(
|
||||
kind: TaxonomyKind,
|
||||
nameValue: string,
|
||||
colorOrIconValue?: string,
|
||||
iconNameValue?: string
|
||||
) {
|
||||
const name = cleanText(nameValue, 80, 'taxonomy');
|
||||
if (!name) throw new Error('INVALID_TAXONOMY');
|
||||
const database = getDatabase();
|
||||
@@ -935,7 +1159,7 @@ export function createTaxonomy(kind: TaxonomyKind, nameValue: string, colorValue
|
||||
if (duplicate) throw new Error('TAXONOMY_EXISTS');
|
||||
const id = randomUUID();
|
||||
if (kind === 'category') {
|
||||
const color = String(colorValue ?? '');
|
||||
const color = String(colorOrIconValue ?? '');
|
||||
if (!/^#[0-9a-fA-F]{6}$/.test(color)) throw new Error('INVALID_COLOR');
|
||||
const order = database
|
||||
.prepare('SELECT COALESCE(max(sort_order), -1) + 1 AS next FROM section_categories')
|
||||
@@ -945,10 +1169,53 @@ export function createTaxonomy(kind: TaxonomyKind, nameValue: string, colorValue
|
||||
database
|
||||
.prepare('INSERT INTO section_categories (id, name, color, sort_order) VALUES (?, ?, ?, ?)')
|
||||
.run(id, name, color, order.next);
|
||||
} else if (kind === 'topic') {
|
||||
database
|
||||
.prepare('INSERT INTO topics (id, name, icon_name) VALUES (?, ?, ?)')
|
||||
.run(id, name, cleanIconName(iconNameValue ?? colorOrIconValue));
|
||||
} else {
|
||||
const table = kind === 'format' ? 'formats' : 'topics';
|
||||
database.prepare(`INSERT INTO ${table} (id, name) VALUES (?, ?)`).run(id, name);
|
||||
database.prepare('INSERT INTO formats (id, name) VALUES (?, ?)').run(id, name);
|
||||
}
|
||||
return id;
|
||||
}
|
||||
|
||||
export function updateTaxonomy(
|
||||
kind: TaxonomyKind,
|
||||
id: string,
|
||||
nameValue: string,
|
||||
iconNameValue?: string
|
||||
) {
|
||||
const name = cleanText(nameValue, 80, 'taxonomy');
|
||||
if (!name) throw new Error('INVALID_TAXONOMY');
|
||||
const table =
|
||||
kind === 'category' ? 'section_categories' : kind === 'format' ? 'formats' : 'topics';
|
||||
const database = getDatabase();
|
||||
const duplicate = database
|
||||
.prepare(`SELECT 1 FROM ${table} WHERE lower(name) = lower(?) AND id != ?`)
|
||||
.get(name, id);
|
||||
if (duplicate) throw new Error('TAXONOMY_EXISTS');
|
||||
const result =
|
||||
kind === 'topic'
|
||||
? database
|
||||
.prepare('UPDATE topics SET name = ?, icon_name = ? WHERE id = ?')
|
||||
.run(name, cleanIconName(iconNameValue), id)
|
||||
: database.prepare(`UPDATE ${table} SET name = ? WHERE id = ?`).run(name, id);
|
||||
if (result.changes !== 1) throw new Error('NOT_FOUND');
|
||||
}
|
||||
|
||||
export function setPieceDeleted(id: string, expectedRevision: number, deleted: boolean) {
|
||||
if (!Number.isInteger(expectedRevision) || expectedRevision < 1) {
|
||||
throw new Error('INVALID_REVISION');
|
||||
}
|
||||
const now = new Date().toISOString();
|
||||
const result = getDatabase()
|
||||
.prepare(
|
||||
`UPDATE pieces SET deleted_at_utc = ?, updated_at_utc = ?, revision = revision + 1
|
||||
WHERE id = ? AND revision = ? AND deleted_at_utc IS ${deleted ? 'NULL' : 'NOT NULL'}`
|
||||
)
|
||||
.run(deleted ? now : null, now, id, expectedRevision);
|
||||
if (result.changes !== 1) throw new Error('CONFLICT');
|
||||
return { revision: expectedRevision + 1, updatedAtUtc: now };
|
||||
}
|
||||
|
||||
export function deleteTaxonomy(kind: TaxonomyKind, id: string) {
|
||||
|
||||
@@ -62,7 +62,7 @@ describe('database setup', () => {
|
||||
database.close();
|
||||
|
||||
expect(counts).toEqual({
|
||||
migrations: 6,
|
||||
migrations: 11,
|
||||
pieces: 6,
|
||||
shows: 2,
|
||||
usages: 5,
|
||||
|
||||
+117
-3
@@ -6,13 +6,18 @@ import { afterEach, beforeEach, describe, expect, it } from 'vitest';
|
||||
import { closeDatabase, getDatabase } from './database.js';
|
||||
import {
|
||||
completeCurrent,
|
||||
clearPresentationChannel,
|
||||
getPresentationChannelView,
|
||||
getLiveView,
|
||||
getPresentationMedia,
|
||||
getPresentationView,
|
||||
goBack,
|
||||
issuePresentationAccess,
|
||||
moveOpenUsage,
|
||||
presentationChannelAccess,
|
||||
presentUsage,
|
||||
rotatePresentationChannelKey,
|
||||
selectUsage,
|
||||
skipCurrent,
|
||||
startOrResumeLive
|
||||
} from './live.js';
|
||||
@@ -35,6 +40,99 @@ afterEach(() => {
|
||||
});
|
||||
|
||||
describe('live mode', () => {
|
||||
it('persists a frozen section countdown across usage changes and reloads', () => {
|
||||
getDatabase()
|
||||
.prepare(
|
||||
"UPDATE show_sections SET explicit_duration_seconds = 300 WHERE id = 'section-stories'"
|
||||
)
|
||||
.run();
|
||||
const start = new Date('2026-10-23T18:00:00.000Z');
|
||||
startOrResumeLive('show-october', 'timer-start', 0, start);
|
||||
let live = getLiveView('show-october', new Date('2026-10-23T18:01:40.000Z'));
|
||||
expect(live.sectionTimer).toMatchObject({
|
||||
sectionId: 'section-stories',
|
||||
plannedDurationSeconds: 300,
|
||||
elapsedSeconds: 100
|
||||
});
|
||||
getDatabase()
|
||||
.prepare(
|
||||
"UPDATE show_sections SET explicit_duration_seconds = 600 WHERE id = 'section-stories'"
|
||||
)
|
||||
.run();
|
||||
completeCurrent(
|
||||
'show-october',
|
||||
'timer-next-piece',
|
||||
live.liveRevision,
|
||||
new Date('2026-10-23T18:02:00.000Z')
|
||||
);
|
||||
live = getLiveView('show-october', new Date('2026-10-23T18:04:00.000Z'));
|
||||
expect(live.current?.id).toBe('usage-effects');
|
||||
expect(live.sectionTimer).toMatchObject({
|
||||
plannedDurationSeconds: 300,
|
||||
elapsedSeconds: 240
|
||||
});
|
||||
completeCurrent(
|
||||
'show-october',
|
||||
'timer-finish',
|
||||
live.liveRevision,
|
||||
new Date('2026-10-23T18:06:00.000Z')
|
||||
);
|
||||
expect(
|
||||
getLiveView('show-october', new Date('2026-10-23T18:07:00.000Z')).sectionTimer
|
||||
).toBeNull();
|
||||
});
|
||||
|
||||
it('selects any rundown usage by stable id, including the first and completed entries', () => {
|
||||
let live = getLiveView('show-october');
|
||||
expect(() =>
|
||||
selectUsage('show-october', 'usage-effects', 'select-before-start', live.liveRevision)
|
||||
).toThrow('NOT_STARTED');
|
||||
startOrResumeLive('show-october', 'start-selection', live.liveRevision);
|
||||
live = getLiveView('show-october');
|
||||
selectUsage('show-october', 'usage-effects', 'select-second', live.liveRevision);
|
||||
live = getLiveView('show-october');
|
||||
expect(live.current?.id).toBe('usage-effects');
|
||||
|
||||
selectUsage('show-october', 'usage-console', 'select-first', live.liveRevision);
|
||||
live = getLiveView('show-october');
|
||||
expect(live.current?.id).toBe('usage-console');
|
||||
completeCurrent('show-october', 'complete-first', live.liveRevision);
|
||||
live = getLiveView('show-october');
|
||||
expect(
|
||||
live.sections
|
||||
.flatMap((section) => section.usages)
|
||||
.find((usage) => usage.id === 'usage-console')?.status
|
||||
).toBe('done');
|
||||
|
||||
selectUsage('show-october', 'usage-console', 'return-to-completed', live.liveRevision);
|
||||
expect(getLiveView('show-october').current).toMatchObject({
|
||||
id: 'usage-console',
|
||||
status: 'current'
|
||||
});
|
||||
});
|
||||
|
||||
it('keeps one stable output channel until its key is explicitly rotated', () => {
|
||||
const key = issuePresentationAccess('show-october');
|
||||
expect(issuePresentationAccess('show-october')).toBe(key);
|
||||
expect(presentationChannelAccess('default', key)).toBe(true);
|
||||
expect(getPresentationChannelView('default')).toEqual({
|
||||
revision: 1_000_000_000,
|
||||
content: null
|
||||
});
|
||||
|
||||
const replacement = rotatePresentationChannelKey('show-october');
|
||||
expect(replacement).not.toBe(key);
|
||||
expect(presentationChannelAccess('default', key)).toBe(false);
|
||||
expect(presentationChannelAccess('default', replacement)).toBe(true);
|
||||
startOrResumeLive('show-october', 'start-channel', 0);
|
||||
presentUsage('show-october', 'usage-console', 'present-channel', 1);
|
||||
expect(getPresentationChannelView('default')?.content).not.toBeNull();
|
||||
clearPresentationChannel();
|
||||
expect(getPresentationChannelView('default')?.content).toBeNull();
|
||||
issuePresentationAccess('show-october');
|
||||
expect(getPresentationChannelView('default')?.content).toBeNull();
|
||||
});
|
||||
|
||||
it('restores live state, records actual intervals and applies commands only once', () => {
|
||||
const started = new Date('2026-10-22T18:00:00.000Z');
|
||||
const initial = getLiveView('show-october', started);
|
||||
@@ -105,6 +203,14 @@ describe('live mode', () => {
|
||||
0,
|
||||
'2026-10-22T18:00:00.000Z'
|
||||
);
|
||||
getDatabase()
|
||||
.prepare(
|
||||
`INSERT INTO usage_tool_snapshots
|
||||
(id, usage_id, original_tool_id, name, start_url, work_url, note, position)
|
||||
VALUES ('private-live-tool', 'usage-console', NULL, 'Privates Werkzeug', '',
|
||||
'https://private.example.test/board', 'PRIVATE_TOOL_NOTE', 0)`
|
||||
)
|
||||
.run();
|
||||
|
||||
const token = issuePresentationAccess('show-october');
|
||||
expect(getPresentationView(token)).toEqual({ revision: 0, content: null });
|
||||
@@ -115,7 +221,9 @@ describe('live mode', () => {
|
||||
const output = getPresentationView(token)!;
|
||||
expect(output.content).toMatchObject({
|
||||
title: 'Die kleine Konsole mit dem großen Dreh',
|
||||
images: [{ id: 'presentation-image', altText: 'Konsole auf dem Tisch' }]
|
||||
topics: ['Gaming'],
|
||||
images: [],
|
||||
sources: []
|
||||
});
|
||||
const serialized = JSON.stringify(output);
|
||||
expect(serialized).toContain('Weniger Leistung, mehr Idee.');
|
||||
@@ -123,13 +231,19 @@ describe('live mode', () => {
|
||||
expect(serialized).not.toContain('Moderationsstichpunkte');
|
||||
expect(serialized).not.toContain('private-original-name');
|
||||
expect(serialized).not.toContain('presentation.png');
|
||||
expect(serialized).not.toContain('https://example.com/console');
|
||||
expect(serialized).not.toContain('https://private.example.test/board');
|
||||
expect(serialized).not.toContain('PRIVATE_TOOL_NOTE');
|
||||
|
||||
const media = await getPresentationMedia(token, 'presentation-image');
|
||||
expect(media?.data.toString()).toBe('test-image');
|
||||
expect(media).toBeNull();
|
||||
expect(await getPresentationMedia(token, 'unknown-image')).toBeNull();
|
||||
|
||||
const replacementToken = issuePresentationAccess('show-october');
|
||||
expect(getPresentationView(token)).toBeNull();
|
||||
expect(replacementToken).toBe(token);
|
||||
expect(getPresentationView(token)?.content?.title).toBe(
|
||||
'Die kleine Konsole mit dem großen Dreh'
|
||||
);
|
||||
expect(getPresentationView(replacementToken)?.content?.title).toBe(
|
||||
'Die kleine Konsole mit dem großen Dreh'
|
||||
);
|
||||
|
||||
+273
-54
@@ -1,6 +1,8 @@
|
||||
import { createHash, randomBytes, randomUUID } from 'node:crypto';
|
||||
import { readFile } from 'node:fs/promises';
|
||||
import path from 'node:path';
|
||||
import type Database from 'better-sqlite3';
|
||||
import { getMediaFile } from './content.js';
|
||||
import { getServerPaths } from './config.js';
|
||||
import { getDatabase } from './database.js';
|
||||
import { renderMarkdown } from './markdown.js';
|
||||
import { buildEmbedUrl, fetchPresentationImage, type PresentationContent } from './presentation.js';
|
||||
@@ -63,12 +65,20 @@ export type LiveView = {
|
||||
next: LiveUsage | null;
|
||||
completedCount: number;
|
||||
totalCount: number;
|
||||
sectionTimer: null | {
|
||||
sectionId: string;
|
||||
sectionName: string;
|
||||
plannedDurationSeconds: number;
|
||||
elapsedSeconds: number;
|
||||
runningSinceUtc: string | null;
|
||||
};
|
||||
};
|
||||
|
||||
export type PresentationView = {
|
||||
revision: number;
|
||||
content: null | {
|
||||
mode: PresentationContent['mode'];
|
||||
topics: string[];
|
||||
title: string;
|
||||
html: string;
|
||||
source: PresentationContent['source'];
|
||||
@@ -142,6 +152,59 @@ function closeActiveRun(database: Database.Database, showId: string, now: string
|
||||
.run(now, showId);
|
||||
}
|
||||
|
||||
function closeSectionTimer(database: Database.Database, showId: string, now: string) {
|
||||
const timer = database
|
||||
.prepare('SELECT id FROM live_section_timers WHERE show_id = ? AND ended_at_utc IS NULL')
|
||||
.get(showId) as { id: string } | undefined;
|
||||
if (!timer) return;
|
||||
database
|
||||
.prepare(
|
||||
'UPDATE live_section_timer_runs SET ended_at_utc = ? WHERE timer_id = ? AND ended_at_utc IS NULL'
|
||||
)
|
||||
.run(now, timer.id);
|
||||
database
|
||||
.prepare('UPDATE live_section_timers SET ended_at_utc = ? WHERE id = ?')
|
||||
.run(now, timer.id);
|
||||
}
|
||||
|
||||
function syncSectionTimer(
|
||||
database: Database.Database,
|
||||
showId: string,
|
||||
usageId: string,
|
||||
now: string
|
||||
) {
|
||||
const section = database
|
||||
.prepare(
|
||||
`SELECT s.id, s.explicit_duration_seconds FROM piece_usages u
|
||||
JOIN show_sections s ON s.id = u.show_section_id
|
||||
WHERE u.id = ? AND s.show_id = ? AND s.is_reserve_bank = 0`
|
||||
)
|
||||
.get(usageId, showId) as { id: string; explicit_duration_seconds: number | null } | undefined;
|
||||
if (!section) throw new Error('NOT_FOUND');
|
||||
const active = database
|
||||
.prepare(
|
||||
'SELECT id, section_id FROM live_section_timers WHERE show_id = ? AND ended_at_utc IS NULL'
|
||||
)
|
||||
.get(showId) as { id: string; section_id: string } | undefined;
|
||||
if (active?.section_id === section.id) return;
|
||||
if (active) closeSectionTimer(database, showId, now);
|
||||
if (!section.explicit_duration_seconds || section.explicit_duration_seconds <= 0) return;
|
||||
const timerId = randomUUID();
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO live_section_timers
|
||||
(id, show_id, section_id, planned_duration_seconds, started_at_utc)
|
||||
VALUES (?, ?, ?, ?, ?)`
|
||||
)
|
||||
.run(timerId, showId, section.id, section.explicit_duration_seconds, now);
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO live_section_timer_runs (id, timer_id, started_at_utc)
|
||||
VALUES (?, ?, ?)`
|
||||
)
|
||||
.run(randomUUID(), timerId, now);
|
||||
}
|
||||
|
||||
function activateUsage(database: Database.Database, showId: string, usageId: string, now: string) {
|
||||
usageBelongsToShow(database, showId, usageId);
|
||||
database
|
||||
@@ -165,6 +228,7 @@ function activateUsage(database: Database.Database, showId: string, usageId: str
|
||||
'UPDATE show_live_states SET current_usage_id = ?, ended_at_utc = NULL WHERE show_id = ?'
|
||||
)
|
||||
.run(usageId, showId);
|
||||
syncSectionTimer(database, showId, usageId, now);
|
||||
}
|
||||
|
||||
function executeCommand(
|
||||
@@ -269,6 +333,44 @@ export function getLiveView(showId: string, nowValue?: Date): LiveView {
|
||||
const next =
|
||||
usages.slice(currentIndex + 1).find((usage) => usage.status === 'open') ??
|
||||
(current ? null : (usages.find((usage) => usage.status === 'open') ?? null));
|
||||
const timer = database
|
||||
.prepare(
|
||||
`SELECT t.id, t.section_id, s.name AS section_name, t.planned_duration_seconds
|
||||
FROM live_section_timers t JOIN show_sections s ON s.id = t.section_id
|
||||
WHERE t.show_id = ? AND t.ended_at_utc IS NULL`
|
||||
)
|
||||
.get(showId) as
|
||||
| { id: string; section_id: string; section_name: string; planned_duration_seconds: number }
|
||||
| undefined;
|
||||
let sectionTimer: LiveView['sectionTimer'] = null;
|
||||
if (timer) {
|
||||
const runs = database
|
||||
.prepare(
|
||||
`SELECT started_at_utc, ended_at_utc FROM live_section_timer_runs
|
||||
WHERE timer_id = ? ORDER BY started_at_utc`
|
||||
)
|
||||
.all(timer.id) as { started_at_utc: string; ended_at_utc: string | null }[];
|
||||
const running = runs.find((run) => run.ended_at_utc === null) ?? null;
|
||||
const elapsedSeconds = runs.reduce(
|
||||
(total, run) =>
|
||||
total +
|
||||
Math.max(
|
||||
0,
|
||||
Math.floor(
|
||||
(new Date(run.ended_at_utc ?? now).getTime() - new Date(run.started_at_utc).getTime()) /
|
||||
1_000
|
||||
)
|
||||
),
|
||||
0
|
||||
);
|
||||
sectionTimer = {
|
||||
sectionId: timer.section_id,
|
||||
sectionName: timer.section_name,
|
||||
plannedDurationSeconds: timer.planned_duration_seconds,
|
||||
elapsedSeconds,
|
||||
runningSinceUtc: running?.started_at_utc ?? null
|
||||
};
|
||||
}
|
||||
return {
|
||||
show: {
|
||||
id: show.id,
|
||||
@@ -288,7 +390,8 @@ export function getLiveView(showId: string, nowValue?: Date): LiveView {
|
||||
next,
|
||||
completedCount: usages.filter((usage) => usage.status === 'done' || usage.status === 'skipped')
|
||||
.length,
|
||||
totalCount: usages.length
|
||||
totalCount: usages.length,
|
||||
sectionTimer
|
||||
};
|
||||
}
|
||||
|
||||
@@ -354,10 +457,12 @@ function advanceCurrent(
|
||||
.run(status, state.current_usage_id);
|
||||
const next = ordered.slice(currentIndex + 1).find((usage) => usage.status === 'open');
|
||||
if (next) activateUsage(database, showId, next.id, now);
|
||||
else
|
||||
else {
|
||||
closeSectionTimer(database, showId, now);
|
||||
database
|
||||
.prepare('UPDATE show_live_states SET current_usage_id = NULL WHERE show_id = ?')
|
||||
.run(showId);
|
||||
}
|
||||
},
|
||||
nowValue
|
||||
);
|
||||
@@ -414,6 +519,34 @@ export function goBack(
|
||||
);
|
||||
}
|
||||
|
||||
export function selectUsage(
|
||||
showId: string,
|
||||
usageId: string,
|
||||
commandId: string,
|
||||
expectedRevision: number,
|
||||
nowValue?: Date
|
||||
) {
|
||||
return executeCommand(
|
||||
showId,
|
||||
commandId,
|
||||
expectedRevision,
|
||||
'select',
|
||||
(database, state, now) => {
|
||||
if (!state.started_at_utc) throw new Error('NOT_STARTED');
|
||||
usageBelongsToShow(database, showId, usageId);
|
||||
if (state.current_usage_id === usageId) return;
|
||||
if (state.current_usage_id) {
|
||||
closeActiveRun(database, showId, now);
|
||||
database
|
||||
.prepare("UPDATE piece_usages SET status = 'open' WHERE id = ?")
|
||||
.run(state.current_usage_id);
|
||||
}
|
||||
activateUsage(database, showId, usageId, now);
|
||||
},
|
||||
nowValue
|
||||
);
|
||||
}
|
||||
|
||||
export function presentUsage(
|
||||
showId: string,
|
||||
usageId: string | null,
|
||||
@@ -480,25 +613,90 @@ export function issuePresentationAccess(showId: string) {
|
||||
const database = getDatabase();
|
||||
const now = nowIso();
|
||||
ensureLiveState(database, showId, now);
|
||||
const token = randomBytes(32).toString('base64url');
|
||||
database.transaction(() => {
|
||||
database
|
||||
.prepare(
|
||||
'UPDATE presentation_access_tokens SET revoked_at_utc = ? WHERE show_id = ? AND revoked_at_utc IS NULL'
|
||||
)
|
||||
.run(now, showId);
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO presentation_access_tokens (id, show_id, token_hash, created_at_utc)
|
||||
VALUES (?, ?, ?, ?)`
|
||||
)
|
||||
.run(randomUUID(), showId, hashToken(token), now);
|
||||
return database.transaction(() => {
|
||||
let channel = database
|
||||
.prepare("SELECT * FROM presentation_channels WHERE id = 'default'")
|
||||
.get() as { access_key: string; show_id: string | null } | undefined;
|
||||
if (!channel) {
|
||||
const accessKey = randomBytes(32).toString('base64url');
|
||||
clearPresentationState(database, showId);
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO presentation_channels
|
||||
(id, name, access_key, key_hash, show_id, revision, created_at_utc, updated_at_utc)
|
||||
VALUES ('default', 'Standardausgabe', ?, ?, ?, 1, ?, ?)`
|
||||
)
|
||||
.run(accessKey, hashToken(accessKey), showId, now, now);
|
||||
channel = { access_key: accessKey, show_id: showId };
|
||||
} else if (channel.show_id !== showId) {
|
||||
clearPresentationState(database, showId);
|
||||
database
|
||||
.prepare(
|
||||
`UPDATE presentation_channels SET show_id = ?, revision = revision + 1,
|
||||
updated_at_utc = ? WHERE id = 'default'`
|
||||
)
|
||||
.run(showId, now);
|
||||
}
|
||||
return channel.access_key;
|
||||
})();
|
||||
return token;
|
||||
}
|
||||
|
||||
function clearPresentationState(database: Database.Database, showId: string) {
|
||||
database
|
||||
.prepare(
|
||||
`UPDATE show_live_states SET presentation_usage_id = NULL,
|
||||
presentation_revision = presentation_revision + 1, updated_at_utc = ?
|
||||
WHERE show_id = ? AND presentation_usage_id IS NOT NULL`
|
||||
)
|
||||
.run(nowIso(), showId);
|
||||
}
|
||||
|
||||
export function clearPresentationChannel() {
|
||||
const now = nowIso();
|
||||
getDatabase().transaction(() => {
|
||||
const database = getDatabase();
|
||||
const channel = database
|
||||
.prepare("SELECT show_id FROM presentation_channels WHERE id = 'default'")
|
||||
.get() as { show_id: string | null } | undefined;
|
||||
if (!channel) throw new Error('NOT_FOUND');
|
||||
if (channel.show_id) clearPresentationState(database, channel.show_id);
|
||||
database
|
||||
.prepare(
|
||||
`UPDATE presentation_channels SET show_id = NULL, revision = revision + 1,
|
||||
updated_at_utc = ? WHERE id = 'default'`
|
||||
)
|
||||
.run(now);
|
||||
})();
|
||||
}
|
||||
|
||||
export function rotatePresentationChannelKey(showId: string) {
|
||||
issuePresentationAccess(showId);
|
||||
const accessKey = randomBytes(32).toString('base64url');
|
||||
const now = nowIso();
|
||||
getDatabase()
|
||||
.prepare(
|
||||
`UPDATE presentation_channels SET access_key = ?, key_hash = ?, revision = revision + 1,
|
||||
updated_at_utc = ? WHERE id = 'default'`
|
||||
)
|
||||
.run(accessKey, hashToken(accessKey), now);
|
||||
return accessKey;
|
||||
}
|
||||
|
||||
export function presentationChannelAccess(channelId: string, accessKey: string) {
|
||||
if (!channelId || !accessKey || accessKey.length > 200) return false;
|
||||
return Boolean(
|
||||
getDatabase()
|
||||
.prepare('SELECT 1 FROM presentation_channels WHERE id = ? AND key_hash = ?')
|
||||
.get(channelId, hashToken(accessKey))
|
||||
);
|
||||
}
|
||||
|
||||
function presentationShowId(database: Database.Database, token: string) {
|
||||
if (!token || token.length > 200) return null;
|
||||
const channel = database
|
||||
.prepare('SELECT show_id FROM presentation_channels WHERE key_hash = ?')
|
||||
.get(hashToken(token)) as { show_id: string | null } | undefined;
|
||||
if (channel) return channel.show_id;
|
||||
const row = database
|
||||
.prepare(
|
||||
`SELECT show_id FROM presentation_access_tokens
|
||||
@@ -508,15 +706,30 @@ function presentationShowId(database: Database.Database, token: string) {
|
||||
return row?.show_id ?? null;
|
||||
}
|
||||
|
||||
export function getPresentationChannelView(channelId: string): PresentationView | null {
|
||||
const channel = getDatabase()
|
||||
.prepare('SELECT show_id, revision FROM presentation_channels WHERE id = ?')
|
||||
.get(channelId) as { show_id: string | null; revision: number } | undefined;
|
||||
if (!channel) return null;
|
||||
if (!channel.show_id) return { revision: channel.revision * 1_000_000_000, content: null };
|
||||
const view = getPresentationViewForShow(channel.show_id);
|
||||
return { ...view, revision: channel.revision * 1_000_000_000 + view.revision };
|
||||
}
|
||||
|
||||
export function getPresentationView(token: string): PresentationView | null {
|
||||
const database = getDatabase();
|
||||
const showId = presentationShowId(database, token);
|
||||
if (!showId) return null;
|
||||
return getPresentationViewForShow(showId);
|
||||
}
|
||||
|
||||
function getPresentationViewForShow(showId: string): PresentationView {
|
||||
const database = getDatabase();
|
||||
const state = ensureLiveState(database, showId, nowIso());
|
||||
if (!state.presentation_usage_id) return { revision: state.presentation_revision, content: null };
|
||||
const usage = database
|
||||
.prepare(
|
||||
`SELECT u.title_snapshot, u.presentation_snapshot, u.original_piece_id,
|
||||
`SELECT u.title_snapshot, u.output_title_snapshot, u.presentation_snapshot,
|
||||
u.presentation_mode_snapshot, u.presentation_source_label_snapshot,
|
||||
u.presentation_source_url_snapshot, u.presentation_source_timecode_snapshot,
|
||||
u.presentation_title_meta_snapshot, u.presentation_description_snapshot,
|
||||
@@ -528,8 +741,8 @@ export function getPresentationView(token: string): PresentationView | null {
|
||||
.get(state.presentation_usage_id, showId) as
|
||||
| {
|
||||
title_snapshot: string;
|
||||
output_title_snapshot: string;
|
||||
presentation_snapshot: string;
|
||||
original_piece_id: string | null;
|
||||
presentation_mode_snapshot: PresentationContent['mode'];
|
||||
presentation_source_label_snapshot: string;
|
||||
presentation_source_url_snapshot: string;
|
||||
@@ -543,33 +756,16 @@ export function getPresentationView(token: string): PresentationView | null {
|
||||
}
|
||||
| undefined;
|
||||
if (!usage) return { revision: state.presentation_revision, content: null };
|
||||
const sources =
|
||||
usage.presentation_mode_snapshot === 'text' && usage.original_piece_id
|
||||
? (database
|
||||
.prepare(
|
||||
`SELECT label, url, timecode_seconds AS timecodeSeconds
|
||||
FROM piece_sources WHERE piece_id = ? ORDER BY position`
|
||||
)
|
||||
.all(usage.original_piece_id) as {
|
||||
label: string;
|
||||
url: string;
|
||||
timecodeSeconds: number | null;
|
||||
}[])
|
||||
: [];
|
||||
const images =
|
||||
usage.presentation_mode_snapshot === 'text' && usage.original_piece_id
|
||||
? (database
|
||||
.prepare(
|
||||
`SELECT id, alt_text AS altText FROM piece_media
|
||||
WHERE piece_id = ? ORDER BY position`
|
||||
)
|
||||
.all(usage.original_piece_id) as { id: string; altText: string }[])
|
||||
: [];
|
||||
return {
|
||||
revision: state.presentation_revision,
|
||||
content: {
|
||||
mode: usage.presentation_mode_snapshot,
|
||||
title: usage.title_snapshot,
|
||||
topics: (
|
||||
database
|
||||
.prepare('SELECT name FROM usage_topic_snapshots WHERE usage_id = ? ORDER BY position')
|
||||
.all(state.presentation_usage_id) as { name: string }[]
|
||||
).map((topic) => topic.name),
|
||||
title: usage.output_title_snapshot || usage.title_snapshot,
|
||||
html: renderMarkdown(usage.presentation_snapshot),
|
||||
source: usage.presentation_source_url_snapshot
|
||||
? {
|
||||
@@ -589,8 +785,15 @@ export function getPresentationView(token: string): PresentationView | null {
|
||||
usage.presentation_provider_id_snapshot,
|
||||
usage.presentation_source_timecode_snapshot
|
||||
),
|
||||
sources,
|
||||
images
|
||||
sources: [],
|
||||
images: (
|
||||
database
|
||||
.prepare(
|
||||
`SELECT id, alt_text FROM usage_media_snapshots
|
||||
WHERE usage_id = ? AND is_presentation = 1`
|
||||
)
|
||||
.all(state.presentation_usage_id) as { id: string; alt_text: string }[]
|
||||
).map((media) => ({ id: media.id, altText: media.alt_text }))
|
||||
}
|
||||
};
|
||||
}
|
||||
@@ -605,19 +808,35 @@ export async function getPresentationPreviewImage(token: string) {
|
||||
}
|
||||
}
|
||||
|
||||
export async function getPresentationMedia(token: string, mediaId: string) {
|
||||
export async function getPresentationMedia(
|
||||
token: string,
|
||||
snapshotId: string
|
||||
): Promise<{ data: Buffer; mimeType: string; byteSize: number; altText: string } | null> {
|
||||
const database = getDatabase();
|
||||
const showId = presentationShowId(database, token);
|
||||
if (!showId) return null;
|
||||
const allowed = database
|
||||
if (!showId || !snapshotId) return null;
|
||||
const media = database
|
||||
.prepare(
|
||||
`SELECT 1 FROM show_live_states l
|
||||
JOIN piece_usages u ON u.id = l.presentation_usage_id
|
||||
`SELECT pm.storage_name, pm.mime_type, pm.byte_size, ums.alt_text
|
||||
FROM show_live_states state
|
||||
JOIN usage_media_snapshots ums ON ums.usage_id = state.presentation_usage_id
|
||||
JOIN piece_usages u ON u.id = ums.usage_id
|
||||
JOIN show_sections s ON s.id = u.show_section_id
|
||||
JOIN piece_media m ON m.piece_id = u.original_piece_id
|
||||
WHERE l.show_id = ? AND s.show_id = ? AND m.id = ?`
|
||||
JOIN piece_media pm ON pm.id = ums.original_media_id
|
||||
WHERE state.show_id = ? AND s.show_id = state.show_id
|
||||
AND s.is_reserve_bank = 0 AND ums.id = ? AND ums.is_presentation = 1`
|
||||
)
|
||||
.get(showId, showId, mediaId);
|
||||
if (!allowed) return null;
|
||||
return getMediaFile(mediaId);
|
||||
.get(showId, snapshotId) as
|
||||
{ storage_name: string; mime_type: string; byte_size: number; alt_text: string } | undefined;
|
||||
if (!media) return null;
|
||||
try {
|
||||
return {
|
||||
data: await readFile(path.join(getServerPaths().uploads, media.storage_name)),
|
||||
mimeType: media.mime_type,
|
||||
byteSize: media.byte_size,
|
||||
altText: media.alt_text
|
||||
};
|
||||
} catch {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@@ -28,6 +28,7 @@ export type PresentationSource = {
|
||||
|
||||
export type PresentationContent = {
|
||||
mode: PresentationMode;
|
||||
topics: string[];
|
||||
title: string;
|
||||
html: string;
|
||||
source: PresentationSource | null;
|
||||
|
||||
@@ -86,7 +86,7 @@ export function getPieces(): PreviewPiece[] {
|
||||
(SELECT count(*) FROM piece_sources ps WHERE ps.piece_id = p.id) AS source_count
|
||||
FROM pieces p
|
||||
LEFT JOIN formats f ON f.id = p.format_id
|
||||
WHERE p.status IN ('preparing', 'ready')
|
||||
WHERE p.status IN ('preparing', 'ready') AND p.deleted_at_utc IS NULL
|
||||
ORDER BY CASE p.status WHEN 'ready' THEN 0 ELSE 1 END, p.title`
|
||||
)
|
||||
.all() as PieceRow[];
|
||||
@@ -175,9 +175,12 @@ export function getTaxonomy() {
|
||||
id: string;
|
||||
name: string;
|
||||
}[],
|
||||
topics: database.prepare('SELECT id, name FROM topics ORDER BY name').all() as {
|
||||
topics: database
|
||||
.prepare('SELECT id, name, icon_name AS iconName FROM topics ORDER BY name')
|
||||
.all() as {
|
||||
id: string;
|
||||
name: string;
|
||||
iconName: string;
|
||||
}[]
|
||||
};
|
||||
}
|
||||
@@ -9,6 +9,7 @@ import {
|
||||
addPieceUsage,
|
||||
addShowSection,
|
||||
createShow,
|
||||
createAndAddPieceUsage,
|
||||
duplicatePieceUsage,
|
||||
getPieceUsageContexts,
|
||||
getShow,
|
||||
@@ -44,6 +45,7 @@ function editedUsage(usage: PieceUsage, overrides: Partial<PieceUsage> = {}) {
|
||||
const edited = { ...usage, ...overrides };
|
||||
return {
|
||||
title: edited.title,
|
||||
outputTitle: edited.outputTitle,
|
||||
intro: edited.intro,
|
||||
research: edited.research,
|
||||
moderation: edited.moderation,
|
||||
@@ -57,12 +59,71 @@ function editedUsage(usage: PieceUsage, overrides: Partial<PieceUsage> = {}) {
|
||||
presentationDescription: edited.presentationDescription,
|
||||
presentationImageUrl: edited.presentationImageUrl,
|
||||
presentationSiteName: edited.presentationSiteName,
|
||||
presentationMediaId: edited.presentationMediaId,
|
||||
ownNotes: edited.ownNotes,
|
||||
durationSeconds: edited.durationSeconds
|
||||
};
|
||||
}
|
||||
|
||||
describe('show builder data layer', () => {
|
||||
it('creates a fundus original and usage atomically and idempotently', () => {
|
||||
const created = createShow({ title: 'Direkte Planung', startsAtUtc: null, templateId: null });
|
||||
const section = addShowSection(created.id, created.revision, {
|
||||
name: 'Ablauf',
|
||||
categoryId: null,
|
||||
explicitDurationSeconds: null
|
||||
});
|
||||
const before = (
|
||||
getDatabase().prepare('SELECT count(*) AS count FROM pieces').get() as { count: number }
|
||||
).count;
|
||||
const first = createAndAddPieceUsage(created.id, section.revision, 'new-piece-command', {
|
||||
title: 'Direkt geplantes Piece',
|
||||
templateId: 'talk',
|
||||
sectionId: section.id
|
||||
});
|
||||
const repeated = createAndAddPieceUsage(created.id, section.revision, 'new-piece-command', {
|
||||
title: 'Darf nicht doppelt entstehen',
|
||||
templateId: 'blank',
|
||||
sectionId: section.id
|
||||
});
|
||||
expect(repeated).toEqual({ ...first, duplicate: true });
|
||||
expect(getShow(created.id)?.sections[0].usages).toHaveLength(1);
|
||||
expect(getPiece(first.pieceId)).toMatchObject({
|
||||
title: 'Direkt geplantes Piece',
|
||||
status: 'ready',
|
||||
formatId: 'format-talk'
|
||||
});
|
||||
expect(
|
||||
(getDatabase().prepare('SELECT count(*) AS count FROM pieces').get() as { count: number })
|
||||
.count
|
||||
).toBe(before + 1);
|
||||
|
||||
expect(() =>
|
||||
createAndAddPieceUsage(created.id, first.revision, 'failing-command', {
|
||||
title: 'Rollback',
|
||||
templateId: 'blank',
|
||||
sectionId: 'missing'
|
||||
})
|
||||
).toThrow('NOT_FOUND');
|
||||
expect(
|
||||
(getDatabase().prepare('SELECT count(*) AS count FROM pieces').get() as { count: number })
|
||||
.count
|
||||
).toBe(before + 1);
|
||||
|
||||
const removed = removePieceUsage(created.id, first.usageId, first.revision);
|
||||
const afterRemoval = createAndAddPieceUsage(created.id, removed.revision, 'new-piece-command', {
|
||||
title: 'Darf auch nach dem Entfernen nicht neu entstehen',
|
||||
templateId: 'blank',
|
||||
sectionId: section.id
|
||||
});
|
||||
expect(afterRemoval).toEqual({ ...first, duplicate: true });
|
||||
expect(getShow(created.id)?.sections[0].usages).toHaveLength(0);
|
||||
expect(
|
||||
(getDatabase().prepare('SELECT count(*) AS count FROM pieces').get() as { count: number })
|
||||
.count
|
||||
).toBe(before + 1);
|
||||
});
|
||||
|
||||
it('creates blank and templated shows with independent sections and reserve banks', () => {
|
||||
const templatesBefore = listShowTemplates();
|
||||
expect(
|
||||
@@ -360,7 +421,8 @@ describe('show builder data layer', () => {
|
||||
.run('https://youtu.be/dQw4w9WgXcQ');
|
||||
getDatabase()
|
||||
.prepare(
|
||||
`UPDATE pieces SET presentation_mode = 'video', presentation_source_position = 0,
|
||||
`UPDATE pieces SET output_title = 'Öffentlicher Ausgabetitel',
|
||||
presentation_mode = 'video', presentation_source_position = 0,
|
||||
presentation_title = 'Gespeicherte Vorschau', presentation_description = 'Erster Stand',
|
||||
presentation_site_name = 'YouTube', presentation_provider = 'youtube',
|
||||
presentation_provider_id = 'dQw4w9WgXcQ' WHERE id = 'piece-console'`
|
||||
@@ -378,6 +440,7 @@ describe('show builder data layer', () => {
|
||||
});
|
||||
let usage = getShow(show.id)!.sections[0].usages[0];
|
||||
expect(usage).toMatchObject({
|
||||
outputTitle: 'Öffentlicher Ausgabetitel',
|
||||
presentationMode: 'video',
|
||||
presentationSourceUrl: 'https://youtu.be/dQw4w9WgXcQ',
|
||||
presentationSourceTimecodeSeconds: 75,
|
||||
@@ -402,6 +465,180 @@ describe('show builder data layer', () => {
|
||||
});
|
||||
});
|
||||
|
||||
it('keeps private source, tool and topic snapshots stable until an explicit refresh', () => {
|
||||
const database = getDatabase();
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO tools (id, name, start_url, description, is_active, created_at_utc, updated_at_utc)
|
||||
VALUES ('tool-tierlist', 'Tierlist', 'https://example.com/start', '', 1, ?, ?)`
|
||||
)
|
||||
.run('2026-10-23T00:00:00.000Z', '2026-10-23T00:00:00.000Z');
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO piece_tools (id, piece_id, tool_id, work_url, note, position)
|
||||
VALUES ('piece-tool-console', 'piece-console', 'tool-tierlist', 'https://example.com/board', 'Erster Stand', 0)`
|
||||
)
|
||||
.run();
|
||||
const show = createShow({ title: 'Relationen', startsAtUtc: null, templateId: null });
|
||||
const section = addShowSection(show.id, show.revision, {
|
||||
name: 'Block',
|
||||
categoryId: null,
|
||||
explicitDurationSeconds: null
|
||||
});
|
||||
const added = addPieceUsage(show.id, section.revision, {
|
||||
pieceId: 'piece-console',
|
||||
sectionId: section.id
|
||||
});
|
||||
let usage = getShow(show.id)!.sections[0].usages[0];
|
||||
expect(usage).toMatchObject({
|
||||
sources: [{ label: 'Herstellerseite', url: 'https://example.com/console' }],
|
||||
tools: [{ name: 'Tierlist', workUrl: 'https://example.com/board', note: 'Erster Stand' }],
|
||||
topics: [{ name: 'Gaming', iconName: '' }]
|
||||
});
|
||||
|
||||
database
|
||||
.prepare("UPDATE piece_sources SET label = 'Neue Quelle' WHERE piece_id = 'piece-console'")
|
||||
.run();
|
||||
database
|
||||
.prepare("UPDATE tools SET name = 'Neuer Katalogname' WHERE id = 'tool-tierlist'")
|
||||
.run();
|
||||
database
|
||||
.prepare(
|
||||
"UPDATE piece_tools SET work_url = 'https://example.com/new' WHERE id = 'piece-tool-console'"
|
||||
)
|
||||
.run();
|
||||
database.prepare("DELETE FROM piece_topics WHERE piece_id = 'piece-console'").run();
|
||||
database
|
||||
.prepare(
|
||||
"INSERT INTO piece_topics (piece_id, topic_id) VALUES ('piece-console', 'topic-internet')"
|
||||
)
|
||||
.run();
|
||||
usage = getShow(show.id)!.sections[0].usages[0];
|
||||
expect(usage.sources[0].label).toBe('Herstellerseite');
|
||||
expect(usage.tools[0]).toMatchObject({
|
||||
name: 'Tierlist',
|
||||
workUrl: 'https://example.com/board'
|
||||
});
|
||||
expect(usage.topics).toEqual([{ name: 'Gaming', iconName: '' }]);
|
||||
|
||||
refreshPieceUsageFromOriginal(show.id, usage.id, added.revision);
|
||||
usage = getShow(show.id)!.sections[0].usages[0];
|
||||
expect(usage.sources[0].label).toBe('Neue Quelle');
|
||||
expect(usage.tools[0]).toMatchObject({
|
||||
name: 'Neuer Katalogname',
|
||||
workUrl: 'https://example.com/new'
|
||||
});
|
||||
expect(usage.topics).toEqual([{ name: 'Netzkultur', iconName: '' }]);
|
||||
});
|
||||
|
||||
it('snapshots active media, their presentation choice and topic icons independently', () => {
|
||||
const database = getDatabase();
|
||||
database.prepare("UPDATE topics SET icon_name = 'gamepad' WHERE id = 'topic-gaming'").run();
|
||||
const insertMedia = database.prepare(
|
||||
`INSERT INTO piece_media (id, piece_id, storage_name, original_name, mime_type,
|
||||
byte_size, alt_text, position, created_at_utc, removed_at_utc)
|
||||
VALUES (?, 'piece-console', ?, ?, 'image/png', 10, ?, ?, ?, ?)`
|
||||
);
|
||||
insertMedia.run(
|
||||
'media-first',
|
||||
'first.png',
|
||||
'first-original.png',
|
||||
'Erstes Bild',
|
||||
0,
|
||||
'2026-10-23T00:00:00.000Z',
|
||||
null
|
||||
);
|
||||
insertMedia.run(
|
||||
'media-second',
|
||||
'second.png',
|
||||
'second-original.png',
|
||||
'Zweites Bild',
|
||||
1,
|
||||
'2026-10-23T00:00:00.000Z',
|
||||
null
|
||||
);
|
||||
insertMedia.run(
|
||||
'media-removed',
|
||||
'removed.png',
|
||||
'removed-original.png',
|
||||
'Entferntes Bild',
|
||||
2,
|
||||
'2026-10-23T00:00:00.000Z',
|
||||
'2026-10-23T01:00:00.000Z'
|
||||
);
|
||||
database
|
||||
.prepare(
|
||||
"INSERT INTO piece_presentation_media (piece_id, media_id) VALUES ('piece-console', 'media-first')"
|
||||
)
|
||||
.run();
|
||||
const show = createShow({ title: 'Medien', startsAtUtc: null, templateId: null });
|
||||
const section = addShowSection(show.id, show.revision, {
|
||||
name: 'Bilder',
|
||||
categoryId: null,
|
||||
explicitDurationSeconds: null
|
||||
});
|
||||
const added = addPieceUsage(show.id, section.revision, {
|
||||
pieceId: 'piece-console',
|
||||
sectionId: section.id
|
||||
});
|
||||
let usage = getShow(show.id)!.sections[0].usages[0];
|
||||
expect(usage.topics).toEqual([{ name: 'Gaming', iconName: 'gamepad' }]);
|
||||
expect(usage.media).toMatchObject([
|
||||
{ originalMediaId: 'media-first', altText: 'Erstes Bild', position: 0, isPresentation: true },
|
||||
{
|
||||
originalMediaId: 'media-second',
|
||||
altText: 'Zweites Bild',
|
||||
position: 1,
|
||||
isPresentation: false
|
||||
}
|
||||
]);
|
||||
expect(usage.presentationMediaId).toBe(usage.media[0].id);
|
||||
|
||||
const selected = updatePieceUsage(show.id, usage.id, added.revision, {
|
||||
...editedUsage(usage),
|
||||
presentationMediaId: usage.media[1].id
|
||||
});
|
||||
usage = getShow(show.id)!.sections[0].usages[0];
|
||||
expect(usage.media.map((item) => item.isPresentation)).toEqual([false, true]);
|
||||
expect(() =>
|
||||
updatePieceUsage(show.id, usage.id, selected.revision, {
|
||||
...editedUsage(usage),
|
||||
presentationMediaId: 'media-first'
|
||||
})
|
||||
).toThrow('INVALID_PRESENTATION_MEDIA');
|
||||
expect(getShow(show.id)?.revision).toBe(selected.revision);
|
||||
|
||||
const duplicate = duplicatePieceUsage(show.id, usage.id, selected.revision);
|
||||
const duplicateUsage = getShow(show.id)!.sections[0].usages[1];
|
||||
expect(duplicateUsage.media.map((item) => item.originalMediaId)).toEqual([
|
||||
'media-first',
|
||||
'media-second'
|
||||
]);
|
||||
expect(duplicateUsage.presentationMediaId).toBe(duplicateUsage.media[1].id);
|
||||
expect(duplicateUsage.media.map((item) => item.id)).not.toEqual(
|
||||
usage.media.map((item) => item.id)
|
||||
);
|
||||
|
||||
database
|
||||
.prepare("UPDATE piece_media SET removed_at_utc = ? WHERE id = 'media-first'")
|
||||
.run('2026-10-23T02:00:00.000Z');
|
||||
database
|
||||
.prepare("UPDATE piece_media SET alt_text = 'Neuer Alternativtext' WHERE id = 'media-second'")
|
||||
.run();
|
||||
database.prepare("DELETE FROM piece_presentation_media WHERE piece_id = 'piece-console'").run();
|
||||
database
|
||||
.prepare(
|
||||
"INSERT INTO piece_presentation_media (piece_id, media_id) VALUES ('piece-console', 'media-second')"
|
||||
)
|
||||
.run();
|
||||
refreshPieceUsageFromOriginal(show.id, usage.id, duplicate.revision);
|
||||
usage = getShow(show.id)!.sections[0].usages[0];
|
||||
expect(usage.media).toMatchObject([
|
||||
{ originalMediaId: 'media-second', altText: 'Neuer Alternativtext', isPresentation: true }
|
||||
]);
|
||||
expect(duplicateUsage.media).toHaveLength(2);
|
||||
});
|
||||
|
||||
it('persists normalized section and usage reordering, moving and removal', () => {
|
||||
const created = createShow({ title: 'Sortierung', startsAtUtc: null, templateId: null });
|
||||
const firstSection = addShowSection(created.id, created.revision, {
|
||||
|
||||
+463
-14
@@ -1,5 +1,6 @@
|
||||
import { randomUUID } from 'node:crypto';
|
||||
import type Database from 'better-sqlite3';
|
||||
import { createPiece } from './content.js';
|
||||
import { getDatabase } from './database.js';
|
||||
import { detectVideoProvider, type PresentationMode } from './presentation.js';
|
||||
|
||||
@@ -42,6 +43,7 @@ export type PieceUsage = {
|
||||
status: UsageStatus;
|
||||
durationSeconds: number;
|
||||
title: string;
|
||||
outputTitle: string;
|
||||
intro: string;
|
||||
research: string;
|
||||
moderation: string;
|
||||
@@ -58,6 +60,28 @@ export type PieceUsage = {
|
||||
presentationProvider: string;
|
||||
presentationProviderId: string;
|
||||
ownNotes: string;
|
||||
sources: { id: string; label: string; url: string; timecodeSeconds: number | null }[];
|
||||
tools: {
|
||||
id: string;
|
||||
originalToolId: string | null;
|
||||
name: string;
|
||||
startUrl: string;
|
||||
workUrl: string;
|
||||
note: string;
|
||||
}[];
|
||||
topics: UsageTopic[];
|
||||
media: PieceUsageMedia[];
|
||||
presentationMediaId: string | null;
|
||||
};
|
||||
|
||||
export type UsageTopic = { name: string; iconName: string };
|
||||
|
||||
export type PieceUsageMedia = {
|
||||
id: string;
|
||||
originalMediaId: string;
|
||||
altText: string;
|
||||
position: number;
|
||||
isPresentation: boolean;
|
||||
};
|
||||
|
||||
export type SentPieceUsage = {
|
||||
@@ -129,6 +153,7 @@ export type PieceUsageInput = {
|
||||
|
||||
export type PieceUsageUpdate = {
|
||||
title: string;
|
||||
outputTitle: string;
|
||||
intro: string;
|
||||
research: string;
|
||||
moderation: string;
|
||||
@@ -144,6 +169,8 @@ export type PieceUsageUpdate = {
|
||||
presentationSiteName: string;
|
||||
ownNotes: string;
|
||||
durationSeconds: number;
|
||||
tools?: { id: string; workUrl: string; note: string }[];
|
||||
presentationMediaId?: string | null;
|
||||
};
|
||||
|
||||
export type MovePieceUsageInput = {
|
||||
@@ -185,6 +212,7 @@ type UsageRow = {
|
||||
status: UsageStatus;
|
||||
duration_seconds: number;
|
||||
title_snapshot: string;
|
||||
output_title_snapshot: string;
|
||||
intro_snapshot: string;
|
||||
research_snapshot: string;
|
||||
moderation_snapshot: string;
|
||||
@@ -348,6 +376,43 @@ function usageSection(
|
||||
return row;
|
||||
}
|
||||
|
||||
function requireUsagesRemovable(
|
||||
database: Database.Database,
|
||||
showId: string,
|
||||
usageIds: string[]
|
||||
): void {
|
||||
if (!usageIds.length) return;
|
||||
const placeholders = usageIds.map(() => '?').join(', ');
|
||||
const state = database
|
||||
.prepare(
|
||||
`SELECT current_usage_id, presentation_usage_id FROM show_live_states WHERE show_id = ?`
|
||||
)
|
||||
.get(showId) as
|
||||
{ current_usage_id: string | null; presentation_usage_id: string | null } | undefined;
|
||||
if (state?.current_usage_id && usageIds.includes(state.current_usage_id)) {
|
||||
throw new Error('USAGE_IS_CURRENT');
|
||||
}
|
||||
if (state?.presentation_usage_id && usageIds.includes(state.presentation_usage_id)) {
|
||||
throw new Error('USAGE_IS_PRESENTED');
|
||||
}
|
||||
if (
|
||||
database
|
||||
.prepare(`SELECT 1 FROM live_usage_runs WHERE usage_id IN (${placeholders}) LIMIT 1`)
|
||||
.get(...usageIds)
|
||||
) {
|
||||
throw new Error('USAGE_HAS_LIVE_RUNS');
|
||||
}
|
||||
if (
|
||||
database
|
||||
.prepare(
|
||||
`SELECT 1 FROM piece_usages WHERE id IN (${placeholders}) AND status != 'open' LIMIT 1`
|
||||
)
|
||||
.get(...usageIds)
|
||||
) {
|
||||
throw new Error('USAGE_NOT_OPEN');
|
||||
}
|
||||
}
|
||||
|
||||
function normalizePositions(
|
||||
database: Database.Database,
|
||||
table: 'show_sections' | 'piece_usages',
|
||||
@@ -368,7 +433,7 @@ function normalizePositions(
|
||||
ids.forEach((id, position) => update.run(position, id));
|
||||
}
|
||||
|
||||
function usageFromRow(row: UsageRow): PieceUsage {
|
||||
function usageFromRow(database: Database.Database, row: UsageRow): PieceUsage {
|
||||
return {
|
||||
id: row.id,
|
||||
originalPieceId: row.original_piece_id,
|
||||
@@ -376,6 +441,7 @@ function usageFromRow(row: UsageRow): PieceUsage {
|
||||
status: row.status,
|
||||
durationSeconds: row.duration_seconds,
|
||||
title: row.title_snapshot,
|
||||
outputTitle: row.output_title_snapshot,
|
||||
intro: row.intro_snapshot,
|
||||
research: row.research_snapshot,
|
||||
moderation: row.moderation_snapshot,
|
||||
@@ -391,10 +457,258 @@ function usageFromRow(row: UsageRow): PieceUsage {
|
||||
presentationSiteName: row.presentation_site_name_snapshot,
|
||||
presentationProvider: row.presentation_provider_snapshot,
|
||||
presentationProviderId: row.presentation_provider_id_snapshot,
|
||||
ownNotes: row.own_notes
|
||||
ownNotes: row.own_notes,
|
||||
sources: (
|
||||
database
|
||||
.prepare(
|
||||
`SELECT id, label, url, timecode_seconds FROM usage_source_snapshots
|
||||
WHERE usage_id = ? ORDER BY position`
|
||||
)
|
||||
.all(row.id) as {
|
||||
id: string;
|
||||
label: string;
|
||||
url: string;
|
||||
timecode_seconds: number | null;
|
||||
}[]
|
||||
).map((source) => ({
|
||||
id: source.id,
|
||||
label: source.label,
|
||||
url: source.url,
|
||||
timecodeSeconds: source.timecode_seconds
|
||||
})),
|
||||
tools: (
|
||||
database
|
||||
.prepare(
|
||||
`SELECT id, original_tool_id, name, start_url, work_url, note
|
||||
FROM usage_tool_snapshots WHERE usage_id = ? ORDER BY position`
|
||||
)
|
||||
.all(row.id) as {
|
||||
id: string;
|
||||
original_tool_id: string | null;
|
||||
name: string;
|
||||
start_url: string;
|
||||
work_url: string;
|
||||
note: string;
|
||||
}[]
|
||||
).map((tool) => ({
|
||||
id: tool.id,
|
||||
originalToolId: tool.original_tool_id,
|
||||
name: tool.name,
|
||||
startUrl: tool.start_url,
|
||||
workUrl: tool.work_url,
|
||||
note: tool.note
|
||||
})),
|
||||
topics: (
|
||||
database
|
||||
.prepare(
|
||||
'SELECT name, icon_name FROM usage_topic_snapshots WHERE usage_id = ? ORDER BY position'
|
||||
)
|
||||
.all(row.id) as { name: string; icon_name: string }[]
|
||||
).map((topic) => ({ name: topic.name, iconName: topic.icon_name })),
|
||||
media: (
|
||||
database
|
||||
.prepare(
|
||||
`SELECT id, original_media_id, alt_text, position, is_presentation
|
||||
FROM usage_media_snapshots WHERE usage_id = ? ORDER BY position`
|
||||
)
|
||||
.all(row.id) as {
|
||||
id: string;
|
||||
original_media_id: string;
|
||||
alt_text: string;
|
||||
position: number;
|
||||
is_presentation: number;
|
||||
}[]
|
||||
).map((media) => ({
|
||||
id: media.id,
|
||||
originalMediaId: media.original_media_id,
|
||||
altText: media.alt_text,
|
||||
position: media.position,
|
||||
isPresentation: media.is_presentation === 1
|
||||
})),
|
||||
presentationMediaId:
|
||||
(
|
||||
database
|
||||
.prepare(
|
||||
'SELECT id FROM usage_media_snapshots WHERE usage_id = ? AND is_presentation = 1'
|
||||
)
|
||||
.get(row.id) as { id: string } | undefined
|
||||
)?.id ?? null
|
||||
};
|
||||
}
|
||||
|
||||
function snapshotPieceRelations(database: Database.Database, usageId: string, pieceId: string) {
|
||||
database.prepare('DELETE FROM usage_source_snapshots WHERE usage_id = ?').run(usageId);
|
||||
database.prepare('DELETE FROM usage_tool_snapshots WHERE usage_id = ?').run(usageId);
|
||||
database.prepare('DELETE FROM usage_topic_snapshots WHERE usage_id = ?').run(usageId);
|
||||
database.prepare('DELETE FROM usage_media_snapshots WHERE usage_id = ?').run(usageId);
|
||||
const sources = database
|
||||
.prepare(
|
||||
`SELECT label, url, timecode_seconds, position FROM piece_sources
|
||||
WHERE piece_id = ? ORDER BY position`
|
||||
)
|
||||
.all(pieceId) as {
|
||||
label: string;
|
||||
url: string;
|
||||
timecode_seconds: number | null;
|
||||
position: number;
|
||||
}[];
|
||||
const addSource = database.prepare(
|
||||
`INSERT INTO usage_source_snapshots (id, usage_id, label, url, timecode_seconds, position)
|
||||
VALUES (?, ?, ?, ?, ?, ?)`
|
||||
);
|
||||
for (const source of sources) {
|
||||
addSource.run(
|
||||
randomUUID(),
|
||||
usageId,
|
||||
source.label,
|
||||
source.url,
|
||||
source.timecode_seconds,
|
||||
source.position
|
||||
);
|
||||
}
|
||||
const tools = database
|
||||
.prepare(
|
||||
`SELECT pt.tool_id, t.name, t.start_url, pt.work_url, pt.note, pt.position
|
||||
FROM piece_tools pt JOIN tools t ON t.id = pt.tool_id
|
||||
WHERE pt.piece_id = ? ORDER BY pt.position`
|
||||
)
|
||||
.all(pieceId) as {
|
||||
tool_id: string;
|
||||
name: string;
|
||||
start_url: string;
|
||||
work_url: string;
|
||||
note: string;
|
||||
position: number;
|
||||
}[];
|
||||
const addTool = database.prepare(
|
||||
`INSERT INTO usage_tool_snapshots
|
||||
(id, usage_id, original_tool_id, name, start_url, work_url, note, position)
|
||||
VALUES (?, ?, ?, ?, ?, ?, ?, ?)`
|
||||
);
|
||||
for (const tool of tools) {
|
||||
addTool.run(
|
||||
randomUUID(),
|
||||
usageId,
|
||||
tool.tool_id,
|
||||
tool.name,
|
||||
tool.start_url,
|
||||
tool.work_url,
|
||||
tool.note,
|
||||
tool.position
|
||||
);
|
||||
}
|
||||
const topics = database
|
||||
.prepare(
|
||||
`SELECT t.name, t.icon_name FROM piece_topics pt JOIN topics t ON t.id = pt.topic_id
|
||||
WHERE pt.piece_id = ? ORDER BY t.name, t.id`
|
||||
)
|
||||
.all(pieceId) as { name: string; icon_name: string }[];
|
||||
const addTopic = database.prepare(
|
||||
'INSERT INTO usage_topic_snapshots (usage_id, name, icon_name, position) VALUES (?, ?, ?, ?)'
|
||||
);
|
||||
topics.forEach((topic, position) => addTopic.run(usageId, topic.name, topic.icon_name, position));
|
||||
const media = database
|
||||
.prepare(
|
||||
`SELECT pm.id, pm.alt_text, pm.position,
|
||||
CASE WHEN ppm.media_id IS NULL THEN 0 ELSE 1 END AS is_presentation
|
||||
FROM piece_media pm
|
||||
LEFT JOIN piece_presentation_media ppm
|
||||
ON ppm.piece_id = pm.piece_id AND ppm.media_id = pm.id
|
||||
WHERE pm.piece_id = ? AND pm.removed_at_utc IS NULL ORDER BY pm.position`
|
||||
)
|
||||
.all(pieceId) as {
|
||||
id: string;
|
||||
alt_text: string;
|
||||
position: number;
|
||||
is_presentation: number;
|
||||
}[];
|
||||
const addMedia = database.prepare(
|
||||
`INSERT INTO usage_media_snapshots
|
||||
(id, usage_id, original_media_id, alt_text, position, is_presentation)
|
||||
VALUES (?, ?, ?, ?, ?, ?)`
|
||||
);
|
||||
for (const item of media) {
|
||||
addMedia.run(
|
||||
randomUUID(),
|
||||
usageId,
|
||||
item.id,
|
||||
item.alt_text,
|
||||
item.position,
|
||||
item.is_presentation
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function copyUsageRelations(database: Database.Database, sourceUsageId: string, usageId: string) {
|
||||
const sources = database
|
||||
.prepare(
|
||||
`SELECT label, url, timecode_seconds, position FROM usage_source_snapshots
|
||||
WHERE usage_id = ? ORDER BY position`
|
||||
)
|
||||
.all(sourceUsageId) as {
|
||||
label: string;
|
||||
url: string;
|
||||
timecode_seconds: number | null;
|
||||
position: number;
|
||||
}[];
|
||||
const addSource = database.prepare(
|
||||
`INSERT INTO usage_source_snapshots (id, usage_id, label, url, timecode_seconds, position)
|
||||
VALUES (?, ?, ?, ?, ?, ?)`
|
||||
);
|
||||
for (const source of sources)
|
||||
addSource.run(
|
||||
randomUUID(),
|
||||
usageId,
|
||||
source.label,
|
||||
source.url,
|
||||
source.timecode_seconds,
|
||||
source.position
|
||||
);
|
||||
const tools = database
|
||||
.prepare(
|
||||
`SELECT original_tool_id, name, start_url, work_url, note, position
|
||||
FROM usage_tool_snapshots WHERE usage_id = ? ORDER BY position`
|
||||
)
|
||||
.all(sourceUsageId) as {
|
||||
original_tool_id: string | null;
|
||||
name: string;
|
||||
start_url: string;
|
||||
work_url: string;
|
||||
note: string;
|
||||
position: number;
|
||||
}[];
|
||||
const addTool = database.prepare(
|
||||
`INSERT INTO usage_tool_snapshots
|
||||
(id, usage_id, original_tool_id, name, start_url, work_url, note, position)
|
||||
VALUES (?, ?, ?, ?, ?, ?, ?, ?)`
|
||||
);
|
||||
for (const tool of tools)
|
||||
addTool.run(
|
||||
randomUUID(),
|
||||
usageId,
|
||||
tool.original_tool_id,
|
||||
tool.name,
|
||||
tool.start_url,
|
||||
tool.work_url,
|
||||
tool.note,
|
||||
tool.position
|
||||
);
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO usage_topic_snapshots (usage_id, name, icon_name, position)
|
||||
SELECT ?, name, icon_name, position FROM usage_topic_snapshots WHERE usage_id = ?`
|
||||
)
|
||||
.run(usageId, sourceUsageId);
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO usage_media_snapshots
|
||||
(id, usage_id, original_media_id, alt_text, position, is_presentation)
|
||||
SELECT lower(hex(randomblob(16))), ?, original_media_id, alt_text, position, is_presentation
|
||||
FROM usage_media_snapshots WHERE usage_id = ?`
|
||||
)
|
||||
.run(usageId, sourceUsageId);
|
||||
}
|
||||
|
||||
export function listShows(): ShowListItem[] {
|
||||
return (
|
||||
getDatabase()
|
||||
@@ -478,7 +792,7 @@ export function getShow(id: string): Show | null {
|
||||
const usageRows = database
|
||||
.prepare(
|
||||
`SELECT u.id, u.show_section_id, u.original_piece_id, u.position, u.status,
|
||||
u.duration_seconds, u.title_snapshot, u.intro_snapshot, u.research_snapshot,
|
||||
u.duration_seconds, u.title_snapshot, u.output_title_snapshot, u.intro_snapshot, u.research_snapshot,
|
||||
u.moderation_snapshot, u.transition_snapshot, u.presentation_snapshot,
|
||||
u.presentation_mode_snapshot, u.presentation_source_label_snapshot,
|
||||
u.presentation_source_url_snapshot, u.presentation_source_timecode_snapshot,
|
||||
@@ -492,7 +806,7 @@ export function getShow(id: string): Show | null {
|
||||
const usagesBySection = new Map<string, PieceUsage[]>();
|
||||
for (const row of usageRows) {
|
||||
const usages = usagesBySection.get(row.show_section_id) ?? [];
|
||||
usages.push(usageFromRow(row));
|
||||
usages.push(usageFromRow(database, row));
|
||||
usagesBySection.set(row.show_section_id, usages);
|
||||
}
|
||||
const sections = sectionRows
|
||||
@@ -754,6 +1068,12 @@ export function removeShowSection(
|
||||
return database.transaction(() => {
|
||||
const result = bumpShow(database, showId, expectedRevision);
|
||||
sectionBelongsToShow(database, showId, sectionId);
|
||||
const usageIds = (
|
||||
database.prepare('SELECT id FROM piece_usages WHERE show_section_id = ?').all(sectionId) as {
|
||||
id: string;
|
||||
}[]
|
||||
).map((usage) => usage.id);
|
||||
requireUsagesRemovable(database, showId, usageIds);
|
||||
database.prepare('DELETE FROM show_sections WHERE id = ?').run(sectionId);
|
||||
const ids = (
|
||||
database
|
||||
@@ -805,7 +1125,7 @@ export function addPieceUsage(
|
||||
sectionBelongsToShow(database, showId, sectionId, input.sectionId === null);
|
||||
const piece = database
|
||||
.prepare(
|
||||
`SELECT p.title, p.duration_seconds, p.intro, p.research_text, p.moderation_notes,
|
||||
`SELECT p.title, p.output_title, p.duration_seconds, p.intro, p.research_text, p.moderation_notes,
|
||||
p.transition_text, p.presentation_text, p.status, p.presentation_mode,
|
||||
COALESCE(ps.label, '') AS presentation_source_label,
|
||||
COALESCE(ps.url, '') AS presentation_source_url,
|
||||
@@ -818,6 +1138,7 @@ export function addPieceUsage(
|
||||
.get(input.pieceId) as
|
||||
| {
|
||||
title: string;
|
||||
output_title: string;
|
||||
duration_seconds: number;
|
||||
intro: string;
|
||||
research_text: string;
|
||||
@@ -838,6 +1159,13 @@ export function addPieceUsage(
|
||||
}
|
||||
| undefined;
|
||||
if (!piece) throw new Error('NOT_FOUND');
|
||||
if (
|
||||
!database
|
||||
.prepare('SELECT 1 FROM pieces WHERE id = ? AND deleted_at_utc IS NULL')
|
||||
.get(input.pieceId)
|
||||
) {
|
||||
throw new Error('NOT_FOUND');
|
||||
}
|
||||
if (piece.status !== 'ready') throw new Error('PIECE_NOT_READY');
|
||||
const ids = (
|
||||
database
|
||||
@@ -849,14 +1177,14 @@ export function addPieceUsage(
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO piece_usages (id, show_section_id, original_piece_id, position, status,
|
||||
duration_seconds, title_snapshot, intro_snapshot, research_snapshot,
|
||||
duration_seconds, title_snapshot, output_title_snapshot, intro_snapshot, research_snapshot,
|
||||
moderation_snapshot, transition_snapshot, presentation_snapshot,
|
||||
presentation_mode_snapshot, presentation_source_label_snapshot,
|
||||
presentation_source_url_snapshot, presentation_source_timecode_snapshot,
|
||||
presentation_title_meta_snapshot, presentation_description_snapshot,
|
||||
presentation_image_url_snapshot, presentation_site_name_snapshot,
|
||||
presentation_provider_snapshot, presentation_provider_id_snapshot, own_notes, is_reserve)
|
||||
VALUES (?, ?, ?, ?, 'open', ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, '', ?)`
|
||||
VALUES (?, ?, ?, ?, 'open', ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, '', ?)`
|
||||
)
|
||||
.run(
|
||||
id,
|
||||
@@ -865,6 +1193,7 @@ export function addPieceUsage(
|
||||
ids.length,
|
||||
piece.duration_seconds,
|
||||
piece.title,
|
||||
piece.output_title,
|
||||
piece.intro,
|
||||
piece.research_text,
|
||||
piece.moderation_notes,
|
||||
@@ -882,12 +1211,67 @@ export function addPieceUsage(
|
||||
piece.presentation_provider_id,
|
||||
input.sectionId === null ? 1 : 0
|
||||
);
|
||||
snapshotPieceRelations(database, id, input.pieceId);
|
||||
ids.splice(position, 0, id);
|
||||
normalizePositions(database, 'piece_usages', ids);
|
||||
return { ...result, id };
|
||||
})();
|
||||
}
|
||||
|
||||
export function createAndAddPieceUsage(
|
||||
showId: string,
|
||||
expectedRevision: number,
|
||||
commandId: string,
|
||||
input: Omit<PieceUsageInput, 'pieceId'> & { title: string; templateId: string }
|
||||
) {
|
||||
if (!commandId || commandId.length > 200) throw new Error('INVALID_COMMAND');
|
||||
const title = cleanText(input.title, 200, 'title', true);
|
||||
const database = getDatabase();
|
||||
return database.transaction(() => {
|
||||
const duplicate = database
|
||||
.prepare(
|
||||
`SELECT piece_id, usage_id, result_revision FROM planning_commands
|
||||
WHERE show_id = ? AND command_id = ?`
|
||||
)
|
||||
.get(showId, commandId) as
|
||||
{ piece_id: string; usage_id: string; result_revision: number } | undefined;
|
||||
if (duplicate) {
|
||||
return {
|
||||
pieceId: duplicate.piece_id,
|
||||
usageId: duplicate.usage_id,
|
||||
revision: duplicate.result_revision,
|
||||
duplicate: true
|
||||
};
|
||||
}
|
||||
|
||||
const pieceId = createPiece(input.templateId || 'blank');
|
||||
database
|
||||
.prepare(
|
||||
`UPDATE pieces SET title = ?, status = 'ready', revision = revision + 1,
|
||||
updated_at_utc = ? WHERE id = ?`
|
||||
)
|
||||
.run(title, new Date().toISOString(), pieceId);
|
||||
const usage = addPieceUsage(showId, expectedRevision, {
|
||||
pieceId,
|
||||
sectionId: input.sectionId,
|
||||
position: input.position
|
||||
});
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO planning_commands
|
||||
(show_id, command_id, piece_id, usage_id, result_revision, created_at_utc)
|
||||
VALUES (?, ?, ?, ?, ?, ?)`
|
||||
)
|
||||
.run(showId, commandId, pieceId, usage.id, usage.revision, new Date().toISOString());
|
||||
return {
|
||||
pieceId,
|
||||
usageId: usage.id,
|
||||
revision: usage.revision,
|
||||
duplicate: false
|
||||
};
|
||||
})();
|
||||
}
|
||||
|
||||
export function duplicatePieceUsage(
|
||||
showId: string,
|
||||
usageId: string,
|
||||
@@ -899,7 +1283,7 @@ export function duplicatePieceUsage(
|
||||
const sourceSection = usageSection(database, showId, usageId);
|
||||
const source = database
|
||||
.prepare(
|
||||
`SELECT original_piece_id, status, duration_seconds, title_snapshot, intro_snapshot,
|
||||
`SELECT original_piece_id, status, duration_seconds, title_snapshot, output_title_snapshot, intro_snapshot,
|
||||
research_snapshot, moderation_snapshot, transition_snapshot, presentation_snapshot,
|
||||
presentation_mode_snapshot, presentation_source_label_snapshot,
|
||||
presentation_source_url_snapshot, presentation_source_timecode_snapshot,
|
||||
@@ -922,14 +1306,14 @@ export function duplicatePieceUsage(
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO piece_usages (id, show_section_id, original_piece_id, position, status,
|
||||
duration_seconds, title_snapshot, intro_snapshot, research_snapshot,
|
||||
duration_seconds, title_snapshot, output_title_snapshot, intro_snapshot, research_snapshot,
|
||||
moderation_snapshot, transition_snapshot, presentation_snapshot,
|
||||
presentation_mode_snapshot, presentation_source_label_snapshot,
|
||||
presentation_source_url_snapshot, presentation_source_timecode_snapshot,
|
||||
presentation_title_meta_snapshot, presentation_description_snapshot,
|
||||
presentation_image_url_snapshot, presentation_site_name_snapshot,
|
||||
presentation_provider_snapshot, presentation_provider_id_snapshot, own_notes, is_reserve)
|
||||
VALUES (?, ?, ?, ?, 'open', ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`
|
||||
VALUES (?, ?, ?, ?, 'open', ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`
|
||||
)
|
||||
.run(
|
||||
id,
|
||||
@@ -938,6 +1322,7 @@ export function duplicatePieceUsage(
|
||||
ids.length,
|
||||
source.duration_seconds,
|
||||
source.title_snapshot,
|
||||
source.output_title_snapshot,
|
||||
source.intro_snapshot,
|
||||
source.research_snapshot,
|
||||
source.moderation_snapshot,
|
||||
@@ -956,6 +1341,7 @@ export function duplicatePieceUsage(
|
||||
source.own_notes,
|
||||
source.is_reserve
|
||||
);
|
||||
copyUsageRelations(database, usageId, id);
|
||||
ids.splice(sourcePosition + 1, 0, id);
|
||||
normalizePositions(database, 'piece_usages', ids);
|
||||
return { ...result, id };
|
||||
@@ -973,7 +1359,7 @@ export function refreshPieceUsageFromOriginal(
|
||||
usageSection(database, showId, usageId);
|
||||
const source = database
|
||||
.prepare(
|
||||
`SELECT p.title, p.duration_seconds, p.intro, p.research_text,
|
||||
`SELECT p.title, p.output_title, p.duration_seconds, p.intro, p.research_text,
|
||||
p.moderation_notes, p.transition_text, p.presentation_text, p.presentation_mode,
|
||||
COALESCE(ps.label, '') AS presentation_source_label,
|
||||
COALESCE(ps.url, '') AS presentation_source_url,
|
||||
@@ -983,11 +1369,12 @@ export function refreshPieceUsageFromOriginal(
|
||||
FROM piece_usages u JOIN pieces p ON p.id = u.original_piece_id
|
||||
LEFT JOIN piece_sources ps ON ps.piece_id = p.id
|
||||
AND ps.position = p.presentation_source_position
|
||||
WHERE u.id = ?`
|
||||
WHERE u.id = ? AND p.deleted_at_utc IS NULL`
|
||||
)
|
||||
.get(usageId) as
|
||||
| {
|
||||
title: string;
|
||||
output_title: string;
|
||||
duration_seconds: number;
|
||||
intro: string;
|
||||
research_text: string;
|
||||
@@ -1009,7 +1396,7 @@ export function refreshPieceUsageFromOriginal(
|
||||
if (!source) throw new Error('ORIGINAL_NOT_FOUND');
|
||||
database
|
||||
.prepare(
|
||||
`UPDATE piece_usages SET title_snapshot = ?, duration_seconds = ?, intro_snapshot = ?,
|
||||
`UPDATE piece_usages SET title_snapshot = ?, output_title_snapshot = ?, duration_seconds = ?, intro_snapshot = ?,
|
||||
research_snapshot = ?, moderation_snapshot = ?, transition_snapshot = ?,
|
||||
presentation_snapshot = ?, presentation_mode_snapshot = ?,
|
||||
presentation_source_label_snapshot = ?, presentation_source_url_snapshot = ?,
|
||||
@@ -1020,6 +1407,7 @@ export function refreshPieceUsageFromOriginal(
|
||||
)
|
||||
.run(
|
||||
source.title,
|
||||
source.output_title,
|
||||
source.duration_seconds,
|
||||
source.intro,
|
||||
source.research_text,
|
||||
@@ -1038,6 +1426,15 @@ export function refreshPieceUsageFromOriginal(
|
||||
source.presentation_provider_id,
|
||||
usageId
|
||||
);
|
||||
snapshotPieceRelations(
|
||||
database,
|
||||
usageId,
|
||||
(
|
||||
database
|
||||
.prepare('SELECT original_piece_id FROM piece_usages WHERE id = ?')
|
||||
.get(usageId) as { original_piece_id: string }
|
||||
).original_piece_id
|
||||
);
|
||||
return result;
|
||||
})();
|
||||
}
|
||||
@@ -1049,6 +1446,7 @@ export function updatePieceUsage(
|
||||
input: PieceUsageUpdate
|
||||
): MutationResult {
|
||||
const title = cleanText(input.title, 200, 'title', true);
|
||||
const outputTitle = cleanText(input.outputTitle, 300, 'output_title');
|
||||
const duration = validDuration(input.durationSeconds)!;
|
||||
const values = {
|
||||
intro: cleanText(input.intro, 50_000, 'intro'),
|
||||
@@ -1074,7 +1472,7 @@ export function updatePieceUsage(
|
||||
usageSection(database, showId, usageId);
|
||||
database
|
||||
.prepare(
|
||||
`UPDATE piece_usages SET title_snapshot = ?, intro_snapshot = ?, research_snapshot = ?,
|
||||
`UPDATE piece_usages SET title_snapshot = ?, output_title_snapshot = ?, intro_snapshot = ?, research_snapshot = ?,
|
||||
moderation_snapshot = ?, transition_snapshot = ?, presentation_snapshot = ?,
|
||||
presentation_mode_snapshot = ?, presentation_source_label_snapshot = ?,
|
||||
presentation_source_url_snapshot = ?, presentation_source_timecode_snapshot = ?,
|
||||
@@ -1085,6 +1483,7 @@ export function updatePieceUsage(
|
||||
)
|
||||
.run(
|
||||
title,
|
||||
outputTitle,
|
||||
values.intro,
|
||||
values.research,
|
||||
values.moderation,
|
||||
@@ -1104,6 +1503,55 @@ export function updatePieceUsage(
|
||||
duration,
|
||||
usageId
|
||||
);
|
||||
if (input.tools) {
|
||||
const existing = database
|
||||
.prepare('SELECT id FROM usage_tool_snapshots WHERE usage_id = ?')
|
||||
.all(usageId) as { id: string }[];
|
||||
const existingIds = new Set(existing.map((tool) => tool.id));
|
||||
if (
|
||||
input.tools.length !== existing.length ||
|
||||
input.tools.some((tool) => !existingIds.has(tool.id))
|
||||
) {
|
||||
throw new Error('INVALID_TOOLS');
|
||||
}
|
||||
const updateTool = database.prepare(
|
||||
'UPDATE usage_tool_snapshots SET work_url = ?, note = ? WHERE id = ? AND usage_id = ?'
|
||||
);
|
||||
for (const tool of input.tools) {
|
||||
const workUrl = cleanText(tool.workUrl, 2_000, 'tools');
|
||||
if (workUrl) {
|
||||
try {
|
||||
const url = new URL(workUrl);
|
||||
if (!['http:', 'https:'].includes(url.protocol) || url.username || url.password) {
|
||||
throw new Error();
|
||||
}
|
||||
} catch {
|
||||
throw new Error('INVALID_TOOLS');
|
||||
}
|
||||
}
|
||||
updateTool.run(workUrl, cleanText(tool.note, 2_000, 'tools'), tool.id, usageId);
|
||||
}
|
||||
}
|
||||
if (input.presentationMediaId !== undefined) {
|
||||
if (
|
||||
input.presentationMediaId !== null &&
|
||||
!database
|
||||
.prepare('SELECT 1 FROM usage_media_snapshots WHERE id = ? AND usage_id = ?')
|
||||
.get(input.presentationMediaId, usageId)
|
||||
) {
|
||||
throw new Error('INVALID_PRESENTATION_MEDIA');
|
||||
}
|
||||
database
|
||||
.prepare('UPDATE usage_media_snapshots SET is_presentation = 0 WHERE usage_id = ?')
|
||||
.run(usageId);
|
||||
if (input.presentationMediaId !== null) {
|
||||
database
|
||||
.prepare(
|
||||
'UPDATE usage_media_snapshots SET is_presentation = 1 WHERE id = ? AND usage_id = ?'
|
||||
)
|
||||
.run(input.presentationMediaId, usageId);
|
||||
}
|
||||
}
|
||||
return result;
|
||||
})();
|
||||
}
|
||||
@@ -1117,6 +1565,7 @@ export function removePieceUsage(
|
||||
return database.transaction(() => {
|
||||
const result = bumpShow(database, showId, expectedRevision);
|
||||
const source = usageSection(database, showId, usageId);
|
||||
requireUsagesRemovable(database, showId, [usageId]);
|
||||
database.prepare('DELETE FROM piece_usages WHERE id = ?').run(usageId);
|
||||
const ids = (
|
||||
database
|
||||
|
||||
@@ -0,0 +1,78 @@
|
||||
import { execFileSync } from 'node:child_process';
|
||||
import { mkdtempSync, rmSync } from 'node:fs';
|
||||
import { tmpdir } from 'node:os';
|
||||
import path from 'node:path';
|
||||
import { afterEach, beforeEach, describe, expect, it } from 'vitest';
|
||||
import { closeDatabase } from './database.js';
|
||||
import { createTool, listTools, updateTool } from './tools.js';
|
||||
|
||||
let directory: string;
|
||||
|
||||
beforeEach(() => {
|
||||
directory = mkdtempSync(path.join(tmpdir(), 'sendewerk-tools-test-'));
|
||||
process.env.SENDEWERK_DB_PATH = path.join(directory, 'test.sqlite');
|
||||
process.env.SENDEWERK_UPLOAD_DIR = path.join(directory, 'uploads');
|
||||
execFileSync(process.execPath, ['scripts/migrate.mjs'], { cwd: process.cwd(), env: process.env });
|
||||
execFileSync(process.execPath, ['scripts/seed.mjs'], { cwd: process.cwd(), env: process.env });
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
closeDatabase();
|
||||
delete process.env.SENDEWERK_DB_PATH;
|
||||
delete process.env.SENDEWERK_UPLOAD_DIR;
|
||||
rmSync(directory, { recursive: true, force: true });
|
||||
});
|
||||
|
||||
describe('tool catalog', () => {
|
||||
it('validates, classifies and deactivates tools without deleting them', () => {
|
||||
const id = createTool({
|
||||
name: 'Tierlist',
|
||||
startUrl: 'https://example.com/tierlist',
|
||||
description: 'Gemeinsames Ranking',
|
||||
iconName: 'ranking-star',
|
||||
isActive: true,
|
||||
formatIds: ['format-quiz']
|
||||
});
|
||||
expect(listTools()).toEqual([
|
||||
{
|
||||
id,
|
||||
name: 'Tierlist',
|
||||
startUrl: 'https://example.com/tierlist',
|
||||
description: 'Gemeinsames Ranking',
|
||||
iconName: 'ranking-star',
|
||||
isActive: true,
|
||||
formatIds: ['format-quiz']
|
||||
}
|
||||
]);
|
||||
updateTool(id, {
|
||||
name: 'Tierlist',
|
||||
startUrl: '',
|
||||
description: '',
|
||||
iconName: 'list-ol',
|
||||
isActive: false,
|
||||
formatIds: []
|
||||
});
|
||||
expect(listTools()).toEqual([]);
|
||||
expect(listTools(true)[0]).toMatchObject({ id, iconName: 'list-ol', isActive: false });
|
||||
expect(() =>
|
||||
createTool({
|
||||
name: 'Unsicher',
|
||||
startUrl: 'javascript:alert(1)',
|
||||
description: '',
|
||||
iconName: 'wrench',
|
||||
isActive: true,
|
||||
formatIds: []
|
||||
})
|
||||
).toThrow('INVALID_TOOL_URL');
|
||||
expect(() =>
|
||||
createTool({
|
||||
name: 'Unbekanntes Icon',
|
||||
startUrl: '',
|
||||
description: '',
|
||||
iconName: 'kein-font-awesome-icon',
|
||||
isActive: true,
|
||||
formatIds: []
|
||||
})
|
||||
).toThrow('INVALID_ICON');
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,156 @@
|
||||
import { randomUUID } from 'node:crypto';
|
||||
import { classicRegularIconNames } from '#lib/icons/classic-regular.js';
|
||||
import { getDatabase } from './database.js';
|
||||
|
||||
export type Tool = {
|
||||
id: string;
|
||||
name: string;
|
||||
startUrl: string;
|
||||
description: string;
|
||||
iconName: string;
|
||||
isActive: boolean;
|
||||
formatIds: string[];
|
||||
};
|
||||
|
||||
export type ToolInput = Omit<Tool, 'id'>;
|
||||
|
||||
function clean(value: unknown, maximum: number, required = false) {
|
||||
const text = String(value ?? '').trim();
|
||||
if (text.length > maximum || (required && !text)) throw new Error('INVALID_TOOL');
|
||||
return text;
|
||||
}
|
||||
|
||||
function validUrl(value: string) {
|
||||
if (!value) return '';
|
||||
try {
|
||||
const url = new URL(value);
|
||||
if (!['http:', 'https:'].includes(url.protocol) || url.username || url.password)
|
||||
throw new Error();
|
||||
return url.href;
|
||||
} catch {
|
||||
throw new Error('INVALID_TOOL_URL');
|
||||
}
|
||||
}
|
||||
|
||||
function validated(input: ToolInput): ToolInput {
|
||||
const formatIds = [...new Set(input.formatIds.filter(Boolean))];
|
||||
if (formatIds.length > 30) throw new Error('INVALID_TOOL');
|
||||
if (formatIds.length) {
|
||||
const placeholders = formatIds.map(() => '?').join(', ');
|
||||
const row = getDatabase()
|
||||
.prepare(`SELECT count(*) AS count FROM formats WHERE id IN (${placeholders})`)
|
||||
.get(...formatIds) as { count: number };
|
||||
if (row.count !== formatIds.length) throw new Error('INVALID_TOOL_FORMAT');
|
||||
}
|
||||
return {
|
||||
name: clean(input.name, 120, true),
|
||||
startUrl: validUrl(clean(input.startUrl, 2_000)),
|
||||
description: clean(input.description, 2_000),
|
||||
iconName: (() => {
|
||||
const iconName = clean(input.iconName, 120, true);
|
||||
if (!classicRegularIconNames.has(iconName)) throw new Error('INVALID_ICON');
|
||||
return iconName;
|
||||
})(),
|
||||
isActive: Boolean(input.isActive),
|
||||
formatIds
|
||||
};
|
||||
}
|
||||
|
||||
export function listTools(includeInactive = false): Tool[] {
|
||||
const database = getDatabase();
|
||||
const rows = database
|
||||
.prepare(
|
||||
`SELECT id, name, start_url, description, icon_name, is_active FROM tools
|
||||
${includeInactive ? '' : 'WHERE is_active = 1'} ORDER BY is_active DESC, name`
|
||||
)
|
||||
.all() as {
|
||||
id: string;
|
||||
name: string;
|
||||
start_url: string;
|
||||
description: string;
|
||||
icon_name: string;
|
||||
is_active: number;
|
||||
}[];
|
||||
const formats = database.prepare(
|
||||
'SELECT format_id FROM tool_formats WHERE tool_id = ? ORDER BY format_id'
|
||||
);
|
||||
return rows.map((row) => ({
|
||||
id: row.id,
|
||||
name: row.name,
|
||||
startUrl: row.start_url,
|
||||
description: row.description,
|
||||
iconName: row.icon_name,
|
||||
isActive: row.is_active === 1,
|
||||
formatIds: (formats.all(row.id) as { format_id: string }[]).map((item) => item.format_id)
|
||||
}));
|
||||
}
|
||||
|
||||
function replaceFormats(toolId: string, formatIds: string[]) {
|
||||
const database = getDatabase();
|
||||
database.prepare('DELETE FROM tool_formats WHERE tool_id = ?').run(toolId);
|
||||
const insert = database.prepare('INSERT INTO tool_formats (tool_id, format_id) VALUES (?, ?)');
|
||||
for (const formatId of formatIds) insert.run(toolId, formatId);
|
||||
}
|
||||
|
||||
export function createTool(rawInput: ToolInput) {
|
||||
const input = validated(rawInput);
|
||||
const database = getDatabase();
|
||||
const id = randomUUID();
|
||||
const now = new Date().toISOString();
|
||||
try {
|
||||
database.transaction(() => {
|
||||
database
|
||||
.prepare(
|
||||
`INSERT INTO tools (id, name, start_url, description, icon_name, is_active, created_at_utc, updated_at_utc)
|
||||
VALUES (?, ?, ?, ?, ?, ?, ?, ?)`
|
||||
)
|
||||
.run(
|
||||
id,
|
||||
input.name,
|
||||
input.startUrl,
|
||||
input.description,
|
||||
input.iconName,
|
||||
input.isActive ? 1 : 0,
|
||||
now,
|
||||
now
|
||||
);
|
||||
replaceFormats(id, input.formatIds);
|
||||
})();
|
||||
} catch (cause) {
|
||||
if (cause instanceof Error && cause.message.includes('UNIQUE')) {
|
||||
throw new Error('TOOL_EXISTS', { cause });
|
||||
}
|
||||
throw cause;
|
||||
}
|
||||
return id;
|
||||
}
|
||||
|
||||
export function updateTool(id: string, rawInput: ToolInput) {
|
||||
const input = validated(rawInput);
|
||||
const database = getDatabase();
|
||||
try {
|
||||
database.transaction(() => {
|
||||
const result = database
|
||||
.prepare(
|
||||
`UPDATE tools SET name = ?, start_url = ?, description = ?, icon_name = ?, is_active = ?, updated_at_utc = ?
|
||||
WHERE id = ?`
|
||||
)
|
||||
.run(
|
||||
input.name,
|
||||
input.startUrl,
|
||||
input.description,
|
||||
input.iconName,
|
||||
input.isActive ? 1 : 0,
|
||||
new Date().toISOString(),
|
||||
id
|
||||
);
|
||||
if (result.changes !== 1) throw new Error('NOT_FOUND');
|
||||
replaceFormats(id, input.formatIds);
|
||||
})();
|
||||
} catch (cause) {
|
||||
if (cause instanceof Error && cause.message.includes('UNIQUE')) {
|
||||
throw new Error('TOOL_EXISTS', { cause });
|
||||
}
|
||||
throw cause;
|
||||
}
|
||||
}
|
||||
@@ -3,6 +3,7 @@
|
||||
import { resolve } from '$app/paths';
|
||||
import { page } from '$app/state';
|
||||
import NavIcon from '#lib/components/NavIcon.svelte';
|
||||
import AppIcon from '#lib/components/AppIcon.svelte';
|
||||
import ThemeToggle from '#lib/components/ThemeToggle.svelte';
|
||||
|
||||
let { children, data } = $props();
|
||||
@@ -84,7 +85,9 @@
|
||||
<span>Sendewerk</span>
|
||||
</a>
|
||||
<form method="POST" action="/logout">
|
||||
<button class="mobile-logout" type="submit" aria-label="Abmelden">↗</button>
|
||||
<button class="mobile-logout" type="submit" aria-label="Abmelden"
|
||||
><AppIcon name="right-from-bracket" /></button
|
||||
>
|
||||
</form>
|
||||
<ThemeToggle />
|
||||
</header>
|
||||
|
||||
@@ -1,11 +1,17 @@
|
||||
import { fail } from '@sveltejs/kit';
|
||||
import type { Actions, PageServerLoad } from './$types';
|
||||
import { requireUser } from '#lib/server/auth.js';
|
||||
import { listPieces, setPieceArchived } from '#lib/server/content.js';
|
||||
import { listPieces, setPieceArchived, setPieceDeleted } from '#lib/server/content.js';
|
||||
|
||||
export const load: PageServerLoad = ({ locals }) => {
|
||||
requireUser(locals.user);
|
||||
return { pieces: listPieces({ statuses: ['archived'] }) };
|
||||
return {
|
||||
pieces: listPieces({ statuses: ['archived'] }),
|
||||
deletedPieces: listPieces({
|
||||
statuses: ['inbox', 'preparing', 'ready', 'archived'],
|
||||
deleted: true
|
||||
})
|
||||
};
|
||||
};
|
||||
|
||||
export const actions = {
|
||||
@@ -18,5 +24,15 @@ export const actions = {
|
||||
} catch {
|
||||
return fail(409, { error: 'Das Piece wurde inzwischen geändert. Bitte Seite neu laden.' });
|
||||
}
|
||||
},
|
||||
restoreDeleted: async ({ locals, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
try {
|
||||
setPieceDeleted(String(data.get('pieceId') || ''), Number(data.get('revision')), false);
|
||||
return { success: 'Gelöschtes Piece wurde wiederhergestellt.' };
|
||||
} catch {
|
||||
return fail(409, { error: 'Das Piece wurde inzwischen geändert. Bitte Seite neu laden.' });
|
||||
}
|
||||
}
|
||||
} satisfies Actions;
|
||||
@@ -1,4 +1,5 @@
|
||||
<script lang="ts">
|
||||
import AppIcon from '#lib/components/AppIcon.svelte';
|
||||
import type { PageProps } from './$types';
|
||||
let { data, form }: PageProps = $props();
|
||||
</script>
|
||||
@@ -28,8 +29,29 @@
|
||||
</article>{/each}
|
||||
</div>
|
||||
{:else}<section class="quiet-panel planned-panel">
|
||||
<div class="planned-icon" aria-hidden="true">□</div>
|
||||
<div class="planned-icon" aria-hidden="true"><AppIcon name="box-archive" /></div>
|
||||
<h2>Keine Pieces archiviert</h2>
|
||||
<p>Archivierte Inhalte lassen sich hier später wiederherstellen.</p>
|
||||
</section>{/if}
|
||||
<section class="deleted-pieces" aria-labelledby="deleted-pieces-title">
|
||||
<h2 id="deleted-pieces-title">Gelöschte Pieces</h2>
|
||||
<p class="quiet-copy">
|
||||
Diese Einträge bleiben wiederherstellbar; bestehende Sendungsfassungen werden nicht verändert.
|
||||
</p>
|
||||
{#if data.deletedPieces.length}<div class="archive-list">
|
||||
{#each data.deletedPieces as piece (piece.id)}<article>
|
||||
<div>
|
||||
<h2>{piece.title}</h2>
|
||||
{#if piece.summary}<p>{piece.summary}</p>{/if}
|
||||
</div>
|
||||
<form method="POST" action="?/restoreDeleted">
|
||||
<input type="hidden" name="pieceId" value={piece.id} /><input
|
||||
type="hidden"
|
||||
name="revision"
|
||||
value={piece.revision}
|
||||
/><button class="secondary-button" type="submit">Wiederherstellen</button>
|
||||
</form>
|
||||
</article>{/each}
|
||||
</div>{:else}<p class="context-empty">Keine gelöschten Pieces.</p>{/if}
|
||||
</section>
|
||||
</div>
|
||||
@@ -1,7 +1,7 @@
|
||||
import { fail, redirect } from '@sveltejs/kit';
|
||||
import { fail } from '@sveltejs/kit';
|
||||
import type { Actions, PageServerLoad } from './$types';
|
||||
import { requireUser } from '#lib/server/auth.js';
|
||||
import { captureInbox, listPieces } from '#lib/server/content.js';
|
||||
import { captureInbox, listPieces, setPieceDeleted } from '#lib/server/content.js';
|
||||
|
||||
export const load: PageServerLoad = ({ locals }) => {
|
||||
requireUser(locals.user);
|
||||
@@ -12,9 +12,9 @@ export const actions = {
|
||||
capture: async ({ locals, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
let id: string;
|
||||
try {
|
||||
id = captureInbox(String(data.get('title') || ''), String(data.get('url') || ''));
|
||||
const id = captureInbox(String(data.get('title') || ''), String(data.get('url') || ''));
|
||||
return { captured: true, capturedId: id };
|
||||
} catch (cause) {
|
||||
const code = cause instanceof Error ? cause.message : '';
|
||||
return fail(400, {
|
||||
@@ -26,6 +26,15 @@ export const actions = {
|
||||
: 'Ein Titel ist erforderlich.'
|
||||
});
|
||||
}
|
||||
redirect(303, `/fundus/${id}`);
|
||||
},
|
||||
delete: async ({ locals, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
try {
|
||||
setPieceDeleted(String(data.get('pieceId') || ''), Number(data.get('revision')), true);
|
||||
return { deleted: true };
|
||||
} catch {
|
||||
return fail(409, { error: 'Das Piece wurde inzwischen geändert. Bitte neu laden.' });
|
||||
}
|
||||
}
|
||||
} satisfies Actions;
|
||||
@@ -1,5 +1,6 @@
|
||||
<script lang="ts">
|
||||
import { resolve } from '$app/paths';
|
||||
import AppIcon from '#lib/components/AppIcon.svelte';
|
||||
import type { PageProps } from './$types';
|
||||
let { data, form }: PageProps = $props();
|
||||
</script>
|
||||
@@ -17,11 +18,14 @@
|
||||
<h2>Was soll nicht verloren gehen?</h2>
|
||||
</div>
|
||||
{#if form?.error}<div class="form-message error" role="alert">{form.error}</div>{/if}
|
||||
{#if form?.captured}<div class="form-message success" role="status">
|
||||
Im Eingang gespeichert.
|
||||
<a href={resolve('/fundus/[id]', { id: form.capturedId })}>Jetzt ausarbeiten</a>
|
||||
</div>{/if}
|
||||
<form method="POST" action="?/capture" class="capture-form">
|
||||
<label
|
||||
>Titel oder Gedanke<input
|
||||
>Gedanke <span>optional bei URL</span><input
|
||||
name="title"
|
||||
required
|
||||
maxlength="200"
|
||||
value={form?.title ?? ''}
|
||||
placeholder="Kurze Idee festhalten"
|
||||
@@ -36,24 +40,43 @@
|
||||
placeholder="https://…"
|
||||
/></label
|
||||
>
|
||||
<button class="primary-button" type="submit">Aufnehmen und öffnen</button>
|
||||
<button class="primary-button" type="submit">Im Eingang ablegen</button>
|
||||
</form>
|
||||
</section>
|
||||
{#if data.pieces.length}
|
||||
<section class="inbox-list">
|
||||
<h2>{data.pieces.length} {data.pieces.length === 1 ? 'offener Inhalt' : 'offene Inhalte'}</h2>
|
||||
{#each data.pieces as piece (piece.id)}<a
|
||||
class="inbox-item"
|
||||
href={resolve('/fundus/[id]', { id: piece.id })}
|
||||
><span
|
||||
><strong>{piece.title}</strong><small
|
||||
>{piece.sourceCount ? `${piece.sourceCount} Quelle` : 'Gedanke ohne Link'}</small
|
||||
></span
|
||||
><span>Ausarbeiten →</span></a
|
||||
>{/each}
|
||||
{#each data.pieces as piece (piece.id)}<article class="inbox-item">
|
||||
<a href={resolve('/fundus/[id]', { id: piece.id })}
|
||||
><span
|
||||
><strong>{piece.title}</strong><small
|
||||
>{piece.sourceCount ? `${piece.sourceCount} Quelle` : 'Gedanke ohne Link'}</small
|
||||
></span
|
||||
><span>Ausarbeiten <AppIcon name="arrow-right" /></span></a
|
||||
>
|
||||
<details class="piece-actions">
|
||||
<summary aria-label={`Aktionen für ${piece.title}`}><AppIcon name="ellipsis" /></summary
|
||||
>
|
||||
<div class="piece-actions-popover">
|
||||
<form
|
||||
method="POST"
|
||||
action="?/delete"
|
||||
onsubmit={(event) =>
|
||||
!confirm(`„${piece.title}“ löschen?`) && event.preventDefault()}
|
||||
>
|
||||
<input type="hidden" name="pieceId" value={piece.id} /><input
|
||||
type="hidden"
|
||||
name="revision"
|
||||
value={piece.revision}
|
||||
/>
|
||||
<button class="text-button danger-text" type="submit">Piece löschen</button>
|
||||
</form>
|
||||
</div>
|
||||
</details>
|
||||
</article>{/each}
|
||||
</section>
|
||||
{:else}<section class="quiet-panel planned-panel">
|
||||
<div class="planned-icon" aria-hidden="true">＋</div>
|
||||
<div class="planned-icon" aria-hidden="true"><AppIcon name="plus" /></div>
|
||||
<h2>Eingang ist leer</h2>
|
||||
<p>Neue Gedanken und Links können oben direkt aufgenommen werden.</p>
|
||||
</section>{/if}
|
||||
|
||||
@@ -3,12 +3,14 @@ import type { Actions, PageServerLoad } from './$types';
|
||||
import { requireUser } from '#lib/server/auth.js';
|
||||
import {
|
||||
createPiece,
|
||||
deletePieceTemplate,
|
||||
duplicatePiece,
|
||||
getTaxonomy,
|
||||
listPieces,
|
||||
pieceTemplates,
|
||||
listPieceTemplates,
|
||||
setPieceArchived,
|
||||
type PieceTemplateId
|
||||
setPieceDeleted,
|
||||
setPieceFavorite
|
||||
} from '#lib/server/content.js';
|
||||
import { getPieceUsageContexts } from '#lib/server/shows.js';
|
||||
|
||||
@@ -39,7 +41,7 @@ export const load: PageServerLoad = ({ locals, url }) => {
|
||||
return {
|
||||
pieces: pieces.map((piece) => ({ ...piece, ...usageContexts[piece.id] })),
|
||||
taxonomy: getTaxonomy(),
|
||||
templates: pieceTemplates,
|
||||
templates: listPieceTemplates(),
|
||||
filters
|
||||
};
|
||||
};
|
||||
@@ -57,12 +59,22 @@ export const actions = {
|
||||
const data = await request.formData();
|
||||
let id: string;
|
||||
try {
|
||||
id = createPiece(String(data.get('template') || 'blank') as PieceTemplateId);
|
||||
id = createPiece(String(data.get('template') || 'blank'));
|
||||
} catch (cause) {
|
||||
return fail(400, { intent: 'create', error: actionError(cause) });
|
||||
}
|
||||
redirect(303, `/fundus/${id}`);
|
||||
},
|
||||
deleteTemplate: async ({ locals, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
try {
|
||||
deletePieceTemplate(String(data.get('templateId') || ''), Number(data.get('revision')));
|
||||
return { intent: 'deleteTemplate', success: 'Vorlage gelöscht.' };
|
||||
} catch (cause) {
|
||||
return fail(409, { intent: 'deleteTemplate', error: actionError(cause) });
|
||||
}
|
||||
},
|
||||
duplicate: async ({ locals, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
@@ -83,5 +95,28 @@ export const actions = {
|
||||
} catch (cause) {
|
||||
return fail(409, { intent: 'archive', error: actionError(cause) });
|
||||
}
|
||||
},
|
||||
favorite: async ({ locals, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
try {
|
||||
setPieceFavorite(String(data.get('pieceId') || ''), data.get('favorite') === '1');
|
||||
return { intent: 'favorite', success: 'Favorit aktualisiert.' };
|
||||
} catch (cause) {
|
||||
return fail(404, { intent: 'favorite', error: actionError(cause) });
|
||||
}
|
||||
},
|
||||
delete: async ({ locals, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
try {
|
||||
setPieceDeleted(String(data.get('pieceId') || ''), Number(data.get('revision')), true);
|
||||
return {
|
||||
intent: 'delete',
|
||||
success: 'Piece gelöscht. Bestehende Sendungsfassungen bleiben erhalten.'
|
||||
};
|
||||
} catch (cause) {
|
||||
return fail(409, { intent: 'delete', error: actionError(cause) });
|
||||
}
|
||||
}
|
||||
} satisfies Actions;
|
||||
+179
-111
@@ -1,9 +1,11 @@
|
||||
<script lang="ts">
|
||||
import { enhance } from '$app/forms';
|
||||
import { goto, replaceState } from '$app/navigation';
|
||||
import { resolve } from '$app/paths';
|
||||
import { page } from '$app/state';
|
||||
import { onMount, untrack } from 'svelte';
|
||||
import PieceUsageHistory from '#lib/components/PieceUsageHistory.svelte';
|
||||
import AppIcon from '#lib/components/AppIcon.svelte';
|
||||
import { formatClock } from '#lib/format.js';
|
||||
import type { PageProps } from './$types';
|
||||
|
||||
@@ -13,7 +15,7 @@
|
||||
let visiblePieces = $derived(
|
||||
data.pieces.filter(
|
||||
(piece) =>
|
||||
(showUsedPieces || piece.sentHistory.length === 0) &&
|
||||
(showUsedPieces || piece.sentHistory.length === 0 || piece.isFavorite) &&
|
||||
(showPlannedPieces || !piece.isPlannedInActiveShow)
|
||||
)
|
||||
);
|
||||
@@ -59,101 +61,134 @@
|
||||
<h1>Fundus</h1>
|
||||
<p class="page-intro">Vorbereitete Inhalte für kommende Sendungen.</p>
|
||||
</div>
|
||||
<div class="heading-stat" aria-label={`${visiblePieces.length} gefundene Inhalte`}>
|
||||
<strong>{visiblePieces.length}</strong><span>Inhalte</span>
|
||||
<div class="fundus-heading-actions">
|
||||
<div class="heading-stat" aria-label={`${visiblePieces.length} gefundene Inhalte`}>
|
||||
<strong>{visiblePieces.length}</strong><span>Inhalte</span>
|
||||
</div>
|
||||
<details class="template-picker">
|
||||
<summary><AppIcon name="plus" /> Neues Piece</summary>
|
||||
<div class="template-popover">
|
||||
<div class="template-grid">
|
||||
{#each data.templates as template (template.id)}
|
||||
<form method="POST" action="?/create">
|
||||
<input type="hidden" name="template" value={template.id} />
|
||||
<button type="submit"
|
||||
><AppIcon name={template.iconName} size="1.35rem" /><strong
|
||||
>{template.name}</strong
|
||||
><span>{template.description}</span></button
|
||||
>
|
||||
</form>
|
||||
{/each}
|
||||
</div>
|
||||
{#if data.templates.some((template) => template.id !== 'blank')}<details
|
||||
class="template-management"
|
||||
>
|
||||
<summary>Vorlagen verwalten</summary>
|
||||
{#each data.templates.filter((template) => template.id !== 'blank') as template (template.id)}
|
||||
<form
|
||||
method="POST"
|
||||
action="?/deleteTemplate"
|
||||
onsubmit={(event) =>
|
||||
!confirm(`Vorlage „${template.name}“ löschen?`) && event.preventDefault()}
|
||||
>
|
||||
<input type="hidden" name="templateId" value={template.id} />
|
||||
<input type="hidden" name="revision" value={template.revision} />
|
||||
<span>{template.name}</span>
|
||||
<button class="text-button danger-text" type="submit">Löschen</button>
|
||||
</form>
|
||||
{/each}
|
||||
</details>{/if}
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
</header>
|
||||
{#if form?.error}<div class="form-message error" role="alert">{form.error}</div>{/if}
|
||||
{#if form?.success}<div class="form-message success" role="status">{form.success}</div>{/if}
|
||||
|
||||
<details class="template-picker">
|
||||
<summary>Neues Piece anlegen</summary>
|
||||
<div class="template-grid">
|
||||
{#each data.templates as template (template.id)}
|
||||
<form method="POST" action="?/create">
|
||||
<input type="hidden" name="template" value={template.id} />
|
||||
<button type="submit"
|
||||
><strong>{template.name}</strong><span>{template.description}</span></button
|
||||
>
|
||||
</form>
|
||||
{/each}
|
||||
</div>
|
||||
</details>
|
||||
|
||||
<form
|
||||
id="library-filters"
|
||||
class="library-filters"
|
||||
method="GET"
|
||||
aria-label="Fundus durchsuchen und filtern"
|
||||
>
|
||||
<label class="search-field"
|
||||
><span aria-hidden="true">⌕</span><span class="sr-only">Fundus durchsuchen</span><input
|
||||
name="q"
|
||||
type="search"
|
||||
value={data.filters.query}
|
||||
placeholder="Titel, Quelle oder Thema suchen"
|
||||
/></label
|
||||
>
|
||||
<label
|
||||
><span>Status</span><select name="status"
|
||||
><option value="">Alle</option><option
|
||||
value="ready"
|
||||
selected={data.filters.status === 'ready'}>Sendefertig</option
|
||||
><option value="preparing" selected={data.filters.status === 'preparing'}>In Arbeit</option
|
||||
></select
|
||||
></label
|
||||
>
|
||||
<label
|
||||
><span>Format</span><select name="format"
|
||||
><option value="">Alle</option>{#each data.taxonomy.formats as item (item.id)}<option
|
||||
value={item.id}
|
||||
selected={data.filters.formatId === item.id}>{item.name}</option
|
||||
>{/each}</select
|
||||
></label
|
||||
>
|
||||
<label
|
||||
><span>Thema</span><select name="topic"
|
||||
><option value="">Alle</option>{#each data.taxonomy.topics as item (item.id)}<option
|
||||
value={item.id}
|
||||
selected={data.filters.topicId === item.id}>{item.name}</option
|
||||
>{/each}</select
|
||||
></label
|
||||
>
|
||||
<label
|
||||
><span>Abschnitt</span><select name="category"
|
||||
><option value="">Alle</option>{#each data.taxonomy.categories as item (item.id)}<option
|
||||
value={item.id}
|
||||
selected={data.filters.categoryId === item.id}>{item.name}</option
|
||||
>{/each}</select
|
||||
></label
|
||||
>
|
||||
<button class="secondary-button" type="submit">Anwenden</button>
|
||||
<button class="text-button" type="button" onclick={resetFilters}>Zurücksetzen</button>
|
||||
<div class="fundus-search-row">
|
||||
<label class="search-field"
|
||||
><AppIcon name="magnifying-glass" /><span class="sr-only">Fundus durchsuchen</span><input
|
||||
name="q"
|
||||
type="search"
|
||||
value={data.filters.query}
|
||||
placeholder="Titel, Quelle oder Thema suchen"
|
||||
/></label
|
||||
>
|
||||
<button class="secondary-button" type="submit">Suchen</button>
|
||||
<details class="filter-picker">
|
||||
<summary><AppIcon name="list-check" /> Weitere Filter</summary>
|
||||
<div class="filter-panel">
|
||||
<label
|
||||
><span>Status</span><select name="status"
|
||||
><option value="">Alle</option><option
|
||||
value="ready"
|
||||
selected={data.filters.status === 'ready'}>Sendefertig</option
|
||||
><option value="preparing" selected={data.filters.status === 'preparing'}
|
||||
>In Arbeit</option
|
||||
></select
|
||||
></label
|
||||
>
|
||||
<label
|
||||
><span>Format</span><select name="format"
|
||||
><option value="">Alle</option>{#each data.taxonomy.formats as item (item.id)}<option
|
||||
value={item.id}
|
||||
selected={data.filters.formatId === item.id}>{item.name}</option
|
||||
>{/each}</select
|
||||
></label
|
||||
>
|
||||
<label
|
||||
><span>Thema</span><select name="topic"
|
||||
><option value="">Alle</option>{#each data.taxonomy.topics as item (item.id)}<option
|
||||
value={item.id}
|
||||
selected={data.filters.topicId === item.id}>{item.name}</option
|
||||
>{/each}</select
|
||||
></label
|
||||
>
|
||||
<label
|
||||
><span>Abschnitt</span><select name="category"
|
||||
><option value="">Alle</option
|
||||
>{#each data.taxonomy.categories as item (item.id)}<option
|
||||
value={item.id}
|
||||
selected={data.filters.categoryId === item.id}>{item.name}</option
|
||||
>{/each}</select
|
||||
></label
|
||||
>
|
||||
<div class="library-filter-options" aria-label="Fundusauswahl erweitern">
|
||||
<label class="filter-checkbox">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="includeUsed"
|
||||
value="1"
|
||||
checked={showUsedPieces}
|
||||
onchange={(event) => setSourceFilter('includeUsed', event.currentTarget.checked)}
|
||||
/>
|
||||
<span>Auch verwendete Inhalte zeigen</span>
|
||||
</label>
|
||||
<label class="filter-checkbox">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="includePlanned"
|
||||
value="1"
|
||||
checked={showPlannedPieces}
|
||||
onchange={(event) => setSourceFilter('includePlanned', event.currentTarget.checked)}
|
||||
/>
|
||||
<span>Auch eingeplante Inhalte zeigen</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="filter-actions">
|
||||
<button class="secondary-button" type="submit">Filter anwenden</button>
|
||||
<button class="text-button" type="button" onclick={resetFilters}>Zurücksetzen</button>
|
||||
</div>
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
</form>
|
||||
<div class="library-filter-options" aria-label="Fundusauswahl erweitern">
|
||||
<label class="filter-checkbox">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="includeUsed"
|
||||
value="1"
|
||||
form="library-filters"
|
||||
checked={showUsedPieces}
|
||||
onchange={(event) => setSourceFilter('includeUsed', event.currentTarget.checked)}
|
||||
/>
|
||||
<span>Auch verwendete Inhalte zeigen</span>
|
||||
</label>
|
||||
<label class="filter-checkbox">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="includePlanned"
|
||||
value="1"
|
||||
form="library-filters"
|
||||
checked={showPlannedPieces}
|
||||
onchange={(event) => setSourceFilter('includePlanned', event.currentTarget.checked)}
|
||||
/>
|
||||
<span>Auch eingeplante Inhalte zeigen</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
{#if visiblePieces.length}
|
||||
<div class="piece-grid">
|
||||
@@ -162,16 +197,29 @@
|
||||
class="piece-card"
|
||||
style={`--category: ${piece.categories[0]?.color ?? '#8b8f98'}`}
|
||||
>
|
||||
<form method="POST" action="?/favorite" class="piece-favorite-form" use:enhance>
|
||||
<input type="hidden" name="pieceId" value={piece.id} />
|
||||
<input type="hidden" name="favorite" value={piece.isFavorite ? '0' : '1'} />
|
||||
<button
|
||||
class="piece-favorite"
|
||||
class:active={piece.isFavorite}
|
||||
type="submit"
|
||||
aria-label={piece.isFavorite
|
||||
? `${piece.title} aus Favoriten entfernen`
|
||||
: `${piece.title} als Favorit markieren`}
|
||||
aria-pressed={piece.isFavorite}><AppIcon name="star" /></button
|
||||
>
|
||||
</form>
|
||||
{#if piece.mediaId}<img
|
||||
class="piece-thumbnail"
|
||||
src={`/media/${piece.mediaId}`}
|
||||
alt=""
|
||||
/>{:else}<span class="piece-thumbnail piece-thumbnail-placeholder" aria-hidden="true"
|
||||
>S</span
|
||||
>{/if}
|
||||
/>{:else}<span class="piece-thumbnail piece-thumbnail-placeholder" aria-hidden="true">
|
||||
<AppIcon name={piece.topics[0]?.iconName || 'newspaper'} size="2rem" />
|
||||
</span>{/if}
|
||||
<div class="piece-primary">
|
||||
<h2><a href={resolve('/fundus/[id]', { id: piece.id })}>{piece.title}</a></h2>
|
||||
<p>{piece.summary || 'Noch keine Kurzbeschreibung.'}</p>
|
||||
{#if piece.summary}<p>{piece.summary}</p>{/if}
|
||||
<PieceUsageHistory history={piece.sentHistory} />
|
||||
</div>
|
||||
<div class="piece-classification">
|
||||
@@ -179,42 +227,62 @@
|
||||
><i></i>{piece.categories.map((item) => item.name).join(', ') || 'Offen'}</span
|
||||
>
|
||||
<div class="piece-tags">
|
||||
<span>{piece.format}</span>{#each piece.topics as topic (topic.id)}<span
|
||||
>{topic.name}</span
|
||||
>{/each}
|
||||
{#if piece.formatId}<span>{piece.format}</span
|
||||
>{/if}{#each piece.topics as topic (topic.id)}<span>{topic.name}</span>{/each}
|
||||
</div>
|
||||
</div>
|
||||
<div class="piece-state">
|
||||
<span class:ready={piece.status === 'ready'} class="status-label"
|
||||
>{statusLabel[piece.status]}</span
|
||||
><span class="piece-facts"
|
||||
><span><b>{formatClock(piece.durationSeconds)}</b> geplant</span><span
|
||||
>{piece.sourceCount} {piece.sourceCount === 1 ? 'Quelle' : 'Quellen'}</span
|
||||
></span
|
||||
>{#if piece.durationSeconds || piece.sourceCount}<span class="piece-facts"
|
||||
>{#if piece.durationSeconds}<span
|
||||
><b>{formatClock(piece.durationSeconds)}</b> geplant</span
|
||||
>{/if}{#if piece.sourceCount}<span
|
||||
>{piece.sourceCount} {piece.sourceCount === 1 ? 'Quelle' : 'Quellen'}</span
|
||||
>{/if}</span
|
||||
>{/if}
|
||||
>
|
||||
</div>
|
||||
<div class="piece-actions">
|
||||
<a class="text-link" href={resolve('/fundus/[id]', { id: piece.id })}>Bearbeiten</a>
|
||||
<form method="POST" action="?/duplicate">
|
||||
<input type="hidden" name="pieceId" value={piece.id} /><button
|
||||
class="text-button"
|
||||
type="submit">Duplizieren</button
|
||||
<details class="piece-actions">
|
||||
<summary aria-label={`Aktionen für ${piece.title}`}><AppIcon name="ellipsis" /></summary
|
||||
>
|
||||
<div class="piece-actions-popover">
|
||||
<form method="POST" action="?/duplicate">
|
||||
<input type="hidden" name="pieceId" value={piece.id} /><button
|
||||
class="text-button"
|
||||
type="submit">Duplizieren</button
|
||||
>
|
||||
</form>
|
||||
<form method="POST" action="?/archive">
|
||||
<input type="hidden" name="pieceId" value={piece.id} /><input
|
||||
type="hidden"
|
||||
name="revision"
|
||||
value={piece.revision}
|
||||
/><button class="text-button danger-text" type="submit">Archivieren</button>
|
||||
</form>
|
||||
<form
|
||||
method="POST"
|
||||
action="?/delete"
|
||||
onsubmit={(event) =>
|
||||
!confirm(
|
||||
`Piece „${piece.title}“ löschen? Bestehende Sendungsfassungen bleiben erhalten.`
|
||||
) && event.preventDefault()}
|
||||
>
|
||||
</form>
|
||||
<form method="POST" action="?/archive">
|
||||
<input type="hidden" name="pieceId" value={piece.id} /><input
|
||||
type="hidden"
|
||||
name="revision"
|
||||
value={piece.revision}
|
||||
/><button class="text-button danger-text" type="submit">Archivieren</button>
|
||||
</form>
|
||||
</div>
|
||||
<input type="hidden" name="pieceId" value={piece.id} /><input
|
||||
type="hidden"
|
||||
name="revision"
|
||||
value={piece.revision}
|
||||
/>
|
||||
<button class="text-button danger-text" type="submit">Piece löschen</button>
|
||||
</form>
|
||||
</div>
|
||||
</details>
|
||||
</article>
|
||||
{/each}
|
||||
</div>
|
||||
{:else}
|
||||
<div class="empty-state">
|
||||
<span aria-hidden="true">⌕</span>
|
||||
<span aria-hidden="true"><AppIcon name="magnifying-glass" /></span>
|
||||
<h2>Kein passendes Piece</h2>
|
||||
<p>Andere Filter wählen oder ein neues Piece anlegen.</p>
|
||||
<a class="secondary-button" href={resolve('/fundus')}>Filter zurücksetzen</a>
|
||||
|
||||
@@ -6,15 +6,20 @@ import {
|
||||
duplicatePiece,
|
||||
getPiece,
|
||||
getTaxonomy,
|
||||
listPieceTemplates,
|
||||
loadPiecePresentationMetadata,
|
||||
savePiece,
|
||||
savePieceAsTemplate,
|
||||
setPieceArchived,
|
||||
setPieceDeleted,
|
||||
setPieceFavorite,
|
||||
uploadPieceImage,
|
||||
type EditablePieceStatus,
|
||||
type PieceInput,
|
||||
type PieceSourceInput
|
||||
} from '#lib/server/content.js';
|
||||
import { renderMarkdown } from '#lib/server/markdown.js';
|
||||
import { listTools } from '#lib/server/tools.js';
|
||||
|
||||
function renderedFields(
|
||||
piece: Pick<
|
||||
@@ -55,8 +60,12 @@ function pieceInput(data: FormData): PieceInput {
|
||||
timecodeSeconds: timecode ? Number(timecode) : null
|
||||
});
|
||||
}
|
||||
const toolIds = data.getAll('toolId').map(String);
|
||||
const toolWorkUrls = data.getAll('toolWorkUrl').map(String);
|
||||
const toolNotes = data.getAll('toolNote').map(String);
|
||||
return {
|
||||
title: text(data, 'title'),
|
||||
outputTitle: text(data, 'outputTitle'),
|
||||
summary: text(data, 'summary'),
|
||||
formatId: text(data, 'formatId') || null,
|
||||
status: text(data, 'status') as EditablePieceStatus,
|
||||
@@ -80,9 +89,15 @@ function pieceInput(data: FormData): PieceInput {
|
||||
presentationDescriptionManual: text(data, 'presentationDescriptionManual') === '1',
|
||||
presentationImageManual: text(data, 'presentationImageManual') === '1',
|
||||
presentationMetadataFetchedAtUtc: text(data, 'presentationMetadataFetchedAtUtc') || null,
|
||||
presentationMediaId: text(data, 'presentationMediaId') || null,
|
||||
topicIds: data.getAll('topicIds').map(String),
|
||||
categoryIds: data.getAll('categoryIds').map(String),
|
||||
sources
|
||||
sources,
|
||||
tools: toolIds.map((toolId, index) => ({
|
||||
toolId,
|
||||
workUrl: toolWorkUrls[index] ?? '',
|
||||
note: toolNotes[index] ?? ''
|
||||
}))
|
||||
};
|
||||
}
|
||||
|
||||
@@ -120,7 +135,13 @@ export const load: PageServerLoad = ({ locals, params }) => {
|
||||
const piece = getPiece(params.id);
|
||||
if (!piece) error(404, 'Piece nicht gefunden');
|
||||
if (piece.status === 'archived') redirect(303, '/archiv');
|
||||
return { piece, taxonomy: getTaxonomy(), rendered: renderedFields(piece) };
|
||||
return {
|
||||
piece,
|
||||
taxonomy: getTaxonomy(),
|
||||
tools: listTools(true),
|
||||
templates: listPieceTemplates().filter((template) => template.id !== 'blank'),
|
||||
rendered: renderedFields(piece)
|
||||
};
|
||||
};
|
||||
|
||||
export const actions = {
|
||||
@@ -161,6 +182,25 @@ export const actions = {
|
||||
}
|
||||
redirect(303, `/fundus/${params.id}`);
|
||||
},
|
||||
saveTemplate: async ({ locals, params, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
const reference = text(data, 'templateRef');
|
||||
const [templateId, revision] = reference.split('|');
|
||||
try {
|
||||
savePieceAsTemplate(
|
||||
params.id,
|
||||
text(data, 'templateName'),
|
||||
text(data, 'templateDescription'),
|
||||
templateId || undefined,
|
||||
revision ? Number(revision) : undefined
|
||||
);
|
||||
return { intent: 'saveTemplate', success: 'Vorlage gespeichert.' };
|
||||
} catch (cause) {
|
||||
const problem = saveError(cause);
|
||||
return fail(problem.status, { intent: 'saveTemplate', ...problem });
|
||||
}
|
||||
},
|
||||
upload: async ({ locals, params, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
@@ -168,7 +208,13 @@ export const actions = {
|
||||
if (!(image instanceof File))
|
||||
return fail(400, { intent: 'upload', error: 'Bitte ein Bild auswählen.' });
|
||||
try {
|
||||
await uploadPieceImage(params.id, Number(data.get('revision')), image, text(data, 'altText'));
|
||||
await uploadPieceImage(
|
||||
params.id,
|
||||
Number(data.get('revision')),
|
||||
image,
|
||||
text(data, 'altText'),
|
||||
data.get('selectForPresentation') === '1'
|
||||
);
|
||||
} catch (cause) {
|
||||
const code = cause instanceof Error ? cause.message : '';
|
||||
if (code === 'CONFLICT')
|
||||
@@ -216,5 +262,25 @@ export const actions = {
|
||||
return fail(409, { intent: 'archive', error: saveError(cause).error });
|
||||
}
|
||||
redirect(303, '/archiv');
|
||||
},
|
||||
favorite: async ({ locals, params, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
try {
|
||||
setPieceFavorite(params.id, data.get('favorite') === '1');
|
||||
return { intent: 'favorite', success: true };
|
||||
} catch (cause) {
|
||||
return fail(404, { intent: 'favorite', error: saveError(cause).error });
|
||||
}
|
||||
},
|
||||
delete: async ({ locals, params, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
try {
|
||||
setPieceDeleted(params.id, Number(data.get('revision')), true);
|
||||
} catch (cause) {
|
||||
return fail(409, { intent: 'delete', error: saveError(cause).error });
|
||||
}
|
||||
redirect(303, '/fundus');
|
||||
}
|
||||
} satisfies Actions;
|
||||
+560
-512
File diff suppressed because it is too large.
Load diff
@@ -1,7 +1,7 @@
|
||||
import { error } from '@sveltejs/kit';
|
||||
import type { PageServerLoad } from './$types';
|
||||
import { requireUser } from '#lib/server/auth.js';
|
||||
import { getPiece } from '#lib/server/content.js';
|
||||
import { getPiece, getTaxonomy } from '#lib/server/content.js';
|
||||
import { renderMarkdown } from '#lib/server/markdown.js';
|
||||
import { buildEmbedUrl, type PresentationContent } from '#lib/server/presentation.js';
|
||||
|
||||
@@ -18,7 +18,10 @@ export const load: PageServerLoad = ({ locals, params }) => {
|
||||
images: { id: string; altText: string }[];
|
||||
} = {
|
||||
mode: piece.presentationMode,
|
||||
title: piece.title,
|
||||
topics: getTaxonomy()
|
||||
.topics.filter((topic) => piece.topicIds.includes(topic.id))
|
||||
.map((topic) => topic.name),
|
||||
title: piece.outputTitle || piece.title,
|
||||
html: renderMarkdown(piece.presentationText),
|
||||
source,
|
||||
previewTitle: piece.presentationTitle,
|
||||
@@ -37,8 +40,10 @@ export const load: PageServerLoad = ({ locals, params }) => {
|
||||
piece.presentationProviderId,
|
||||
source?.timecodeSeconds ?? null
|
||||
),
|
||||
sources: piece.sources,
|
||||
images: piece.media.map((item) => ({ id: item.id, altText: item.altText }))
|
||||
sources: [],
|
||||
images: piece.media
|
||||
.filter((item) => item.id === piece.presentationMediaId)
|
||||
.map((item) => ({ id: item.id, altText: item.altText }))
|
||||
};
|
||||
return { pieceId: piece.id, content };
|
||||
};
|
||||
@@ -14,8 +14,10 @@
|
||||
<div class="presentation-test-status" role="status">Isolierte Testansicht</div>
|
||||
<PresentationDisplay
|
||||
content={data.content}
|
||||
imageSrc={data.content.mode === 'text'
|
||||
? '/media'
|
||||
imageSrc={data.content.images.length
|
||||
? data.content.mode === 'text'
|
||||
? '/media'
|
||||
: `/media/${data.content.images[0].id}`
|
||||
: `/fundus/${data.pieceId}/praesentation/preview-image`}
|
||||
/>
|
||||
</main>
|
||||
@@ -1,9 +1,10 @@
|
||||
import { error } from '@sveltejs/kit';
|
||||
import type { PageServerLoad } from './$types';
|
||||
import { getPresentationView } from '#lib/server/live.js';
|
||||
import { getPresentationChannelView, presentationChannelAccess } from '#lib/server/live.js';
|
||||
|
||||
export const load: PageServerLoad = ({ params }) => {
|
||||
const view = getPresentationView(params.token);
|
||||
if (!view) error(404, 'Präsentationsausgabe nicht gefunden');
|
||||
return { view };
|
||||
export const load: PageServerLoad = ({ params, cookies }) => {
|
||||
const accessKey = cookies.get(`sendewerk-output-${params.token}`) ?? '';
|
||||
const view = presentationChannelAccess(params.token, accessKey)
|
||||
? getPresentationChannelView(params.token)
|
||||
: null;
|
||||
return { view, channelId: params.token };
|
||||
};
|
||||
@@ -5,8 +5,10 @@
|
||||
import type { PageProps } from './$types';
|
||||
|
||||
let { data }: PageProps = $props();
|
||||
let view = $state(untrack(() => data.view));
|
||||
let connection = $state<'connected' | 'waiting' | 'interrupted'>('connected');
|
||||
let view = $state(untrack(() => data.view ?? { revision: -1, content: null }));
|
||||
let connection = $state<'connected' | 'waiting' | 'interrupted'>(
|
||||
untrack(() => (data.view ? 'connected' : 'waiting'))
|
||||
);
|
||||
|
||||
onMount(() => {
|
||||
let stopped = false;
|
||||
@@ -26,8 +28,22 @@
|
||||
}
|
||||
if (!stopped) timer = setTimeout(refresh, connection === 'interrupted' ? 3000 : 1000);
|
||||
}
|
||||
connection = 'waiting';
|
||||
timer = setTimeout(refresh, 500);
|
||||
async function connect() {
|
||||
const accessKey = decodeURIComponent(location.hash.slice(1));
|
||||
if (accessKey) {
|
||||
const response = await fetch(`/heinzlive/${data.channelId}/access`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ key: accessKey })
|
||||
});
|
||||
if (!response.ok) {
|
||||
connection = 'interrupted';
|
||||
return;
|
||||
}
|
||||
}
|
||||
timer = setTimeout(refresh, 0);
|
||||
}
|
||||
void connect();
|
||||
return () => {
|
||||
stopped = true;
|
||||
clearTimeout(timer);
|
||||
@@ -40,7 +56,7 @@
|
||||
<meta name="robots" content="noindex, nofollow, noarchive" />
|
||||
</svelte:head>
|
||||
|
||||
<main class="heinzlive-output">
|
||||
<main class:empty={!view.content} class="heinzlive-output">
|
||||
<div class="output-connection sr-only" class:problem={connection === 'interrupted'} role="status">
|
||||
<span></span>{connection === 'interrupted' ? 'Verbindung unterbrochen' : 'Verbunden'}
|
||||
</div>
|
||||
@@ -48,16 +64,12 @@
|
||||
{#key view.revision}
|
||||
<PresentationDisplay
|
||||
content={view.content}
|
||||
imageSrc={view.content.mode === 'text'
|
||||
? `/heinzlive/${page.params.token}/media`
|
||||
imageSrc={view.content.images.length
|
||||
? view.content.mode === 'text'
|
||||
? `/heinzlive/${page.params.token}/media`
|
||||
: `/heinzlive/${page.params.token}/media/${view.content.images[0].id}`
|
||||
: `/heinzlive/${page.params.token}/preview-image`}
|
||||
/>
|
||||
{/key}
|
||||
{:else}
|
||||
<section class="output-idle">
|
||||
<div class="brand-mark" aria-hidden="true"><i></i><i></i><i></i></div>
|
||||
<h1>Bereit für den nächsten Inhalt</h1>
|
||||
<p>Die Moderation wählt ausdrücklich aus, was hier erscheint.</p>
|
||||
</section>
|
||||
{/if}
|
||||
</main>
|
||||
@@ -0,0 +1,18 @@
|
||||
import { error, json } from '@sveltejs/kit';
|
||||
import type { RequestHandler } from './$types';
|
||||
import { presentationChannelAccess } from '#lib/server/live.js';
|
||||
|
||||
export const POST: RequestHandler = async ({ params, request, cookies, url }) => {
|
||||
const body = (await request.json().catch(() => null)) as { key?: unknown } | null;
|
||||
const accessKey = typeof body?.key === 'string' ? body.key : '';
|
||||
if (!presentationChannelAccess(params.token, accessKey)) {
|
||||
error(404, 'Präsentationsausgabe nicht gefunden');
|
||||
}
|
||||
cookies.set(`sendewerk-output-${params.token}`, accessKey, {
|
||||
path: `/heinzlive/${params.token}`,
|
||||
httpOnly: true,
|
||||
sameSite: 'strict',
|
||||
secure: url.protocol === 'https:'
|
||||
});
|
||||
return json({ success: true }, { headers: { 'Cache-Control': 'no-store' } });
|
||||
};
|
||||
@@ -1,11 +1,13 @@
|
||||
import { error } from '@sveltejs/kit';
|
||||
import type { RequestHandler } from './$types';
|
||||
import { getPresentationMedia } from '#lib/server/live.js';
|
||||
import { getPresentationMedia, presentationChannelAccess } from '#lib/server/live.js';
|
||||
|
||||
export const GET: RequestHandler = async ({ params }) => {
|
||||
const media = await getPresentationMedia(params.token, params.id);
|
||||
export const GET: RequestHandler = async ({ params, cookies }) => {
|
||||
const accessKey = cookies.get(`sendewerk-output-${params.token}`) ?? '';
|
||||
if (!presentationChannelAccess(params.token, accessKey)) error(404, 'Bild nicht gefunden');
|
||||
const media = await getPresentationMedia(accessKey, params.id);
|
||||
if (!media) error(404, 'Bild nicht gefunden');
|
||||
return new Response(media.data, {
|
||||
return new Response(new Uint8Array(media.data), {
|
||||
headers: {
|
||||
'Content-Type': media.mimeType,
|
||||
'Content-Length': String(media.byteSize),
|
||||
|
||||
@@ -1,9 +1,12 @@
|
||||
import { error } from '@sveltejs/kit';
|
||||
import type { RequestHandler } from './$types';
|
||||
import { getPresentationPreviewImage } from '#lib/server/live.js';
|
||||
import { getPresentationPreviewImage, presentationChannelAccess } from '#lib/server/live.js';
|
||||
|
||||
export const GET: RequestHandler = async ({ params }) => {
|
||||
const image = await getPresentationPreviewImage(params.token);
|
||||
export const GET: RequestHandler = async ({ params, cookies }) => {
|
||||
const accessKey = cookies.get(`sendewerk-output-${params.token}`) ?? '';
|
||||
if (!presentationChannelAccess(params.token, accessKey))
|
||||
error(404, 'Vorschaubild nicht verfügbar');
|
||||
const image = await getPresentationPreviewImage(accessKey);
|
||||
if (!image) error(404, 'Vorschaubild nicht verfügbar');
|
||||
return new Response(new Uint8Array(image.data), {
|
||||
headers: {
|
||||
|
||||
@@ -1,9 +1,12 @@
|
||||
import { error, json } from '@sveltejs/kit';
|
||||
import type { RequestHandler } from './$types';
|
||||
import { getPresentationView } from '#lib/server/live.js';
|
||||
import { getPresentationChannelView, presentationChannelAccess } from '#lib/server/live.js';
|
||||
|
||||
export const GET: RequestHandler = ({ params }) => {
|
||||
const view = getPresentationView(params.token);
|
||||
export const GET: RequestHandler = ({ params, cookies }) => {
|
||||
const accessKey = cookies.get(`sendewerk-output-${params.token}`) ?? '';
|
||||
if (!presentationChannelAccess(params.token, accessKey))
|
||||
error(404, 'Präsentationsausgabe nicht gefunden');
|
||||
const view = getPresentationChannelView(params.token);
|
||||
if (!view) error(404, 'Präsentationsausgabe nicht gefunden');
|
||||
return json(view, { headers: { 'Cache-Control': 'no-store' } });
|
||||
};
|
||||
@@ -4,11 +4,14 @@ import type { Actions, PageServerLoad } from './$types';
|
||||
import { requireUser } from '#lib/server/auth.js';
|
||||
import {
|
||||
completeCurrent,
|
||||
clearPresentationChannel,
|
||||
getLiveView,
|
||||
goBack,
|
||||
issuePresentationAccess,
|
||||
moveOpenUsage,
|
||||
presentUsage,
|
||||
rotatePresentationChannelKey,
|
||||
selectUsage,
|
||||
skipCurrent,
|
||||
startOrResumeLive
|
||||
} from '#lib/server/live.js';
|
||||
@@ -26,6 +29,8 @@ function actionError(cause: unknown) {
|
||||
error: 'Der Live-Stand wurde bereits geändert. Die Ansicht wurde erneuert.'
|
||||
};
|
||||
if (code === 'NO_CURRENT') return { status: 409, error: 'Es ist kein aktuelles Piece aktiv.' };
|
||||
if (code === 'NOT_STARTED')
|
||||
return { status: 409, error: 'Die Sendung muss vor der Auswahl gestartet werden.' };
|
||||
if (code === 'NO_PREVIOUS') return { status: 409, error: 'Es gibt kein vorheriges Piece.' };
|
||||
if (code === 'LIVE_ORDER_LOCKED')
|
||||
return {
|
||||
@@ -91,6 +96,18 @@ export const actions = {
|
||||
goBack(text(data, 'showId'), text(data, 'commandId'), Number(data.get('revision')))
|
||||
);
|
||||
},
|
||||
select: async ({ locals, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
return attempt('select', () =>
|
||||
selectUsage(
|
||||
text(data, 'showId'),
|
||||
text(data, 'usageId'),
|
||||
text(data, 'commandId'),
|
||||
Number(data.get('revision'))
|
||||
)
|
||||
);
|
||||
},
|
||||
present: async ({ locals, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
@@ -118,10 +135,25 @@ export const actions = {
|
||||
const data = await request.formData();
|
||||
try {
|
||||
const token = issuePresentationAccess(text(data, 'showId'));
|
||||
return { intent: 'createOutput', success: true, outputUrl: `/heinzlive/${token}` };
|
||||
return { intent: 'createOutput', success: true, outputUrl: `/heinzlive/default#${token}` };
|
||||
} catch (cause) {
|
||||
const problem = actionError(cause);
|
||||
return fail(problem.status, { intent: 'createOutput', ...problem });
|
||||
}
|
||||
},
|
||||
rotateOutput: async ({ locals, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
try {
|
||||
const token = rotatePresentationChannelKey(text(data, 'showId'));
|
||||
return { intent: 'rotateOutput', success: true, outputUrl: `/heinzlive/default#${token}` };
|
||||
} catch (cause) {
|
||||
const problem = actionError(cause);
|
||||
return fail(problem.status, { intent: 'rotateOutput', ...problem });
|
||||
}
|
||||
},
|
||||
clearOutput: async ({ locals }) => {
|
||||
requireUser(locals.user);
|
||||
return attempt('clearOutput', () => clearPresentationChannel());
|
||||
}
|
||||
} satisfies Actions;
|
||||
@@ -3,6 +3,7 @@
|
||||
import { resolve } from '$app/paths';
|
||||
import { onMount, untrack } from 'svelte';
|
||||
import { formatClock, formatDuration } from '#lib/format.js';
|
||||
import AppIcon from '#lib/components/AppIcon.svelte';
|
||||
import type { PageProps } from './$types';
|
||||
|
||||
let { data, form }: PageProps = $props();
|
||||
@@ -13,6 +14,7 @@
|
||||
let now = $state(Date.now());
|
||||
let loadedAt = $state(Date.now());
|
||||
let currentId = $state(untrack(() => data.live.current?.id ?? null));
|
||||
let loadedRevision = $state(untrack(() => data.live.liveRevision));
|
||||
let outputWindow: Window | null = null;
|
||||
let progress = $derived(
|
||||
data.live.totalCount ? Math.round((data.live.completedCount / data.live.totalCount) * 100) : 0
|
||||
@@ -21,11 +23,21 @@
|
||||
(data.live.current?.actualDurationSeconds ?? 0) +
|
||||
(data.live.current ? Math.max(0, Math.floor((now - loadedAt) / 1000)) : 0)
|
||||
);
|
||||
let sectionElapsedSeconds = $derived(
|
||||
(data.live.sectionTimer?.elapsedSeconds ?? 0) +
|
||||
(data.live.sectionTimer?.runningSinceUtc
|
||||
? Math.max(0, Math.floor((now - loadedAt) / 1000))
|
||||
: 0)
|
||||
);
|
||||
let sectionRemainingSeconds = $derived(
|
||||
(data.live.sectionTimer?.plannedDurationSeconds ?? 0) - sectionElapsedSeconds
|
||||
);
|
||||
|
||||
$effect(() => {
|
||||
const nextCurrentId = data.live.current?.id ?? null;
|
||||
if (nextCurrentId !== currentId) {
|
||||
if (nextCurrentId !== currentId || data.live.liveRevision !== loadedRevision) {
|
||||
currentId = nextCurrentId;
|
||||
loadedRevision = data.live.liveRevision;
|
||||
loadedAt = Date.now();
|
||||
}
|
||||
});
|
||||
@@ -73,6 +85,15 @@
|
||||
persistSettings();
|
||||
}
|
||||
|
||||
function formatCountdown(totalSeconds: number) {
|
||||
const hours = Math.floor(totalSeconds / 3600);
|
||||
const minutes = Math.floor((totalSeconds % 3600) / 60);
|
||||
const seconds = Math.floor(totalSeconds % 60);
|
||||
return hours > 0
|
||||
? `${hours}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`
|
||||
: `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
|
||||
}
|
||||
|
||||
function liveAction(name: string) {
|
||||
return `?show=${encodeURIComponent(data.live.show.id)}&/${name}`;
|
||||
}
|
||||
@@ -161,8 +182,31 @@
|
||||
</form>
|
||||
<form method="POST" action={liveAction('createOutput')} use:enhance={enhanceOutput}>
|
||||
<input type="hidden" name="showId" value={data.live.show.id} />
|
||||
<button class="secondary-button" type="submit">Präsentationsfenster öffnen</button>
|
||||
<button class="secondary-button" type="submit">Ausgabe verbinden und öffnen</button>
|
||||
</form>
|
||||
{#if data.live.presentationUsageId}<form
|
||||
method="POST"
|
||||
action={liveAction('present')}
|
||||
use:enhance={enhanceCommand}
|
||||
>
|
||||
<input type="hidden" name="showId" value={data.live.show.id} />
|
||||
<input type="hidden" name="usageId" value="" />
|
||||
<input type="hidden" name="revision" value={data.live.liveRevision} />
|
||||
<input type="hidden" name="commandId" value={data.commandId} />
|
||||
<button class="text-button" type="submit">Präsentation leeren</button>
|
||||
</form>{/if}
|
||||
<details class="live-output-settings">
|
||||
<summary>Ausgabekanal</summary>
|
||||
<div>
|
||||
<form method="POST" action={liveAction('rotateOutput')} use:enhance={enhanceOutput}>
|
||||
<input type="hidden" name="showId" value={data.live.show.id} />
|
||||
<button class="text-button" type="submit">Schlüssel widerrufen und erneuern</button>
|
||||
</form>
|
||||
<form method="POST" action={liveAction('clearOutput')} use:enhance={enhanceCommand}>
|
||||
<button class="text-button danger-text" type="submit">Ausgabekanal leeren</button>
|
||||
</form>
|
||||
</div>
|
||||
</details>
|
||||
<div class="live-session-summary">
|
||||
<strong>{data.live.completedCount} / {data.live.totalCount}</strong>
|
||||
<span>{progress}% bearbeitet</span>
|
||||
@@ -175,6 +219,21 @@
|
||||
style={`--prompt-size: ${promptSize}rem`}
|
||||
aria-labelledby="current-title"
|
||||
>
|
||||
{#if data.live.sectionTimer?.sectionId === data.live.current.sectionId}
|
||||
<section
|
||||
class:warning={sectionRemainingSeconds <= 120 && sectionRemainingSeconds >= 0}
|
||||
class:overrun={sectionRemainingSeconds < 0}
|
||||
class="section-countdown"
|
||||
aria-live="off"
|
||||
>
|
||||
<span>{data.live.sectionTimer.sectionName} · Abschnitt</span>
|
||||
<strong
|
||||
>{sectionRemainingSeconds < 0
|
||||
? `Überzogen +${formatCountdown(Math.abs(sectionRemainingSeconds))}`
|
||||
: `Noch ${formatCountdown(sectionRemainingSeconds)}`}</strong
|
||||
>
|
||||
</section>
|
||||
{/if}
|
||||
<div class="live-kicker">
|
||||
<span>Aktuell · {data.live.current.sectionName}</span>
|
||||
{#if showTimes}<strong
|
||||
@@ -197,6 +256,45 @@
|
||||
<!-- eslint-disable-next-line svelte/no-at-html-tags -->
|
||||
<div class="live-markdown">{@html data.live.current.researchHtml}</div>
|
||||
</details>
|
||||
{#if data.live.current.sources.length || data.live.current.tools.length}
|
||||
<!-- eslint-disable svelte/no-navigation-without-resolve -->
|
||||
<section class="live-materials" aria-labelledby="live-materials-title">
|
||||
<div>
|
||||
<span>Nur Redaktion</span>
|
||||
<h3 id="live-materials-title">Materialien</h3>
|
||||
</div>
|
||||
{#if data.live.current.sources.length}<div class="live-material-group">
|
||||
<strong>Quellen</strong>
|
||||
<ul>
|
||||
{#each data.live.current.sources as source (source.id)}<li>
|
||||
<!-- The URL is a server-validated private HTTP(S) snapshot. -->
|
||||
<!-- eslint-disable-next-line svelte/no-navigation-without-resolve -->
|
||||
<a href={source.url} target="_blank" rel="noopener noreferrer"
|
||||
>{source.label}</a
|
||||
>{#if source.timecodeSeconds !== null}<small
|
||||
>ab {formatClock(source.timecodeSeconds)}</small
|
||||
>{/if}
|
||||
</li>{/each}
|
||||
</ul>
|
||||
</div>{/if}
|
||||
{#if data.live.current.tools.length}<div class="live-material-group">
|
||||
<strong>Werkzeuge</strong>
|
||||
<ul>
|
||||
{#each data.live.current.tools as tool (tool.id)}<li>
|
||||
{#if tool.workUrl || tool.startUrl}<!-- The URL is a server-validated private HTTP(S) snapshot. -->
|
||||
<!-- eslint-disable-next-line svelte/no-navigation-without-resolve -->
|
||||
<a
|
||||
href={tool.workUrl || tool.startUrl}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer">{tool.name}</a
|
||||
>{:else}<span>{tool.name}</span><small>Kein Link hinterlegt</small>{/if}
|
||||
{#if tool.note}<small>{tool.note}</small>{/if}
|
||||
</li>{/each}
|
||||
</ul>
|
||||
</div>{/if}
|
||||
</section>
|
||||
<!-- eslint-enable svelte/no-navigation-without-resolve -->
|
||||
{/if}
|
||||
{#if data.live.current.transitionHtml}<section class="transition-card">
|
||||
<span>Überleitung</span>
|
||||
<!-- eslint-disable-next-line svelte/no-at-html-tags -->
|
||||
@@ -288,6 +386,18 @@
|
||||
<strong>{usage.title}</strong><small>{usage.status}</small>
|
||||
</div>
|
||||
<div class="live-run-actions">
|
||||
<form method="POST" action={liveAction('select')} use:enhance={enhanceCommand}>
|
||||
<input type="hidden" name="showId" value={data.live.show.id} />
|
||||
<input type="hidden" name="usageId" value={usage.id} />
|
||||
<input type="hidden" name="revision" value={data.live.liveRevision} />
|
||||
<input type="hidden" name="commandId" value={data.commandId} />
|
||||
<button
|
||||
class="text-button"
|
||||
type="submit"
|
||||
disabled={!data.live.startedAtUtc || usage.id === data.live.current?.id}
|
||||
aria-label={`${usage.title} als aktuelles Piece auswählen`}>Aktuell</button
|
||||
>
|
||||
</form>
|
||||
{#if usage.status === 'open'}
|
||||
<form
|
||||
method="POST"
|
||||
@@ -303,7 +413,7 @@
|
||||
type="submit"
|
||||
disabled={usageIndex === 0 ||
|
||||
section.usages[usageIndex - 1]?.status !== 'open'}
|
||||
aria-label={`${usage.title} nach oben`}>↑</button
|
||||
aria-label={`${usage.title} nach oben`}><AppIcon name="arrow-up" /></button
|
||||
>
|
||||
</form>
|
||||
<form
|
||||
@@ -320,7 +430,8 @@
|
||||
type="submit"
|
||||
disabled={usageIndex === section.usages.length - 1 ||
|
||||
section.usages[usageIndex + 1]?.status !== 'open'}
|
||||
aria-label={`${usage.title} nach unten`}>↓</button
|
||||
aria-label={`${usage.title} nach unten`}
|
||||
><AppIcon name="arrow-down" /></button
|
||||
>
|
||||
</form>
|
||||
{/if}
|
||||
@@ -329,7 +440,9 @@
|
||||
<input type="hidden" name="usageId" value={usage.id} />
|
||||
<input type="hidden" name="revision" value={data.live.liveRevision} />
|
||||
<input type="hidden" name="commandId" value={data.commandId} />
|
||||
<button type="submit" aria-label={`${usage.title} präsentieren`}>↗</button>
|
||||
<button type="submit" aria-label={`${usage.title} präsentieren`}
|
||||
><AppIcon name="display" /></button
|
||||
>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
@@ -356,7 +469,8 @@
|
||||
<button
|
||||
type="submit"
|
||||
disabled={reserveIndex === 0}
|
||||
aria-label={`${usage.title} in Reserve nach oben`}>↑</button
|
||||
aria-label={`${usage.title} in Reserve nach oben`}
|
||||
><AppIcon name="arrow-up" /></button
|
||||
>
|
||||
</form>
|
||||
<form method="POST" action={liveAction('moveUsage')} use:enhance={enhanceCommand}>
|
||||
@@ -368,7 +482,8 @@
|
||||
<button
|
||||
type="submit"
|
||||
disabled={reserveIndex === data.live.reserve.length - 1}
|
||||
aria-label={`${usage.title} in Reserve nach unten`}>↓</button
|
||||
aria-label={`${usage.title} in Reserve nach unten`}
|
||||
><AppIcon name="arrow-down" /></button
|
||||
>
|
||||
</form>
|
||||
{#if data.live.current || data.live.sections[0]}<form
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
<script lang="ts">
|
||||
import { resolve } from '$app/paths';
|
||||
import { formatDuration } from '#lib/format.js';
|
||||
import AppIcon from '#lib/components/AppIcon.svelte';
|
||||
import type { PageProps } from './$types';
|
||||
|
||||
let { data, form }: PageProps = $props();
|
||||
@@ -27,8 +28,9 @@
|
||||
|
||||
{#if form?.error}<div class="form-message error" role="alert">{form.error}</div>{/if}
|
||||
|
||||
<section class="show-create-panel">
|
||||
<div>
|
||||
<details class="show-create-panel">
|
||||
<summary><AppIcon name="plus" /> Neue Sendung planen</summary>
|
||||
<div class="show-create-heading">
|
||||
<p class="eyebrow">Neuen Stream planen</p>
|
||||
<h2>Leer starten oder Ablauf übernehmen</h2>
|
||||
</div>
|
||||
@@ -45,23 +47,29 @@
|
||||
<label
|
||||
>Termin<input name="startsAt" type="datetime-local" value={form?.startsAt ?? ''} /></label
|
||||
>
|
||||
<label
|
||||
>Ausgangspunkt<select name="templateId" value={form?.templateId ?? ''}
|
||||
><option value="">Leer starten</option
|
||||
>{#each data.templates as template (template.id)}<option value={template.id}
|
||||
>{template.name}</option
|
||||
>{/each}</select
|
||||
></label
|
||||
>
|
||||
<fieldset class="show-template-grid">
|
||||
<legend>Ausgangspunkt</legend>
|
||||
<label
|
||||
><input type="radio" name="templateId" value="" checked={!form?.templateId} /><AppIcon
|
||||
name="newspaper"
|
||||
/><span
|
||||
><strong>Leer starten</strong><small>Eine leere Sendung frei aufbauen.</small></span
|
||||
></label
|
||||
>
|
||||
{#each data.templates as template (template.id)}<label
|
||||
><input
|
||||
type="radio"
|
||||
name="templateId"
|
||||
value={template.id}
|
||||
checked={form?.templateId === template.id}
|
||||
/><AppIcon name="list-check" /><span
|
||||
><strong>{template.name}</strong><small>{template.description}</small></span
|
||||
></label
|
||||
>{/each}
|
||||
</fieldset>
|
||||
<button class="primary-button" type="submit">Sendung anlegen</button>
|
||||
</form>
|
||||
<div class="template-notes">
|
||||
{#each data.templates as template (template.id)}<p>
|
||||
<strong>{template.name}:</strong>
|
||||
{template.description}
|
||||
</p>{/each}
|
||||
</div>
|
||||
</section>
|
||||
</details>
|
||||
|
||||
<section class="show-library" aria-labelledby="show-library-title">
|
||||
<header>
|
||||
@@ -86,16 +94,17 @@
|
||||
<p>{berlinDate(show.startsAtUtc)} Uhr</p>
|
||||
</div>
|
||||
<div class="show-card-facts">
|
||||
<span><strong>{show.sectionCount}</strong> Abschnitte</span><span
|
||||
><strong>{formatDuration(show.totalDurationSeconds)}</strong> Planzeit</span
|
||||
><b aria-hidden="true">→</b>
|
||||
{#if show.sectionCount}<span><strong>{show.sectionCount}</strong> Abschnitte</span
|
||||
>{/if}{#if show.totalDurationSeconds}<span
|
||||
><strong>{formatDuration(show.totalDurationSeconds)}</strong> Planzeit</span
|
||||
>{/if}<b aria-hidden="true"><AppIcon name="arrow-right" /></b>
|
||||
</div>
|
||||
</a>
|
||||
{/each}
|
||||
</div>
|
||||
{:else}
|
||||
<div class="empty-state">
|
||||
<span aria-hidden="true">＋</span>
|
||||
<span aria-hidden="true"><AppIcon name="plus" /></span>
|
||||
<h2>Noch keine Sendung</h2>
|
||||
<p>Oben kann der erste Stream geplant werden.</p>
|
||||
</div>
|
||||
|
||||
@@ -1,10 +1,12 @@
|
||||
import { randomUUID } from 'node:crypto';
|
||||
import { error, fail } from '@sveltejs/kit';
|
||||
import type { Actions, PageServerLoad } from './$types';
|
||||
import { requireUser } from '#lib/server/auth.js';
|
||||
import { getTaxonomy, listPieces } from '#lib/server/content.js';
|
||||
import { getTaxonomy, listPieces, listPieceTemplates } from '#lib/server/content.js';
|
||||
import {
|
||||
addPieceUsage,
|
||||
addShowSection,
|
||||
createAndAddPieceUsage,
|
||||
duplicatePieceUsage,
|
||||
getShow,
|
||||
getPieceUsageContexts,
|
||||
@@ -90,6 +92,16 @@ function actionError(cause: unknown) {
|
||||
if (code === 'ORIGINAL_NOT_FOUND')
|
||||
return { status: 409, error: 'Das zugehörige Fundus-Piece ist nicht mehr verfügbar.' };
|
||||
if (code === 'NOT_FOUND') return { status: 404, error: 'Der Eintrag wurde nicht gefunden.' };
|
||||
if (
|
||||
['USAGE_IS_CURRENT', 'USAGE_IS_PRESENTED', 'USAGE_HAS_LIVE_RUNS', 'USAGE_NOT_OPEN'].includes(
|
||||
code
|
||||
)
|
||||
)
|
||||
return {
|
||||
status: 409,
|
||||
error:
|
||||
'Diese Sendungsfassung war bereits live aktiv oder wird gerade verwendet und kann nicht entfernt werden.'
|
||||
};
|
||||
if (code === 'INVALID_DURATION')
|
||||
return { status: 400, error: 'Piece-Dauern müssen zwischen 0 und 1.440 Minuten liegen.' };
|
||||
if (code.startsWith('INVALID_'))
|
||||
@@ -123,6 +135,8 @@ export const load: PageServerLoad = ({ locals, params, url }) => {
|
||||
startsAtLocal: berlinInput(show.startsAtUtc),
|
||||
pieces: pieces.map((piece) => ({ ...piece, ...usageContexts[piece.id] })),
|
||||
taxonomy: getTaxonomy(),
|
||||
pieceTemplates: listPieceTemplates(),
|
||||
createCommandId: randomUUID(),
|
||||
filters: {
|
||||
query: url.searchParams.get('q') ?? '',
|
||||
categoryId: url.searchParams.get('category') ?? '',
|
||||
@@ -197,12 +211,27 @@ export const actions = {
|
||||
})
|
||||
);
|
||||
},
|
||||
createUsage: async ({ locals, params, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
return attempt('createUsage', () =>
|
||||
createAndAddPieceUsage(params.id, Number(data.get('revision')), text(data, 'commandId'), {
|
||||
title: text(data, 'title'),
|
||||
templateId: text(data, 'templateId') || 'blank',
|
||||
sectionId: text(data, 'sectionId') || null
|
||||
})
|
||||
);
|
||||
},
|
||||
updateUsage: async ({ locals, params, request }) => {
|
||||
requireUser(locals.user);
|
||||
const data = await request.formData();
|
||||
const toolIds = data.getAll('usageToolId').map(String);
|
||||
const toolWorkUrls = data.getAll('toolWorkUrl').map(String);
|
||||
const toolNotes = data.getAll('toolNote').map(String);
|
||||
return attempt('updateUsage', () =>
|
||||
updatePieceUsage(params.id, text(data, 'usageId'), Number(data.get('revision')), {
|
||||
title: text(data, 'title'),
|
||||
outputTitle: text(data, 'outputTitle'),
|
||||
durationSeconds: pieceDurationInSeconds(data),
|
||||
ownNotes: text(data, 'ownNotes'),
|
||||
intro: text(data, 'intro'),
|
||||
@@ -219,7 +248,13 @@ export const actions = {
|
||||
presentationTitle: text(data, 'presentationTitle'),
|
||||
presentationDescription: text(data, 'presentationDescription'),
|
||||
presentationImageUrl: text(data, 'presentationImageUrl'),
|
||||
presentationSiteName: text(data, 'presentationSiteName')
|
||||
presentationSiteName: text(data, 'presentationSiteName'),
|
||||
presentationMediaId: text(data, 'presentationMediaId') || null,
|
||||
tools: toolIds.map((id, index) => ({
|
||||
id,
|
||||
workUrl: toolWorkUrls[index] ?? '',
|
||||
note: toolNotes[index] ?? ''
|
||||
}))
|
||||
})
|
||||
);
|
||||
},
|
||||
|
||||
@@ -6,6 +6,7 @@
|
||||
import { flip } from 'svelte/animate';
|
||||
import { onMount, untrack } from 'svelte';
|
||||
import PieceUsageHistory from '#lib/components/PieceUsageHistory.svelte';
|
||||
import AppIcon from '#lib/components/AppIcon.svelte';
|
||||
import UsageEditorDialog from '#lib/components/UsageEditorDialog.svelte';
|
||||
import { formatClock, formatDuration } from '#lib/format.js';
|
||||
import type { PageProps } from './$types';
|
||||
@@ -22,9 +23,11 @@
|
||||
let moveSectionForm: HTMLFormElement;
|
||||
let moveUsageForm: HTMLFormElement;
|
||||
let addUsageForm: HTMLFormElement;
|
||||
let removeUsageForm: HTMLFormElement;
|
||||
let draggedSectionId = $state('');
|
||||
let draggedUsageId = $state('');
|
||||
let draggedPieceId = $state('');
|
||||
let removedUsageId = $state('');
|
||||
let dropSectionId = $state('');
|
||||
let dropPosition = $state(0);
|
||||
let copyMessage = $state('');
|
||||
@@ -33,7 +36,7 @@
|
||||
let visiblePieces = $derived(
|
||||
data.pieces.filter(
|
||||
(piece) =>
|
||||
(showUsedPieces || piece.sentHistory.length === 0) &&
|
||||
(showUsedPieces || piece.sentHistory.length === 0 || piece.isFavorite) &&
|
||||
(showPlannedPieces || !piece.isPlannedInCurrentShow)
|
||||
)
|
||||
);
|
||||
@@ -165,6 +168,17 @@
|
||||
setTimeout(() => moveUsageForm.requestSubmit());
|
||||
}
|
||||
|
||||
function removeDraggedUsage() {
|
||||
if (dragged?.kind !== 'usage') return;
|
||||
if (!confirm('Piece aus dieser Sendung entfernen?')) {
|
||||
finishDrag();
|
||||
return;
|
||||
}
|
||||
removedUsageId = dragged.id;
|
||||
finishDrag();
|
||||
setTimeout(() => removeUsageForm.requestSubmit());
|
||||
}
|
||||
|
||||
const enhanceCommand: SubmitFunction = ({ formElement, submitter }) => {
|
||||
const affected = formElement.closest<HTMLElement>(
|
||||
'.run-section, .editable-reserve, .builder-source-card, .show-settings, .add-section-form'
|
||||
@@ -194,7 +208,7 @@
|
||||
<div class="page-wrap builder-page">
|
||||
<header class="page-heading show-heading">
|
||||
<div class="show-heading-copy">
|
||||
<a class="back-link" href={resolve('/sendungen')}>← Sendungen</a>
|
||||
<a class="back-link" href={resolve('/sendungen')}><AppIcon name="arrow-left" /> Sendungen</a>
|
||||
<h1>{data.show.title}</h1>
|
||||
<p class="show-date">
|
||||
{data.show.startsAtUtc ? `${berlinDate(data.show.startsAtUtc)} Uhr` : 'Termin offen'}
|
||||
@@ -206,7 +220,7 @@
|
||||
<strong>{formatDuration(data.show.totalDurationSeconds)}</strong><span>Planzeit</span>
|
||||
</div>
|
||||
<a class="live-link" href={resolve(`/live?show=${encodeURIComponent(data.show.id)}`)}
|
||||
>Live-Steuerung <span>↗</span></a
|
||||
>Live-Steuerung <AppIcon name="display" /></a
|
||||
>
|
||||
</div>
|
||||
</header>
|
||||
@@ -287,8 +301,18 @@
|
||||
<div class="builder-workspace">
|
||||
<section
|
||||
class="builder-pane source-pane"
|
||||
class:drop-ready={dropTarget === 'source'}
|
||||
class:mobile-hidden={mobilePane !== 'fundus'}
|
||||
aria-labelledby="source-title"
|
||||
ondragover={(event) => {
|
||||
if (dragged?.kind !== 'usage') return;
|
||||
event.preventDefault();
|
||||
dropTarget = 'source';
|
||||
}}
|
||||
ondrop={(event) => {
|
||||
event.preventDefault();
|
||||
removeDraggedUsage();
|
||||
}}
|
||||
>
|
||||
<header class="pane-heading">
|
||||
<div>
|
||||
@@ -297,6 +321,33 @@
|
||||
</div>
|
||||
<span>{visiblePieces.length}</span>
|
||||
</header>
|
||||
{#if dropTarget === 'source'}<div class="drag-remove-target">
|
||||
<strong>Aus Sendung entfernen</strong><span>Das Fundus-Original bleibt erhalten.</span>
|
||||
</div>{/if}
|
||||
<details class="plan-piece-create">
|
||||
<summary>Neues Piece direkt einplanen</summary>
|
||||
<form use:enhance={enhanceCommand} method="POST" action="?/createUsage">
|
||||
<input type="hidden" name="revision" value={data.show.revision} />
|
||||
<input type="hidden" name="commandId" value={data.createCommandId} />
|
||||
<label>Titel<input name="title" required maxlength="200" /></label>
|
||||
<label
|
||||
>Vorlage<select name="templateId">
|
||||
{#each data.pieceTemplates as template (template.id)}<option value={template.id}
|
||||
>{template.name}</option
|
||||
>{/each}
|
||||
</select></label
|
||||
>
|
||||
<label
|
||||
>Ziel<select name="sectionId">
|
||||
<option value="">Reservebank</option>
|
||||
{#each data.show.sections as section (section.id)}<option value={section.id}
|
||||
>{section.name}</option
|
||||
>{/each}
|
||||
</select></label
|
||||
>
|
||||
<button class="secondary-button" type="submit">Anlegen und einplanen</button>
|
||||
</form>
|
||||
</details>
|
||||
<form id="builder-filters" method="GET" class="builder-filter">
|
||||
<label
|
||||
><span class="sr-only">Fundus durchsuchen</span><input
|
||||
@@ -361,7 +412,11 @@
|
||||
><i></i>{piece.categories.map((item) => item.name).join(', ') || 'Offen'}</span
|
||||
><span>{formatClock(piece.durationSeconds)}</span>
|
||||
</div>
|
||||
<h3>{piece.title}</h3>
|
||||
<h3>
|
||||
{#if piece.isFavorite}<span class="favorite-mark" aria-label="Favorit"
|
||||
><AppIcon name="star" /></span
|
||||
>{/if}{piece.title}
|
||||
</h3>
|
||||
<p>
|
||||
{piece.format} · {piece.topics.map((item) => item.name).join(', ') || 'Ohne Thema'}
|
||||
</p>
|
||||
@@ -396,7 +451,7 @@
|
||||
{/each}
|
||||
</div>
|
||||
{#if !visiblePieces.length}<div class="empty-state">
|
||||
<span aria-hidden="true">⌕</span>
|
||||
<span aria-hidden="true"><AppIcon name="magnifying-glass" /></span>
|
||||
<h2>Keine verfügbaren Pieces</h2>
|
||||
<p>
|
||||
Suchfilter ändern, ausgeblendete Inhalte einblenden oder Pieces im Fundus sendefertig
|
||||
@@ -472,7 +527,7 @@
|
||||
/><input type="hidden" name="position" value={index - 1} /><button
|
||||
type="submit"
|
||||
disabled={index === 0}
|
||||
aria-label={`${section.name} nach oben`}>↑</button
|
||||
aria-label={`${section.name} nach oben`}><AppIcon name="arrow-up" /></button
|
||||
>
|
||||
</form>
|
||||
<form use:enhance={enhanceCommand} method="POST" action="?/moveSection">
|
||||
@@ -483,7 +538,7 @@
|
||||
/><input type="hidden" name="position" value={index + 1} /><button
|
||||
type="submit"
|
||||
disabled={index === data.show.sections.length - 1}
|
||||
aria-label={`${section.name} nach unten`}>↓</button
|
||||
aria-label={`${section.name} nach unten`}><AppIcon name="arrow-down" /></button
|
||||
>
|
||||
</form>
|
||||
</div>
|
||||
@@ -533,7 +588,7 @@
|
||||
ondragend={finishDrag}
|
||||
>
|
||||
<strong>{usage.title}</strong><small
|
||||
>{formatClock(usage.durationSeconds)} · sendungsspezifische Kopie</small
|
||||
>{formatClock(usage.durationSeconds)}</small
|
||||
>
|
||||
</div>
|
||||
<div class="row-actions">
|
||||
@@ -549,7 +604,8 @@
|
||||
/><button
|
||||
type="submit"
|
||||
disabled={usageIndex === 0}
|
||||
aria-label={`${usage.title} nach oben`}>↑</button
|
||||
aria-label={`${usage.title} nach oben`}
|
||||
><AppIcon name="arrow-up" /></button
|
||||
>
|
||||
</form>
|
||||
<form use:enhance={enhanceCommand} method="POST" action="?/moveUsage">
|
||||
@@ -564,7 +620,8 @@
|
||||
/><button
|
||||
type="submit"
|
||||
disabled={usageIndex === section.usages.length - 1}
|
||||
aria-label={`${usage.title} nach unten`}>↓</button
|
||||
aria-label={`${usage.title} nach unten`}
|
||||
><AppIcon name="arrow-down" /></button
|
||||
>
|
||||
</form>
|
||||
<UsageEditorDialog
|
||||
@@ -770,7 +827,13 @@
|
||||
></label
|
||||
><button class="secondary-button" type="submit">Einplanen</button>
|
||||
</form>
|
||||
<form use:enhance={enhanceCommand} method="POST" action="?/removeUsage">
|
||||
<form
|
||||
use:enhance={enhanceCommand}
|
||||
method="POST"
|
||||
action="?/removeUsage"
|
||||
onsubmit={(event) =>
|
||||
!confirm('Piece aus dieser Sendung entfernen?') && event.preventDefault()}
|
||||
>
|
||||
<input type="hidden" name="revision" value={data.show.revision} /><input
|
||||
type="hidden"
|
||||
name="usageId"
|
||||
@@ -778,7 +841,7 @@
|
||||
/><button
|
||||
class="text-button danger-text"
|
||||
type="submit"
|
||||
aria-label={`${usage.title} aus Reserve entfernen`}>Entfernen</button
|
||||
aria-label={`${usage.title} aus Sendung entfernen`}>Aus Sendung entfernen</button
|
||||
>
|
||||
</form>
|
||||
<UsageEditorDialog
|
||||
@@ -847,4 +910,14 @@
|
||||
value={draggedPieceId}
|
||||
/><input type="hidden" name="sectionId" value={dropSectionId} />
|
||||
</form>
|
||||
<form
|
||||
bind:this={removeUsageForm}
|
||||
use:enhance={enhanceCommand}
|
||||
method="POST"
|
||||
action="?/removeUsage"
|
||||
class="hidden-command-form"
|
||||
>
|
||||
<input type="hidden" name="revision" value={data.show.revision} />
|
||||
<input type="hidden" name="usageId" value={removedUsageId} />
|
||||
</form>
|
||||
</div>
|
||||
@@ -4,9 +4,11 @@ import {
|
||||
createTaxonomy,
|
||||
deleteTaxonomy,
|
||||
getTaxonomy,
|
||||
updateTaxonomy,
|
||||
type TaxonomyKind
|
||||
} from '#lib/server/content.js';
|
||||
import { getMailConfig } from '#lib/server/config.js';
|
||||
import { createTool, listTools, updateTool, type ToolInput } from '#lib/server/tools.js';
|
||||
import {
|
||||
inviteUser,
|
||||
isRole,
|
||||
@@ -25,6 +27,7 @@ export const load: PageServerLoad = ({ locals }) => {
|
||||
taxonomy: getTaxonomy(),
|
||||
users: listUsers(),
|
||||
invitations: listOpenInvitations(),
|
||||
tools: listTools(true),
|
||||
mailTransport: getMailConfig().transport
|
||||
};
|
||||
};
|
||||
@@ -40,9 +43,27 @@ function actionError(cause: unknown): string {
|
||||
return 'Verwendete oder für Vorlagen benötigte Einträge können nicht entfernt werden.';
|
||||
if (code === 'INVALID_COLOR') return 'Bitte eine gültige Farbe wählen.';
|
||||
if (code === 'INVALID_TAXONOMY') return 'Bitte einen gültigen Namen eingeben.';
|
||||
if (code === 'INVALID_ICON') return 'Bitte ein Icon aus der angebotenen Auswahl verwenden.';
|
||||
if (code === 'TOOL_EXISTS') return 'Ein Werkzeug mit diesem Namen existiert bereits.';
|
||||
if (code === 'INVALID_TOOL_URL')
|
||||
return 'Die Start-URL muss eine vollständige HTTP- oder HTTPS-Adresse sein.';
|
||||
if (code === 'INVALID_TOOL_FORMAT')
|
||||
return 'Mindestens ein gewähltes Format existiert nicht mehr.';
|
||||
if (code === 'INVALID_TOOL') return 'Bitte die Werkzeugdaten prüfen.';
|
||||
return 'Die Aktion konnte nicht ausgeführt werden.';
|
||||
}
|
||||
|
||||
function toolInput(data: FormData): ToolInput {
|
||||
return {
|
||||
name: String(data.get('name') || ''),
|
||||
startUrl: String(data.get('startUrl') || ''),
|
||||
description: String(data.get('description') || ''),
|
||||
iconName: String(data.get('iconName') || ''),
|
||||
isActive: data.get('isActive') === '1',
|
||||
formatIds: data.getAll('formatIds').map(String)
|
||||
};
|
||||
}
|
||||
|
||||
export const actions = {
|
||||
invite: async ({ locals, request }) => {
|
||||
const actor = requireBarkeeper(locals.user);
|
||||
@@ -112,12 +133,36 @@ export const actions = {
|
||||
return fail(400, { intent: 'taxonomy', error: 'Ungültige Taxonomieart.' });
|
||||
}
|
||||
try {
|
||||
createTaxonomy(kind, String(data.get('name') || ''), String(data.get('color') || ''));
|
||||
createTaxonomy(
|
||||
kind,
|
||||
String(data.get('name') || ''),
|
||||
String(data.get('color') || ''),
|
||||
String(data.get('iconName') || '')
|
||||
);
|
||||
return { intent: 'taxonomy', success: 'Eintrag angelegt.' };
|
||||
} catch (cause) {
|
||||
return fail(400, { intent: 'taxonomy', error: actionError(cause) });
|
||||
}
|
||||
},
|
||||
updateTaxonomy: async ({ locals, request }) => {
|
||||
requireBarkeeper(locals.user);
|
||||
const data = await request.formData();
|
||||
const kind = String(data.get('kind') || '') as TaxonomyKind;
|
||||
if (!['category', 'format', 'topic'].includes(kind)) {
|
||||
return fail(400, { intent: 'taxonomy', error: 'Ungültige Taxonomieart.' });
|
||||
}
|
||||
try {
|
||||
updateTaxonomy(
|
||||
kind,
|
||||
String(data.get('taxonomyId') || ''),
|
||||
String(data.get('name') || ''),
|
||||
String(data.get('iconName') || '')
|
||||
);
|
||||
return { intent: 'taxonomy', success: 'Eintrag aktualisiert.' };
|
||||
} catch (cause) {
|
||||
return fail(400, { intent: 'taxonomy', error: actionError(cause) });
|
||||
}
|
||||
},
|
||||
deleteTaxonomy: async ({ locals, request }) => {
|
||||
requireBarkeeper(locals.user);
|
||||
const data = await request.formData();
|
||||
@@ -131,5 +176,25 @@ export const actions = {
|
||||
} catch (cause) {
|
||||
return fail(400, { intent: 'taxonomy', error: actionError(cause) });
|
||||
}
|
||||
},
|
||||
createTool: async ({ locals, request }) => {
|
||||
requireBarkeeper(locals.user);
|
||||
const data = await request.formData();
|
||||
try {
|
||||
createTool(toolInput(data));
|
||||
return { intent: 'tool', success: 'Werkzeug angelegt.' };
|
||||
} catch (cause) {
|
||||
return fail(400, { intent: 'tool', error: actionError(cause) });
|
||||
}
|
||||
},
|
||||
updateTool: async ({ locals, request }) => {
|
||||
requireBarkeeper(locals.user);
|
||||
const data = await request.formData();
|
||||
try {
|
||||
updateTool(String(data.get('toolId') || ''), toolInput(data));
|
||||
return { intent: 'tool', success: 'Werkzeug aktualisiert.' };
|
||||
} catch (cause) {
|
||||
return fail(400, { intent: 'tool', error: actionError(cause) });
|
||||
}
|
||||
}
|
||||
} satisfies Actions;
|
||||
@@ -1,6 +1,10 @@
|
||||
<script lang="ts">
|
||||
import AppIcon from '#lib/components/AppIcon.svelte';
|
||||
import IconPicker from '#lib/components/IconPicker.svelte';
|
||||
import ToolEditorDialog from '#lib/components/ToolEditorDialog.svelte';
|
||||
import type { PageProps } from './$types';
|
||||
let { data, form }: PageProps = $props();
|
||||
let toolDialog: { showModal: (tool?: (typeof data.tools)[number] | null) => void };
|
||||
|
||||
function confirmTaxonomyRemoval(event: SubmitEvent) {
|
||||
if (!confirm('Eintrag wirklich entfernen?')) event.preventDefault();
|
||||
@@ -12,7 +16,7 @@
|
||||
<div class="page-wrap narrow-page">
|
||||
<header class="page-heading">
|
||||
<h1>Verwaltung</h1>
|
||||
<p class="page-intro">Konten, Rollen und bestehende Taxonomie verwalten.</p>
|
||||
<p class="page-intro">Konten, Werkzeuge und bestehende Taxonomie verwalten.</p>
|
||||
</header>
|
||||
{#if form?.error}<div class="form-message error" role="alert">{form.error}</div>{/if}
|
||||
{#if form?.success}<div class="form-message success" role="status">{form.success}</div>{/if}
|
||||
@@ -113,6 +117,46 @@
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<h2 class="section-heading">Werkzeuge</h2>
|
||||
<section class="quiet-panel tool-management">
|
||||
<div class="panel-heading">
|
||||
<div>
|
||||
<p class="eyebrow">Redaktionelle Hilfsmittel</p>
|
||||
<h2>Werkzeugkatalog</h2>
|
||||
</div>
|
||||
<button class="compact-add-button" type="button" onclick={() => toolDialog.showModal()}>
|
||||
<AppIcon name="plus" /> Werkzeug hinzufügen
|
||||
</button>
|
||||
</div>
|
||||
<p class="catalog-note">
|
||||
Deaktivierte Werkzeuge bleiben in bestehenden Pieces und Sendungen erhalten.
|
||||
</p>
|
||||
<div class="catalog-settings-list tool-settings-list">
|
||||
{#each data.tools as tool (tool.id)}
|
||||
<button
|
||||
type="button"
|
||||
class:inactive={!tool.isActive}
|
||||
aria-label={`${tool.name} bearbeiten`}
|
||||
onclick={() => toolDialog.showModal(tool)}
|
||||
>
|
||||
<span class="catalog-entry-icon"><AppIcon name={tool.iconName || 'wrench'} /></span>
|
||||
<span class="catalog-entry-copy">
|
||||
<strong>{tool.name}</strong>
|
||||
<small
|
||||
>{tool.isActive ? 'Aktiv' : 'Deaktiviert'}{#if tool.formatIds.length}
|
||||
· {data.taxonomy.formats
|
||||
.filter((format) => tool.formatIds.includes(format.id))
|
||||
.map((format) => format.name)
|
||||
.join(', ')}{/if}</small
|
||||
>
|
||||
</span>
|
||||
<AppIcon name="pen" />
|
||||
</button>
|
||||
{/each}
|
||||
</div>
|
||||
</section>
|
||||
<ToolEditorDialog bind:this={toolDialog} formats={data.taxonomy.formats} />
|
||||
|
||||
<h2 class="section-heading">Taxonomie</h2>
|
||||
<div class="settings-grid">
|
||||
<section class="quiet-panel taxonomy-panel">
|
||||
@@ -126,7 +170,9 @@
|
||||
type="hidden"
|
||||
name="taxonomyId"
|
||||
value={category.id}
|
||||
/><button type="submit" aria-label={`${category.name} entfernen`}>×</button>
|
||||
/><button type="submit" aria-label={`${category.name} entfernen`}
|
||||
><AppIcon name="trash" /></button
|
||||
>
|
||||
</form></span
|
||||
>{/each}
|
||||
</div>
|
||||
@@ -158,7 +204,9 @@
|
||||
type="hidden"
|
||||
name="taxonomyId"
|
||||
value={format.id}
|
||||
/><button type="submit" aria-label={`${format.name} entfernen`}>×</button>
|
||||
/><button type="submit" aria-label={`${format.name} entfernen`}
|
||||
><AppIcon name="trash" /></button
|
||||
>
|
||||
</form></span
|
||||
>{/each}
|
||||
</div>
|
||||
@@ -173,20 +221,31 @@
|
||||
><button class="text-button" type="submit">Hinzufügen</button>
|
||||
</form>
|
||||
</section>
|
||||
<section class="quiet-panel taxonomy-panel">
|
||||
<section class="quiet-panel taxonomy-panel topic-management-panel">
|
||||
<p class="eyebrow">Themen</p>
|
||||
<h2>Inhaltliche Zuordnung</h2>
|
||||
<div class="taxonomy-list editable-taxonomy">
|
||||
{#each data.taxonomy.topics as topic (topic.id)}<span
|
||||
>{topic.name}
|
||||
<div class="topic-settings-list">
|
||||
{#each data.taxonomy.topics as topic (topic.id)}
|
||||
<details>
|
||||
<summary
|
||||
><AppIcon name={topic.iconName || 'circle'} /><strong>{topic.name}</strong><AppIcon
|
||||
name="pen"
|
||||
/></summary
|
||||
>
|
||||
<form class="topic-edit-form" method="POST" action="?/updateTaxonomy">
|
||||
<input type="hidden" name="kind" value="topic" />
|
||||
<input type="hidden" name="taxonomyId" value={topic.id} />
|
||||
<label>Name<input name="name" required maxlength="80" value={topic.name} /></label>
|
||||
<IconPicker name={topic.iconName} />
|
||||
<button class="secondary-button" type="submit">Änderungen speichern</button>
|
||||
</form>
|
||||
<form method="POST" action="?/deleteTaxonomy" onsubmit={confirmTaxonomyRemoval}>
|
||||
<input type="hidden" name="kind" value="topic" /><input
|
||||
type="hidden"
|
||||
name="taxonomyId"
|
||||
value={topic.id}
|
||||
/><button type="submit" aria-label={`${topic.name} entfernen`}>×</button>
|
||||
</form></span
|
||||
>{/each}
|
||||
<input type="hidden" name="kind" value="topic" />
|
||||
<input type="hidden" name="taxonomyId" value={topic.id} />
|
||||
<button class="text-button danger-text" type="submit">Thema löschen</button>
|
||||
</form>
|
||||
</details>
|
||||
{/each}
|
||||
</div>
|
||||
<form class="taxonomy-form" method="POST" action="?/createTaxonomy">
|
||||
<input type="hidden" name="kind" value="topic" /><label
|
||||
@@ -196,7 +255,7 @@
|
||||
maxlength="80"
|
||||
placeholder="Neues Thema"
|
||||
/></label
|
||||
><button class="text-button" type="submit">Hinzufügen</button>
|
||||
><IconPicker name="" /><button class="text-button" type="submit">Hinzufügen</button>
|
||||
</form>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
File diff suppressed because it is too large.
Load diff
|
After Width: | Height: | Size: 3.7 MiB |
+276
-116
@@ -1,4 +1,4 @@
|
||||
import { expect, test, type Page } from '@playwright/test';
|
||||
import { expect, test, type Locator, type Page } from '@playwright/test';
|
||||
import Database from 'better-sqlite3';
|
||||
import { readFileSync, readdirSync } from 'node:fs';
|
||||
import path from 'node:path';
|
||||
@@ -31,11 +31,19 @@ async function setTheme(page: Page, theme: 'light' | 'dark') {
|
||||
}
|
||||
|
||||
async function openEditorialField(page: Page, heading: string) {
|
||||
const field = page.locator('.editorial-field').filter({
|
||||
has: page.getByRole('heading', { name: heading, exact: true })
|
||||
});
|
||||
await field.locator('.editorial-edit-button').click();
|
||||
return field;
|
||||
if (heading.includes('Recherche')) {
|
||||
await page.getByRole('button', { name: 'Recherche & Quellen' }).click();
|
||||
} else if (heading.includes('Präsentation')) {
|
||||
await page.getByRole('button', { name: 'Präsentation', exact: true }).click();
|
||||
} else {
|
||||
await page.getByRole('button', { name: 'Sendungstext', exact: true }).click();
|
||||
}
|
||||
}
|
||||
|
||||
async function editInlineTitle(scope: Page | Locator, title: string, value: string) {
|
||||
await scope.getByRole('button', { name: `${title} Titel bearbeiten` }).click();
|
||||
await scope.getByLabel('Titel', { exact: true }).fill(value);
|
||||
await scope.getByLabel('Titel', { exact: true }).press('Enter');
|
||||
}
|
||||
|
||||
async function login(page: Page, email = adminEmail, password = adminPassword) {
|
||||
@@ -188,6 +196,16 @@ function removePresentationFixture() {
|
||||
database.close();
|
||||
}
|
||||
|
||||
function setSectionDuration(sectionId: string, seconds: number | null) {
|
||||
const dataDirectory = process.env.SENDEWERK_E2E_DATA_DIR;
|
||||
if (!dataDirectory) throw new Error('E2E-Datenverzeichnis ist nicht konfiguriert.');
|
||||
const database = new Database(path.join(dataDirectory, 'e2e.sqlite'));
|
||||
database
|
||||
.prepare('UPDATE show_sections SET explicit_duration_seconds = ? WHERE id = ?')
|
||||
.run(seconds, sectionId);
|
||||
database.close();
|
||||
}
|
||||
|
||||
test.beforeAll(async ({ browser }) => {
|
||||
const page = await browser.newPage();
|
||||
await page.goto('/');
|
||||
@@ -304,8 +322,25 @@ test('desktop fundus is a compact, filterable list with persistent themes', asyn
|
||||
await expect(page.locator('.mobile-navigation')).toBeHidden();
|
||||
await expect(page.locator('.utility-navigation a')).toHaveText('Verwaltung');
|
||||
await expect(page.locator('.piece-card')).toHaveCount(1);
|
||||
await page
|
||||
.locator('.filter-picker')
|
||||
.evaluate((element) => ((element as HTMLDetailsElement).open = true));
|
||||
await page.getByLabel('Auch eingeplante Inhalte zeigen').check();
|
||||
await expect(page.locator('.piece-card')).toHaveCount(4);
|
||||
await page
|
||||
.getByRole('button', { name: 'Die kleine Konsole mit dem großen Dreh als Favorit markieren' })
|
||||
.click();
|
||||
await expect(
|
||||
page.getByRole('button', {
|
||||
name: 'Die kleine Konsole mit dem großen Dreh aus Favoriten entfernen'
|
||||
})
|
||||
).toBeVisible();
|
||||
await expect(page.locator('.piece-card').first()).toContainText(
|
||||
'Die kleine Konsole mit dem großen Dreh'
|
||||
);
|
||||
await page
|
||||
.locator('.filter-picker')
|
||||
.evaluate((element) => ((element as HTMLDetailsElement).open = true));
|
||||
|
||||
const firstRow = await page.locator('.piece-card').nth(0).boundingBox();
|
||||
const secondRow = await page.locator('.piece-card').nth(1).boundingBox();
|
||||
@@ -317,11 +352,17 @@ test('desktop fundus is a compact, filterable list with persistent themes', asyn
|
||||
expect(searchBox?.height).toBe(statusBox?.height);
|
||||
|
||||
await page.getByRole('searchbox', { name: 'Fundus durchsuchen' }).fill('Pixelart');
|
||||
await page.getByRole('button', { name: 'Anwenden' }).click();
|
||||
await page.getByRole('button', { name: 'Filter anwenden' }).click();
|
||||
await expect(page.locator('.piece-card')).toHaveCount(1);
|
||||
await page
|
||||
.locator('.filter-picker')
|
||||
.evaluate((element) => ((element as HTMLDetailsElement).open = true));
|
||||
await page.getByLabel('Status').selectOption('preparing');
|
||||
await page.getByRole('button', { name: 'Anwenden' }).click();
|
||||
await page.getByRole('button', { name: 'Filter anwenden' }).click();
|
||||
await expect(page.getByRole('heading', { name: 'Kein passendes Piece' })).toBeVisible();
|
||||
await page
|
||||
.locator('.filter-picker')
|
||||
.evaluate((element) => ((element as HTMLDetailsElement).open = true));
|
||||
await page.getByRole('button', { name: 'Zurücksetzen' }).click();
|
||||
await expect(page.locator('.piece-card')).toHaveCount(1);
|
||||
|
||||
@@ -344,7 +385,13 @@ test('sent and planned source filters stay independent and removing the last usa
|
||||
page.getByRole('heading', { name: 'Warum praktische Effekte wieder auffallen' })
|
||||
).toHaveCount(0);
|
||||
await page.evaluate(() => (document.body.dataset.filterDocument = 'stable'));
|
||||
await page
|
||||
.locator('.filter-picker')
|
||||
.evaluate((element) => ((element as HTMLDetailsElement).open = true));
|
||||
await page.getByLabel('Auch verwendete Inhalte zeigen').check();
|
||||
await page
|
||||
.locator('.filter-picker')
|
||||
.evaluate((element) => ((element as HTMLDetailsElement).open = true));
|
||||
await expect(
|
||||
page.getByRole('heading', { name: 'Warum praktische Effekte wieder auffallen' })
|
||||
).toHaveCount(0);
|
||||
@@ -363,7 +410,7 @@ test('sent and planned source filters stay independent and removing the last usa
|
||||
await expect(usedPiece.locator('.piece-usage-history li')).toHaveCount(2);
|
||||
await expect(page.locator('body')).toHaveAttribute('data-filter-document', 'stable');
|
||||
await page.getByRole('searchbox', { name: 'Fundus durchsuchen' }).fill('praktische Effekte');
|
||||
await page.getByRole('button', { name: 'Anwenden' }).click();
|
||||
await page.getByRole('button', { name: 'Filter anwenden' }).click();
|
||||
await expect(page.getByLabel('Auch verwendete Inhalte zeigen')).toBeChecked();
|
||||
await expect(usedPiece).toBeVisible();
|
||||
await page.screenshot({
|
||||
@@ -372,8 +419,9 @@ test('sent and planned source filters stay independent and removing the last usa
|
||||
});
|
||||
|
||||
await page.goto('/sendungen');
|
||||
await page.getByLabel('Titel').fill('E2E Filterprüfung');
|
||||
await page.getByLabel('Ausgangspunkt').selectOption('template-default');
|
||||
await page.getByText('Neue Sendung planen', { exact: true }).click();
|
||||
await page.getByLabel('Titel', { exact: true }).fill('E2E Filterprüfung');
|
||||
await page.getByRole('radio', { name: /Standardablauf/ }).check();
|
||||
await page.getByRole('button', { name: 'Sendung anlegen' }).click();
|
||||
await page.getByPlaceholder('Fundus durchsuchen').fill('kleine Konsole');
|
||||
await page.getByRole('button', { name: 'Filtern' }).click();
|
||||
@@ -424,9 +472,10 @@ test('sent and planned source filters stay independent and removing the last usa
|
||||
fullPage: true
|
||||
});
|
||||
|
||||
page.once('dialog', (dialog) => dialog.accept());
|
||||
await page
|
||||
.locator('.reserve-usage')
|
||||
.getByRole('button', { name: /aus Reserve entfernen/ })
|
||||
.getByRole('button', { name: /aus Sendung entfernen/ })
|
||||
.click();
|
||||
await page.getByLabel('Auch verwendete Inhalte zeigen').uncheck();
|
||||
await expect(
|
||||
@@ -519,10 +568,12 @@ test('mobile and tablet navigation do not obscure switchable content', async ({
|
||||
test('a show can be planned from a template with independent usages and reserve', async ({
|
||||
page
|
||||
}, testInfo) => {
|
||||
test.slow();
|
||||
await page.setViewportSize({ width: 1440, height: 1000 });
|
||||
await page.goto('/sendungen');
|
||||
await page.getByLabel('Titel').fill('E2E Planung Spiele und JC');
|
||||
await page.getByLabel('Ausgangspunkt').selectOption('template-default');
|
||||
await page.getByText('Neue Sendung planen', { exact: true }).click();
|
||||
await page.getByLabel('Titel', { exact: true }).fill('E2E Planung Spiele und JC');
|
||||
await page.getByRole('radio', { name: /Standardablauf/ }).check();
|
||||
await page.getByRole('button', { name: 'Sendung anlegen' }).click();
|
||||
await expect(page).toHaveURL(/\/sendungen\/[a-f0-9-]+$/);
|
||||
const showUrl = page.url();
|
||||
@@ -582,16 +633,9 @@ test('a show can be planned from a template with independent usages and reserve'
|
||||
name: 'Die kleine Konsole mit dem großen Dreh bearbeiten und verschieben'
|
||||
})
|
||||
.click();
|
||||
await expect(page.locator('dialog[open]')).toContainText('Sendungsspezifische Kopie');
|
||||
const desktopEditorItems = await page
|
||||
.locator('dialog[open] .usage-dialog-editor')
|
||||
.evaluate((element) =>
|
||||
Array.from(element.children)
|
||||
.filter((child) => child.matches('section, button'))
|
||||
.map((child) => child.getBoundingClientRect().top)
|
||||
);
|
||||
expect(Math.abs(desktopEditorItems[0] - desktopEditorItems[1])).toBeLessThan(2);
|
||||
expect(desktopEditorItems[2]).toBeGreaterThan(desktopEditorItems[1]);
|
||||
await expect(page.locator('dialog[open]')).toContainText('Sendungsfassung');
|
||||
await expect(page.locator('dialog[open] .piece-dialog-workspace')).toBeVisible();
|
||||
await expectNoHorizontalOverflow(page);
|
||||
await page.screenshot({
|
||||
path: testInfo.outputPath('verwendungseditor-desktop.png'),
|
||||
fullPage: true
|
||||
@@ -611,9 +655,18 @@ test('a show can be planned from a template with independent usages and reserve'
|
||||
name: 'Die kleine Konsole mit dem großen Dreh bearbeiten und verschieben'
|
||||
})
|
||||
.click();
|
||||
await usages.nth(0).getByLabel('Titel').fill('Konsole als Auftakt');
|
||||
await editInlineTitle(
|
||||
usages.nth(0),
|
||||
'Die kleine Konsole mit dem großen Dreh',
|
||||
'Konsole als Auftakt'
|
||||
);
|
||||
await usages.nth(0).locator('.piece-meta-details > summary').click();
|
||||
await usages.nth(0).getByLabel('Dauer in Minuten').fill('5');
|
||||
await usages.nth(0).getByLabel('Eigene Notizen').fill('Kurbel zuerst zeigen');
|
||||
await usages.nth(0).getByRole('button', { name: 'Recherche & Quellen' }).click();
|
||||
await usages
|
||||
.nth(0)
|
||||
.getByRole('textbox', { name: 'Interne Notizen zu dieser Verwendung', exact: true })
|
||||
.fill('Kurbel zuerst zeigen');
|
||||
await usages.nth(0).getByRole('button', { name: 'Verwendung speichern' }).click();
|
||||
await expect(reactionSection).toContainText('Konsole als Auftakt');
|
||||
|
||||
@@ -627,9 +680,18 @@ test('a show can be planned from a template with independent usages and reserve'
|
||||
name: 'Die kleine Konsole mit dem großen Dreh bearbeiten und verschieben'
|
||||
})
|
||||
.click();
|
||||
await usages.nth(1).getByLabel('Titel').fill('Konsole als Rückblick');
|
||||
await editInlineTitle(
|
||||
usages.nth(1),
|
||||
'Die kleine Konsole mit dem großen Dreh',
|
||||
'Konsole als Rückblick'
|
||||
);
|
||||
await usages.nth(1).locator('.piece-meta-details > summary').click();
|
||||
await usages.nth(1).getByLabel('Dauer in Minuten').fill('15');
|
||||
await usages.nth(1).getByLabel('Eigene Notizen').fill('Andere Perspektive');
|
||||
await usages.nth(1).getByRole('button', { name: 'Recherche & Quellen' }).click();
|
||||
await usages
|
||||
.nth(1)
|
||||
.getByRole('textbox', { name: 'Interne Notizen zu dieser Verwendung', exact: true })
|
||||
.fill('Andere Perspektive');
|
||||
await usages.nth(1).getByRole('button', { name: 'Verwendung speichern' }).click();
|
||||
await expect(page.locator('.show-summary')).toContainText('2 Std. 25 Min.');
|
||||
|
||||
@@ -659,7 +721,7 @@ test('a show can be planned from a template with independent usages and reserve'
|
||||
name: 'Die kleine Konsole mit dem großen Dreh bearbeiten und verschieben'
|
||||
})
|
||||
.click();
|
||||
await expect(page.locator('dialog[open]')).toContainText('Sendungsspezifische Kopie');
|
||||
await expect(page.locator('dialog[open]')).toContainText('Sendungsfassung');
|
||||
await expect(
|
||||
page.locator('dialog[open]').getByRole('button', { name: 'Duplizieren' })
|
||||
).toBeVisible();
|
||||
@@ -687,7 +749,6 @@ test('a show can be planned from a template with independent usages and reserve'
|
||||
);
|
||||
await expect(reserveUsage).toHaveClass(/is-dragging/);
|
||||
await finalSectionTarget.dispatchEvent('drop', { dataTransfer: reserveTransfer });
|
||||
await reserveHandle.dispatchEvent('dragend', { dataTransfer: reserveTransfer });
|
||||
await reserveTransfer.dispose();
|
||||
await expect(page.locator('.reserve-usage')).toHaveCount(0);
|
||||
await expect(page.locator('body')).toHaveAttribute('data-builder-document', 'stable');
|
||||
@@ -697,7 +758,7 @@ test('a show can be planned from a template with independent usages and reserve'
|
||||
await savedUsage
|
||||
.getByRole('button', { name: 'Konsole als Auftakt bearbeiten und verschieben' })
|
||||
.click();
|
||||
await expect(savedUsage.getByLabel('Eigene Notizen')).toHaveValue('Kurbel zuerst zeigen');
|
||||
await expect(savedUsage.locator('textarea[name="ownNotes"]')).toHaveValue('Kurbel zuerst zeigen');
|
||||
await page.locator('dialog[open]').getByRole('button', { name: 'Editor schließen' }).click();
|
||||
const duplicatedUsage = page
|
||||
.locator('.editable-usage')
|
||||
@@ -708,7 +769,7 @@ test('a show can be planned from a template with independent usages and reserve'
|
||||
.getByRole('button', { name: 'Konsole als Rückblick bearbeiten und verschieben' })
|
||||
.click();
|
||||
await expect(duplicatedUsage.nth(1).getByLabel('Dauer in Minuten')).toHaveValue('15');
|
||||
await expect(duplicatedUsage.nth(1).getByLabel('Eigene Notizen')).toHaveValue(
|
||||
await expect(duplicatedUsage.nth(1).locator('textarea[name="ownNotes"]')).toHaveValue(
|
||||
'Andere Perspektive'
|
||||
);
|
||||
await page.locator('dialog[open]').getByRole('button', { name: 'Editor schließen' }).click();
|
||||
@@ -717,15 +778,7 @@ test('a show can be planned from a template with independent usages and reserve'
|
||||
await savedUsage
|
||||
.getByRole('button', { name: 'Konsole als Auftakt bearbeiten und verschieben' })
|
||||
.click();
|
||||
const mobileEditorItems = await page
|
||||
.locator('dialog[open] .usage-dialog-editor')
|
||||
.evaluate((element) =>
|
||||
Array.from(element.children)
|
||||
.filter((child) => child.matches('section, button'))
|
||||
.map((child) => child.getBoundingClientRect().top)
|
||||
);
|
||||
expect(mobileEditorItems[1]).toBeGreaterThan(mobileEditorItems[0]);
|
||||
expect(mobileEditorItems[2]).toBeGreaterThan(mobileEditorItems[1]);
|
||||
await expect(page.locator('dialog[open] .piece-dialog-workspace')).toBeVisible();
|
||||
await expectNoHorizontalOverflow(page);
|
||||
await page.screenshot({
|
||||
path: testInfo.outputPath('verwendungseditor-mobile.png'),
|
||||
@@ -733,18 +786,16 @@ test('a show can be planned from a template with independent usages and reserve'
|
||||
});
|
||||
await page
|
||||
.locator('dialog[open]')
|
||||
.getByRole('button', { name: 'Entfernen' })
|
||||
.getByRole('button', { name: 'Aus Sendung entfernen' })
|
||||
.scrollIntoViewIfNeeded();
|
||||
await expect(
|
||||
page.locator('dialog[open]').getByRole('button', { name: 'Entfernen' })
|
||||
page.locator('dialog[open]').getByRole('button', { name: 'Aus Sendung entfernen' })
|
||||
).toBeVisible();
|
||||
await page
|
||||
.locator('dialog[open] form[action="?/updateUsage"] input[name="revision"]')
|
||||
.evaluate((element) => ((element as HTMLInputElement).value = '1'));
|
||||
await page.locator('dialog[open]').getByRole('button', { name: 'Verwendung speichern' }).click();
|
||||
await expect(page.locator('dialog[open]').getByRole('alert')).toContainText(
|
||||
'inzwischen geändert'
|
||||
);
|
||||
await expect(page.getByRole('alert')).toContainText('inzwischen geändert');
|
||||
await page.locator('dialog[open]').getByRole('button', { name: 'Editor schließen' }).click();
|
||||
await page.getByRole('button', { name: 'Ablauf', exact: true }).click();
|
||||
await page.getByPlaceholder('Neuer Abschnitt').fill('Finales Spiel');
|
||||
@@ -842,6 +893,75 @@ test('inbox, archive and administration stay concise', async ({ page }) => {
|
||||
expect(boxes[1]?.y).toBe(boxes[2]?.y);
|
||||
});
|
||||
|
||||
test('tools stay editable in pieces after catalog deactivation', async ({ page }, testInfo) => {
|
||||
await page.goto('/verwaltung');
|
||||
await page.getByRole('button', { name: 'Werkzeug hinzufügen' }).click();
|
||||
const create = page.getByRole('dialog', { name: 'Neues Werkzeug' });
|
||||
await create.getByLabel('Name').fill('E2E Tierlist');
|
||||
await create.getByLabel('Start-URL').fill('https://example.com/tierlist');
|
||||
await create.getByLabel('Beschreibung').fill('Ranking für die Sendung');
|
||||
await create.getByText('Icon auswählen', { exact: true }).click();
|
||||
await create.getByPlaceholder('Icon suchen').fill('Satellite Dish');
|
||||
await page.screenshot({ path: testInfo.outputPath('tool-icon-picker-desktop.png') });
|
||||
await create.getByRole('button', { name: 'Satellite Dish', exact: true }).click();
|
||||
await create.getByText('Formate auswählen', { exact: true }).click();
|
||||
await create.getByRole('checkbox', { name: 'Quiz' }).check();
|
||||
await create.getByRole('button', { name: 'Auswahl schließen' }).click();
|
||||
await page.screenshot({ path: testInfo.outputPath('tool-create-desktop.png'), fullPage: true });
|
||||
await create.getByRole('button', { name: 'Werkzeug anlegen' }).click();
|
||||
const tool = page.locator('.tool-settings-list > button').filter({ hasText: 'E2E Tierlist' });
|
||||
await expect(tool).toContainText('Aktiv');
|
||||
await expect(tool.locator('.catalog-entry-icon svg')).toBeVisible();
|
||||
await page.screenshot({ path: testInfo.outputPath('tool-catalog-desktop.png'), fullPage: true });
|
||||
|
||||
await page.goto('/fundus/piece-quiz');
|
||||
await page.getByRole('button', { name: 'Recherche & Quellen' }).click();
|
||||
await page.getByText('Werkzeuge auswählen', { exact: true }).click();
|
||||
const toolChoice = page.getByRole('checkbox', { name: /E2E Tierlist/ });
|
||||
await expect(toolChoice.locator('xpath=..').locator('svg')).toBeVisible();
|
||||
await toolChoice.check();
|
||||
await page.getByLabel('Arbeitslink').fill('https://example.com/tierlist/e2e-board');
|
||||
await page.getByLabel('Notiz').fill('Vor der Sendung sortieren');
|
||||
await expect(page.locator('.save-indicator')).toContainText('Gespeichert', { timeout: 10_000 });
|
||||
const toolsSection = page.locator('.piece-source-editor').filter({ hasText: 'Werkzeuge' });
|
||||
await toolsSection.scrollIntoViewIfNeeded();
|
||||
await page.screenshot({ path: testInfo.outputPath('piece-tools-desktop.png') });
|
||||
|
||||
await page.goto('/verwaltung');
|
||||
const storedTool = page
|
||||
.locator('.tool-settings-list > button')
|
||||
.filter({ hasText: 'E2E Tierlist' });
|
||||
await storedTool.click();
|
||||
const edit = page.getByRole('dialog', { name: 'E2E Tierlist' });
|
||||
await edit.getByRole('checkbox', { name: /^Aktiv/ }).uncheck();
|
||||
await page.setViewportSize({ width: 390, height: 844 });
|
||||
await expectNoHorizontalOverflow(page);
|
||||
await expect(edit.getByRole('button', { name: 'Änderungen speichern' })).toBeVisible();
|
||||
await edit.getByText('Icon auswählen', { exact: true }).click();
|
||||
await edit.getByPlaceholder('Icon suchen').fill('Satellite Dish');
|
||||
await page.screenshot({ path: testInfo.outputPath('tool-icon-picker-mobile.png') });
|
||||
await edit.getByRole('button', { name: 'Satellite Dish', exact: true }).click();
|
||||
await page.screenshot({ path: testInfo.outputPath('tool-edit-mobile.png') });
|
||||
await edit.getByRole('button', { name: 'Änderungen speichern' }).click();
|
||||
await expect(storedTool).toContainText('Deaktiviert');
|
||||
await page.screenshot({ path: testInfo.outputPath('tool-catalog-mobile.png'), fullPage: true });
|
||||
|
||||
await page.goto('/fundus/piece-quiz');
|
||||
await page.getByRole('button', { name: 'Recherche & Quellen' }).click();
|
||||
await expect(page.locator('.tool-assignment-row')).toContainText('E2E Tierlist');
|
||||
await expect(page.locator('.tool-assignment-row')).toContainText('Deaktiviert');
|
||||
await expect(page.getByLabel('Arbeitslink')).toHaveValue(
|
||||
'https://example.com/tierlist/e2e-board'
|
||||
);
|
||||
await page.setViewportSize({ width: 390, height: 844 });
|
||||
await page
|
||||
.locator('.piece-source-editor')
|
||||
.filter({ hasText: 'Werkzeuge' })
|
||||
.scrollIntoViewIfNeeded();
|
||||
await expectNoHorizontalOverflow(page);
|
||||
await page.screenshot({ path: testInfo.outputPath('piece-tools-mobile.png') });
|
||||
});
|
||||
|
||||
test('validated YouTube and TikTok players switch without exposing private fields', async ({
|
||||
page
|
||||
}, testInfo) => {
|
||||
@@ -861,10 +981,10 @@ test('validated YouTube and TikTok players switch without exposing private field
|
||||
);
|
||||
await page.goto('/live?show=e2e-presentation');
|
||||
const popupPromise = page.waitForEvent('popup');
|
||||
await page.getByRole('button', { name: 'Präsentationsfenster öffnen' }).click();
|
||||
await page.getByRole('button', { name: 'Ausgabe verbinden und öffnen' }).click();
|
||||
const output = await popupPromise;
|
||||
await output.waitForLoadState('networkidle');
|
||||
await expect(output.getByText('Bereit für den nächsten Inhalt')).toBeVisible();
|
||||
await expect(output.locator('.output-content')).toHaveCount(0);
|
||||
await expect(output.locator('.heinzlive-output')).toHaveClass(/empty/);
|
||||
|
||||
await page.getByRole('button', { name: 'YouTube Kurzlink präsentieren' }).click();
|
||||
const youtube = output.locator('iframe[title="YouTube Vorschau"]');
|
||||
@@ -872,6 +992,9 @@ test('validated YouTube and TikTok players switch without exposing private field
|
||||
'src',
|
||||
'https://www.youtube-nocookie.com/embed/dQw4w9WgXcQ?start=75'
|
||||
);
|
||||
await page.getByRole('button', { name: 'Präsentation leeren' }).click();
|
||||
await expect(youtube).toHaveCount(0);
|
||||
await expect(output.locator('.heinzlive-output')).toHaveClass(/empty/);
|
||||
await expect(output.locator('.output-connection')).toHaveClass(/sr-only/);
|
||||
const publicState = await output.evaluate(async () =>
|
||||
JSON.stringify(await fetch(`${location.pathname}/state`).then((response) => response.json()))
|
||||
@@ -905,9 +1028,11 @@ test('live control persists state and exposes only explicit presentation data',
|
||||
page,
|
||||
browser
|
||||
}, testInfo) => {
|
||||
setSectionDuration('section-stories', 300);
|
||||
await page.setViewportSize({ width: 1280, height: 900 });
|
||||
await page.goto('/fundus?q=kleine+Konsole&includePlanned=1');
|
||||
await page.getByRole('heading', { name: 'Die kleine Konsole mit dem großen Dreh' }).click();
|
||||
await page.getByRole('button', { name: 'Präsentation', exact: true }).click();
|
||||
const png = Buffer.from(
|
||||
'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNk+A8AAQUBAScY42YAAAAASUVORK5CYII=',
|
||||
'base64'
|
||||
@@ -919,11 +1044,20 @@ test('live control persists state and exposes only explicit presentation data',
|
||||
});
|
||||
await page.getByLabel('Alternativtext').fill('Kleine Konsole im Live-Bild');
|
||||
await page.getByRole('button', { name: 'Bild hochladen' }).click();
|
||||
await page.goto('/sendungen/show-october');
|
||||
const plannedConsole = page
|
||||
.locator('.editable-usage')
|
||||
.filter({ hasText: 'Die kleine Konsole mit dem großen Dreh' })
|
||||
.first();
|
||||
await plannedConsole.getByRole('button', { name: /bearbeiten und verschieben/ }).click();
|
||||
await plannedConsole.getByRole('button', { name: 'Aus Fundus aktualisieren' }).click();
|
||||
|
||||
await page.goto('/live?show=show-october');
|
||||
await expect(page.getByText('Noch nicht gestartet.')).toBeVisible();
|
||||
await page.getByRole('button', { name: 'Sendung starten' }).click();
|
||||
await expect(page.locator('#current-title')).toHaveText('Die kleine Konsole mit dem großen Dreh');
|
||||
await expect(page.locator('.section-countdown')).toContainText(/Noch 0[45]:\d{2}/);
|
||||
await expect(page.locator('.live-materials')).toContainText('Herstellerseite');
|
||||
await expect(
|
||||
page.getByText('Herstellerangaben gegen unabhängige Tests prüfen')
|
||||
).not.toBeVisible();
|
||||
@@ -942,16 +1076,15 @@ test('live control persists state and exposes only explicit presentation data',
|
||||
|
||||
const [popup] = await Promise.all([
|
||||
page.waitForEvent('popup'),
|
||||
page.getByRole('button', { name: 'Präsentationsfenster öffnen' }).click()
|
||||
page.getByRole('button', { name: 'Ausgabe verbinden und öffnen' }).click()
|
||||
]);
|
||||
await popup.waitForURL(/\/heinzlive\/[A-Za-z0-9_-]+$/);
|
||||
await popup.waitForURL(/\/heinzlive\/default#/);
|
||||
const outputUrl = popup.url();
|
||||
const anonymous = await browser.newContext();
|
||||
const output = await anonymous.newPage();
|
||||
await output.goto(outputUrl);
|
||||
await expect(
|
||||
output.getByRole('heading', { name: 'Bereit für den nächsten Inhalt' })
|
||||
).toBeVisible();
|
||||
await expect(output.locator('.output-content')).toHaveCount(0);
|
||||
await expect(output.locator('.heinzlive-output')).toHaveClass(/empty/);
|
||||
|
||||
await page.getByRole('button', { name: 'Präsentieren', exact: true }).click();
|
||||
await expect(
|
||||
@@ -959,7 +1092,8 @@ test('live control persists state and exposes only explicit presentation data',
|
||||
).toBeVisible({
|
||||
timeout: 10_000
|
||||
});
|
||||
await expect(output.getByText('Weniger Leistung, mehr Idee.')).toBeVisible();
|
||||
await expect(output.getByRole('heading', { name: 'Weniger Leistung, mehr Idee' })).toBeVisible();
|
||||
await expect(output.locator('.output-topics')).toHaveText('Gaming');
|
||||
await expect(output.getByAltText('Kleine Konsole im Live-Bild')).toBeVisible();
|
||||
await output.screenshot({ path: testInfo.outputPath('heinzlive-output.png'), fullPage: true });
|
||||
const outputHtml = await output.content();
|
||||
@@ -967,13 +1101,21 @@ test('live control persists state and exposes only explicit presentation data',
|
||||
expect(outputHtml).not.toContain('Erst Formfaktor zeigen');
|
||||
expect(outputHtml).not.toContain(adminEmail);
|
||||
expect(outputHtml).not.toContain('live-konsole.png');
|
||||
const outputState = await anonymous.request.get(`${outputUrl}/state`);
|
||||
expect(outputHtml).not.toContain('https://example.com/console');
|
||||
const stateUrl = new URL(outputUrl);
|
||||
stateUrl.hash = '';
|
||||
stateUrl.pathname += '/state';
|
||||
const outputState = await anonymous.request.get(stateUrl.toString());
|
||||
expect(outputState.status()).toBe(200);
|
||||
const outputJson = await outputState.text();
|
||||
expect(outputJson).toContain('Weniger Leistung');
|
||||
expect(outputJson).not.toContain('Herstellerangaben');
|
||||
expect(outputJson).not.toContain('Moderationsstichpunkte');
|
||||
expect(outputJson).not.toContain('live-konsole.png');
|
||||
await page.getByRole('button', { name: 'Präsentation leeren' }).click();
|
||||
await expect(output.locator('.output-content')).toHaveCount(0);
|
||||
await expect(output.locator('.heinzlive-output')).toHaveClass(/empty/);
|
||||
await page.getByRole('button', { name: 'Präsentieren', exact: true }).click();
|
||||
|
||||
await page.getByRole('button', { name: 'Als Nächstes' }).click();
|
||||
await expect(page.locator('.next-card')).toContainText('Pixelart');
|
||||
@@ -997,9 +1139,11 @@ test('live control persists state and exposes only explicit presentation data',
|
||||
await page.evaluate(() => {
|
||||
window.open = () => null;
|
||||
});
|
||||
await page.getByRole('button', { name: 'Präsentationsfenster öffnen' }).click();
|
||||
await page.getByRole('button', { name: 'Ausgabe verbinden und öffnen' }).click();
|
||||
await expect(
|
||||
page.getByText('Popup blockiert. Bitte Popups erlauben und erneut öffnen.')
|
||||
page
|
||||
.getByRole('status')
|
||||
.filter({ hasText: 'Präsentationsfenster konnte nicht geöffnet werden' })
|
||||
).toBeVisible();
|
||||
await anonymous.close();
|
||||
await popup.close();
|
||||
@@ -1012,33 +1156,42 @@ test('pieces autosave safely, detect conflicts and protect uploaded images', asy
|
||||
}, testInfo) => {
|
||||
await page.setViewportSize({ width: 1280, height: 1000 });
|
||||
await page.goto('/fundus');
|
||||
await page.getByText('Neues Piece anlegen').click();
|
||||
await page.locator('.template-picker > summary').click();
|
||||
await page.getByRole('button', { name: /Reaction \/ Fundstück/ }).click();
|
||||
await expect(page).toHaveURL(/\/fundus\/[a-f0-9-]+$/);
|
||||
const pieceUrl = page.url();
|
||||
|
||||
await page.getByLabel('Titel').fill('E2E Fundstück mit Markdown');
|
||||
await page.getByRole('link', { name: '← Fundus', exact: true }).click();
|
||||
await editInlineTitle(page, 'Neues Fundstück', 'E2E Fundstück mit Markdown');
|
||||
await expect(page.locator('.save-indicator')).toContainText('Gespeichert', { timeout: 10_000 });
|
||||
await page.getByRole('button', { name: 'Editor schließen' }).click();
|
||||
await expect(page).toHaveURL(/\/fundus$/);
|
||||
await page.getByRole('heading', { name: 'E2E Fundstück mit Markdown' }).click();
|
||||
await expect(page).toHaveURL(pieceUrl);
|
||||
await page.getByRole('button', { name: 'Einordnung bearbeiten' }).click();
|
||||
await page.getByText('Status, Dauer und Einordnung').click();
|
||||
await page
|
||||
.getByLabel('Kurzbeschreibung')
|
||||
.fill('Persistiert nach Neuladen und ist gezielt suchbar.');
|
||||
await page.getByLabel('Status').selectOption('ready');
|
||||
await page.getByLabel('Dauer in Minuten').fill('10.25');
|
||||
await page.getByText('Themen auswählen', { exact: true }).click();
|
||||
await page.getByLabel('Gaming').check();
|
||||
await openEditorialField(page, 'Eigene Gedanken & Recherche');
|
||||
await page.getByLabel('Private Recherche').fill('Nur intern: **Hintergrund prüfen**.');
|
||||
await openEditorialField(page, 'Private Recherche');
|
||||
await page
|
||||
.getByRole('textbox', { name: 'Private Recherche', exact: true })
|
||||
.fill('Nur intern: **Hintergrund prüfen**.');
|
||||
await openEditorialField(page, 'Moderationsstichpunkte');
|
||||
await page.getByLabel('Moderationsstichpunkte').fill('Den Kern in zwei Sätzen erklären.');
|
||||
await expect(page.getByLabel('Private Recherche')).toBeVisible();
|
||||
await page.getByRole('button', { name: 'Präsentation bearbeiten' }).click();
|
||||
await page
|
||||
.getByRole('textbox', { name: 'Moderationsstichpunkte', exact: true })
|
||||
.fill('Den Kern in zwei Sätzen erklären.');
|
||||
await openEditorialField(page, 'Private Recherche');
|
||||
await expect(page.getByRole('textbox', { name: 'Private Recherche', exact: true })).toHaveValue(
|
||||
'Nur intern: **Hintergrund prüfen**.'
|
||||
);
|
||||
await openEditorialField(page, 'Präsentationstext');
|
||||
await page
|
||||
.getByLabel('Präsentationstext')
|
||||
.getByRole('textbox', { name: 'Öffentlicher Text', exact: true })
|
||||
.fill('## Sichere Vorschau\n\n<script>globalThis.e2eXss = true</script> **sichtbar**');
|
||||
await openEditorialField(page, 'Private Recherche');
|
||||
await page.getByRole('button', { name: 'Quelle hinzufügen' }).click();
|
||||
const source = page.locator('.source-row').last();
|
||||
await source.getByLabel('Name').fill('Originalbeitrag');
|
||||
@@ -1047,19 +1200,17 @@ test('pieces autosave safely, detect conflicts and protect uploaded images', asy
|
||||
await expect(page.locator('.save-indicator')).toContainText('Gespeichert', { timeout: 10_000 });
|
||||
await page.waitForTimeout(1_200);
|
||||
await expect(page.locator('.save-indicator')).toContainText('Gespeichert');
|
||||
await page
|
||||
.locator('.editorial-field')
|
||||
.filter({ has: page.getByRole('heading', { name: 'Präsentationstext', exact: true }) })
|
||||
.getByRole('button', { name: 'Lesen' })
|
||||
.click();
|
||||
await expect(page.locator('.markdown-preview script')).toHaveCount(0);
|
||||
await expect(page.locator('.markdown-preview').last()).toContainText('Sichere Vorschau');
|
||||
await openEditorialField(page, 'Präsentationstext');
|
||||
await expect(page.locator('.piece-presentation-preview script')).toHaveCount(0);
|
||||
await expect(page.locator('.piece-presentation-preview')).toContainText('Sichere Vorschau');
|
||||
await page.reload();
|
||||
await expect(page.getByLabel('Titel')).toHaveValue('E2E Fundstück mit Markdown');
|
||||
await page.getByRole('button', { name: 'Einordnung bearbeiten' }).click();
|
||||
await expect(
|
||||
page.getByRole('button', { name: 'E2E Fundstück mit Markdown Titel bearbeiten' })
|
||||
).toBeVisible();
|
||||
await page.getByText('Status, Dauer und Einordnung').click();
|
||||
await expect(page.getByLabel('Dauer in Minuten')).toHaveValue('10.25');
|
||||
await openEditorialField(page, 'Eigene Gedanken & Recherche');
|
||||
await expect(page.getByLabel('Private Recherche')).toHaveValue(
|
||||
await openEditorialField(page, 'Private Recherche');
|
||||
await expect(page.getByRole('textbox', { name: 'Private Recherche', exact: true })).toHaveValue(
|
||||
'Nur intern: **Hintergrund prüfen**.'
|
||||
);
|
||||
|
||||
@@ -1067,6 +1218,7 @@ test('pieces autosave safely, detect conflicts and protect uploaded images', asy
|
||||
'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNk+A8AAQUBAScY42YAAAAASUVORK5CYII=',
|
||||
'base64'
|
||||
);
|
||||
await page.getByRole('button', { name: 'Präsentation', exact: true }).click();
|
||||
await page.getByLabel('Bild', { exact: true }).setInputFiles({
|
||||
name: 'redaktionsbild.png',
|
||||
mimeType: 'image/png',
|
||||
@@ -1087,9 +1239,9 @@ test('pieces autosave safely, detect conflicts and protect uploaded images', asy
|
||||
|
||||
const concurrent = await page.context().newPage();
|
||||
await concurrent.goto(pieceUrl);
|
||||
await page.getByLabel('Titel').fill('E2E Fundstück, extern aktualisiert');
|
||||
await editInlineTitle(page, 'E2E Fundstück mit Markdown', 'E2E Fundstück, extern aktualisiert');
|
||||
await expect(page.locator('.save-indicator')).toContainText('Gespeichert', { timeout: 10_000 });
|
||||
await concurrent.getByRole('button', { name: 'Einordnung bearbeiten' }).click();
|
||||
await concurrent.getByText('Status, Dauer und Einordnung').click();
|
||||
await concurrent
|
||||
.getByLabel('Kurzbeschreibung')
|
||||
.fill('Diese veraltete Änderung darf nicht gewinnen.');
|
||||
@@ -1097,8 +1249,10 @@ test('pieces autosave safely, detect conflicts and protect uploaded images', asy
|
||||
timeout: 10_000
|
||||
});
|
||||
await concurrent.reload();
|
||||
await expect(concurrent.getByLabel('Titel')).toHaveValue('E2E Fundstück, extern aktualisiert');
|
||||
await concurrent.getByRole('button', { name: 'Einordnung bearbeiten' }).click();
|
||||
await expect(
|
||||
concurrent.getByRole('button', { name: 'E2E Fundstück, extern aktualisiert Titel bearbeiten' })
|
||||
).toBeVisible();
|
||||
await concurrent.getByText('Status, Dauer und Einordnung').click();
|
||||
await expect(concurrent.getByLabel('Kurzbeschreibung')).not.toHaveValue(
|
||||
'Diese veraltete Änderung darf nicht gewinnen.'
|
||||
);
|
||||
@@ -1109,7 +1263,7 @@ test('pieces autosave safely, detect conflicts and protect uploaded images', asy
|
||||
await expect(
|
||||
page.getByRole('heading', { name: 'E2E Fundstück, extern aktualisiert' })
|
||||
).toBeVisible();
|
||||
await page.getByRole('link', { name: 'Bearbeiten' }).click();
|
||||
await page.getByRole('heading', { name: 'E2E Fundstück, extern aktualisiert' }).click();
|
||||
await page.getByRole('button', { name: 'Piece archivieren' }).click();
|
||||
await expect(page).toHaveURL(/\/archiv$/);
|
||||
const archived = page.locator('.archive-list article').filter({ hasText: 'extern aktualisiert' });
|
||||
@@ -1118,26 +1272,32 @@ test('pieces autosave safely, detect conflicts and protect uploaded images', asy
|
||||
await expect(archived).toHaveCount(0);
|
||||
await page.goto('/fundus?q=extern+aktualisiert');
|
||||
await expect(page.locator('.piece-card')).toHaveCount(1);
|
||||
await page.locator('.piece-card .piece-actions > summary').click();
|
||||
await page.locator('.piece-card').getByRole('button', { name: 'Duplizieren' }).click();
|
||||
await expect(page.getByLabel('Titel')).toHaveValue(
|
||||
'Kopie von E2E Fundstück, extern aktualisiert'
|
||||
);
|
||||
await expect(
|
||||
page.getByRole('button', {
|
||||
name: 'Kopie von E2E Fundstück, extern aktualisiert Titel bearbeiten'
|
||||
})
|
||||
).toBeVisible();
|
||||
|
||||
await page.context().setOffline(true);
|
||||
await page.getByLabel('Titel').fill('Kopie mit unterbrochener Verbindung');
|
||||
await editInlineTitle(
|
||||
page,
|
||||
'Kopie von E2E Fundstück, extern aktualisiert',
|
||||
'Kopie mit unterbrochener Verbindung'
|
||||
);
|
||||
await expect(page.locator('.save-indicator')).toContainText('Speichern fehlgeschlagen', {
|
||||
timeout: 10_000
|
||||
});
|
||||
await page.context().setOffline(false);
|
||||
await page.getByRole('button', { name: 'Jetzt speichern' }).click();
|
||||
await page.getByRole('button', { name: 'Erneut speichern' }).click();
|
||||
await expect(page.locator('.save-indicator')).toContainText('Gespeichert', { timeout: 10_000 });
|
||||
|
||||
await page.setViewportSize({ width: 390, height: 844 });
|
||||
await setTheme(page, 'dark');
|
||||
await page.reload();
|
||||
await page.getByRole('button', { name: 'Quellen', exact: true }).click();
|
||||
await page.getByRole('button', { name: 'Recherche & Quellen' }).click();
|
||||
await expect(page.getByRole('heading', { name: 'Quellen', exact: true })).toBeVisible();
|
||||
await page.getByRole('button', { name: 'Quellen schließen' }).click();
|
||||
await expectNoHorizontalOverflow(page);
|
||||
await page.screenshot({
|
||||
path: testInfo.outputPath('piece-editor-mobile-dark.png'),
|
||||
@@ -1155,33 +1315,33 @@ test('a quickly captured video can be written and previewed before classificatio
|
||||
})
|
||||
);
|
||||
await page.goto('/eingang');
|
||||
await page.getByLabel('Titel oder Gedanke').fill('Schnelles Video-Fundstück');
|
||||
await page.getByLabel('Gedanke').fill('Schnelles Video-Fundstück');
|
||||
await page.getByLabel('Link').fill('https://youtu.be/dQw4w9WgXcQ');
|
||||
await page.getByRole('button', { name: 'Aufnehmen und öffnen' }).click();
|
||||
await expect(page).toHaveURL(/\/fundus\/[a-f0-9-]+$/);
|
||||
await expect(page.getByRole('link', { name: 'Original öffnen' })).toHaveAttribute(
|
||||
'href',
|
||||
await page.getByRole('button', { name: 'Im Eingang ablegen' }).click();
|
||||
await expect(page).toHaveURL(/\/eingang(?:\?\/capture)?$/);
|
||||
await page.locator('.inbox-item').filter({ hasText: 'Schnelles Video-Fundstück' }).click();
|
||||
await page.getByRole('button', { name: 'Recherche & Quellen' }).click();
|
||||
await expect(page.locator('.source-row').getByLabel('URL')).toHaveValue(
|
||||
'https://youtu.be/dQw4w9WgXcQ'
|
||||
);
|
||||
await expect(page.getByLabel('Status')).toBeHidden();
|
||||
|
||||
await openEditorialField(page, 'Eigene Gedanken & Recherche');
|
||||
await openEditorialField(page, 'Private Recherche');
|
||||
await page
|
||||
.getByLabel('Private Recherche')
|
||||
.getByRole('textbox', { name: 'Private Recherche', exact: true })
|
||||
.fill('Warum funktioniert der Einstieg so unmittelbar?');
|
||||
await openEditorialField(page, 'Moderationsstichpunkte');
|
||||
await page
|
||||
.getByLabel('Moderationsstichpunkte')
|
||||
.getByRole('textbox', { name: 'Moderationsstichpunkte', exact: true })
|
||||
.fill('Erst Clip zeigen, dann die Beobachtung öffnen.');
|
||||
await expect(page.getByLabel('Private Recherche')).toBeVisible();
|
||||
|
||||
await page.getByRole('button', { name: 'Präsentation bearbeiten' }).click();
|
||||
await page.getByLabel('Video').check();
|
||||
await page.getByRole('button', { name: 'Präsentation', exact: true }).click();
|
||||
await page.getByRole('radio', { name: 'Video', exact: true }).check();
|
||||
await page.getByRole('combobox', { name: 'Quelle', exact: true }).selectOption('0');
|
||||
await expect(page.locator('.save-indicator')).toContainText('Gespeichert', { timeout: 10_000 });
|
||||
|
||||
const previewPromise = page.waitForEvent('popup');
|
||||
await page.getByRole('link', { name: 'Präsentation testen' }).click();
|
||||
await page.getByRole('link', { name: 'In neuem Fenster testen' }).click();
|
||||
const preview = await previewPromise;
|
||||
await expect(preview.locator('iframe[title="Schnelles Video-Fundstück"]')).toHaveAttribute(
|
||||
'src',
|
||||
@@ -1191,9 +1351,9 @@ test('a quickly captured video can be written and previewed before classificatio
|
||||
|
||||
await page.setViewportSize({ width: 390, height: 844 });
|
||||
await page.getByRole('button', { name: 'Präsentation', exact: true }).click();
|
||||
await expect(page.getByLabel('Video')).toBeVisible();
|
||||
await page.getByRole('button', { name: 'Präsentation schließen' }).click();
|
||||
await expect(page.getByLabel('Private Recherche')).toBeVisible();
|
||||
await expect(page.getByRole('radio', { name: 'Video', exact: true })).toBeVisible();
|
||||
await page.getByRole('button', { name: 'Recherche & Quellen' }).click();
|
||||
await expect(page.getByRole('textbox', { name: 'Private Recherche', exact: true })).toBeVisible();
|
||||
await expectNoHorizontalOverflow(page);
|
||||
});
|
||||
|
||||
@@ -1201,21 +1361,19 @@ test('link preview uses one existing source, persists manual fields and isolates
|
||||
page
|
||||
}, testInfo) => {
|
||||
await page.goto('/fundus/piece-console');
|
||||
await page.getByRole('button', { name: 'Präsentation bearbeiten' }).click();
|
||||
await page.getByLabel('Linkvorschau').check();
|
||||
await page.getByRole('button', { name: 'Präsentation', exact: true }).click();
|
||||
await page.getByRole('radio', { name: 'Linkvorschau', exact: true }).check();
|
||||
await page.getByRole('combobox', { name: 'Quelle', exact: true }).selectOption('0');
|
||||
await page.getByLabel('Titel', { exact: true }).last().fill('Manuell korrigierte Linkvorschau');
|
||||
await page.getByLabel('Kartentitel').fill('Manuell korrigierte Linkvorschau');
|
||||
await page.getByLabel('Anreißer').fill('Ein kurzer manueller Anreißer ohne Vorschaubild.');
|
||||
await expect(page.locator('.save-indicator')).toContainText('Gespeichert', { timeout: 10_000 });
|
||||
await page.reload();
|
||||
await page.getByRole('button', { name: 'Präsentation bearbeiten' }).click();
|
||||
await expect(page.getByLabel('Linkvorschau')).toBeChecked();
|
||||
await expect(page.getByLabel('Titel', { exact: true }).last()).toHaveValue(
|
||||
'Manuell korrigierte Linkvorschau'
|
||||
);
|
||||
await page.getByRole('button', { name: 'Präsentation', exact: true }).click();
|
||||
await expect(page.getByRole('radio', { name: 'Linkvorschau', exact: true })).toBeChecked();
|
||||
await expect(page.getByLabel('Kartentitel')).toHaveValue('Manuell korrigierte Linkvorschau');
|
||||
|
||||
const previewPromise = page.waitForEvent('popup');
|
||||
await page.getByRole('link', { name: 'Präsentation testen' }).click();
|
||||
await page.getByRole('link', { name: 'In neuem Fenster testen' }).click();
|
||||
const preview = await previewPromise;
|
||||
await preview.waitForLoadState('networkidle');
|
||||
await expect(preview.getByText('Isolierte Testansicht')).toBeVisible();
|
||||
@@ -1223,7 +1381,7 @@ test('link preview uses one existing source, persists manual fields and isolates
|
||||
preview.getByRole('heading', { name: 'Manuell korrigierte Linkvorschau' })
|
||||
).toBeVisible();
|
||||
await expect(preview.getByText('Ein kurzer manueller Anreißer ohne Vorschaubild.')).toBeVisible();
|
||||
await expect(preview.locator('.output-link-image')).toHaveCount(0);
|
||||
await expect(preview.locator('.output-link-image')).toHaveCount(1);
|
||||
await preview.screenshot({
|
||||
path: testInfo.outputPath('linkvorschau-desktop.png'),
|
||||
fullPage: true
|
||||
@@ -1236,8 +1394,10 @@ test('link preview uses one existing source, persists manual fields and isolates
|
||||
});
|
||||
await preview.close();
|
||||
|
||||
await page.getByRole('button', { name: 'Recherche & Quellen' }).click();
|
||||
await page.locator('.source-row').first().getByLabel('URL').fill('http://127.0.0.1/private');
|
||||
await expect(page.locator('.save-indicator')).toContainText('Gespeichert', { timeout: 10_000 });
|
||||
await page.getByRole('button', { name: 'Präsentation', exact: true }).click();
|
||||
const blockedPreview = page.waitForResponse((response) =>
|
||||
response.url().includes('?/loadPreview')
|
||||
);
|
||||
|
||||
Reference in new issue
Block a user