add local storage store

src/components/Viewer.svelte

@@ -6,15 +6,15 @@
     import { onMount } from 'svelte'
     import { get } from 'svelte/store'
     import YoutubePlayer from 'yt-player'
-    import { entry, playing, volume, muted } from '/store.js'
+    import { entry, playing, muted, volume } from '/store.js'
 
     let element
     let player
 
     $: updateEntry($entry)
     $: updatePlaying($playing)
-    $: updateVolume($volume)
     $: updateMuted($muted)
+    $: updateVolume($volume)
 
     const updateEntry = (entry) => {
         if (player && entry) player.load(entry.id, get(playing))
@@ -24,14 +24,14 @@
         if (player) playing ? player.play() : player.pause()
     }
 
-    const updateVolume = (volume) => {
-        if (player) player.setVolume(volume)
-    }
-
     const updateMuted = (muted) => {
         if (player) muted ? player.mute() : player.unMute()
     }
 
+    const updateVolume = (volume) => {
+        if (player) player.setVolume(volume)
+    }
+
     onMount(() => {
         player = new YoutubePlayer(element, {
             width: 300,
@@ -44,6 +44,10 @@
             related: false
         })
 
+        updatePlaying($playing)
+        updateMuted($muted)
+        updateVolume($volume)
+
         player.on('ended', () => entry.next())
         player.on('unplayable', () => entry.next())
     })

src/store.js

@@ -11,8 +11,8 @@ export const hashtags = writable([
 ])
 
 export const playing = writable(true)
-export const muted = writable(false)
-export const volume = writable(100)
+export const muted = writableLocalStorage('muted', false)
+export const volume = writableLocalStorage('volume', 100)
 
 export const entries = entriesStore()
 export const entry = entryStore(entries)
@@ -20,6 +20,12 @@ export const entry = entryStore(entries)
 
 
 
+function writableLocalStorage(key, value) {
+    const item = JSON.parse(localStorage.getItem(key))
+    const store = writable(item === null ? value : item)
+    const unsubscribe = store.subscribe(x => localStorage.setItem(key, x))
+    return store
+}
 
 function entryStore(entries) {
     const store = writable(null)

src/util.js

@@ -31,8 +31,7 @@ export const statusesToEntries = pipe(
         const metadata = await fetchYoutubeMetadata(id)
 
         return { status, url, id, tags, metadata }
-    }),
-    asyncTake(20)
+    })
 )
 
 function fetchYoutubeMetadata(id) {