mirror of
https://github.com/linsa-io/linsa.git
synced 2026-01-11 11:50:25 +01:00
Update stream playback configuration to include WebRTC support and conditionally render WebRTC player in stream page.
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"last_commit": {
|
||||
"timestamp": "2025-12-22T02:34:08.927463+00:00",
|
||||
"session_id": "019b43e7-d67f-7913-8869-c71b4462765a",
|
||||
"last_entry_timestamp": "2025-12-22T02:34:05.739Z"
|
||||
"timestamp": "2025-12-22T02:36:05.675814+00:00",
|
||||
"session_id": "019b43e9-b86b-7a80-939f-6ee733a40258",
|
||||
"last_entry_timestamp": "2025-12-22T02:36:02.528Z"
|
||||
}
|
||||
}
|
||||
@@ -3,6 +3,7 @@ import { createFileRoute } from "@tanstack/react-router"
|
||||
import { getStreamByUsername, type StreamPageData } from "@/lib/stream/db"
|
||||
import { VideoPlayer } from "@/components/VideoPlayer"
|
||||
import { CloudflareStreamPlayer } from "@/components/CloudflareStreamPlayer"
|
||||
import { WebRTCPlayer } from "@/components/WebRTCPlayer"
|
||||
import { resolveStreamPlayback } from "@/lib/stream/playback"
|
||||
import { JazzProvider } from "@/lib/jazz/provider"
|
||||
import { ViewerCount } from "@/components/ViewerCount"
|
||||
@@ -14,7 +15,7 @@ export const Route = createFileRoute("/$username")({
|
||||
|
||||
// Cloudflare Stream HLS URL
|
||||
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
|
||||
const NIKIV_DATA: StreamPageData = {
|
||||
@@ -31,6 +32,7 @@ const NIKIV_DATA: StreamPageData = {
|
||||
is_live: false, // Set to true when actually streaming
|
||||
viewer_count: 0,
|
||||
hls_url: HLS_URL,
|
||||
webrtc_url: null,
|
||||
playback: NIKIV_PLAYBACK,
|
||||
thumbnail_url: null,
|
||||
started_at: null,
|
||||
@@ -148,7 +150,9 @@ function StreamPage() {
|
||||
const { user, stream } = data
|
||||
const playback = stream?.playback
|
||||
const showPlayer =
|
||||
playback?.type === "cloudflare" || (playback?.type === "hls" && streamReady)
|
||||
playback?.type === "cloudflare" ||
|
||||
playback?.type === "webrtc" ||
|
||||
(playback?.type === "hls" && streamReady)
|
||||
|
||||
return (
|
||||
<JazzProvider>
|
||||
@@ -159,7 +163,25 @@ function StreamPage() {
|
||||
</div>
|
||||
|
||||
{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">
|
||||
<CloudflareStreamPlayer
|
||||
uid={playback.uid}
|
||||
|
||||
Reference in New Issue
Block a user