bgg-ottawa-sell-club/src/routes/+layout.svelte

68 lines
1.8 KiB
Svelte

<svelte:head>
<title>Ottawa board games, trades and sales</title>
</svelte:head>
<main class="responsive">
<slot />
</main>
<script>
import 'beercss/dist/cdn/beer.min.css';
import { setContext } from 'svelte';
import { dev, browser } from '$app/environment';
import { readable, writable } from 'svelte/store';
import { persisted } from 'svelte-persisted-store';
import u from '@yanick/updeep-remeda';
const prefix = dev ? '/dev/' : '/db/';
const games = readable([], async (set) => {
if (!browser) return () => {};
fetch(prefix + 'games.json')
.then((doc) => doc.json())
.then(set);
return () => {};
});
setContext('games', games);
const sellers = readable({}, async (set) => {
if (!browser) return () => {};
const sellers_list = await fetch(prefix + 'sellers.json').then((doc) =>
doc.json(),
);
set(
Object.fromEntries(
sellers_list.map((seller) => [seller.username, seller]),
),
);
return () => {};
});
setContext('sellers', sellers);
const games_hidden = writable(
JSON.parse(localStorage.getItem('games_hidden') || '{}'),
);
games_hidden.toggle = (username, bgg_id) => {
console.log({ username, bgg_id });
games_hidden.update(
u.updateIn([username, bgg_id].join('!'), (v) => !v),
);
};
setContext('games_hidden', games_hidden);
games_hidden.subscribe((data) =>
localStorage.setItem('games_hidden', JSON.stringify(data)),
);
</script>
<style>
:global(:root) {
--font-size-10: 1rem;
--font-size-11: 1.5rem;
--font-size-12: 1.75rem;
--font-size-13: 2rem;
--font-size-14: 2.25rem;
}
</style>