@livepeer-frameworks/player-react 0.1.1 → 0.1.2

package/src/components/players/MewsWsPlayer/index.tsx

@@ -1,58 +0,0 @@
-/**
- * MEWS WebSocket Player - React Wrapper
- *
- * Low-latency WebSocket MP4 streaming using MediaSource Extensions.
- * The implementation is in @livepeer-frameworks/player-core.
- */
-
-import React, { useEffect, useRef } from "react";
-import { MewsWsPlayerImpl } from "@livepeer-frameworks/player-core";
-
-// Re-export the implementation from core for backwards compatibility
-export { MewsWsPlayerImpl };
-
-type Props = {
-  wsUrl: string;
-  muted?: boolean;
-  autoPlay?: boolean;
-  controls?: boolean;
-  onError?: (e: Error) => void;
-};
-
-// React component wrapper
-const MewsWsPlayer: React.FC<Props> = ({
-  wsUrl,
-  muted = true,
-  autoPlay = true,
-  controls = true,
-  onError,
-}) => {
-  const containerRef = useRef<HTMLDivElement>(null);
-  const playerRef = useRef<MewsWsPlayerImpl | null>(null);
-
-  useEffect(() => {
-    if (!containerRef.current) return;
-
-    const player = new MewsWsPlayerImpl();
-    playerRef.current = player;
-
-    player
-      .initialize(
-        containerRef.current,
-        { url: wsUrl, type: "ws/video/mp4" },
-        { autoplay: autoPlay, muted, controls }
-      )
-      .catch((e) => {
-        onError?.(e instanceof Error ? e : new Error(String(e)));
-      });
-
-    return () => {
-      player.destroy();
-      playerRef.current = null;
-    };
-  }, [wsUrl, muted, autoPlay, controls, onError]);
-
-  return <div ref={containerRef} style={{ width: "100%", height: "100%" }} />;
-};
-
-export default MewsWsPlayer;

package/src/components/players/MistPlayer.tsx

@@ -1,62 +0,0 @@
-/**
- * MistServer Legacy Player - React Wrapper
- *
- * Fallback player using MistServer's native player.js.
- * The implementation is in @livepeer-frameworks/player-core.
- */
-
-import React, { useEffect, useRef } from "react";
-import { MistPlayerImpl } from "@livepeer-frameworks/player-core";
-
-// Re-export the implementation from core for backwards compatibility
-export { MistPlayerImpl };
-
-type Props = {
-  src: string;
-  streamName?: string;
-  muted?: boolean;
-  autoPlay?: boolean;
-  controls?: boolean;
-  devMode?: boolean;
-  onError?: (e: Error) => void;
-};
-
-// React component wrapper
-const MistPlayer: React.FC<Props> = ({
-  src,
-  streamName,
-  muted = true,
-  autoPlay = true,
-  controls = true,
-  devMode = false,
-  onError,
-}) => {
-  const containerRef = useRef<HTMLDivElement>(null);
-  const playerRef = useRef<MistPlayerImpl | null>(null);
-
-  useEffect(() => {
-    if (!containerRef.current) return;
-
-    const player = new MistPlayerImpl();
-    playerRef.current = player;
-
-    player
-      .initialize(
-        containerRef.current,
-        { url: src, type: "mist/legacy", streamName },
-        { autoplay: autoPlay, muted, controls, devMode }
-      )
-      .catch((e) => {
-        onError?.(e instanceof Error ? e : new Error(String(e)));
-      });
-
-    return () => {
-      player.destroy();
-      playerRef.current = null;
-    };
-  }, [src, streamName, muted, autoPlay, controls, devMode, onError]);
-
-  return <div ref={containerRef} style={{ width: "100%", height: "100%" }} />;
-};
-
-export default MistPlayer;

package/src/components/players/MistWebRTCPlayer/index.tsx

@@ -1,68 +0,0 @@
-/**
- * MistWebRTC Player - React Wrapper
- *
- * MistServer native WebRTC with signaling for DVR support.
- * The implementation is in @livepeer-frameworks/player-core.
- */
-
-import React, { useRef, useEffect } from "react";
-import { MistWebRTCPlayerImpl } from "@livepeer-frameworks/player-core";
-
-// Re-export the implementation from core for backwards compatibility
-export { MistWebRTCPlayerImpl };
-
-interface Props {
-  src: string;
-  autoPlay?: boolean;
-  muted?: boolean;
-  controls?: boolean;
-  poster?: string;
-  onReady?: (video: HTMLVideoElement) => void;
-  onError?: (error: Error) => void;
-}
-
-export const MistWebRTCPlayer: React.FC<Props> = ({
-  src,
-  autoPlay = true,
-  muted = true,
-  controls = true,
-  poster,
-  onReady,
-  onError,
-}) => {
-  const containerRef = useRef<HTMLDivElement>(null);
-  const playerRef = useRef<MistWebRTCPlayerImpl | null>(null);
-
-  useEffect(() => {
-    if (!containerRef.current) return;
-
-    const player = new MistWebRTCPlayerImpl();
-    playerRef.current = player;
-
-    player
-      .initialize(
-        containerRef.current,
-        { url: src, type: "webrtc" },
-        {
-          autoplay: autoPlay,
-          muted,
-          controls,
-          poster,
-          onReady,
-          onError: (e) => onError?.(typeof e === "string" ? new Error(e) : e),
-        }
-      )
-      .catch((e) => {
-        onError?.(e instanceof Error ? e : new Error(String(e)));
-      });
-
-    return () => {
-      player.destroy();
-      playerRef.current = null;
-    };
-  }, [src, autoPlay, muted, controls, poster, onReady, onError]);
-
-  return <div ref={containerRef} style={{ width: "100%", height: "100%" }} />;
-};
-
-export default MistWebRTCPlayerImpl;

package/src/components/players/NativePlayer.tsx

@@ -1,56 +0,0 @@
-/**
- * Native Player - React Wrapper
- *
- * HTML5 video and WHEP WebRTC playback.
- * The implementation is in @livepeer-frameworks/player-core.
- */
-
-import React, { useEffect, useRef } from "react";
-import { NativePlayerImpl, DirectPlaybackPlayerImpl } from "@livepeer-frameworks/player-core";
-
-// Re-export the implementations from core for backwards compatibility
-export { NativePlayerImpl, DirectPlaybackPlayerImpl };
-
-type Props = {
-  src: string;
-  type?: string;
-  muted?: boolean;
-  autoPlay?: boolean;
-  controls?: boolean;
-  onError?: (e: Error) => void;
-};
-
-// React component wrapper
-const NativePlayer: React.FC<Props> = ({
-  src,
-  type = "html5/video/mp4",
-  muted = true,
-  autoPlay = true,
-  controls = true,
-  onError,
-}) => {
-  const containerRef = useRef<HTMLDivElement>(null);
-  const playerRef = useRef<NativePlayerImpl | null>(null);
-
-  useEffect(() => {
-    if (!containerRef.current) return;
-
-    const player = new NativePlayerImpl();
-    playerRef.current = player;
-
-    player
-      .initialize(containerRef.current, { url: src, type }, { autoplay: autoPlay, muted, controls })
-      .catch((e) => {
-        onError?.(e instanceof Error ? e : new Error(String(e)));
-      });
-
-    return () => {
-      player.destroy();
-      playerRef.current = null;
-    };
-  }, [src, type, muted, autoPlay, controls, onError]);
-
-  return <div ref={containerRef} style={{ width: "100%", height: "100%" }} />;
-};
-
-export default NativePlayer;

package/src/components/players/VideoJsPlayer.tsx

@@ -1,58 +0,0 @@
-/**
- * Video.js Player - React Wrapper
- *
- * HLS streaming via Video.js with VHS (videojs-http-streaming).
- * The implementation is in @livepeer-frameworks/player-core.
- */
-
-import React, { useEffect, useRef } from "react";
-import { VideoJsPlayerImpl } from "@livepeer-frameworks/player-core";
-
-// Re-export the implementation from core for backwards compatibility
-export { VideoJsPlayerImpl };
-
-type Props = {
-  src: string;
-  muted?: boolean;
-  autoPlay?: boolean;
-  controls?: boolean;
-  onError?: (e: Error) => void;
-};
-
-// React component wrapper
-const VideoJsPlayer: React.FC<Props> = ({
-  src,
-  muted = true,
-  autoPlay = true,
-  controls = true,
-  onError,
-}) => {
-  const containerRef = useRef<HTMLDivElement>(null);
-  const playerRef = useRef<VideoJsPlayerImpl | null>(null);
-
-  useEffect(() => {
-    if (!containerRef.current) return;
-
-    const player = new VideoJsPlayerImpl();
-    playerRef.current = player;
-
-    player
-      .initialize(
-        containerRef.current,
-        { url: src, type: "html5/application/vnd.apple.mpegurl" },
-        { autoplay: autoPlay, muted, controls }
-      )
-      .catch((e) => {
-        onError?.(e instanceof Error ? e : new Error(String(e)));
-      });
-
-    return () => {
-      player.destroy();
-      playerRef.current = null;
-    };
-  }, [src, muted, autoPlay, controls, onError]);
-
-  return <div ref={containerRef} style={{ width: "100%", height: "100%" }} />;
-};
-
-export default VideoJsPlayer;