forked from coracle/flotilla
Jon Staab
40 lines
884 B
Svelte
40 lines
884 B
Svelte
<script lang="ts">
|
|
import {onMount} from "svelte"
|
|
import {userSettingsValues} from "@app/core/state"
|
|
import {notifications} from "../util/notifications"
|
|
|
|
let audioElement: HTMLAudioElement
|
|
|
|
let enabled = $state(false)
|
|
|
|
document.addEventListener("visibilitychange", () => {
|
|
if (document.hidden) {
|
|
enabled = true
|
|
} else {
|
|
enabled = false
|
|
}
|
|
})
|
|
|
|
let notificationCount = $state($notifications.size)
|
|
|
|
const playSound = () => {
|
|
if (enabled && $userSettingsValues.play_notification_sound) {
|
|
audioElement?.play()
|
|
}
|
|
}
|
|
|
|
onMount(() => {
|
|
audioElement.load()
|
|
|
|
notifications.subscribe(notifications => {
|
|
if (notifications.size > notificationCount) {
|
|
playSound()
|
|
}
|
|
|
|
notificationCount = notifications.size
|
|
})
|
|
})
|
|
</script>
|
|
|
|
<audio bind:this={audioElement} src="/new-notification-3-398649.mp3"></audio>
|