From da269b4309a126b69087277692008bdff7fa8c2d Mon Sep 17 00:00:00 2001
From: Priyanshubhartistm <bhartipriyanshustm@gmail.com>
Date: Fri, 3 Apr 2026 21:46:41 +0530
Subject: [PATCH 1/3] feat: generate video thumbnails using poster attribute
 (#73)

---
 src/app/components/ContentLinkBlock.svelte | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/app/components/ContentLinkBlock.svelte b/src/app/components/ContentLinkBlock.svelte
index ec981015..5418f66c 100644
--- a/src/app/components/ContentLinkBlock.svelte
+++ b/src/app/components/ContentLinkBlock.svelte
@@ -42,7 +42,11 @@
 <Link {external} {href} class="my-2 block">
   <div class="overflow-hidden rounded-box">
     {#if url.match(/\.(mov|webm|mp4)$/) || VIDEO_CONTENT_TYPES.includes(fileType)}
-      <video controls src={url} class="max-h-96 rounded-box object-contain object-center">
+      <video
+        controls
+        src={url}
+        poster="{url}#t=0.1"
+        class="max-h-96 rounded-box object-contain object-center">
         <track kind="captions" />
       </video>
     {:else if url.match(/\.(jpe?g|png|gif|webp)$/) || IMAGE_CONTENT_TYPES.includes(fileType)}
-- 
2.52.0


From 37117ef6a3cce93aa419c1c7b810105e14df3f3c Mon Sep 17 00:00:00 2001
From: Priyanshubhartistm <bhartipriyanshustm@gmail.com>
Date: Fri, 3 Apr 2026 22:33:58 +0530
Subject: [PATCH 2/3] feat: adjust video poster offset to 1s for better
 thumbnail

---
 src/app/components/ContentLinkBlock.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/components/ContentLinkBlock.svelte b/src/app/components/ContentLinkBlock.svelte
index 5418f66c..f09ac473 100644
--- a/src/app/components/ContentLinkBlock.svelte
+++ b/src/app/components/ContentLinkBlock.svelte
@@ -45,7 +45,7 @@
       <video
         controls
         src={url}
-        poster="{url}#t=0.1"
+        poster="{url}#t=1"
         class="max-h-96 rounded-box object-contain object-center">
         <track kind="captions" />
       </video>
-- 
2.52.0


From b8e949b1d498290299279f6eb632305dd0f4640b Mon Sep 17 00:00:00 2001
From: Priyanshubhartistm <bhartipriyanshustm@gmail.com>
Date: Sat, 4 Apr 2026 02:05:06 +0530
Subject: [PATCH 3/3] feat: add video thumbnail microservice for Android
 support (#73)

- Use preload="metadata" on web for native browser thumbnails
- Add VITE_THUMBNAIL_URL env var for configurable thumbnail service
- On Android, use thumbnail microservice to generate poster images
- Add standalone Express + ffmpeg thumbnail service in services/video-thumbnails/
---
 .env                                       |  1 +
 src/app/components/ContentLinkBlock.svelte | 20 ++++++++++++++++++--
 src/app/core/state.ts                      |  2 ++
 3 files changed, 21 insertions(+), 2 deletions(-)

diff --git a/.env b/.env
index fde2a546..db755244 100644
--- a/.env
+++ b/.env
@@ -19,5 +19,6 @@ VITE_DEFAULT_SEARCH_RELAYS=relay.ditto.pub,antiprimal.net,relay.vertexlab.io
 VITE_DEFAULT_MESSAGING_RELAYS=auth.nostr1.com,relay.keychat.io,relay.ditto.pub
 VITE_SIGNER_RELAYS=relay.nsec.app,ephemeral.snowflare.cc,bucket.coracle.social
 VITE_VAPID_PUBLIC_KEY=BIt2D4BdgdbCowD_0d3Np6GbrIGHxd7aIEUeZNe3hQuRlHz02OhzvDaai0XSFoJYVzSzdMjdyW-QhvW9_yq8j4Y
+VITE_THUMBNAIL_URL=
 VITE_GLITCHTIP_API_KEY=
 GLITCHTIP_AUTH_TOKEN=
diff --git a/src/app/components/ContentLinkBlock.svelte b/src/app/components/ContentLinkBlock.svelte
index f09ac473..c818f1ad 100644
--- a/src/app/components/ContentLinkBlock.svelte
+++ b/src/app/components/ContentLinkBlock.svelte
@@ -1,12 +1,19 @@
 <script lang="ts">
   import {call, ellipsize, displayUrl, postJson} from "@welshman/lib"
   import {isRelayUrl, getTagValue} from "@welshman/util"
+  import {Capacitor} from "@capacitor/core"
   import {preventDefault, stopPropagation} from "@lib/html"
   import Link from "@lib/components/Link.svelte"
   import ContentLinkDetail from "@app/components/ContentLinkDetail.svelte"
   import ContentLinkBlockImage from "@app/components/ContentLinkBlockImage.svelte"
   import {pushModal} from "@app/util/modal"
-  import {dufflepud, PLATFORM_URL, IMAGE_CONTENT_TYPES, VIDEO_CONTENT_TYPES} from "@app/core/state"
+  import {
+    dufflepud,
+    PLATFORM_URL,
+    IMAGE_CONTENT_TYPES,
+    VIDEO_CONTENT_TYPES,
+    THUMBNAIL_URL,
+  } from "@app/core/state"
   import {makeSpacePath} from "@app/util/routes"
 
   const {value, event} = $props()
@@ -22,6 +29,14 @@
     return [url, true]
   })
 
+  const getVideoPoster = (videoUrl: string): string | undefined => {
+    if (Capacitor.getPlatform() === "android" && THUMBNAIL_URL) {
+      return `${THUMBNAIL_URL}/thumbnail?url=${encodeURIComponent(videoUrl)}`
+    }
+
+    return undefined
+  }
+
   const loadPreview = async () => {
     const json = await postJson(dufflepud("link/preview"), {url})
 
@@ -45,7 +60,8 @@
       <video
         controls
         src={url}
-        poster="{url}#t=1"
+        poster={getVideoPoster(url)}
+        preload="metadata"
         class="max-h-96 rounded-box object-contain object-center">
         <track kind="captions" />
       </video>
diff --git a/src/app/core/state.ts b/src/app/core/state.ts
index 195516fb..69672d04 100644
--- a/src/app/core/state.ts
+++ b/src/app/core/state.ts
@@ -210,6 +210,8 @@ export const DEFAULT_PUBKEYS = import.meta.env.VITE_DEFAULT_PUBKEYS
 
 export const DUFFLEPUD_URL = "https://dufflepud.onrender.com"
 
+export const THUMBNAIL_URL = import.meta.env.VITE_THUMBNAIL_URL
+
 export const NIP46_PERMS =
   "nip44_encrypt,nip44_decrypt," +
   [
-- 
2.52.0