Changeset 28f797d in Klonkt for src/views

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/views

Files:

• pages/post.ejs (modified) (1 diff)
• shell.ejs (modified) (1 diff)

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).