This commit is contained in:
Santiago Lo Coco 2024-05-09 14:02:02 +02:00
parent 2603c57018
commit d93640c9ba
1 changed files with 95 additions and 90 deletions

View File

@ -2,11 +2,23 @@
import { onDestroy, onMount } from "svelte" import { onDestroy, onMount } from "svelte"
import { browser } from "$app/environment" import { browser } from "$app/environment"
let BREAK_INTERVAL_STORE = $state(browser ? (localStorage.getItem('breakInterval') || 20) : 20) let BREAK_INTERVAL_STORE = $state(
let MINI_BREAK_DURATION_STORE = $state(browser ? (localStorage.getItem('miniBreakDuration') || 20) : 20) browser ? localStorage.getItem("breakInterval") || 20 : 20
let LONG_BREAK_DURATION_STORE = $state(browser ? (localStorage.getItem('longBreakDuration') || 5) : 5) )
let SOUND_ENABLED = $state(browser ? ((localStorage.getItem('soundEnabled') || 'true') === 'true') : true) let MINI_BREAK_DURATION_STORE = $state(
let NOTIFICATIONS_ENABLED = $state(browser ? ((localStorage.getItem('notificationsEnabled') || 'true') === 'true') : true) browser ? localStorage.getItem("miniBreakDuration") || 20 : 20
)
let LONG_BREAK_DURATION_STORE = $state(
browser ? localStorage.getItem("longBreakDuration") || 5 : 5
)
let SOUND_ENABLED = $state(
browser ? (localStorage.getItem("soundEnabled") || "true") === "true" : true
)
let NOTIFICATIONS_ENABLED = $state(
browser
? (localStorage.getItem("notificationsEnabled") || "true") === "true"
: true
)
let BREAK_INTERVAL: number let BREAK_INTERVAL: number
let MINI_BREAK_DURATION: number let MINI_BREAK_DURATION: number
@ -27,20 +39,20 @@
$effect(() => { $effect(() => {
MINI_BREAK_DURATION = MINI_BREAK_DURATION_STORE * 1000 MINI_BREAK_DURATION = MINI_BREAK_DURATION_STORE * 1000
localStorage.setItem('miniBreakDuration', MINI_BREAK_DURATION_STORE) localStorage.setItem("miniBreakDuration", MINI_BREAK_DURATION_STORE)
}) })
$effect(() => { $effect(() => {
LONG_BREAK_DURATION = LONG_BREAK_DURATION_STORE * 60 * 1000 LONG_BREAK_DURATION = LONG_BREAK_DURATION_STORE * 60 * 1000
localStorage.setItem('longBreakDuration', LONG_BREAK_DURATION_STORE) localStorage.setItem("longBreakDuration", LONG_BREAK_DURATION_STORE)
}) })
$effect(() => { $effect(() => {
localStorage.setItem('soundEnabled', SOUND_ENABLED) localStorage.setItem("soundEnabled", SOUND_ENABLED)
}) })
$effect(() => { $effect(() => {
localStorage.setItem('notificationsEnabled', NOTIFICATIONS_ENABLED) localStorage.setItem("notificationsEnabled", NOTIFICATIONS_ENABLED)
}) })
let miniBreakCount = 0 let miniBreakCount = 0
@ -142,15 +154,11 @@
</script> </script>
<main> <main>
{#if !browser}
{#if !browser} <div class="loading-spinner" />
<div class="loading-spinner"/> {:else}
{:else}
<div class="container"> <div class="container">
<div class="settings"> <div class="settings">
<div class="setting"> <div class="setting">
<label for="break-interval" <label for="break-interval"
>Break interval: {BREAK_INTERVAL_STORE} minutes</label >Break interval: {BREAK_INTERVAL_STORE} minutes</label
@ -221,8 +229,7 @@
{/if} {/if}
</div> </div>
</div> </div>
{/if}
{/if}
</main> </main>
<style lang="postcss"> <style lang="postcss">
@ -293,6 +300,4 @@
transform: rotate(360deg); transform: rotate(360deg);
} }
} }
</style> </style>