- All you need to load an episode is a URL to an audio file.
- svelte-podcast uses a html audio element under the hood, so any
- audio file compatible with the autio element is also compatible with
- this package.
+ Subscribe to specific changes in the audio attributes. This will
+ return a readable store that you can use to access the attributes.
-
-
-
+
+
+
-
Using a local file (relative path)
-
+
- If you're using SvelteKit, you can store static files in
- the /static directory. When your site is built, everything in the
- static directory will be at the root of your site. If you have a
- file in /static/episides/episode-01.mp3 you could load
- it as /episides/episode-01.mp3
+ Load a new audio source. This will stop the current audio source and
+ replace it with the new one.
+
+
+
+
-
-
+
+
+ Unload the current audio source. This will stop the current audio
+ source and remove it from the audio state.
+
+
+
+
+
+
+
+ Set or toggle the play state.
+
+
+
+
+
+
+ Set or toggle the pause state.
+
+
+
+
+
+
+ Set or toggle the mute state.
+
+
+
+
+
+
+ Set or toggle the unmute state.
+
+
+
+
+
+
+
+ Seek to a specific time in the audio. The `from` parameter
+ determines whether the time is relative to the start or end of the
+ audio.
+
+
+
+
+
+
+
+
+ Skip forward or backward in the audio by a specific number of
+ seconds.
+
+
+
-
- Methods
+
+
+
+
- EpisodeDetails\n)',
- description:
- 'You can update the audio state. This is useful if you want to update the state based on the previous state.',
- },
- ]}
- />
+
+
+
+ Subscribe to changes in the user preferences. This will return a
+ readable store that you can use to access the user preferences.
+
+
+
+
+
-
- EpisodeState
-
- `} language={lang_ts} />
-
-
- Episode state holds the metadata for the current episode. You derermine
- the shape of the this data.
-
+
+
+ Set the playback rate. This will update the user preferences and
+ apply the new playback rate to the audio.
+
+
+
+
+
-
- For complete type safety, we recommend defining this type yourself in a
- .d.ts file. In SvelteKit, you should do this in
- /src/app.d.ts
- .
-
+
+
+ Set the volume. This will update the user preferences and apply the
+ new volume to the audio.
+
+
+
+
+
- Override EpisodeState
-
-
-
+
+
+ Clear the user preferences. This will reset the user preferences to
+ the default values.
+
+
+
+
+
-
-
-
- Methods
- EpisodeProgress\n)',
- description:
- 'You can update the audio state. This is useful if you want to update the state based on the previous state.',
- },
- ]}
- />
+
+
+
+
+ User progress is a record where the keys are audio sources, and the
+ values are timestamps in seconds. Progress is retrieved by matching
+ the source, and returning the timestamp.
+
-
- EpisodeProgress
-
+
+ `} language={lang_ts} />
+
+
+
+
+
+
+ Subscribe to changes in the user progress. This will return a
+ readable store that you can use to access the user progress.
+
+
+
+
+
+
+
+
+ Get the user progress for a given audio source. This will return the
+ timestamp in seconds.
+
+
+
+
+
+
+
+
+ Clear the user progress. This will reset the user progress to the
+ default values.
+
+
+
+
+
+
+
+
+ Save the user progress for a given audio source. This will update
+ the user progress with the new timestamp.
+
+
+
+
+
@@ -261,89 +308,4 @@
-
-
-
-
- Methods
-
-
-
- UserPreferences
-
-
-
-
-
-
- Methods
-
-
-
- UserProgress
-
- User progress is a record where the keys are audio sources, and the
- values are timestamps in seconds. Progress is retrieved by matching the
- source, and returning the timestamp.
-
-
-
- `} language={lang_ts} />
-
-
diff --git a/src/routes/api/code/audio-load.js b/src/routes/api/code/audio-load.js
new file mode 100644
index 0000000..d48cd37
--- /dev/null
+++ b/src/routes/api/code/audio-load.js
@@ -0,0 +1,17 @@
+import { audio } from 'svelte-podcast';
+
+// load a new audio source
+audio.load(
+ // path to audio file
+ '/episode-377.mp3',
+
+ // custom metadata
+ {
+ title: 'Supper Club × Rich Harris, Author of Svelte',
+ guests: ['Rich Harris'],
+ hosts: ['Wes Bos', 'Scott Tolinski'],
+ },
+
+ // autoplay
+ true,
+);
diff --git a/src/routes/api/code/audio-mute.js b/src/routes/api/code/audio-mute.js
new file mode 100644
index 0000000..789fae9
--- /dev/null
+++ b/src/routes/api/code/audio-mute.js
@@ -0,0 +1,9 @@
+import { audio } from 'svelte-podcast';
+
+// mute the current audio source
+// do nothing if it's already muted
+audio.mute('set');
+
+// mute the current audio if it's unmuted
+// unmute the current audio if it's muted
+audio.mute('toggle');
diff --git a/src/routes/api/code/audio-pause.js b/src/routes/api/code/audio-pause.js
new file mode 100644
index 0000000..bfa3dd8
--- /dev/null
+++ b/src/routes/api/code/audio-pause.js
@@ -0,0 +1,9 @@
+import { audio } from 'svelte-podcast';
+
+// pause the current audio source
+// do nothing if it's already paused
+audio.pause('set');
+
+// pause the current audio if it's playing
+// play the current audio if it's paused
+audio.pause('toggle');
diff --git a/src/routes/api/code/audio-play.js b/src/routes/api/code/audio-play.js
new file mode 100644
index 0000000..0fd33c2
--- /dev/null
+++ b/src/routes/api/code/audio-play.js
@@ -0,0 +1,9 @@
+import { audio } from 'svelte-podcast';
+
+// play the current audio source
+// do nothing if it's already playing
+audio.play('set');
+
+// play the current audio if it's paused
+// pause the current audio if it's playing
+audio.play('toggle');
diff --git a/src/routes/api/code/audio-seek.js b/src/routes/api/code/audio-seek.js
new file mode 100644
index 0000000..17a2e2a
--- /dev/null
+++ b/src/routes/api/code/audio-seek.js
@@ -0,0 +1,7 @@
+import { audio } from 'svelte-podcast';
+
+// go to 200 seconds from the start
+audio.seek(200);
+
+// go to 200 seconds before the end
+audio.seek(200, 'from-end');
diff --git a/src/routes/api/code/audio-skip.js b/src/routes/api/code/audio-skip.js
new file mode 100644
index 0000000..0b89e7e
--- /dev/null
+++ b/src/routes/api/code/audio-skip.js
@@ -0,0 +1,7 @@
+import { audio } from 'svelte-podcast';
+
+// skip forward 30 seconds from the current position
+audio.skip(30);
+
+// skip backward 30 seconds from the current position
+audio.skip(30, 'backward');
diff --git a/src/routes/api/code/audio-subscribe.svelte b/src/routes/api/code/audio-subscribe.svelte
new file mode 100644
index 0000000..36a9d2f
--- /dev/null
+++ b/src/routes/api/code/audio-subscribe.svelte
@@ -0,0 +1,16 @@
+
+
+
Current timestamp {attributes.timestamp_current}.
+
+
{attributes.is_paused ? 'Paused...' : 'Playing!'}.
diff --git a/src/routes/api/code/audio-unload.js b/src/routes/api/code/audio-unload.js
new file mode 100644
index 0000000..af801f9
--- /dev/null
+++ b/src/routes/api/code/audio-unload.js
@@ -0,0 +1,4 @@
+import { audio } from 'svelte-podcast';
+
+// unload the current audio source
+audio.unload();
diff --git a/src/routes/api/code/audio-unmute.js b/src/routes/api/code/audio-unmute.js
new file mode 100644
index 0000000..51e1789
--- /dev/null
+++ b/src/routes/api/code/audio-unmute.js
@@ -0,0 +1,9 @@
+import { audio } from 'svelte-podcast';
+
+// unmute the current audio source
+// do nothing if it's already unmuted
+audio.unmute('set');
+
+// unmute the current audio if it's muted
+// mute the current audio if it's unmuted
+audio.unmute('toggle');
diff --git a/src/routes/api/code/index.js b/src/routes/api/code/index.js
index 009ae3b..716e32a 100644
--- a/src/routes/api/code/index.js
+++ b/src/routes/api/code/index.js
@@ -1,15 +1,48 @@
+import { format_code } from '../../../layout/helper';
+import { default as audio_load_src } from './audio-load.js?raw';
+import { default as audio_mute_src } from './audio-mute.js?raw';
+import { default as audio_pause_src } from './audio-pause.js?raw';
+import { default as audio_play_src } from './audio-play.js?raw';
+import { default as audio_seek_src } from './audio-seek.js?raw';
+import { default as audio_skip_src } from './audio-skip.js?raw';
+import { default as audio_subscribe_src } from './audio-subscribe.svelte?raw';
+import { default as audio_unload_src } from './audio-unload.js?raw';
+import { default as audio_unmute_src } from './audio-unmute.js?raw';
import { default as load_audio_after_click_src } from './load-audio-after-click.svelte?raw';
import { default as load_audio_after_mount_src } from './load-audio-after-mount.svelte?raw';
-import { default as load_audio_local_src } from './load-audio-local?raw';
-import { default as load_audio_remote_src } from './load-audio-remote?raw';
-import { default as override_episode_state_src } from './override-episode-state?raw';
import { default as seconds_to_timestamp_src } from './seconds-to-timestamp?raw';
-
-const format_code = (/** @type {string} */ code) => code.replaceAll('\t', ' ');
+import { default as user_preferences_clear_src } from './user_preferences-clear?raw';
+import { default as user_preferences_set_playback_rate_src } from './user_preferences-set_playback_rate?raw';
+import { default as user_preferences_set_volume_src } from './user_preferences-set_volume?raw';
+import { default as user_preferences_subscribe_src } from './user_preferences-subscribe.svelte?raw';
+import { default as user_progress_clear_src } from './user_progress-clear?raw';
+import { default as user_progress_get_src } from './user_progress-get?raw';
+import { default as user_progress_save_src } from './user_progress-save?raw';
+import { default as user_progress_subscribe_src } from './user_progress-subscribe.svelte?raw';
export const load_audio_after_click = format_code(load_audio_after_click_src);
export const load_audio_after_mount = format_code(load_audio_after_mount_src);
-export const load_audio_local = format_code(load_audio_local_src);
-export const load_audio_remote = format_code(load_audio_remote_src);
-export const override_episode_state = format_code(override_episode_state_src);
export const seconds_to_timestamp = format_code(seconds_to_timestamp_src);
+export const audio_load = format_code(audio_load_src);
+export const audio_play = format_code(audio_play_src);
+export const audio_unload = format_code(audio_unload_src);
+export const audio_pause = format_code(audio_pause_src);
+export const audio_skip = format_code(audio_skip_src);
+export const audio_seek = format_code(audio_seek_src);
+export const audio_mute = format_code(audio_mute_src);
+export const audio_unmute = format_code(audio_unmute_src);
+export const user_preferences_clear = format_code(user_preferences_clear_src);
+export const user_preferences_set_playback_rate = format_code(
+ user_preferences_set_playback_rate_src,
+);
+export const user_preferences_set_volume = format_code(
+ user_preferences_set_volume_src,
+);
+export const user_preferences_subscribe = format_code(
+ user_preferences_subscribe_src,
+);
+export const audio_subscribe = format_code(audio_subscribe_src);
+export const user_progress_clear = format_code(user_progress_clear_src);
+export const user_progress_get = format_code(user_progress_get_src);
+export const user_progress_save = format_code(user_progress_save_src);
+export const user_progress_subscribe = format_code(user_progress_subscribe_src);
diff --git a/src/routes/api/code/load-audio-after-click.svelte b/src/routes/api/code/load-audio-after-click.svelte
index f20855e..1fa0fde 100644
--- a/src/routes/api/code/load-audio-after-click.svelte
+++ b/src/routes/api/code/load-audio-after-click.svelte
@@ -1,11 +1,11 @@
-
+
diff --git a/src/routes/api/code/load-audio-after-mount.svelte b/src/routes/api/code/load-audio-after-mount.svelte
index 63cfadb..28230f3 100644
--- a/src/routes/api/code/load-audio-after-mount.svelte
+++ b/src/routes/api/code/load-audio-after-mount.svelte
@@ -1,10 +1,10 @@
+
+
Listening at {preferences.playback_rate * 100}% speed.
+
+
Volume set to {preferences.volume * 100}%.
diff --git a/src/routes/api/code/user_progress-clear.js b/src/routes/api/code/user_progress-clear.js
new file mode 100644
index 0000000..b4180d8
--- /dev/null
+++ b/src/routes/api/code/user_progress-clear.js
@@ -0,0 +1,4 @@
+import { user_progress } from 'svelte-podcast';
+
+// Clear the user's progress for ALL episodes.
+user_progress.clear();
diff --git a/src/routes/api/code/user_progress-get.js b/src/routes/api/code/user_progress-get.js
new file mode 100644
index 0000000..93990fa
--- /dev/null
+++ b/src/routes/api/code/user_progress-get.js
@@ -0,0 +1,4 @@
+import { user_progress } from 'svelte-podcast';
+
+// Get the user's progress for a specific episode.
+user_progress.get('https://example.com/episodes/1');
diff --git a/src/routes/api/code/user_progress-save.js b/src/routes/api/code/user_progress-save.js
new file mode 100644
index 0000000..bf34982
--- /dev/null
+++ b/src/routes/api/code/user_progress-save.js
@@ -0,0 +1,4 @@
+import { user_progress } from 'svelte-podcast';
+
+// Save the user's progress for the current episode.
+user_progress.save();
diff --git a/src/routes/api/code/user_progress-subscribe.svelte b/src/routes/api/code/user_progress-subscribe.svelte
new file mode 100644
index 0000000..f5ce5fa
--- /dev/null
+++ b/src/routes/api/code/user_progress-subscribe.svelte
@@ -0,0 +1,16 @@
+
+
+
+ Listened to {progress['https://example.com/episodes/1']} seconds of episode 1.
+
diff --git a/src/routes/examples/+page.svelte b/src/routes/examples/+page.svelte
index 4412096..714dc05 100644
--- a/src/routes/examples/+page.svelte
+++ b/src/routes/examples/+page.svelte
@@ -1,12 +1,8 @@
-
+
+ Work in progress!
-
-
diff --git a/src/routes/setup/+page.svelte b/src/routes/setup/+page.svelte
index d7b4245..af58fe4 100644
--- a/src/routes/setup/+page.svelte
+++ b/src/routes/setup/+page.svelte
@@ -1,9 +1,15 @@
@@ -17,37 +23,82 @@