Changeset 97bcf7e in Klonkt for src/services

Timestamp:

07/30/2026 07:47:53 AM (6 weeks ago)

Author:

Robin <roboburr@…>

Branches:

main

Children:

7d01696

Parents:

6089c53

Message:

Video op maat in de post, en een Video-tab in Media

Robins opdracht (30-7): videoverwerking beter aanpakken. Een video die vanuit
Shaer op de Klonkt van een ward landt, rendert nu op maat in plaats van te
groot: dezelfde regels als afbeeldingen in de post-tekst, plus een plafond
(70vh/540px) en object-fit zodat een portret-video de kolom niet meer
volduwt. Geldt ook in de Krant en Berichten (tl-content), waar dezelfde
content langskomt. En de video-tag uit de composer krijgt preload=metadata,
dus de browser toont het eerste frame als voorlopige thumbnail.

Nieuw: Beheer -> Media -> Video's. De videos die C2S-uploads binnenbrachten
(Shaers composer, de boei), met bestandsnaam, grootte, gebruiksteller uit
content plus c2s_attachments, kopieer-URL, en verwijderen alleen voor
ongebruikte, met dezelfde basename-en-binnen-de-map-teugels als bij
afbeeldingen.

Echte posterframes (server-side thumbnails) kunnen hier nog niet: er staat
geen ffmpeg op de VPS. Dat wordt een bead, met de aantekening dat Shaer
thumbnails straks native kan maken (AVAssetImageGenerator /
MediaMetadataRetriever), zonder server-hulp.

Changed files:
src/assets/css/style.css

• .post-content video en .tl-content video: maatvoering + plafond

src/services/ActivityPubService.js

• de gevouwen video-tag preloadt zijn metadata

src/routes/admin-media.js

• videoEntries + GET /videos + POST /videos/delete

src/views/partials/media-tabs.ejs

• de Video-tab tussen Afbeeldingen en Audio

src/services/i18n.js

• media_videos/videos_*-strings, NL/EN/DE

New file:
src/views/pages/admin-videos.ejs

• de Video-tab zelf, zelfde snit als de afbeeldingenpagina

remarks: 336 tests groen, server start. Draait nog nergens; beta/demo
bijwerken maakt het zichtbaar.

-robo
Co-Authored-By: Claude Opus 5 <noreply@…>

Location:

src/services

Files:

• ActivityPubService.js (modified) (1 diff)
• i18n.js (modified) (3 diffs)

src/services/ActivityPubService.js

@@ -2389 +2389 @@
     if (a.mediaType.startsWith('image/')) return `<p><img src="${a.url}" alt="${esc(a.name)}"></p>`;
     if (a.mediaType.startsWith('audio/')) return `<p><audio controls preload="metadata" src="${a.url}"></audio></p>`;
-    return `<p><video controls playsinline src="${a.url}"></video></p>`;
+    return `<p><video controls playsinline preload="metadata" src="${a.url}"></video></p>`;
   }).join('');
   const postId = crypto.randomUUID();

src/services/i18n.js

@@ -74 +74 @@
     'admin.tagline_hub': 'Hub-modus — bedrijfssite met gebruikers, elk hun eigen Klonkt Hub.',
     'admin.b_sites': '🌐 Sites', 'admin.b_users': '👥 Gebruikers', 'admin.b_audio': '🎵 Audio',
-    'admin.b_media': '🎬 Media', 'admin.t_media': 'Media', 'admin.media_images': 'Afbeeldingen', 'admin.media_count': 'afbeeldingen', 'admin.media_unused': 'ongebruikt', 'admin.media_cleanup': 'Ongebruikt opruimen', 'admin.media_cleanup_confirm': 'Alle ongebruikte afbeeldingen verwijderen?', 'admin.media_empty': 'Nog geen afbeeldingen geüpload.', 'admin.media_copy': 'Kopieer URL', 'admin.media_del_confirm': 'Deze afbeelding verwijderen?',
+    'admin.b_media': '🎬 Media', 'admin.t_media': 'Media', 'admin.media_images': 'Afbeeldingen', 'admin.media_videos': "Video's", 'admin.videos_count': "video's", 'admin.videos_empty': "Nog geen video's geupload.", 'admin.videos_del_confirm': 'Deze video verwijderen?', 'admin.media_count': 'afbeeldingen', 'admin.media_unused': 'ongebruikt', 'admin.media_cleanup': 'Ongebruikt opruimen', 'admin.media_cleanup_confirm': 'Alle ongebruikte afbeeldingen verwijderen?', 'admin.media_empty': 'Nog geen afbeeldingen geüpload.', 'admin.media_copy': 'Kopieer URL', 'admin.media_del_confirm': 'Deze afbeelding verwijderen?',
     'admin.b_playlists': '📃 Playlists', 'admin.b_comments': '💬 Reacties', 'admin.b_seo': '🔎 SEO',
     'admin.b_settings': '⚙️ Instellingen', 'admin.b_newpost': '✍️ Nieuwe post', 'admin.b_look': '🎨 Uiterlijk',
@@ -1015 +1015 @@
     'admin.tagline_hub': 'Hub mode — a company site with users, each their own Klonkt Hub.',
     'admin.b_sites': '🌐 Sites', 'admin.b_users': '👥 Users', 'admin.b_audio': '🎵 Audio',
-    'admin.b_media': '🎬 Media', 'admin.t_media': 'Media', 'admin.media_images': 'Images', 'admin.media_count': 'images', 'admin.media_unused': 'unused', 'admin.media_cleanup': 'Delete unused', 'admin.media_cleanup_confirm': 'Delete all unused images?', 'admin.media_empty': 'No images uploaded yet.', 'admin.media_copy': 'Copy URL', 'admin.media_del_confirm': 'Delete this image?',
+    'admin.b_media': '🎬 Media', 'admin.t_media': 'Media', 'admin.media_images': 'Images', 'admin.media_videos': 'Videos', 'admin.videos_count': 'videos', 'admin.videos_empty': 'No videos uploaded yet.', 'admin.videos_del_confirm': 'Delete this video?', 'admin.media_count': 'images', 'admin.media_unused': 'unused', 'admin.media_cleanup': 'Delete unused', 'admin.media_cleanup_confirm': 'Delete all unused images?', 'admin.media_empty': 'No images uploaded yet.', 'admin.media_copy': 'Copy URL', 'admin.media_del_confirm': 'Delete this image?',
     'admin.b_playlists': '📃 Playlists', 'admin.b_comments': '💬 Comments', 'admin.b_seo': '🔎 SEO',
     'admin.b_settings': '⚙️ Settings', 'admin.b_newpost': '✍️ New post', 'admin.b_look': '🎨 Appearance',
@@ -1950 +1950 @@
     'admin.tagline_hub': 'Hub-Modus — eine Firmenseite mit Nutzern, je ein eigener Klonkt Hub.',
     'admin.b_sites': '🌐 Seiten', 'admin.b_users': '👥 Nutzer', 'admin.b_audio': '🎵 Audio',
-    'admin.b_media': '🎬 Medien', 'admin.t_media': 'Medien', 'admin.media_images': 'Bilder', 'admin.media_count': 'Bilder', 'admin.media_unused': 'ungenutzt', 'admin.media_cleanup': 'Ungenutzte löschen', 'admin.media_cleanup_confirm': 'Alle ungenutzten Bilder löschen?', 'admin.media_empty': 'Noch keine Bilder hochgeladen.', 'admin.media_copy': 'URL kopieren', 'admin.media_del_confirm': 'Dieses Bild löschen?',
+    'admin.b_media': '🎬 Medien', 'admin.t_media': 'Medien', 'admin.media_images': 'Bilder', 'admin.media_videos': 'Videos', 'admin.videos_count': 'Videos', 'admin.videos_empty': 'Noch keine Videos hochgeladen.', 'admin.videos_del_confirm': 'Dieses Video löschen?', 'admin.media_count': 'Bilder', 'admin.media_unused': 'ungenutzt', 'admin.media_cleanup': 'Ungenutzte löschen', 'admin.media_cleanup_confirm': 'Alle ungenutzten Bilder löschen?', 'admin.media_empty': 'Noch keine Bilder hochgeladen.', 'admin.media_copy': 'URL kopieren', 'admin.media_del_confirm': 'Dieses Bild löschen?',
     'admin.b_playlists': '📃 Playlists', 'admin.b_comments': '💬 Kommentare', 'admin.b_seo': '🔎 SEO',
     'admin.b_settings': '⚙️ Einstellungen', 'admin.b_newpost': '✍️ Neuer Beitrag', 'admin.b_look': '🎨 Aussehen',