diff --git a/src/lib/components/audio/audio.svelte b/src/lib/components/audio/audio.svelte index 03fd9bf..2b737ff 100644 --- a/src/lib/components/audio/audio.svelte +++ b/src/lib/components/audio/audio.svelte @@ -6,6 +6,7 @@ __internal_audio_src, } from '$lib/components/audio/store'; import type { PlayerElement } from '$lib/components/audio/types'; + import { isBoolean, isNumber } from '$lib/helper/check'; let element: PlayerElement; let currentTime = 0; @@ -40,43 +41,35 @@ // TODO: reset player state // console.log('emptied', e); }} - aria-activedescendant="audio-progress" - aria-atomic="true" - aria-busy="false" - aria-controls="audio-progress" on:loadeddata={() => { __internal_audio_metadata.update((m) => ({ ...m, loading: false })); }} on:loadstart={() => { __internal_audio_metadata.update((m) => ({ ...m, loading: true })); }} - on:ratechange={(e) => { - // @ts-expect-error event is not fully typed - const rate = e.target.playbackRate; - console.log('rateChange', rate); - if (typeof rate != 'number' || isNaN(rate)) return; - __internal_audio_metadata.update((m) => ({ ...m, playbackRate: rate })); - }} on:playing={(e) => { // @ts-expect-error event is not fully typed const is_paused = e.target.paused; - console.log('playing paused:', is_paused); - if (typeof is_paused != 'boolean') return; + if (!isBoolean(is_paused)) return; __internal_audio_metadata.update((m) => ({ ...m, paused: is_paused })); }} on:pause={(e) => { // @ts-expect-error event is not fully typed const is_paused = e.target.paused; - console.log('pause paused:', is_paused); - if (typeof is_paused != 'boolean') return; + if (!isBoolean(is_paused)) return; __internal_audio_metadata.update((m) => ({ ...m, paused: is_paused })); }} + on:ratechange={(e) => { + // @ts-expect-error event is not fully typed + const playbackRate = e.target.playbackRate; + if (!isNumber(playbackRate)) return; + __internal_audio_metadata.update((m) => ({ ...m, playbackRate })); + }} on:durationchange={(e) => { // @ts-expect-error event is not fully typed - const dur = e.target?.duration; - console.log('durationchange', dur); - if (typeof dur != 'number' || isNaN(dur)) return; - __internal_audio_metadata.update((m) => ({ ...m, duration: dur })); + const duration = e.target?.duration; + if (!isNumber(duration)) return; + __internal_audio_metadata.update((m) => ({ ...m, duration })); }} /> diff --git a/src/lib/components/audio/store.ts b/src/lib/components/audio/store.ts index feadc03..70f6c6d 100644 --- a/src/lib/components/audio/store.ts +++ b/src/lib/components/audio/store.ts @@ -1,6 +1,6 @@ import { dev } from '$app/environment'; import type { PlayerElement, PlayerMetadata } from '$lib/components/audio/types'; -import { secondsToTimestamp } from '$lib/helper/s-to-timestamp'; +import { secondsToTimestamp } from '$lib/helper/seconds-to-timestamp'; import clamp from 'just-clamp'; import { derived, writable } from 'svelte/store'; diff --git a/src/lib/helper/check.ts b/src/lib/helper/check.ts new file mode 100644 index 0000000..e537435 --- /dev/null +++ b/src/lib/helper/check.ts @@ -0,0 +1,7 @@ +export function isBoolean(value: any): value is boolean { + return typeof value === 'boolean'; +} + +export function isNumber(value: any): value is number { + return typeof value === 'number' && !isNaN(value); +} diff --git a/src/lib/helper/s-to-timestamp.ts b/src/lib/helper/seconds-to-timestamp.ts similarity index 100% rename from src/lib/helper/s-to-timestamp.ts rename to src/lib/helper/seconds-to-timestamp.ts