slococo-uni
/
breakoften
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Reformat

This commit is contained in:
Santiago Lo Coco 2024-05-09 12:37:52 +02:00
parent 5524503d75
commit 1c0641e563
1 changed files with 41 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
src/routes/timer/+page.svelte
View File

@ -26,10 +26,16 @@
timeLeft.set(BREAK_INTERVAL) timeLeft.set(BREAK_INTERVAL)
timeLeftDisplay.set(formatTime(BREAK_INTERVAL)) timeLeftDisplay.set(formatTime(BREAK_INTERVAL))
}) })
MINI_BREAK_DURATION_STORE.subscribe((value) => (MINI_BREAK_DURATION = value * 1000)) MINI_BREAK_DURATION_STORE.subscribe(
LONG_BREAK_DURATION_STORE.subscribe((value) => (LONG_BREAK_DURATION = value * 60 * 1000)) (value) => (MINI_BREAK_DURATION = value * 1000)
)
LONG_BREAK_DURATION_STORE.subscribe(
(value) => (LONG_BREAK_DURATION = value * 60 * 1000)
)
SOUND_ENABLED.subscribe((value) => (SOUND_ENABLED_STATE = value)) SOUND_ENABLED.subscribe((value) => (SOUND_ENABLED_STATE = value))
NOTIFICATIONS_ENABLED.subscribe((value) => (NOTIFICATIONS_ENABLED_STATE = value)) NOTIFICATIONS_ENABLED.subscribe(
(value) => (NOTIFICATIONS_ENABLED_STATE = value)
)
let miniBreakCount = 0 let miniBreakCount = 0
@ -79,7 +85,6 @@
timeLeftDisplay.set(formatTime(LONG_BREAK_DURATION)) timeLeftDisplay.set(formatTime(LONG_BREAK_DURATION))
showNotification("Long Break", { showNotification("Long Break", {
body: `Take a ${LONG_BREAK_DURATION / (60 * 1000)}-second break now!`, body: `Take a ${LONG_BREAK_DURATION / (60 * 1000)}-second break now!`,
}) })
playSound() playSound()
return LONG_BREAK_DURATION return LONG_BREAK_DURATION
@ -133,18 +138,42 @@
<h1>Prevent CVS</h1> <h1>Prevent CVS</h1>
<div class="setting"> <div class="setting">
<label for="break-interval">Break interval: {BREAK_INTERVAL / (60 * 1000)} minutes</label> <label for="break-interval"
<input type="range" min="1" max="60" step="1" bind:value={$BREAK_INTERVAL_STORE} /> >Break interval: {BREAK_INTERVAL / (60 * 1000)} minutes</label
>
<input
type="range"
min="1"
max="60"
step="1"
bind:value={$BREAK_INTERVAL_STORE}
/>
</div> </div>
<div class="setting"> <div class="setting">
<label for="mini-break-duration">Mini break duration: {MINI_BREAK_DURATION / 1000} seconds</label> <label for="mini-break-duration"
<input type="range" min="5" max="60" step="1" bind:value={$MINI_BREAK_DURATION_STORE} /> >Mini break duration: {MINI_BREAK_DURATION / 1000} seconds</label
>
<input
type="range"
min="5"
max="60"
step="1"
bind:value={$MINI_BREAK_DURATION_STORE}
/>
</div> </div>
<div class="setting"> <div class="setting">
<label for="long-break-duration">Long break duration: {LONG_BREAK_DURATION / (60 * 1000)} minutes</label> <label for="long-break-duration"
<input type="range" min="1" max="30" step="1" bind:value={$LONG_BREAK_DURATION_STORE} /> >Long break duration: {LONG_BREAK_DURATION / (60 * 1000)} minutes</label
>
<input
type="range"
min="1"
max="30"
step="1"
bind:value={$LONG_BREAK_DURATION_STORE}
/>
</div> </div>
<div class="setting"> <div class="setting">
@ -176,7 +205,6 @@
{/if} {/if}
</div> </div>
</div> </div>
</main> </main>
<style lang="postcss"> <style lang="postcss">
@ -199,7 +227,8 @@
position: relative; position: relative;
} }
.timer, .settings { .timer,
.settings {
@apply text-black; @apply text-black;
} }