feat(#19): Add a basic My Dex page

This commit is contained in:
Josh Creek
2024-04-08 21:09:34 +01:00
parent 9c22786dd5
commit d581e26234
4 changed files with 102 additions and 27 deletions
+1 -1
View File
@@ -32,5 +32,5 @@
{#if imagePath}
<img src={imagePath} alt="sprite" />
{:else}
<p>Loading...</p>
<span class="loading loading-spinner loading-xs"></span>
{/if}
+26 -26
View File
@@ -38,7 +38,7 @@
"columnNumber": 3,
"pokedexNumber": 3,
"name": "Venusaur",
"form": "Gigantamax",
"form": "",
"generation": 1,
"originGame": "Red/Blue/Yellow",
"altOriginGame": "LG: Pikachu/Eevee",
@@ -98,7 +98,7 @@
"columnNumber": 1,
"pokedexNumber": 6,
"name": "Charizard",
"form": "Gigantamax",
"form": "",
"generation": 1,
"originGame": "Red/Blue/Yellow",
"altOriginGame": "LG: Pikachu/Eevee",
@@ -143,7 +143,7 @@
"columnNumber": 4,
"pokedexNumber": 9,
"name": "Blastoise",
"form": "Gigantamax",
"form": "",
"generation": 1,
"originGame": "Red/Blue/Yellow",
"altOriginGame": "LG: Pikachu/Eevee",
@@ -188,7 +188,7 @@
"columnNumber": 1,
"pokedexNumber": 12,
"name": "Butterfree",
"form": "Gigantamax",
"form": "",
"generation": 1,
"originGame": "Red/Blue/Yellow",
"altOriginGame": "LG: Pikachu/Eevee",
@@ -1178,7 +1178,7 @@
"columnNumber": 1,
"pokedexNumber": 52,
"name": "Meowth",
"form": "Gigantamax",
"form": "",
"generation": 1,
"originGame": "Blue",
"altOriginGame": "LG: Eevee",
@@ -1523,7 +1523,7 @@
"columnNumber": 6,
"pokedexNumber": 68,
"name": "Machamp",
"form": "Gigantamax",
"form": "",
"generation": 1,
"originGame": "Red/Blue/Yellow",
"altOriginGame": "LG: Pikachu/Eevee",
@@ -2093,7 +2093,7 @@
"columnNumber": 2,
"pokedexNumber": 94,
"name": "Gengar",
"form": "Gigantamax",
"form": "",
"generation": 1,
"originGame": "Red/Blue/Yellow",
"altOriginGame": "LG: Pikachu/Eevee",
@@ -2183,7 +2183,7 @@
"columnNumber": 2,
"pokedexNumber": 99,
"name": "Kingler",
"form": "Gigantamax",
"form": "",
"generation": 1,
"originGame": "Red/Blue/Yellow",
"altOriginGame": "LG: Pikachu/Eevee",
@@ -2914,7 +2914,7 @@
"columnNumber": 2,
"pokedexNumber": 131,
"name": "Lapras",
"form": "Gigantamax",
"form": "",
"generation": 1,
"originGame": "Red/Blue/Yellow",
"altOriginGame": "LG: Pikachu/Eevee",
@@ -3109,7 +3109,7 @@
"columnNumber": 3,
"pokedexNumber": 143,
"name": "Snorlax",
"form": "Gigantamax",
"form": "",
"generation": 1,
"originGame": "Red/Blue/Yellow",
"altOriginGame": "LG: Pikachu/Eevee",
@@ -11538,7 +11538,7 @@
"columnNumber": 6,
"pokedexNumber": 569,
"name": "Garbodor",
"form": "Gigantamax",
"form": "",
"generation": 5,
"originGame": "Black/White",
"altOriginGame": "Black 2/White 2",
@@ -16428,7 +16428,7 @@
"columnNumber": 1,
"pokedexNumber": 810,
"name": "Melmetal",
"form": "Gigantamax",
"form": "",
"generation": null,
"originGame": "GO",
"altOriginGame": "",
@@ -16473,7 +16473,7 @@
"columnNumber": 4,
"pokedexNumber": 813,
"name": "Rillaboom",
"form": "Gigantamax",
"form": "",
"generation": 8,
"originGame": "Sword/Shield",
"altOriginGame": "",
@@ -16518,7 +16518,7 @@
"columnNumber": 1,
"pokedexNumber": 816,
"name": "Cinderace",
"form": "Gigantamax",
"form": "",
"generation": 8,
"originGame": "Sword/Shield",
"altOriginGame": "",
@@ -16563,7 +16563,7 @@
"columnNumber": 4,
"pokedexNumber": 819,
"name": "Inteleon",
"form": "Gigantamax",
"form": "",
"generation": 8,
"originGame": "Sword/Shield",
"altOriginGame": "",
@@ -16638,7 +16638,7 @@
"columnNumber": 3,
"pokedexNumber": 824,
"name": "Corviknight",
"form": "Gigantamax",
"form": "",
"generation": 8,
"originGame": "Sword/Shield",
"altOriginGame": "",
@@ -16683,7 +16683,7 @@
"columnNumber": 6,
"pokedexNumber": 827,
"name": "Orbeetle",
"form": "Gigantamax",
"form": "",
"generation": 8,
"originGame": "Sword/Shield",
"altOriginGame": "",
@@ -16803,7 +16803,7 @@
"columnNumber": 2,
"pokedexNumber": 835,
"name": "Drednaw",
"form": "Gigantamax",
"form": "",
"generation": 8,
"originGame": "Sword/Shield",
"altOriginGame": "",
@@ -16878,7 +16878,7 @@
"columnNumber": 1,
"pokedexNumber": 840,
"name": "Coalossal",
"form": "Gigantamax",
"form": "",
"generation": 8,
"originGame": "Sword/Shield",
"altOriginGame": "",
@@ -16908,7 +16908,7 @@
"columnNumber": 3,
"pokedexNumber": 842,
"name": "Flapple",
"form": "Gigantamax",
"form": "",
"generation": 8,
"originGame": "Sword",
"altOriginGame": "",
@@ -16923,7 +16923,7 @@
"columnNumber": 4,
"pokedexNumber": 843,
"name": "Appletun",
"form": "Gigantamax",
"form": "",
"generation": 8,
"originGame": "Shield",
"altOriginGame": "",
@@ -16953,7 +16953,7 @@
"columnNumber": 6,
"pokedexNumber": 845,
"name": "Sandaconda",
"form": "Gigantamax",
"form": "",
"generation": 8,
"originGame": "Sword/Shield",
"altOriginGame": "",
@@ -17073,7 +17073,7 @@
"columnNumber": 2,
"pokedexNumber": 852,
"name": "Centiskorch",
"form": "Gigantamax",
"form": "",
"generation": 8,
"originGame": "Sword/Shield",
"altOriginGame": "",
@@ -17208,7 +17208,7 @@
"columnNumber": 5,
"pokedexNumber": 859,
"name": "Hatterene",
"form": "Gigantamax",
"form": "",
"generation": 8,
"originGame": "Sword/Shield",
"altOriginGame": "",
@@ -17253,7 +17253,7 @@
"columnNumber": 2,
"pokedexNumber": 862,
"name": "Grimmsnarl",
"form": "Gigantamax",
"form": "",
"generation": 8,
"originGame": "Sword/Shield",
"altOriginGame": "",
@@ -18468,7 +18468,7 @@
"columnNumber": 5,
"pokedexNumber": 880,
"name": "Copperajah",
"form": "Gigantamax",
"form": "",
"generation": 8,
"originGame": "Sword/Shield",
"altOriginGame": "",
+26
View File
@@ -0,0 +1,26 @@
import { json } from '@sveltejs/kit';
import { dbConnect, dbDisconnect } from '$lib/utils/db';
import { type PokedexEntry } from '$lib/models/PokedexEntry';
import PokedexEntryRepository from '$lib/repositories/PokedexEntryRepository';
export const GET = async () => {
return json(await fetchPokeDexEntriesFromDatabase());
};
async function fetchPokeDexEntriesFromDatabase() {
let pokemonData = null as PokedexEntry[] | null;
try {
await dbConnect();
const repo = new PokedexEntryRepository();
pokemonData = await repo.findAll();
// order by pokedexNumber property, ascending
pokemonData = pokemonData.sort((a, b) => a.pokedexNumber - b.pokedexNumber);
} catch (error) {
console.error(error);
} finally {
dbDisconnect();
}
return pokemonData;
}
+49
View File
@@ -0,0 +1,49 @@
<script lang="ts">
import { onMount } from 'svelte';
import { type PokedexEntry } from '$lib/models/PokedexEntry';
import PokemonSprite from '$lib/components/PokemonSprite.svelte';
let pokemonData = null as PokedexEntry[] | null;
async function fetchPokeDexEntries() {
const response = await fetch('/api/pokedexentries');
if (!response.ok) {
throw new Error('Failed to fetch Pokémon data');
}
pokemonData = await response.json();
}
onMount(async () => {
const cachedData = localStorage.getItem('pokeDexEntries');
if (cachedData) {
// Use cached data
pokemonData = JSON.parse(cachedData);
} else {
await fetchPokeDexEntries();
// Cache data in local storage
localStorage.setItem('pokeDexEntries', JSON.stringify(pokemonData));
}
});
</script>
{#if pokemonData}
{#each pokemonData as pokemon}
<div>
<PokemonSprite
pokedexNumber={pokemon.pokedexNumber.toString().padStart(3, '0')}
form={pokemon.form
.replace(/[^a-zA-Z ]/g, '')
.trim()
.replace(/ /g, '-')}
/>
<p>
{pokemon.pokedexNumber.toString().padStart(3, '0')}
{pokemon.pokemon}
{pokemon.form}
</p>
</div>
{/each}
{:else}
<span class="loading loading-spinner loading-xl"></span>
{/if}