@eduardoroth/media-player


Native Media Player for iOS, Android and Browser.
Based on the great work of @jepiqueau

- iOS
- AVPlayer
- Android
- ExoPlayer3
- Web
- Vidstack

Install

``bash
npm install @eduardoroth/media-player
npx cap sync
`

Android

Required Gradle v7+

For the plugin to work correctly, you have to set/add in your AndroidManifest.xml for your main activity the following setting for android:configChanges

`xml
android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|screenLayout|uiMode|fontScale|density|fontWeightAdjustment"
>

`

This will make sure the app doesn't break when doing any of the following actions:

- Changing the orientation
- Showing or hiding the keyboard
- Changing the screen size
- Casting or mirroring the screen
- Changing the font scale
- Changing the screen density

Contributors

API

* create(...)
* play(...)
* pause(...)
* getDuration(...)
* getCurrentTime(...)
* setCurrentTime(...)
* isPlaying(...)
* isMuted(...)
* setVisibilityBackgroundForPiP(...)
* mute(...)
* getVolume(...)
* setVolume(...)
* getRate(...)
* setRate(...)
* remove(...)
* removeAll()
* addListener('MediaPlayer:Ready', ...)
* addListener('MediaPlayer:Play', ...)
* addListener('MediaPlayer:Pause', ...)
* addListener('MediaPlayer:Ended', ...)
* addListener('MediaPlayer:Removed', ...)
* addListener('MediaPlayer:Seek', ...)
* addListener('MediaPlayer:TimeUpdated', ...)
* addListener('MediaPlayer:FullScreen', ...)
* addListener('MediaPlayer:PictureInPicture', ...)
* addListener('MediaPlayer:isPlayingInBackground', ...)
* removeAllListeners(...)
* Interfaces
* Type Aliases

$3

`typescript
create(options: MediaPlayerOptions) => Promise>
`

| Param | Type |
| ------------- | ----------------------------------------------------------------- |
| options | MediaPlayerOptions |

Returns: Promise<MediaPlayerResult<string>>

--------------------

$3

`typescript
play(options: MediaPlayerIdOptions) => Promise>
`

| Param | Type |
| ------------- | --------------------------------------------------------------------- |
| options | MediaPlayerIdOptions |

Returns: Promise<MediaPlayerResult<string>>

--------------------

$3

`typescript
pause(options: MediaPlayerIdOptions) => Promise>
`

| Param | Type |
| ------------- | --------------------------------------------------------------------- |
| options | MediaPlayerIdOptions |

Returns: Promise<MediaPlayerResult<string>>

--------------------

$3

`typescript
getDuration(options: MediaPlayerIdOptions) => Promise>
`

| Param | Type |
| ------------- | --------------------------------------------------------------------- |
| options | MediaPlayerIdOptions |

Returns: Promise<MediaPlayerResult<number>>

--------------------

$3

`typescript
getCurrentTime(options: MediaPlayerIdOptions) => Promise>
`

| Param | Type |
| ------------- | --------------------------------------------------------------------- |
| options | MediaPlayerIdOptions |

Returns: Promise<MediaPlayerResult<number>>

--------------------

$3

`typescript
setCurrentTime(options: MediaPlayerSetCurrentTimeOptions) => Promise>
`

| Param | Type |
| ------------- | --------------------------------------------------------------------------------------------- |
| options | MediaPlayerSetCurrentTimeOptions |

Returns: Promise<MediaPlayerResult<number>>

--------------------

$3

`typescript
isPlaying(options: MediaPlayerIdOptions) => Promise>
`

| Param | Type |
| ------------- | --------------------------------------------------------------------- |
| options | MediaPlayerIdOptions |

Returns: Promise<MediaPlayerResult<boolean>>

--------------------

$3

`typescript
isMuted(options: MediaPlayerIdOptions) => Promise>
`

| Param | Type |
| ------------- | --------------------------------------------------------------------- |
| options | MediaPlayerIdOptions |

Returns: Promise<MediaPlayerResult<boolean>>

--------------------

$3

`typescript
setVisibilityBackgroundForPiP(options: MediaPlayerSetVisibilityBackgroundForPiPOptions) => Promise>
`

| Param | Type |
| ------------- | --------------------------------------------------------------------------------------------------------------------------- |
| options | MediaPlayerSetVisibilityBackgroundForPiPOptions |

Returns: Promise<MediaPlayerResult<boolean>>

--------------------

$3

`typescript
mute(options: MediaPlayerIdOptions) => Promise>
`

| Param | Type |
| ------------- | --------------------------------------------------------------------- |
| options | MediaPlayerIdOptions |

Returns: Promise<MediaPlayerResult<boolean>>

--------------------

$3

`typescript
getVolume(options: MediaPlayerIdOptions) => Promise>
`

| Param | Type |
| ------------- | --------------------------------------------------------------------- |
| options | MediaPlayerIdOptions |

Returns: Promise<MediaPlayerResult<number>>

--------------------

$3

`typescript
setVolume(options: MediaPlayerSetVolumeOptions) => Promise>
`

| Param | Type |
| ------------- | ----------------------------------------------------------------------------------- |
| options | MediaPlayerSetVolumeOptions |

Returns: Promise<MediaPlayerResult<number>>

--------------------

$3

`typescript
getRate(options: MediaPlayerIdOptions) => Promise>
`

| Param | Type |
| ------------- | --------------------------------------------------------------------- |
| options | MediaPlayerIdOptions |

Returns: Promise<MediaPlayerResult<number>>

--------------------

$3

`typescript
setRate(options: MediaPlayerSetRateOptions) => Promise>
`

| Param | Type |
| ------------- | ------------------------------------------------------------------------------- |
| options | MediaPlayerSetRateOptions |

Returns: Promise<MediaPlayerResult<number>>

--------------------

$3

`typescript
remove(options: MediaPlayerIdOptions) => Promise>
`

| Param | Type |
| ------------- | --------------------------------------------------------------------- |
| options | MediaPlayerIdOptions |

Returns: Promise<MediaPlayerResult<string>>

--------------------

$3

`typescript
removeAll() => Promise>
`

Returns: Promise<MediaPlayerResult<string[]>>

--------------------

$3

`typescript
addListener(event: 'MediaPlayer:Ready', listener: (event: { playerId: string; }) => void) => Promise
`

| Param | Type |
| -------------- | ------------------------------------------------------ |
| event | 'MediaPlayer:Ready' |
| listener | (event: { playerId: string; }) => void |

Returns: Promise<PluginListenerHandle>

--------------------

$3

`typescript
addListener(event: 'MediaPlayer:Play', listener: (event: { playerId: string; }) => void) => Promise
`

| Param | Type |
| -------------- | ------------------------------------------------------ |
| event | 'MediaPlayer:Play' |
| listener | (event: { playerId: string; }) => void |

Returns: Promise<PluginListenerHandle>

--------------------

$3

`typescript
addListener(event: 'MediaPlayer:Pause', listener: (event: { playerId: string; }) => void) => Promise
`

| Param | Type |
| -------------- | ------------------------------------------------------ |
| event | 'MediaPlayer:Pause' |
| listener | (event: { playerId: string; }) => void |

Returns: Promise<PluginListenerHandle>

--------------------

$3

`typescript
addListener(event: 'MediaPlayer:Ended', listener: (event: { playerId: string; }) => void) => Promise
`

| Param | Type |
| -------------- | ------------------------------------------------------ |
| event | 'MediaPlayer:Ended' |
| listener | (event: { playerId: string; }) => void |

Returns: Promise<PluginListenerHandle>

--------------------

$3

`typescript
addListener(event: 'MediaPlayer:Removed', listener: (event: { playerId: string; }) => void) => Promise
`

| Param | Type |
| -------------- | ------------------------------------------------------ |
| event | 'MediaPlayer:Removed' |
| listener | (event: { playerId: string; }) => void |

Returns: Promise<PluginListenerHandle>

--------------------

$3

`typescript
addListener(event: 'MediaPlayer:Seek', listener: (event: { playerId: string; previousTime: number | undefined; newTime: number; }) => void) => Promise
`

| Param | Type |
| -------------- | --------------------------------------------------------------------------------------------- |
| event | 'MediaPlayer:Seek' |
| listener | (event: { playerId: string; previousTime: number; newTime: number; }) => void |

Returns: Promise<PluginListenerHandle>

--------------------

$3

`typescript
addListener(event: 'MediaPlayer:TimeUpdated', listener: (event: { playerId: string; currentTime: number; }) => void) => Promise
`

| Param | Type |
| -------------- | --------------------------------------------------------------------------- |
| event | 'MediaPlayer:TimeUpdated' |
| listener | (event: { playerId: string; currentTime: number; }) => void |

Returns: Promise<PluginListenerHandle>

--------------------

$3

`typescript
addListener(event: 'MediaPlayer:FullScreen', listener: (event: { playerId: string; isInFullScreen: boolean; }) => void) => Promise
`

| Param | Type |
| -------------- | ------------------------------------------------------------------------------- |
| event | 'MediaPlayer:FullScreen' |
| listener | (event: { playerId: string; isInFullScreen: boolean; }) => void |

Returns: Promise<PluginListenerHandle>

--------------------

$3

`typescript
addListener(event: 'MediaPlayer:PictureInPicture', listener: (event: { playerId: string; isInPictureInPicture: boolean; }) => void) => Promise
`

| Param | Type |
| -------------- | ------------------------------------------------------------------------------------- |
| event | 'MediaPlayer:PictureInPicture' |
| listener | (event: { playerId: string; isInPictureInPicture: boolean; }) => void |

Returns: Promise<PluginListenerHandle>

--------------------

$3

`typescript
addListener(event: 'MediaPlayer:isPlayingInBackground', listener: (event: { playerId: string; isPlayingInBackground: boolean; }) => void) => Promise
`

| Param | Type |
| -------------- | -------------------------------------------------------------------------------------- |
| event | 'MediaPlayer:isPlayingInBackground' |
| listener | (event: { playerId: string; isPlayingInBackground: boolean; }) => void |

Returns: Promise<PluginListenerHandle>

--------------------

$3

`typescript
removeAllListeners(options: MediaPlayerIdOptions) => Promise
`

| Param | Type |
| ------------- | --------------------------------------------------------------------- |
| options | MediaPlayerIdOptions |

--------------------

$3


#### Error

| Prop | Type |
| ------------- | ------------------- |
| name | string |
| message | string |
| stack | string |


#### PluginListenerHandle

| Prop | Type |
| ------------ | ----------------------------------------- |
| remove` | () => Promise<void> |

$3

#### MediaPlayerResult

{ method: string; result: boolean; value?: ResultValueType; error?: Error; message?: string; }

#### MediaPlayerOptions

{ playerId: string; url: string; placement?: MediaPlayerPlacementOptions; ios?: MediaPlayerIosOptions; android?: MediaPlayerAndroidOptions; web?: MediaPlayerWebOptions; extra?: MediaPlayerExtraOptions; }

#### MediaPlayerPlacementOptions

{ videoOrientation?: 'VERTICAL' | 'HORIZONTAL'; horizontalMargin?: number; horizontalAlignment?: 'START' | 'CENTER' | 'END'; verticalMargin?: number; verticalAlignment?: 'TOP' | 'CENTER' | 'BOTTOM'; height?: number; width?: number; }

#### MediaPlayerIosOptions

{ enableExternalPlayback?: boolean; enablePiP?: boolean; enableBackgroundPlay?: boolean; openInFullscreen?: boolean; automaticallyEnterPiP?: boolean; automaticallyHideBackgroundForPip?: boolean; fullscreenOnLandscape?: boolean; allowsVideoFrameAnalysis?: boolean; }

#### MediaPlayerAndroidOptions

{ enableChromecast?: boolean; enablePiP?: boolean; enableBackgroundPlay?: boolean; openInFullscreen?: boolean; automaticallyEnterPiP?: boolean; fullscreenOnLandscape?: boolean; stopOnTaskRemoved?: boolean; }

#### MediaPlayerWebOptions

{ enableChromecast?: boolean; }

#### MediaPlayerExtraOptions

{ title?: string; subtitle?: string; poster?: string; artist?: string; rate?: number; subtitles?: MediaPlayerSubtitleOptions; autoPlayWhenReady?: boolean; loopOnEnd?: boolean; showControls?: boolean; headers?: { [key: string]: string; }; }

#### MediaPlayerSubtitleOptions

{ url: string; options?: { language?: string; foregroundColor?: string; backgroundColor?: string; fontSize?: number; }; }

#### MediaPlayerIdOptions

{ playerId: string; }

#### MediaPlayerSetCurrentTimeOptions

{ playerId: string; time: number; }

#### MediaPlayerSetVisibilityBackgroundForPiPOptions

{ playerId: string; isVisible: boolean; }

#### MediaPlayerSetVolumeOptions

{ playerId: string; volume: number; }

#### MediaPlayerSetRateOptions

{ playerId: string; rate: number; }