ui: Fix loading problems when themes arrived to late

This commit is contained in:
nemunaire 2021-09-01 01:42:56 +02:00
parent e3057726e8
commit 941e1c16d5
5 changed files with 41 additions and 42 deletions

View File

@ -83,7 +83,7 @@
{#if $my && $my.team_id} {#if $my && $my.team_id}
<NavItem> <NavItem>
{$my.score} {$my.score === 1 ? 'point' : 'points'} {$my.score} {$my.score === 1 ? 'point' : 'points'}
{#if $teams[$my.team_id].rank} {#if $teams && $teams[$my.team_id].rank}
&ndash; {$teams[$my.team_id].rank}<sup>e</sup> sur {Object.keys($teams).length} &ndash; {$teams[$my.team_id].rank}<sup>e</sup> sur {Object.keys($teams).length}
{/if} {/if}
</NavItem> </NavItem>
@ -93,7 +93,7 @@
<Badge href="/register" color="warning"> <Badge href="/register" color="warning">
Inscription Inscription
</Badge> </Badge>
{:else if $my.team_id} {:else if $my.team_id && $teams}
<Badge href="/edit" style="background-color: {$teams[$my.team_id].color} !important; color: {$teams[$my.team_id].color};"> <Badge href="/edit" style="background-color: {$teams[$my.team_id].color} !important; color: {$teams[$my.team_id].color};">
<span class="teamname">{$my.name}</span> <span class="teamname">{$my.name}</span>
</Badge> </Badge>

View File

@ -53,14 +53,14 @@
</script> </script>
<svelte:head> <svelte:head>
<title>{exercice.title} - {$settings.title}</title> <title>{exercice?exercice.title+" - ":""}{$settings.title}</title>
</svelte:head> </svelte:head>
{#if exercice} {#if exercice}
<ThemeNav {theme} {exercice} /> <ThemeNav {theme} {exercice} />
{/if} {/if}
{#if !$my || !$my.exercices[exercice.id]} {#if !$my || !exercice || !$my.exercices[exercice.id]}
<Alert color="warning" class="mt-3" fade={false}> <Alert color="warning" class="mt-3" fade={false}>
<Icon name="dash-circle-fill" /> <Icon name="dash-circle-fill" />
Vous n'avez pas encore accès à ce défi. Vous n'avez pas encore accès à ce défi.

View File

@ -7,9 +7,8 @@
const thms = get_store_value(themes); const thms = get_store_value(themes);
let theme = null; let theme = null;
for (let th in thms) { for (let th in thms) {
if (thms[th].urlid === page.params.theme) { if (thms[th] && thms[th].urlid === page.params.theme) {
theme = thms[th]; theme = thms[th];
break; break;
} }
@ -33,11 +32,11 @@
import { settings } from '../../stores/settings.js'; import { settings } from '../../stores/settings.js';
export let theme = null; export let theme;
</script> </script>
<svelte:head> <svelte:head>
<title>{theme.name} - {$settings.title}</title> <title>{theme?theme.name:""} - {$settings.title}</title>
</svelte:head> </svelte:head>
{#if theme} {#if theme}

View File

@ -57,7 +57,7 @@
} }
refresh_interval_themes = setInterval(refresh_themes, interval); refresh_interval_themes = setInterval(refresh_themes, interval);
themesStore.update(await fetch('/themes.json'), cb); await themesStore.update(await fetch('/themes.json'), cb);
} }
let refresh_interval_my = null; let refresh_interval_my = null;

View File

@ -1,13 +1,14 @@
import { derived, writable } from 'svelte/store'; import { derived, writable } from 'svelte/store';
function createThemesStore() { function createThemesStore() {
const { subscribe, set, update } = writable({themes: {}, exercices_idx: {}, max_solved: 0}); const { subscribe, set, update } = writable({themes: null, exercices_idx: {}, max_solved: 0});
return { return {
subscribe, subscribe,
update: (res_themes, cb=null) => { update: async (res_themes, cb=null) => {
if (res_themes.status === 200) { if (res_themes.status === 200) {
res_themes.json().then((themes) => { const themes = await res_themes.json();
let max_solved = 0; let max_solved = 0;
const exercices_idx = {}; const exercices_idx = {};
@ -44,7 +45,6 @@ function createThemesStore() {
if (cb) { if (cb) {
cb(themes, exercices_idx, max_solved); cb(themes, exercices_idx, max_solved);
} }
});
} }
}, },
}; };