> This project is in early development. The docs are not yet complete and the API is likely to change before 1.0.0.
#### Install
```bash
# with npm
npm install svelte-podcast
# with yarn
yarn add svelte-podcast
# with pnpm
pnpm add svelte-podcast
```
You must add one instance of the `<AudioLoader />` to your app. This should be places as high as possible, ideally in your root `+layout,svelte` file.
```html
<script>
import{AudioLoader}from'svelte-podcast';
</script>
<AudioLoader/>
<slot/>
```
#### Basic usage
You will likely be interacting with svelte-podcast via one of the stores it exports.
```html
<script>
import{
// a custom store for subscribing to the state of the audio player and controlling audio element
audio,
// a custom store for subscribing to the users preferences and setting a users preference
user_preferences,
// a utility for saving and loading the progress of an episode
episode_progress,
// a utility for saving and loading both the progress and preferences
save_podcast_state,
}from'svelte-podcast';
</script>
```
#### `audio` store
##### `subscribe`
```html
<script>
import{audio}from'svelte-podcast';
// shorthand
$audio;
// longhand
audio.subscribe((value)=>{
// value is the current state of the audio store
});
</script>
```
##### methods
###### play / pause
`audio.play()` to play the currently loaded audio, or `audio.play("toggle")` to toggle play/pause.
`audio.pause()` to pause the currently loaded audio, or `audio.pause("toggle")` to toggle play/pause.
###### mute / unmute
`audio.mute()` to mute the audio for the `<audio />` element, or `audio.mute("toggle")` to toggle mute/unmute.
`audio.unmute()` to unmute the audio for the `<audio />` element, or `audio.unmute("toggle")` to toggle mute/unmute.
###### load / unload
`audio.load(data: AudioLoadData, opts: AudioLoadOptions)` to load a new episode into the `<audio />` element.
- AudioLoadData is an object with the following properties:
- src: `string` - the URL or local path to the audio file
- title: `string` - the title of the episode
- artwork: `string` - the URL or local path to the artwork for the episode
- AudioLoadOptions is an object with the following properties:
- autoplay: `boolean` - whether or not to autoplay the audio when it is loaded. Typically this should be set to `true`
- start_at: `number | undefined` - the time in seconds to start the audio at. Useful for resuming playback from a previous session. This will be overridden by the users episode progress if it exists.
`audio.unload()` - unloads the currently loaded audio file from the `<audio />` element.
###### seek / skip
`audio.seek(seconds, from)` - seek to a specific moment in the audio file.
- seconds: `number` - the time in seconds to seek to
- from: `'from-start' | 'from-end'` - whether to seek relative to the start or end of the audio file. Defaults to `'from-start'`
`audio.skip(seconds, type)` - similar to seek, but always relative to the current time.
- seconds: `number` - the time in seconds to skip
- type: `'forward' | 'backward'` - whether to skip forward or backward. Defaults to `'forward'`
Example payload:
```json
{
"current_time":35.624346,
"duration":3378.756,
"ended":false,
"loading":false,
"paused":true,
"start_at":27.37508,
"autoplay":true,
"muted":false,
"src":"/example-syntax.mp3",
"metadata":{
"title":"Supper Club × Rich Harris, Author of Svelte",
> This project is very early in development. Contributions are welcome but I do not plan to provide detailed docs for contributions until the project is more stable.
