42 lines
1.7 KiB
Plaintext
42 lines
1.7 KiB
Plaintext
---
|
|
import WebsiteLayout from '@layouts/website/WebsiteLayout.astro';
|
|
import VideoPlayer from '@app/website/video/VideoPlayer.svelte';
|
|
import { getVideoMetadata, resolveVideo } from '@util/video.ts';
|
|
import { BASE_PATH } from 'astro:env/server';
|
|
|
|
const { name } = Astro.params;
|
|
|
|
const video = name ? await resolveVideo(name) : null;
|
|
if (!video) return new Response(null, { status: 404 });
|
|
|
|
const metadata = await getVideoMetadata(video);
|
|
if (!metadata) return new Response(null, { status: 404 });
|
|
|
|
const { title, description, width, height, duration } = metadata;
|
|
const streamPath = `${BASE_PATH}/video/${encodeURIComponent(video.name)}/stream`;
|
|
---
|
|
|
|
<WebsiteLayout title={`${title} - Video`} description={description ?? undefined}>
|
|
<Fragment slot="head">
|
|
<meta property="og:type" content="video" />
|
|
<meta property="og:video" content={streamPath} />
|
|
<meta property="og:video:type" content={video.contentType} />
|
|
{width && <meta property="og:video:width" content={width.toString()} />}
|
|
{height && <meta property="og:video:height" content={height.toString()} />}
|
|
{duration && <meta property="og:video:duration" content={duration.toString()} />}
|
|
</Fragment>
|
|
|
|
<section class="mx-auto flex w-full max-w-6xl flex-col gap-5 px-4 py-8 lg:py-12">
|
|
<div>
|
|
<p class="text-sm tracking-widest text-base-content/60 uppercase">Video</p>
|
|
<h1 class="mt-1 text-2xl font-semibold break-words lg:text-4xl">{title}</h1>
|
|
</div>
|
|
|
|
<VideoPlayer client:load src={streamPath} type={video.contentType} title={title} />
|
|
|
|
{description && (
|
|
<p class="max-w-3xl text-base leading-relaxed whitespace-pre-line text-base-content/70">{description}</p>
|
|
)}
|
|
</section>
|
|
</WebsiteLayout>
|