@cassette/core
Version:
A simple, clean, and responsive visual wrapper for the HTML audio tag, built with React.
41 lines (39 loc) • 10.4 kB
Markdown
`playerContext` contains the following values:
| Name | Description |
| ---------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| playlist | the playlist passed to the `PlayerContextProvider` |
| activeTrackIndex | the index of the currently playing track |
| trackLoading | A boolean representing whether the current track is still loading |
| paused | A boolean representing whether the current track is paused |
| currentTime | The current playback time in seconds |
| seekPreviewTime | The current previewed time for the seek bar, which may differ from `currentTime` if a seek is in progress |
| seekInProgress | A boolean representing whether a time seek is in progress |
| awaitingPlayResume | A boolean which is `true` if playback is scheduled to resume after active track changed or once the current seek has completed |
| duration | A number showing the duration in seconds of the currently-loaded track |
| bufferedRanges | An array of { `start`, `end` } objects which represent the ranges in the track that have been buffered for playback. `start` and `end` are each numbers showing time in seconds. |
| playedRanges | An array of { `start`, `end` } objects which represent the ranges in the track that have been already played. `start` and `end` are each numbers showing time in seconds. |
| seekableRanges | An array of { `start`, `end` } objects which represent the ranges in the track that are seekable. `start` and `end` are each numbers showing time in seconds. |
| volume | A number between 0 and 1 showing the current track volume |
| muted | A boolean showing whether the track volume is currently muted |
| shuffle | A boolean showing whether the track is currently playing tracks in shuffle order |
| stalled | A boolean showing whether the track playback is currently stalled due to network issues |
| mediaCannotPlay | A boolean showing whether the track playback failed while fetching the media data or if the type of the resource is not supported media format. |
| playbackRate | A number showing the current rate of playback (1 is normal) |
| setVolumeInProgress | A boolean showing whether the volume is currently being adjusted |
| repeatStrategy | A value that is either "track", "playlist" or "none". Tells whether the playlist repeats at the playlist level, the track level, or none (playback stops at the end of the playlist). |
| registerVideoHostElement | A function which registers a DOM element as eligible to host the video content. Generally it's a better idea to use the [`VideoDisplay`](#videodisplay) component, which uses this internally. |
| renderVideoIntoHostElement | A function which moves the video content into the given host DOM element. `registerVideoHostElement` must be called first. |
| unregisterVideoHostElement | A function which unregisters a DOM element that has been used to host the video content. This should **always** be called before the container is removed from the DOM. |
| onTogglePause | A function which can be called with no arguments to toggle the `paused` state, or with a boolean argument to set the `paused` value directly. |
| onSelectTrackIndex | A function which can be called with an index of a new track to play |
| onBackSkip | A function which can be called to trigger a back skip |
| onForwardSkip | A function which can be called to trigger a forward skip |
| onSeekPreview | A function which should be called as the seek time is updated using a progress slider UI, with the new time value as an argument (the resulting behavior depends on the `seekMode` prop passed to [`PlayerContextProvider`](#playercontextprovider)). **`onSeekComplete` must be called when time updates are finished.** If the seeking UI involves a discrete click/tap only, then simply call `onSeekComplete` with the desired seek time. |
| onSeekComplete | A function which should be called in two scenarios: 1. When a time seek has completed (the user has released the mouse), it should be called with **no arguments** to seek to the last time value provided to `onSeekPreview`. Don't forget this! 2. It can be called with a **number argument** that specifies a time to seek to immediately (no need to call `onSeekPreview` first). |
| onSetVolume | A function which should be called as volume adjustments are made using a volume slider UI, with the new volume as an argument. **`onSetVolumeComplete` must be called when adjustments are finished.** If the volume UI involves a discrete click/tap only, then simply call `onSetVolumeComplete` with the desired volume. |
| onSetVolumeComplete | A function which should be called in two scenarios: 1. When a volume update has completed (the user has released the mouse), it should be called with **no arguments** to commit the current volume (the last one set with `onSetVolume`) as stable. Don't forget this! 2. It can be called with a **number argument** that specifies a new volume to set immediately (no need to call `onSetVolume` first). |
| onToggleMuted | A function which can be called with no arguments to toggle the `muted` state, or with a boolean argument to set the `muted` value directly. |
| onToggleShuffle | A function which can be called with no arguments to toggle the `shuffle` state, or with a boolean argument to set the `shuffle` value directly. |
| onSetRepeatStrategy | A function which can be called with a new `repeatStrategy` to use |
| onSetPlaybackRate | A function which can be called with a new `playbackRate` to use |
| reloadActiveTrack | A function which can be called to reload the active track. It can be called with an object that has a property `shouldPlay` which indicates if the track should autoplay after it loads. |