feat(home): tap opens detail, long-press plays from home cards

Home carousel cards route a tap to the item's detail / Episode Focus
View and a ~500ms long-press to a confirm-then-play flow. MediaCard gains
an onLongPress prop with pointer-based detection (cancelled on >10px move
so carousel scroll is unaffected, trailing click suppressed). Episode
taps route to /library/<seriesId>?episode=<id>; the bare-episode detail
page links back to its parent series/season.

TRACES: UR-058 | DR-087
This commit is contained in:
2026-07-24 23:49:03 +02:00
parent e2c9d68311
commit 589f08b873
4 changed files with 136 additions and 17 deletions
+23 -6
View File
@@ -381,12 +381,29 @@
<div class="flex-1 space-y-4">
<div>
<h1 class="text-3xl font-bold text-white">{item.name}</h1>
{#if item.kind === "episode" && (item.parentIndexNumber || item.indexNumber)}
<p class="text-lg text-gray-400 mt-1">
{#if item.parentIndexNumber}Season {item.parentIndexNumber}{/if}
{#if item.parentIndexNumber && item.indexNumber}, {/if}
{#if item.indexNumber}Episode {item.indexNumber}{/if}
</p>
{#if item.kind === "episode"}
<!-- Links back to the parent series/season so the episode detail
page is a navigable hub, not a dead end. TRACES: UR-058 | DR-087 -->
{#if item.seriesId && item.seriesName}
<p class="text-lg mt-1">
<a
href={`/library/${item.seriesId}`}
class="text-[var(--color-jellyfin)] hover:underline"
>{item.seriesName}</a>
</p>
{/if}
{#if item.parentIndexNumber || item.indexNumber}
<p class="text-lg text-gray-400 mt-1">
{#if item.seasonId && item.parentIndexNumber}
<a
href={`/library/${item.seasonId}`}
class="hover:underline hover:text-[var(--color-jellyfin)] transition-colors"
>Season {item.parentIndexNumber}</a>
{:else if item.parentIndexNumber}Season {item.parentIndexNumber}{/if}
{#if item.parentIndexNumber && item.indexNumber}, {/if}
{#if item.indexNumber}Episode {item.indexNumber}{/if}
</p>
{/if}
{:else if item.artistItems?.length || item.artists?.length}
<p class="text-lg text-gray-400 mt-1">
<ArtistLinks