extract leaderboard from editor

This commit is contained in:
Ilion Beyst 2022-08-21 21:18:06 +02:00
parent 64d24c9e3d
commit 8eec57f560
4 changed files with 32 additions and 26 deletions

View file

@ -1,20 +1,5 @@
<script lang="ts"> <script lang="ts">
import { onMount } from "svelte"; export let leaderboard;
let leaderboard = [];
onMount(async () => {
const res = await fetch("/api/leaderboard", {
headers: {
"Content-Type": "application/json",
},
});
if (res.ok) {
leaderboard = await res.json();
console.log(leaderboard);
}
});
function formatRating(entry: object): any { function formatRating(entry: object): any {
const rating = entry["rating"]; const rating = entry["rating"];

View file

@ -13,6 +13,9 @@
<div class="navbar-item"> <div class="navbar-item">
<a href="/editor">Editor</a> <a href="/editor">Editor</a>
</div> </div>
<div class="navbar-item">
<a href="/leaderboard">Leaderboard</a>
</div>
</div> </div>
<div class="navbar-right"> <div class="navbar-right">
<UserControls /> <UserControls />

View file

@ -19,7 +19,6 @@
Editor, Editor,
MatchVisualizer, MatchVisualizer,
Rules, Rules,
Leaderboard,
} }
let matches = []; let matches = [];
@ -153,13 +152,6 @@
> >
Rules Rules
</div> </div>
<div
class="sidebar-item"
class:selected={viewMode === ViewMode.Leaderboard}
on:click={() => setViewMode(ViewMode.Leaderboard)}
>
Leaderboard
</div>
<div class="sidebar-header">match history</div> <div class="sidebar-header">match history</div>
<ul class="match-list"> <ul class="match-list">
{#each matches as match} {#each matches as match}
@ -184,8 +176,6 @@
<EditorView {editSession} /> <EditorView {editSession} />
{:else if viewMode === ViewMode.Rules} {:else if viewMode === ViewMode.Rules}
<RulesView /> <RulesView />
{:else if viewMode === ViewMode.Leaderboard}
<Leaderboard />
{/if} {/if}
</div> </div>
<div class="sidebar-right"> <div class="sidebar-right">

View file

@ -0,0 +1,28 @@
<script lang="ts" context="module">
import { ApiClient } from "$lib/api_client";
export async function load({ fetch }) {
try {
const apiClient = new ApiClient(fetch);
const leaderboard = await apiClient.get("/api/leaderboard");
return {
props: {
leaderboard,
},
};
} catch (error) {
return {
status: error.status,
error: error,
};
}
}
</script>
<script lang="ts">
import Leaderboard from "$lib/components/Leaderboard.svelte";
export let leaderboard: object[];
</script>
<Leaderboard {leaderboard} />