expo-libvlc-player 0.1.0

package/src/VlcPlayer.types.ts

@@ -0,0 +1,291 @@
+import * as React from "react";
+import type { ViewProps } from "react-native";
+
+export interface VLCPlayerViewRef {
+  /**
+   * Starts playback for the current player
+   *
+   * @returns void
+   */
+  readonly play: () => Promise<void>;
+  /**
+   * Pauses playback for the current player
+   *
+   * @returns void
+   */
+  readonly pause: () => Promise<void>;
+  /**
+   * Stops playback for the current player
+   *
+   * @returns void
+   */
+  readonly stop: () => Promise<void>;
+  /**
+   * Sets position of the current player
+   *
+   * @param position - Must be a float number between `0` and `1`
+   *
+   * @returns void
+   */
+  readonly seek: (position: number) => Promise<void>;
+}
+
+/**
+ * @hidden
+ */
+export type BufferingListener = () => void;
+
+/**
+ * @hidden
+ */
+export type PlayingPausedListener = () => void;
+
+/**
+ * @hidden
+ */
+export type StoppedListener = () => void;
+
+/**
+ * @hidden
+ */
+export type EndedListener = () => void;
+
+/**
+ * @hidden
+ */
+export type RepeatListener = () => void;
+
+/**
+ * @hidden
+ */
+export type WarnListener = (event: { nativeEvent: Warn }) => void;
+
+export type Warn = { warn: string };
+
+/**
+ * @hidden
+ */
+export type ErrorListener = (event: { nativeEvent: Error }) => void;
+
+export type Error = { error: string };
+
+/**
+ * @hidden
+ */
+export type PositionChangedListener = (event: {
+  nativeEvent: PositionChanged;
+}) => void;
+
+export type PositionChanged = { position: number };
+
+/**
+ * @hidden
+ */
+export type LoadListener = (event: { nativeEvent: VideoInfo }) => void;
+
+/**
+ * @hidden
+ */
+export type BackgroundListener = () => void;
+
+export interface Track {
+  id: number;
+  name: string;
+}
+
+export interface VideoTracks {
+  audio: Track[];
+  subtitle: Track[];
+}
+
+export interface VideoInfo {
+  width: number;
+  height: number;
+  aspectRatio: string | null;
+  duration: number;
+  tracks: VideoTracks;
+  seekable: boolean;
+}
+
+export interface Subtitle {
+  uri: string;
+  enable: boolean;
+}
+
+export interface TracksOptions {
+  audio: number;
+  subtitle: number;
+}
+
+/**
+ * @hidden
+ */
+export interface VlcPlayerViewNativeProps {
+  ref?: React.Ref<VLCPlayerViewRef>;
+  uri?: string;
+  subtitle?: Subtitle;
+  options?: string[];
+  volume?: number;
+  mute?: boolean;
+  rate?: number;
+  tracks?: TracksOptions;
+  repeat?: boolean;
+  aspectRatio?: string;
+  audioMixingMode?: AudioMixingMode;
+  playInBackground?: boolean;
+  autoplay?: boolean;
+  onBuffering?: BufferingListener;
+  onPlaying?: PlayingPausedListener;
+  onPaused?: PlayingPausedListener;
+  onStopped?: StoppedListener;
+  onEnded?: EndedListener;
+  onRepeat?: RepeatListener;
+  onWarn?: WarnListener;
+  onError?: ErrorListener;
+  onPositionChanged?: PositionChangedListener;
+  onLoad?: LoadListener;
+  onBackground?: BackgroundListener;
+}
+
+export type AudioMixingMode =
+  | "mixWithOthers"
+  | "duckOthers"
+  | "auto"
+  | "doNotMix";
+
+export interface VlcPlayerViewProps extends ViewProps {
+  /**
+   * Sets the URI of the media to be played
+   */
+  uri: string;
+  /**
+   * Sets subtitle URI and enabled state
+   *
+   * @example
+   * ```tsx
+   * <VLCPlayerView
+   *   subtitle={{
+   *    uri: "file://",
+   *    enable: false,
+   *   }}
+   * />
+   * ```
+   */
+  subtitle?: Subtitle;
+  /**
+   * https://wiki.videolan.org/VLC_command-line_help/
+   *
+   * Sets the VLC options to initialize the player with
+   *
+   * @example ["--network-caching=1000"]
+   *
+   * @default []
+   *
+   */
+  options?: string[];
+  /**
+   * Controls the player volume, must be an integer number between `0` and `100`
+   *
+   * @default 100
+   *
+   */
+  volume?: number;
+  /**
+   * Sets the player volume to `0`
+   */
+  mute?: boolean;
+  /**
+   * Controls the player rate, must be a float number
+   *
+   * @default 1
+   *
+   */
+  rate?: number;
+  /**
+   * Sets the player audio and subtitle tracks, see `VideoInfo` for tracks type
+   *
+   * @example
+   * ```tsx
+   * <VLCPlayerView
+   *    tracks={{
+   *       audio: 1,
+   *       subtitle: 2,
+   *    }}
+   * />
+   * ```
+   */
+  tracks?: TracksOptions;
+  /**
+   * Repeats media once playback is ended
+   */
+  repeat?: boolean;
+  /**
+   * Sets the player aspect ratio, must be a valid string
+   *
+   * @example "16:9"
+   */
+  aspectRatio?: string;
+  /**
+   * Determines how the player will interact with other audio playing in the system
+   *
+   * @default 'auto'
+   */
+  audioMixingMode?: AudioMixingMode;
+  /**
+   * Determines whether the player should continue playing after the app enters the background
+   *
+   * @default false
+   */
+  playInBackground?: boolean;
+  /**
+   * Autoplays media once player is created
+   *
+   * @default true
+   *
+   */
+  autoplay?: boolean;
+  /**
+   * Event that fires when player buffers
+   */
+  onBuffering?: () => void;
+  /**
+   * Event that fires when player plays
+   */
+  onPlaying?: () => void;
+  /**
+   * Event that fires when player pauses
+   */
+  onPaused?: () => void;
+  /**
+   * Event that fires when player stops
+   */
+  onStopped?: () => void;
+  /**
+   * Event that fires when player reaches an end
+   */
+  onEnded?: () => void;
+  /**
+   * Event that fires when player repeats
+   */
+  onRepeat?: () => void;
+  /**
+   * Event that fires when player emits a warning
+   */
+  onWarn?: (event: Warn) => void;
+  /**
+   * Event that fires when player encounters an error
+   */
+  onError?: (event: Error) => void;
+  /**
+   * Event that fires when player position changes
+   */
+  onPositionChanged?: (event: PositionChanged) => void;
+  /**
+   * Event that fires when player loads
+   */
+  onLoad?: (event: VideoInfo) => void;
+  /**
+   * Event that fires when player enters the background
+   */
+  onBackground?: () => void;
+}

package/src/VlcPlayerModule.ts

@@ -0,0 +1,7 @@
+import { NativeModule, requireNativeModule } from "expo";
+
+// eslint-disable-next-line @typescript-eslint/no-empty-object-type
+declare class VlcPlayerModule extends NativeModule<{}> {}
+
+// This call loads the native module object from the JSI.
+export default requireNativeModule<VlcPlayerModule>("ExpoLibVlcPlayer");

package/src/VlcPlayerView.tsx

@@ -0,0 +1,73 @@
+import { requireNativeView } from "expo";
+import * as React from "react";
+
+import {
+  VlcPlayerViewNativeProps,
+  VlcPlayerViewProps,
+  VLCPlayerViewRef,
+  type Warn,
+  type Error,
+  type PositionChanged,
+  type VideoInfo,
+} from "./VlcPlayer.types";
+import { convertNativeProps } from "./utils/props";
+
+const NativeView: React.ComponentType<VlcPlayerViewNativeProps> =
+  requireNativeView("ExpoLibVlcPlayer");
+
+let loggedRenderingChildrenWarning = false;
+
+const VlcPlayerView = React.forwardRef<VLCPlayerViewRef, VlcPlayerViewProps>(
+  (props, ref) => {
+    const nativeProps = convertNativeProps(props);
+
+    // @ts-expect-error
+    if (nativeProps.children && !loggedRenderingChildrenWarning) {
+      console.warn(
+        "The <VLCPlayerView> component does not support children. This may lead to inconsistent behaviour or crashes. If you want to render content on top of the VLCPlayer, consider using absolute positioning.",
+      );
+      loggedRenderingChildrenWarning = true;
+    }
+
+    const onWarn = ({ nativeEvent }: { nativeEvent: Warn }) => {
+      if (props.onWarn) {
+        props.onWarn(nativeEvent);
+      }
+    };
+
+    const onError = ({ nativeEvent }: { nativeEvent: Error }) => {
+      if (props.onError) {
+        props.onError(nativeEvent);
+      }
+    };
+
+    const onPositionChanged = ({
+      nativeEvent,
+    }: {
+      nativeEvent: PositionChanged;
+    }) => {
+      if (props.onPositionChanged) {
+        props.onPositionChanged(nativeEvent);
+      }
+    };
+
+    const onLoad = ({ nativeEvent }: { nativeEvent: VideoInfo }) => {
+      if (props.onLoad) {
+        props.onLoad(nativeEvent);
+      }
+    };
+
+    return (
+      <NativeView
+        {...nativeProps}
+        ref={ref}
+        onWarn={onWarn}
+        onError={onError}
+        onPositionChanged={onPositionChanged}
+        onLoad={onLoad}
+      />
+    );
+  },
+);
+
+export default VlcPlayerView;

package/src/index.ts

@@ -0,0 +1,4 @@
+// Reexport the native module. On native platforms, it will be resolved to VlcPlayer.ts
+export { default } from "./VlcPlayerModule";
+export { default as VLCPlayerView } from "./VlcPlayerView";
+export * from "./VlcPlayer.types";

package/src/utils/props.ts

@@ -0,0 +1,20 @@
+import {
+  VlcPlayerViewNativeProps,
+  VlcPlayerViewProps,
+} from "../VlcPlayer.types";
+
+export function convertNativeProps(
+  props?: VlcPlayerViewProps,
+): VlcPlayerViewNativeProps {
+  if (!props || typeof props !== "object") {
+    return {};
+  }
+
+  const nativeProps: VlcPlayerViewNativeProps = {};
+
+  for (const [key, value] of Object.entries(props)) {
+    nativeProps[key as keyof VlcPlayerViewNativeProps] = value;
+  }
+
+  return nativeProps;
+}

package/tsconfig.json

@@ -0,0 +1,9 @@
+// @generated by expo-module-scripts
+{
+  "extends": "expo-module-scripts/tsconfig.base",
+  "compilerOptions": {
+    "outDir": "./build"
+  },
+  "include": ["./src"],
+  "exclude": ["**/__mocks__/*", "**/__tests__/*", "**/__rsc_tests__/*"]
+}