cyber-mawonaj/oki-podcast-reader
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

passes duration to slot props

Browse Source
This commit is contained in:
Ollie Taylor
2023-02-22 00:29:57 +00:00
parent 8afc23cbac
commit 07212fc671
2 changed files with 22 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/routes/+page.svelte
+21 -19
View File
@@ -19,30 +19,32 @@
{playbackRate}
{paused}
bind:currentTime
/>
let:duration
>
<h5>Custom audio controls</h5>
<h5>Custom audio controls</h5>
<h6>Audio Actions</h6>
<h6>Audio Actions</h6>
<button type="button" on:click={() => (paused = false)}>Play</button>
<button type="button" on:click={() => (paused = true)}>Pause</button>
<button type="button" on:click={() => (paused = !paused)}>Toggle</button>
<button type="button" on:click={() => (paused = false)}>Play</button>
<button type="button" on:click={() => (paused = true)}>Pause</button>
<button type="button" on:click={() => (paused = !paused)}>Toggle</button>
<h6>Seeking</h6>
<h6>Seeking</h6>
<button type="button" on:click={() => (currentTime = currentTime + 5)}>Skip 5s</button>
<button type="button" on:click={() => (currentTime = currentTime - 5)}>Rewind 5s</button>
<button type="button" on:click={() => (currentTime = 30)}>Go to 30s</button>
<button type="button" on:click={() => (currentTime = duration - 30)}>Go to 30s before end</button>
<button type="button" on:click={() => (currentTime = currentTime + 5)}>Skip 5s</button>
<button type="button" on:click={() => (currentTime = currentTime - 5)}>Rewind 5s</button>
<button type="button" on:click={() => (currentTime = 30)}>Go to 30s</button>
<h6>Playback Rate</h6>
<h6>Playback Rate</h6>
{#each [0.5, 1, 2, 3] as rate}
<button type="button" on:click={() => (playbackRate = rate)}>{rate}x</button>
{/each}
{#each [0.5, 1, 2, 3] as rate}
<button type="button" on:click={() => (playbackRate = rate)}>{rate}x</button>
{/each}
<h6>Volume</h6>
<h6>Volume</h6>
{#each [0, 0.25, 0.5, 0.75, 1] as v}
<button type="button" on:click={() => (volume = v)}>{v * 100}%</button>
{/each}
{#each [0, 0.25, 0.5, 0.75, 1] as v}
<button type="button" on:click={() => (volume = v)}>{v * 100}%</button>
{/each}
</Audio>