@uln/hls 0.3.1 / examples / film-page

film-page HLS

A film's own route that continues from the moment the card's clip was showing

examples/film-page/FilmPage.tsx

import { Video } from "@uln/hls/react";
import type { Film } from "../films";

/**
 * A film's own page, reached from a card through the site's router (Next.js,
 * …). The card puts the moment its clip was showing in the link (`?t=42`), so
 * the film continues from there.
 */
export function FilmPage({ film, t }: { film: Film; t: number }) {
  return (
    <article>
      <Video src={film.hls} poster={film.poster} playing start={t} controls className="film" />
      <h1>{film.title}</h1>
    </article>
  );
}