diff options
Diffstat (limited to 'src/lib')
| -rw-r--r-- | src/lib/Counter.svelte | 102 | ||||
| -rw-r--r-- | src/lib/api.ts | 19 | ||||
| -rw-r--r-- | src/lib/sections/Leaderboards.svelte | 4 | ||||
| -rw-r--r-- | src/lib/sections/Zones.svelte | 2 |
4 files changed, 20 insertions, 107 deletions
diff --git a/src/lib/Counter.svelte b/src/lib/Counter.svelte deleted file mode 100644 index 0df76f5..0000000 --- a/src/lib/Counter.svelte +++ /dev/null @@ -1,102 +0,0 @@ -<script lang="ts"> - import { spring } from 'svelte/motion'; - - let count = 0; - - const displayed_count = spring(); - $: displayed_count.set(count); - $: offset = modulo($displayed_count, 1); - - function modulo(n: number, m: number) { - // handle negative numbers - return ((n % m) + m) % m; - } -</script> - -<div class="counter"> - <button on:click={() => (count -= 1)} aria-label="Decrease the counter by one"> - <svg aria-hidden="true" viewBox="0 0 1 1"> - <path d="M0,0.5 L1,0.5" /> - </svg> - </button> - - <div class="counter-viewport"> - <div class="counter-digits" style="transform: translate(0, {100 * offset}%)"> - <strong class="hidden" aria-hidden="true">{Math.floor($displayed_count + 1)}</strong> - <strong>{Math.floor($displayed_count)}</strong> - </div> - </div> - - <button on:click={() => (count += 1)} aria-label="Increase the counter by one"> - <svg aria-hidden="true" viewBox="0 0 1 1"> - <path d="M0,0.5 L1,0.5 M0.5,0 L0.5,1" /> - </svg> - </button> -</div> - -<style> - .counter { - display: flex; - border-top: 1px solid rgba(0, 0, 0, 0.1); - border-bottom: 1px solid rgba(0, 0, 0, 0.1); - margin: 1rem 0; - } - - .counter button { - width: 2em; - padding: 0; - display: flex; - align-items: center; - justify-content: center; - border: 0; - background-color: transparent; - color: var(--text-color); - font-size: 2rem; - } - - .counter button:hover { - background-color: var(--secondary-color); - } - - svg { - width: 25%; - height: 25%; - } - - path { - vector-effect: non-scaling-stroke; - stroke-width: 2px; - stroke: var(--text-color); - } - - .counter-viewport { - width: 8em; - height: 4em; - overflow: hidden; - text-align: center; - position: relative; - } - - .counter-viewport strong { - position: absolute; - display: flex; - width: 100%; - height: 100%; - font-weight: 400; - color: var(--accent-color); - font-size: 4rem; - align-items: center; - justify-content: center; - } - - .counter-digits { - position: absolute; - width: 100%; - height: 100%; - } - - .hidden { - top: -100%; - user-select: none; - } -</style> diff --git a/src/lib/api.ts b/src/lib/api.ts index e3559e1..552607c 100644 --- a/src/lib/api.ts +++ b/src/lib/api.ts @@ -1,3 +1,18 @@ +import env from './env' + // the trailing slash is required -export const API_URL = 'https://skyblock-api.matdoes.dev/' -// export const API_URL = 'http://localhost:8080/'
\ No newline at end of file +const API_URL = 'https://skyblock-api.matdoes.dev/' +// export const API_URL = 'http://localhost:8080/' + +export async function fetchApi(path: string, fetch: (info: RequestInfo, init?: RequestInit | undefined) => Promise<Response>, init?: RequestInit | undefined) { + const { SKYBLOCK_STATS_API_KEY } = env() + if (SKYBLOCK_STATS_API_KEY) { + init = init || {} + if (!init.headers) + init.headers = {} + init.headers['key'] = SKYBLOCK_STATS_API_KEY + } + + const response = await fetch(API_URL + path, init) + return response +}
\ No newline at end of file diff --git a/src/lib/sections/Leaderboards.svelte b/src/lib/sections/Leaderboards.svelte index 7e32958..817f59a 100644 --- a/src/lib/sections/Leaderboards.svelte +++ b/src/lib/sections/Leaderboards.svelte @@ -1,5 +1,5 @@ <script lang="ts"> - import { API_URL } from '$lib/api' + import { fetchApi } from '$lib/api' import type { CleanMemberProfile } from '$lib/APITypes' import Emoji from '$lib/Emoji.svelte' @@ -8,7 +8,7 @@ export let data: CleanMemberProfile </script> -{#await fetch(`${API_URL}player/${data.member.uuid}/${data.profile.uuid}/leaderboards`).then( r => r.json() )} +{#await fetchApi(`player/${data.member.uuid}/${data.profile.uuid}/leaderboards`, fetch).then( r => r.json() )} Loading... {:then leaderboards} {#if leaderboards.length > 0} diff --git a/src/lib/sections/Zones.svelte b/src/lib/sections/Zones.svelte index ef96456..f7e993b 100644 --- a/src/lib/sections/Zones.svelte +++ b/src/lib/sections/Zones.svelte @@ -1,6 +1,6 @@ <script lang="ts"> import type { CleanMemberProfile } from '$lib/APITypes' - import { cleanId, toRomanNumerals } from '$lib/utils' + import { cleanId } from '$lib/utils' export let data: CleanMemberProfile |