react-native-theoplayer 1.8.2 → 2.0.0

package/lib/typescript/ui/components/message/barrel.d.ts

@@ -0,0 +1,2 @@
+export * from './CastMessage';
+export * from './ErrorDisplay';

package/lib/typescript/ui/components/seekbar/SeekBar.d.ts

@@ -0,0 +1,41 @@
+import { PureComponent } from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+import { TimeRange } from 'react-native-theoplayer';
+export interface SeekBarProps {
+    /**
+     * Optional style applied to the SeekBar.
+     */
+    style?: StyleProp<ViewStyle>;
+}
+interface SeekBarState {
+    ignoreTimeupdate: boolean;
+    isSeeking: boolean;
+    pausedDueToScrubbing: boolean;
+    seekable: TimeRange[];
+    duration: number;
+    sliderTime: number;
+    width: number;
+}
+/**
+ * The default seek bar component for the `react-native-theoplayer` UI.
+ */
+export declare class SeekBar extends PureComponent<SeekBarProps, SeekBarState> {
+    private static initialState;
+    private _seekBlockingTimeout;
+    private _clearIsScrubbingTimout;
+    constructor(props: SeekBarProps);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    private _onTimeUpdate;
+    private _onLoadedMetadata;
+    private _onDurationChange;
+    private _onProgress;
+    private _onSlidingStart;
+    private _onValueChange;
+    private _onSlidingComplete;
+    private readonly _prepareSeekStart;
+    private readonly _finishSeek;
+    private debounceSeek;
+    render(): JSX.Element;
+}
+export {};

package/lib/typescript/ui/components/seekbar/barrel.d.ts

@@ -0,0 +1,2 @@
+export * from './SeekBar';
+export * from './thumbnail/barrel';

package/lib/typescript/ui/components/seekbar/thumbnail/SingleThumbnailView.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+export interface ThumbnailViewProps {
+    seekableStart: number;
+    seekableEnd: number;
+    currentTime: number;
+    seekBarWidth: number;
+}
+export declare function SingleThumbnailView(props: ThumbnailViewProps): JSX.Element;

package/lib/typescript/ui/components/seekbar/thumbnail/Thumbnail.d.ts

@@ -0,0 +1,56 @@
+export declare function isTileMapThumbnail(thumbnail: Thumbnail): thumbnail is TileMapThumbnail;
+export declare function isImageThumbnail(thumbnail: Thumbnail): thumbnail is ImageThumbnail;
+/**
+ * Description of a thumbnail, which can be either a full image or part of a tile map.
+ */
+export interface Thumbnail {
+    /**
+     * The url of the thumbnail image.
+     */
+    url: string;
+    /**
+     * Horizontal offset within the tile map in case the thumbnail is part of tile map.
+     */
+    tileX?: number;
+    /**
+     * Vertical offset within the tile map in case the thumbnail is part of tile map.
+     */
+    tileY?: number;
+    /**
+     * Width of a tile in case the thumbnail is part of tile map.
+     */
+    tileWidth?: number;
+    /**
+     * Height of a tile in case the thumbnail is part of tile map.
+     */
+    tileHeight?: number;
+}
+/**
+ * Description of a tile-map thumbnail.
+ */
+export interface TileMapThumbnail extends Thumbnail {
+    /**
+     * The url of the thumbnail image.
+     */
+    url: string;
+    /**
+     * Horizontal offset within the tile map in case the thumbnail is part of tile map.
+     */
+    tileX: number;
+    /**
+     * Vertical offset within the tile map in case the thumbnail is part of tile map.
+     */
+    tileY: number;
+    /**
+     * Width of a tile in case the thumbnail is part of tile map.
+     */
+    tileWidth: number;
+    /**
+     * Height of a tile in case the thumbnail is part of tile map.
+     */
+    tileHeight: number;
+}
+/**
+ * Description of a tile-map thumbnail.
+ */
+export declare type ImageThumbnail = Thumbnail;

package/lib/typescript/ui/components/seekbar/thumbnail/ThumbnailView.d.ts

@@ -0,0 +1,60 @@
+import { PureComponent } from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+import { TextTrack } from 'react-native-theoplayer';
+interface ThumbnailViewState {
+    imageWidth: number;
+    imageHeight: number;
+    renderWidth: number;
+    renderHeight: number;
+}
+export interface ThumbnailViewProps {
+    /**
+     * Thumbnail track. A valid thumbnail track should have properties:
+     * <br/> - `'kind'` equals `'metadata'`.
+     * <br/> - `'label'` equals `'thumbnails'`.
+     */
+    thumbnailTrack: TextTrack;
+    /**
+     * Current time.
+     */
+    time: number;
+    /**
+     * Stream duration
+     */
+    duration: number;
+    /**
+     * Whether to show a time label.
+     */
+    showTimeLabel: boolean;
+    /**
+     * Used to set the width of the rendered thumbnail. The height will be calculated according to the image's aspect ratio.
+     */
+    size: number;
+    /**
+     * Optional style applied to the time label.
+     */
+    timeLabelStyle?: StyleProp<ViewStyle>;
+}
+export declare const DEFAULT_THUMBNAIL_VIEW_STYLE: ThumbnailStyle;
+export interface ThumbnailStyle {
+    containerThumbnail: ViewStyle;
+    thumbnail: ViewStyle;
+}
+export declare class ThumbnailView extends PureComponent<ThumbnailViewProps, ThumbnailViewState> {
+    static defaultProps: {
+        showTimeLabel: boolean;
+    };
+    private _ismounted;
+    constructor(props: ThumbnailViewProps);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    private getCueIndexAtTime;
+    private resolveThumbnailUrl;
+    private getThumbnailImageForCue;
+    private onTileImageLoad;
+    private onImageLoadError;
+    private onImageLoad;
+    private renderThumbnail;
+    render(): JSX.Element;
+}
+export {};

package/lib/typescript/ui/components/seekbar/thumbnail/Urlpolyfill.d.ts

@@ -0,0 +1 @@
+export * from 'react-native-url-polyfill';

package/lib/typescript/ui/components/seekbar/thumbnail/Urlpolyfill.web.d.ts

@@ -0,0 +1 @@
+export * from 'url-polyfill';

package/lib/typescript/ui/components/seekbar/thumbnail/barrel.d.ts

@@ -0,0 +1,2 @@
+export * from './SingleThumbnailView';
+export * from './Thumbnail';

package/lib/typescript/ui/components/timelabel/StaticTimeLabel.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+import { StyleProp, TextStyle } from 'react-native';
+export interface StaticTimeLabelProps {
+    /**
+     * Whether to show the duration of the current source.
+     */
+    showDuration: boolean;
+    /**
+     * The style overrides.
+     */
+    style?: StyleProp<TextStyle>;
+    /**
+     * The current time of the player
+     */
+    time: number;
+    /**
+     * The duration of the current source.
+     */
+    duration: number;
+}
+/**
+ * A static time label for the `react-native-theoplayer` UI.
+ */
+export declare function StaticTimeLabel(props: StaticTimeLabelProps): JSX.Element;

package/lib/typescript/ui/components/timelabel/TimeLabel.d.ts

@@ -0,0 +1,32 @@
+import type { StyleProp, TextStyle } from 'react-native';
+import { PureComponent } from 'react';
+export interface TimeLabelProps {
+    /**
+     * Whether to show the duration of the player.
+     */
+    showDuration: boolean;
+    /**
+     * The style overrides.
+     */
+    style?: StyleProp<TextStyle>;
+}
+export interface TimeLabelState {
+    currentTime: number;
+    duration: number;
+}
+/**
+ * The default style for the time label.
+ */
+export declare const DEFAULT_TIME_LABEL_STYLE: TextStyle;
+/**
+ * The default time label component for the `react-native-theoplayer` UI.
+ */
+export declare class TimeLabel extends PureComponent<TimeLabelProps, TimeLabelState> {
+    private static initialState;
+    constructor(props: TimeLabelProps);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    private onTimeUpdate;
+    private onDurationChange;
+    render(): JSX.Element;
+}

package/lib/typescript/ui/components/timelabel/barrel.d.ts

@@ -0,0 +1,2 @@
+export * from './StaticTimeLabel';
+export * from './TimeLabel';

package/lib/typescript/ui/components/uicontroller/UiContainer.d.ts

@@ -0,0 +1,115 @@
+import React, { PureComponent, ReactNode } from 'react';
+import { Animated, StyleProp, ViewStyle } from 'react-native';
+import type { THEOplayer } from 'react-native-theoplayer';
+import { PlayerError } from 'react-native-theoplayer';
+import type { THEOplayerTheme } from '../../THEOplayerTheme';
+import type { UiControls } from './UiControls';
+interface UiContainerProps {
+    /**
+     * The player that is provided to all children using PlayerContext.
+     */
+    player: THEOplayer;
+    /**
+     * The theme that is provided to all children using PlayerContext.
+     */
+    theme: THEOplayerTheme;
+    /**
+     * The style of the container.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * The style of the top slot.
+     */
+    topStyle?: StyleProp<ViewStyle>;
+    /**
+     * The style of the center slot.
+     */
+    centerStyle?: StyleProp<ViewStyle>;
+    /**
+     * The style of the button slot.
+     */
+    bottomStyle?: StyleProp<ViewStyle>;
+    /**
+     * The components to be put in the top slot.
+     */
+    top?: ReactNode;
+    /**
+     * The components to be put in the center slot.
+     */
+    center?: ReactNode;
+    /**
+     * The components to be put in the bottom slot.
+     */
+    bottom?: ReactNode;
+    /**
+     * A slot to put components behind the UI background.
+     */
+    behind?: ReactNode;
+}
+/**
+ * The default style for a fullscreen centered view.
+ */
+export declare const FULLSCREEN_CENTER_STYLE: ViewStyle;
+/**
+ * The default style for the center container.
+ */
+export declare const UI_CONTAINER_STYLE: ViewStyle;
+/**
+ * The default style for the top container.
+ */
+export declare const TOP_UI_CONTAINER_STYLE: ViewStyle;
+/**
+ * The default style for the center container.
+ */
+export declare const CENTER_UI_CONTAINER_STYLE: ViewStyle;
+/**
+ * The default style for the bottom container.
+ */
+export declare const BOTTOM_UI_CONTAINER_STYLE: ViewStyle;
+interface UiContainerState {
+    fadeAnimation: Animated.Value;
+    currentMenu: ReactNode | undefined;
+    showing: boolean;
+    buttonsEnabled: boolean;
+    error: PlayerError | undefined;
+    firstPlay: boolean;
+    paused: boolean;
+    casting: boolean;
+    pip: boolean;
+}
+/**
+ * A component that does all the coordination between UI components.
+ * - It provides all UI components with the PlayerContext, so they can access the styling and player.
+ * - It provides slots for UI components to be places in the top/center/bottom positions.
+ * - It uses animations to fade the UI in and out when applicable.
+ */
+export declare class UiContainer extends PureComponent<React.PropsWithChildren<UiContainerProps>, UiContainerState> implements UiControls {
+    private _currentFadeOutTimeout;
+    private _menus;
+    static initialState: UiContainerState;
+    constructor(props: UiContainerProps);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    private onPlay;
+    private onPause;
+    private onSourceChange;
+    private onLoadStart;
+    private onError;
+    private onCastEvent;
+    private onEnded;
+    private onPresentationModeChange;
+    get buttonsEnabled_(): boolean;
+    /**
+     * Request to show the UI due to user input.
+     */
+    onUserAction_: () => void;
+    openMenu_: (menuConstructor: () => ReactNode) => void;
+    closeCurrentMenu_: () => void;
+    private stopAnimationsAndShowUi_;
+    private resumeAnimationsIfPossible_;
+    private doFadeIn_;
+    private doFadeOut_;
+    private get animationsBlocked_();
+    render(): JSX.Element;
+}
+export {};

package/lib/typescript/ui/components/uicontroller/UiControls.d.ts

@@ -0,0 +1,14 @@
+import type { ReactNode } from 'react';
+/**
+ * A callback function to render a menu when needed.
+ */
+export declare type MenuConstructor = () => ReactNode;
+/**
+ * The API provided to all UI components in `react-native-theoplayer` so they can communicate with the UI.
+ */
+export interface UiControls {
+    readonly buttonsEnabled_: boolean;
+    onUserAction_: () => void;
+    openMenu_: (menuConstructor: MenuConstructor) => void;
+    closeCurrentMenu_: () => void;
+}

package/lib/typescript/ui/components/uicontroller/barrel.d.ts

@@ -0,0 +1,2 @@
+export * from './UiContainer';
+export * from './UiControls';

package/lib/typescript/ui/components/util/PlayerContext.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import type { THEOplayer } from 'react-native-theoplayer';
+import type { THEOplayerTheme } from '../../THEOplayerTheme';
+import type { UiControls } from '../uicontroller/UiControls';
+export interface UiContext {
+    /**
+     * The THEOplayer from the THEOplayerView.
+     */
+    readonly player: THEOplayer;
+    /**
+     * The configured THEOplayerTheme.
+     */
+    readonly style: THEOplayerTheme;
+    /**
+     * UI controls for the components to communicate with the UI.
+     */
+    readonly ui: UiControls;
+}
+/**
+ * The context for all UI components of `react-native-theoplayer`.
+ */
+export declare const PlayerContext: React.Context<UiContext>;

package/lib/typescript/ui/components/util/TrackUtils.d.ts

@@ -0,0 +1,10 @@
+import type { MediaTrack, TextTrack } from 'react-native-theoplayer';
+import { TrackListEventType, VideoQuality } from 'react-native-theoplayer';
+export declare function getTrackLabel(track: MediaTrack | TextTrack): string;
+export declare function stringFromTextTrackListEvent(type: TrackListEventType): string;
+/**
+ * Retain renderable tracks.
+ * https://html.spec.whatwg.org/multipage/embedded-content.html#text-track-showing
+ */
+export declare function filterRenderableTracks(textTracks: TextTrack[]): TextTrack[];
+export declare function getVideoQualityLabel(quality: VideoQuality | undefined, withBandWidth?: boolean): string;

package/lib/typescript/ui/components/util/barrel.d.ts

@@ -0,0 +1 @@
+export * from './PlayerContext';

package/lib/typescript/ui/utils/ArrayUtils.d.ts

@@ -0,0 +1,2 @@
+export declare function arrayRemoveElement<T>(array: T[], element: T): boolean;
+export declare function arrayRemoveAt<T>(array: T[], index: number): void;

package/lib/typescript/ui/utils/language/Language.d.ts

@@ -0,0 +1,19 @@
+export interface ISO639Language {
+    name: string;
+    local: string;
+    '1': string;
+    '2': string;
+    '2T': string;
+    '2B': string;
+    '3': string;
+}
+/**
+ * "und" is intended for cases where the language in the data
+ * has not been identified, such as when it is mislabeled
+ * or never had been labeled.
+ *
+ * https://en.wikipedia.org/wiki/ISO_639:und
+ */
+export declare const ISO639_UNDETERMINED = "und";
+export declare function getISO639LanguageByCode(code: string): ISO639Language | undefined;
+export declare const iso639Data: ISO639Language[];

package/lib/typescript/web/platform/BrowserDetection.d.ts

@@ -0,0 +1,23 @@
+declare global {
+    interface Window {
+        ActiveXObject?: any;
+        DocumentTouch?: any;
+    }
+}
+declare class BrowserDetection {
+    static readonly instance_: BrowserDetection;
+    private readonly _isWindowsPhone;
+    private readonly _isIphone;
+    private readonly _isIpad;
+    private readonly _isIpod;
+    private readonly _isMac;
+    private readonly _isTizen;
+    private readonly _isTouch;
+    private readonly _isIpadOs;
+    private readonly _isIos;
+    private readonly _isSafari;
+    get IS_IOS_(): boolean;
+    get IS_SAFARI_(): boolean;
+}
+export declare const browserDetection: BrowserDetection;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-theoplayer",
-  "version": "1.8.2",
+  "version": "2.0.0",
   "description": "A THEOplayer video component for react-native.",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
@@ -14,6 +14,8 @@
     "ios",
     "cpp",
     "react-native-theoplayer.podspec",
+    "react-native-theoplayer.json",
+    "CHANGELOG.md",
     "!lib/typescript/example",
     "!android/build",
     "!ios/build",
@@ -25,9 +27,7 @@
     "lint": "eslint \"**/*.{ts,tsx}\"",
     "prepare": "bob build",
     "release": "release-it",
-    "example": "yarn --cwd example",
-    "pods": "cd example && pod-install --quiet",
-    "bootstrap": "yarn example && yarn && yarn pods"
+    "pods": "cd example && pod-install --quiet"
   },
   "keywords": [
     "react-native",
@@ -49,8 +49,8 @@
     "@commitlint/config-conventional": "^11.0.0",
     "@react-native-community/eslint-config": "^2.0.0",
     "@release-it/conventional-changelog": "^5.1.1",
-    "@types/react": "^17.0.1",
-    "@types/react-native": "0.64.2",
+    "@types/react": "^18.0.31",
+    "@types/react-native": "^0.71.5",
     "commitlint": "^11.0.0",
     "eslint": "^7.2.0",
     "eslint-config-prettier": "^7.0.0",
@@ -59,8 +59,8 @@
     "husky": "^6.0.0",
     "pod-install": "^0.1.0",
     "prettier": "^2.0.5",
-    "react": "17.0.1",
-    "react-native": "0.64.2",
+    "react": "^18.2.0",
+    "react-native": "^0.71.5",
     "react-native-builder-bob": "^0.18.0",
     "release-it": "^15.5.0",
     "typescript": "^4.1.3"
@@ -110,7 +110,13 @@
     ]
   },
   "dependencies": {
+    "@react-native-community/slider": "^4.4.2",
     "buffer": "^6.0.3",
-    "theoplayer": "^4.6.0"
+    "react-native-google-cast": "^4.6.2",
+    "react-native-svg": "^13.8.0",
+    "react-native-svg-web": "^1.0.0",
+    "react-native-url-polyfill": "^1.3.0",
+    "theoplayer": "^4.6.0",
+    "url-polyfill": "^1.1.12"
   }
 }

package/react-native-theoplayer.json

@@ -0,0 +1,8 @@
+{
+	"ios": {
+		"features": [
+			"GOOGLE_IMA",
+			"CHROMECAST"
+		]
+	}
+}

package/react-native-theoplayer.podspec

@@ -1,6 +1,13 @@
 require "json"
 
 package = JSON.parse(File.read(File.join(__dir__, "package.json")))
+theoconfigpath = File.join(__dir__ + "/../../", "react-native-theoplayer.json")
+if File.exists?(theoconfigpath) 
+  theoconfig = JSON.parse(File.read(theoconfigpath))
+  theofeatures = theoconfig["ios"]["features"]
+else
+  theofeatures = []
+end
 
 Pod::Spec.new do |s|
   s.name         = "react-native-theoplayer"
@@ -9,13 +16,32 @@ Pod::Spec.new do |s|
   s.homepage     = package["homepage"]
   s.license      = package["license"]
   s.authors      = package["author"]
-
-  s.platforms    = { :ios => "11.0", :tvos => "12.0" }
+  
+  s.platforms    = { :ios => "12.0", :tvos => "12.0" }
   s.source       = { :git => "https://www.theoplayer.com/.git", :tag => "#{s.version}" }
-
-  s.source_files = 'ios/*.{h,m,swift}', 'ios/ads/*.swift', 'ios/casting/*.swift', 'ios/contentprotection/*.swift'
+  
+  s.source_files = 'ios/*.{h,m,swift}', 'ios/ads/*.swift', 'ios/casting/*.swift', 'ios/contentprotection/*.swift', 'ios/pip/*.swift', 'ios/backgroundAudio/*.swift'
   s.resources = ['ios/*.css']
-
+  
+  # ReactNative Dependency
   s.dependency "React-Core"
-  s.dependency "THEOplayerSDK-basic"
+  
+  # THEOplayer Dependencies
+  if theofeatures.include?("WEB") 
+    s.dependency "THEOplayerSDK-basic"
+    s.pod_target_xcconfig = {
+      'SWIFT_ACTIVE_COMPILATION_CONDITIONS[config=Release]' => theofeatures.join(' '),
+      'SWIFT_ACTIVE_COMPILATION_CONDITIONS[config=Debug]' => theofeatures.join(' ')
+    }
+  else 
+    s.dependency "THEOplayerSDK-core"
+    if theofeatures.include?("GOOGLE_IMA") 
+      s.dependency "THEOplayer-Integration-GoogleIMA"
+    end
+    if theofeatures.include?("CHROMECAST")
+      s.ios.dependency "THEOplayer-Integration-GoogleCast"
+      s.ios.dependency "google-cast-sdk-dynamic-xcframework-no-bluetooth"
+    end
+  end
+  
 end