starred/linsa
1
0
Fork 0
mirror of https://github.com/linsa-io/linsa.git synced 2026-01-11 20:00:23 +01:00
Code Issues 2 Packages Projects Releases Wiki Activity

Update stream playback configuration to include WebRTC support and conditionally render WebRTC player in stream page.

Browse Source
This commit is contained in:
Nikita
2025-12-21 18:37:46 -08:00
parent 3d6709e5c5
commit 2a98dd1d0b
2 changed files with 28 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
.ai/commit-checkpoints.json
View File

@@ -1,7 +1,7 @@
{ {
"last_commit": { "last_commit": {
"timestamp": "2025-12-22T02:34:08.927463+00:00", "timestamp": "2025-12-22T02:36:05.675814+00:00",
"session_id": "019b43e7-d67f-7913-8869-c71b4462765a", "session_id": "019b43e9-b86b-7a80-939f-6ee733a40258",
"last_entry_timestamp": "2025-12-22T02:34:05.739Z" "last_entry_timestamp": "2025-12-22T02:36:02.528Z"
} }
} }

28
packages/web/src/routes/$username.tsx
View File

@@ -3,6 +3,7 @@ import { createFileRoute } from "@tanstack/react-router"
import { getStreamByUsername, type StreamPageData } from "@/lib/stream/db" import { getStreamByUsername, type StreamPageData } from "@/lib/stream/db"
import { VideoPlayer } from "@/components/VideoPlayer" import { VideoPlayer } from "@/components/VideoPlayer"
import { CloudflareStreamPlayer } from "@/components/CloudflareStreamPlayer" import { CloudflareStreamPlayer } from "@/components/CloudflareStreamPlayer"
import { WebRTCPlayer } from "@/components/WebRTCPlayer"
import { resolveStreamPlayback } from "@/lib/stream/playback" import { resolveStreamPlayback } from "@/lib/stream/playback"
import { JazzProvider } from "@/lib/jazz/provider" import { JazzProvider } from "@/lib/jazz/provider"
import { ViewerCount } from "@/components/ViewerCount" import { ViewerCount } from "@/components/ViewerCount"
@@ -14,7 +15,7 @@ export const Route = createFileRoute("/$username")({
// Cloudflare Stream HLS URL // Cloudflare Stream HLS URL
const HLS_URL = "https://customer-xctsztqzu046isdc.cloudflarestream.com/bb7858eafc85de6c92963f3817477b5d/manifest/video.m3u8" const HLS_URL = "https://customer-xctsztqzu046isdc.cloudflarestream.com/bb7858eafc85de6c92963f3817477b5d/manifest/video.m3u8"
const NIKIV_PLAYBACK = resolveStreamPlayback({ hlsUrl: HLS_URL }) const NIKIV_PLAYBACK = resolveStreamPlayback({ hlsUrl: HLS_URL, webrtcUrl: null })
// Hardcoded user for nikiv // Hardcoded user for nikiv
const NIKIV_DATA: StreamPageData = { const NIKIV_DATA: StreamPageData = {
@@ -31,6 +32,7 @@ const NIKIV_DATA: StreamPageData = {
is_live: false, // Set to true when actually streaming is_live: false, // Set to true when actually streaming
viewer_count: 0, viewer_count: 0,
hls_url: HLS_URL, hls_url: HLS_URL,
webrtc_url: null,
playback: NIKIV_PLAYBACK, playback: NIKIV_PLAYBACK,
thumbnail_url: null, thumbnail_url: null,
started_at: null, started_at: null,
@@ -148,7 +150,9 @@ function StreamPage() {
const { user, stream } = data const { user, stream } = data
const playback = stream?.playback const playback = stream?.playback
const showPlayer = const showPlayer =
playback?.type === "cloudflare" || (playback?.type === "hls" && streamReady) playback?.type === "cloudflare" ||
playback?.type === "webrtc" ||
(playback?.type === "hls" && streamReady)
return ( return (
<JazzProvider> <JazzProvider>
@@ -159,7 +163,25 @@ function StreamPage() {
</div> </div>
{stream?.is_live && playback && showPlayer ? ( {stream?.is_live && playback && showPlayer ? (
playback.type === "cloudflare" ? ( playback.type === "webrtc" ? (
<div className="relative h-full w-full">
<WebRTCPlayer
src={playback.url}
muted={false}
onReady={() => setStreamReady(true)}
/>
{!streamReady && (
<div className="absolute inset-0 flex items-center justify-center text-white">
<div className="text-center">
<div className="animate-pulse text-4xl">🔴</div>
<p className="mt-4 text-xl text-neutral-400">
Connecting to stream...
</p>
</div>
</div>
)}
</div>
) : playback.type === "cloudflare" ? (
<div className="relative h-full w-full"> <div className="relative h-full w-full">
<CloudflareStreamPlayer <CloudflareStreamPlayer
uid={playback.uid} uid={playback.uid}