Changeset 28f797d in Klonkt

Timestamp:

06/30/2026 04:31:56 PM (2 months ago)

Author:

roboburr <roboburr@…>

Branches:

main

Children:

ecbfa41

Parents:

28bf7f0

Message:

feat(post): share button at the bottom of posts

A "Share/Deel" button under the post (visible to everyone). Uses the Web Share API (native share
sheet) where available, otherwise copies the post URL to the clipboard with a "Link copied"
confirmation. Wired through the existing delegated click handler (CSP-safe, no inline on*).

• src/views/pages/post.ejs — share button + feedback span
• src/views/shell.ejs — data-share delegated handler (navigator.share / clipboard)
• src/services/i18n.js — post.share, post.share_copied (nl/en/de)

Co-Authored-By: Claude <noreply@…>

Location:

src

Files:

• services/i18n.js (modified) (3 diffs)
• views/pages/post.ejs (modified) (1 diff)
• views/shell.ejs (modified) (1 diff)

src/services/i18n.js

@@ -695 +695 @@
     'pedit.pin_top': 'bovenaan',
     'pedit.pin_nth_suffix': 'e van boven',
-    'pedit.noindex_label': 'noindex (verberg voor zoekmachines)', 'pedit.nsfw_label': 'NSFW / gevoelige inhoud', 'pedit.fedi_audio_label': 'Audio openbaar delen op de fediverse (speelt inline in apps; bestand downloadbaar)', 'pedit.nsfw_cw_ph': 'Waarschuwingstekst (optioneel, standaard: Gevoelige inhoud)', 'post.nsfw_warning': 'Gevoelige inhoud', 'post.nsfw_show': 'Tonen',
+    'pedit.noindex_label': 'noindex (verberg voor zoekmachines)', 'pedit.nsfw_label': 'NSFW / gevoelige inhoud', 'pedit.fedi_audio_label': 'Audio openbaar delen op de fediverse (speelt inline in apps; bestand downloadbaar)', 'pedit.nsfw_cw_ph': 'Waarschuwingstekst (optioneel, standaard: Gevoelige inhoud)', 'post.nsfw_warning': 'Gevoelige inhoud', 'post.nsfw_show': 'Tonen', 'post.share': 'Deel', 'post.share_copied': 'Link gekopieerd ✓',
     'pedit.fan_only_label': 'Alleen voor ingelogde fans',
     'pedit.schedule_label': 'Publicatie inplannen',
@@ -1611 +1611 @@
     'pedit.pin_top': 'at the top',
     'pedit.pin_nth_suffix': 'th from top',
-    'pedit.noindex_label': 'noindex (hide from search engines)', 'pedit.nsfw_label': 'NSFW / sensitive content', 'pedit.fedi_audio_label': 'Share audio openly on the fediverse (plays inline in apps; file downloadable)', 'pedit.nsfw_cw_ph': 'Warning text (optional, default: Sensitive content)', 'post.nsfw_warning': 'Sensitive content', 'post.nsfw_show': 'Show',
+    'pedit.noindex_label': 'noindex (hide from search engines)', 'pedit.nsfw_label': 'NSFW / sensitive content', 'pedit.fedi_audio_label': 'Share audio openly on the fediverse (plays inline in apps; file downloadable)', 'pedit.nsfw_cw_ph': 'Warning text (optional, default: Sensitive content)', 'post.nsfw_warning': 'Sensitive content', 'post.nsfw_show': 'Show', 'post.share': 'Share', 'post.share_copied': 'Link copied ✓',
     'pedit.fan_only_label': 'Logged-in fans only',
     'pedit.schedule_label': 'Schedule publication',
@@ -2527 +2527 @@
     'pedit.pin_top': 'ganz oben',
     'pedit.pin_nth_suffix': '. von oben',
-    'pedit.noindex_label': 'noindex (vor Suchmaschinen verbergen)', 'pedit.nsfw_label': 'NSFW / sensibler Inhalt', 'pedit.fedi_audio_label': 'Audio offen im Fediverse teilen (spielt inline in Apps; Datei herunterladbar)', 'pedit.nsfw_cw_ph': 'Warntext (optional, Standard: Sensibler Inhalt)', 'post.nsfw_warning': 'Sensibler Inhalt', 'post.nsfw_show': 'Anzeigen',
+    'pedit.noindex_label': 'noindex (vor Suchmaschinen verbergen)', 'pedit.nsfw_label': 'NSFW / sensibler Inhalt', 'pedit.fedi_audio_label': 'Audio offen im Fediverse teilen (spielt inline in Apps; Datei herunterladbar)', 'pedit.nsfw_cw_ph': 'Warntext (optional, Standard: Sensibler Inhalt)', 'post.nsfw_warning': 'Sensibler Inhalt', 'post.nsfw_show': 'Anzeigen', 'post.share': 'Teilen', 'post.share_copied': 'Link kopiert ✓',
     'pedit.fan_only_label': 'Nur für angemeldete Fans',
     'pedit.schedule_label': 'Veröffentlichung planen',

src/views/pages/post.ejs

@@ -56 +56 @@
     </div>
   <% } %>
+
+  <div class="post-share" style="margin:1.25rem 0;display:flex;align-items:center;gap:.6rem;flex-wrap:wrap">
+    <button type="button" class="btn post-share-btn" data-share data-share-title="<%= post.title %>">🔗 <%= t('post.share') %></button>
+    <span class="post-share-feedback" id="post-share-feedback" style="color:var(--accent);font-size:.85rem" hidden><%= t('post.share_copied') %></span>
+  </div>
 
   <!-- Inline admin actions: only visible if user has permission -->

src/views/shell.ejs

@@ -807 +807 @@
   // Misc click helpers (select-all in a field, history-back button).
   document.addEventListener('click', function (e) {
-    var el = e.target.closest && e.target.closest('[data-selectall],[data-back]');
+    var el = e.target.closest && e.target.closest('[data-selectall],[data-back],[data-share]');
     if (!el) return;
     if (el.dataset.selectall !== undefined && el.select) el.select();
     if (el.dataset.back !== undefined) { e.preventDefault(); history.back(); }
+    if (el.dataset.share !== undefined) {
+      e.preventDefault();
+      var url = location.href, title = el.dataset.shareTitle || document.title;
+      if (navigator.share) { navigator.share({ title: title, url: url }).catch(function () {}); }
+      else if (navigator.clipboard && navigator.clipboard.writeText) {
+        navigator.clipboard.writeText(url).then(function () {
+          var fb = document.getElementById('post-share-feedback');
+          if (fb) { fb.hidden = false; setTimeout(function () { fb.hidden = true; }, 2000); }
+        }).catch(function () { window.prompt('Copy link:', url); });
+      } else { window.prompt('Copy link:', url); }
+    }
   });
   // Image fallback (the error event doesn't bubble → capture phase).