Handle quote of the day

This commit is contained in:
nemunaire 2022-10-04 12:29:16 +02:00
parent 4bdab894ca
commit 9527f43225
2 changed files with 61 additions and 8 deletions

View File

@ -3,17 +3,27 @@
Container, Container,
Icon, Icon,
} from 'sveltestrap'; } from 'sveltestrap';
import { quotes } from '../stores/quotes';
</script> </script>
<Container class="flex-fill d-flex flex-column justify-content-center text-center"> <Container class="flex-fill d-flex flex-column justify-content-center text-center">
{#if $quotes.quoteOfTheDay}
<figure> <figure>
<blockquote class="blockquote text-muted"> <blockquote class="blockquote text-muted">
<p class="display-6">A well-known quote, contained in a blockquote element.</p> <p class="display-6">{$quotes.quoteOfTheDay.content}</p>
</blockquote> </blockquote>
<figcaption class="blockquote-footer"> <figcaption class="blockquote-footer">
Someone famous in <cite title="Source Title">Source Title</cite> {$quotes.quoteOfTheDay.author}
</figcaption> </figcaption>
</figure> </figure>
{:else}
{#await quotes.refreshQOTD()}
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading...</span>
</div>
{/await}
{/if}
<div class="display-5 mb-4"> <div class="display-5 mb-4">
Prochain réveil&nbsp;: demain matin à 7h10 (dans 5 cycles) Prochain réveil&nbsp;: demain matin à 7h10 (dans 5 cycles)
</div> </div>

43
ui/src/stores/quotes.js Normal file
View File

@ -0,0 +1,43 @@
import { writable } from 'svelte/store';
function createQuotesStore() {
const { subscribe, set, update } = writable({quotes: [], quoteOfTheDay: null});
return {
subscribe,
set: (quotes) => {
update((m) => Object.assign(m, {quotes}));
},
setQOTD: (quoteOfTheDay) => {
update((m) => Object.assign(m, {quoteOfTheDay}));
},
refreshQOTD: async () => {
const res = await fetch(`api/quoteoftheday`, {headers: {'Accept': 'application/json'}})
if (res.status == 200) {
const quoteOfTheDay = await res.json();
update((m) => Object.assign(m, {quoteOfTheDay}));
return quoteOfTheDay;
} else {
throw new Error((await res.json()).errmsg);
}
},
update: (res_quotes, cb=null) => {
if (res_quotes.status === 200) {
res_quotes.json().then((quotes) => {
update((m) => (Object.assign(m, {quotes})));
if (cb) {
cb(quotes);
}
});
}
},
};
}
export const quotes = createQuotesStore();