add collections and zones

15 files changed, 230 insertions, 90 deletions

diff --git a/README.md b/README.md
index 94a48f5..63a7649 100644
--- a/README.md
+++ b/README.md
@@ -1,40 +1,2 @@
-# create-svelte
+# SkyBlock Stats
 
-Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/master/packages/create-svelte).
-
-## Creating a project
-
-If you're seeing this, you've probably already done this step. Congrats!
-
-```bash
-# create a new project in the current directory
-npm init svelte@next
-
-# create a new project in my-app
-npm init svelte@next my-app
-```
-
-> Note: the `@next` is temporary
-
-## Developing
-
-Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
-
-```bash
-npm run dev
-
-# or start the server and open the app in a new browser tab
-npm run dev -- --open
-```
-
-## Building
-
-To create a production version of your app:
-
-```bash
-npm run build
-```
-
-You can preview the production build with `npm run preview`.
-
-> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.
diff --git a/package.json b/package.json
index ad3d693..0b31905 100644
--- a/package.json
+++ b/package.json
@@ -38,7 +38,7 @@
     "@sveltejs/adapter-static": "^1.0.0-next.28",
     "@sveltejs/adapter-vercel": "^1.0.0-next.43",
     "cookie": "^0.4.1",
-    "skyblock-assets": "^2.0.4"
+    "skyblock-assets": "^2.0.6"
   },
   "packageManager": "yarn@3.1.1"
 }
diff --git a/src/app.css b/src/app.css
index abba4bf..6c9576f 100644
--- a/src/app.css
+++ b/src/app.css
@@ -97,16 +97,19 @@
 	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F,
 		U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }
+
 body {
 	font-family: 'Atkinson Hyperlegible', sans-serif;
 	color: var(--theme-main-text);
 	background-color: var(--theme-main-background);
 	margin: 0;
 	overflow-x: hidden;
+	height: 100%;
 }
 
 html {
 	scroll-behavior: smooth;
+	height: 100%;
 }
 
 /* content is uglier when its max width */
diff --git a/src/lib/APITypes.d.ts b/src/lib/APITypes.d.ts
index 2f1c9ff..119e5b6 100644
--- a/src/lib/APITypes.d.ts
+++ b/src/lib/APITypes.d.ts
@@ -122,3 +122,19 @@ export interface CleanFullProfileBasicMembers extends CleanProfile {
 	minion_count: number
 	maxUniqueMinions: number
 }
+
+declare const COLLECTIONS: {
+	readonly farming: readonly ["wheat", "carrot", "potato", "pumpkin", "melon_slice", "wheat_seeds", "red_mushroom", "cocoa_beans", "cactus", "sugar_cane", "feather", "leather", "porkchop", "chicken", "mutton", "rabbit", "nether_wart"]
+	readonly mining: readonly ["cobblestone", "coal", "iron_ingot", "gold_ingot", "diamond", "lapis_lazuli", "emerald", "redstone", "quartz", "obsidian", "glowstone_dust", "gravel", "ice", "netherrack", "sand", "end_stone", "mithril_ore", "gemstone", "hard_stone"]
+	readonly combat: readonly ["rotten_flesh", "bone", "string", "spider_eye", "gunpowder", "ender_pearl", "ghast_tear", "slime_ball", "blaze_rod", "magma_cream"]
+	readonly foraging: readonly ["oak_log", "spruce_log", "birch_log", "jungle_log", "acacia_log", "dark_oak_log"]
+	readonly fishing: readonly ["cod", "salmon", "tropical_fish", "pufferfish", "prismarine_shard", "prismarine_crystals", "clay_ball", "lily_pad", "ink_sac", "sponge"]
+	readonly unknown: readonly []
+}
+declare type CollectionCategory = keyof typeof COLLECTIONS
+export interface Collection {
+	name: string
+	xp: number
+	level: number
+	category: CollectionCategory
+}
diff --git a/src/lib/layout/Loader.svelte b/src/lib/layout/Loader.svelte
index 8347e16..524d975 100644
--- a/src/lib/layout/Loader.svelte
+++ b/src/lib/layout/Loader.svelte
@@ -41,9 +41,10 @@
 		left: 0px;
 		top: 0px;
 		transition: width 1s cubic-bezier(0.4, 0, 0.2, 1), opacity 100ms linear;
-		height: 8px;
+		height: 6px;
 		z-index: 20;
 		/* add a faint glow effect */
-		background: -moz-linear-gradient(top, #16e 0%, #16e 50%, #16e5 50%, #16e0 100%);
+		/* background: -moz-linear-gradient(top, #16e 0%, #16e 50%, #16e5 50%, #16e0 100%); */
+		background: linear-gradient(to bottom, #16e 0%, #16e 50%, #16e5 50%, #16e0 100%);
 	}
 </style>
diff --git a/src/lib/minecraft/inventory.ts b/src/lib/minecraft/inventory.ts
index faaea85..7b35f0e 100644
--- a/src/lib/minecraft/inventory.ts
+++ b/src/lib/minecraft/inventory.ts
@@ -58,9 +58,10 @@ export function itemToUrl(item: Item, packName?: string): string {
     return textureUrl
 }
 
-export async function skyblockItemToUrl(skyblockItemName: string) {
+export function skyblockItemToUrl(skyblockItemName: string) {
     const item = skyblockItemNameToItem(skyblockItemName)
-    const itemTextureUrl = await itemToUrl(item, 'packshq')
+    console.log(skyblockItemName, item)
+    const itemTextureUrl = itemToUrl(item, 'packshq')
     return itemTextureUrl
 }
 
diff --git a/src/lib/sections/Collections.svelte b/src/lib/sections/Collections.svelte
new file mode 100644
index 0000000..2e03d3f
--- /dev/null
+++ b/src/lib/sections/Collections.svelte
@@ -0,0 +1,56 @@
+<script lang="ts">
+	import type { CleanMemberProfile, Collection } from '$lib/APITypes'
+	import { skyblockItemToUrl } from '$lib/minecraft/inventory'
+	import ListItemWithIcon from '$lib/ListItemWithIcon.svelte'
+	import { cleanId } from '$lib/utils'
+	import Tooltip from '$lib/Tooltip.svelte'
+
+	export let data: CleanMemberProfile
+
+	const categories: Record<string, Collection[]> = {}
+	if (data.member.collections)
+		for (const collection of data.member.collections) {
+			if (!categories[collection.category]) categories[collection.category] = []
+			categories[collection.category].push(collection)
+		}
+</script>
+
+{#if data.member.collections}
+	{#each Object.keys(categories).sort() as categoryName}
+		{@const collections = categories[categoryName]}
+		<h3>{cleanId(categoryName)}</h3>
+		<ul>
+			{#each collections as collection}
+				<ListItemWithIcon url={skyblockItemToUrl(collection.name)}>
+					<Tooltip>
+						<span slot="tooltip">
+							Amount: {collection.xp.toLocaleString()}
+						</span>
+						{cleanId(collection.name)}
+						<span class="coll-level">{collection.level}</span>
+					</Tooltip>
+				</ListItemWithIcon>
+			{/each}
+		</ul>
+	{/each}
+{/if}
+
+<style>
+	ul {
+		margin: 0;
+		display: grid;
+		grid-template-columns: repeat(2, 1fr);
+		grid-column-gap: 0;
+		width: fit-content;
+	}
+
+	ul > :global(li) {
+		width: 12em;
+		height: 1.5em;
+		text-overflow: ellipsis;
+	}
+
+	h3 {
+		margin: 0.5em 0 0.5em 0.5em;
+	}
+</style>
diff --git a/src/lib/sections/Minions.svelte b/src/lib/sections/Minions.svelte
index 2e4483c..63dda51 100644
--- a/src/lib/sections/Minions.svelte
+++ b/src/lib/sections/Minions.svelte
@@ -24,18 +24,6 @@
 	{/each}
 </table>
 
-<!-- 
-<p class="darker-text">Unique minions: <span class="main-text"><b>{{ data.profile.minion_count }}</b>/{{ getConstants().max_minions }}</span></p>
-<table>
-{%- for minion in data.profile.minions -%}
-    <tr>
-        <th>{{ minion.name|clean }}</th>
-        {%- for unlocked in minion.levels -%}
-        <td class="minions-table-{% if unlocked %}unlocked{% else %}locked{% endif %}">{{ loop.index|romanNumerals }}</td>
-        {%- endfor -%}
-    </tr>
-{%- endfor -%}
-</table> -->
 <style>
 	.unique-minions-text {
 		color: var(--theme-darker-text);
diff --git a/src/lib/sections/Zones.svelte b/src/lib/sections/Zones.svelte
new file mode 100644
index 0000000..428ab79
--- /dev/null
+++ b/src/lib/sections/Zones.svelte
@@ -0,0 +1,38 @@
+<script lang="ts">
+	import type { CleanMemberProfile } from '$lib/APITypes'
+	import { cleanId, toRomanNumerals } from '$lib/utils'
+
+	export let data: CleanMemberProfile
+
+	let zonesVisitedCount = data.member.visited_zones
+		? data.member.visited_zones?.filter(z => z.visited).length
+		: 0
+</script>
+
+{#if data.member.visited_zones}
+	<p class="zones-visited-text">
+		<span class="zones-visited-number">
+			<b>{zonesVisitedCount}</b>/{data.member.visited_zones.length} zones visited
+		</span>
+	</p>
+	<ul>
+		{#each data.member.visited_zones.filter(z => z.visited) as zone}
+			<li>{cleanId(zone.name)}</li>
+		{/each}
+		{#each data.member.visited_zones.filter(z => !z.visited) as zone}
+			<li class="unvisited-zone">{cleanId(zone.name)}</li>
+		{/each}
+	</ul>
+{/if}
+
+<style>
+	.zones-visited-text {
+		color: var(--theme-darker-text);
+	}
+	.zones-visited-number {
+		color: var(--theme-main-text);
+	}
+	.unvisited-zone {
+		opacity: 0.5;
+	}
+</style>
diff --git a/src/routes/__error.svelte b/src/routes/__error.svelte
new file mode 100644
index 0000000..b49d2a1
--- /dev/null
+++ b/src/routes/__error.svelte
@@ -0,0 +1,53 @@
+<script lang="ts" context="module">
+	import type { ErrorLoad } from '@sveltejs/kit'
+
+	export const load: ErrorLoad = async ({ error, status }) => {
+		return {
+			props: {
+				error,
+				status,
+			},
+		}
+	}
+</script>
+
+<script lang="ts">
+	import Header from '$lib/Header.svelte'
+	import Head from '$lib/Head.svelte'
+
+	export let status: number
+	export let error: Error
+</script>
+
+<Head title={error.message} />
+<Header />
+
+<main>
+	<div>
+		<h1>{status}</h1>
+		<p>{error.message}</p>
+		<a href="/" sveltekit:prefetch>Home</a>
+	</div>
+</main>
+
+<style>
+	main {
+		height: calc(100% - 4rem);
+		/* vertical align */
+		display: grid;
+		align-items: center;
+		justify-content: center;
+	}
+
+	h1 {
+		font-size: 3em;
+		margin: 0;
+	}
+	p {
+		margin: 0;
+	}
+	a {
+		display: block;
+		margin-top: 0.5rem;
+	}
+</style>
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index 524df13..9bfbd29 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -1,4 +1,6 @@
 <script context="module" lang="ts">
+	import Header from '$lib/Header.svelte'
+
 	export const prerender = true
 </script>
 
@@ -6,6 +8,8 @@
 	<title>Home</title>
 </svelte:head>
 
+<Header />
+
 <section>
 	<h1>SkyBlock Stats</h1>
 </section>
diff --git a/src/routes/player/[player]/[profile].svelte b/src/routes/player/[player]/[profile].svelte
index 1a86b44..e31108b 100644
--- a/src/routes/player/[player]/[profile].svelte
+++ b/src/routes/player/[player]/[profile].svelte
@@ -37,6 +37,8 @@
 	import { cleanId } from '$lib/utils'
 	import Collapsible from '$lib/Collapsible.svelte'
 	import Minions from '$lib/sections/Minions.svelte'
+	import Zones from '$lib/sections/Zones.svelte'
+	import Collections from '$lib/sections/Collections.svelte'
 
 	export let data: CleanMemberProfile
 	export let pack: string
@@ -127,6 +129,18 @@
 					<Minions {data} />
 				</Collapsible>
 			</section>
+			<section id="zones">
+				<Collapsible>
+					<h2 slot="title">Zones</h2>
+					<Zones {data} />
+				</Collapsible>
+			</section>
+			<section id="collections">
+				<Collapsible>
+					<h2 slot="title">Collections</h2>
+					<Collections {data} />
+				</Collapsible>
+			</section>
 		</div>
 	</div>
 </main>
diff --git a/src/routes/player/[player]/index.svelte b/src/routes/player/[player]/index.svelte
index 2ba7ba1..460cd28 100644
--- a/src/routes/player/[player]/index.svelte
+++ b/src/routes/player/[player]/index.svelte
@@ -36,19 +36,22 @@
 
 	let activeProfile: CleanProfile | null = null
 	let activeProfileLastSave: number = 0
-
-	if (data.profiles)
-		for (const profile of data.profiles) {
-			if (profile.members)
-				for (const member of profile.members) {
-					if (member.uuid === data.player?.uuid && member.last_save > activeProfileLastSave) {
-						activeProfile = profile
-						activeProfileLastSave = member.last_save
+	let isActiveProfileOnline: boolean
+
+	$: {
+		if (data.profiles)
+			for (const profile of data.profiles) {
+				if (profile.members)
+					for (const member of profile.members) {
+						if (member.uuid === data.player?.uuid && member.last_save > activeProfileLastSave) {
+							activeProfile = profile
+							activeProfileLastSave = member.last_save
+						}
 					}
-				}
-		}
+			}
 
-	const isActiveProfileOnline = Date.now() / 1000 - 60 < activeProfileLastSave
+		isActiveProfileOnline = Date.now() / 1000 - 60 < activeProfileLastSave
+	}
 
 	// cursed svelte :D
 	$: bodyStyle = data.customization?.backgroundUrl
diff --git a/svelte.config.js b/svelte.config.js
index c9ad951..4811785 100644
--- a/svelte.config.js
+++ b/svelte.config.js
@@ -1,5 +1,6 @@
 // import adapter from '@sveltejs/adapter-static'
-import adapter from '@sveltejs/adapter-node'
+// import adapter from '@sveltejs/adapter-node'
+import adapter from '@sveltejs/adapter-auto'
 // import adapter from '@sveltejs/adapter-vercel'
 import preprocess from 'svelte-preprocess'
 // import { createHtmlPlugin } from 'vite-plugin-html'
@@ -11,14 +12,14 @@ const config = {
 	preprocess: preprocess(),
 
 	kit: {
-		// adapter: adapter(),
-		adapter: adapter({
-			out: 'build',
-			precompress: true,
-			env: {
-				host: '127.0.0.1'
-			}
-		}),
+		adapter: adapter(),
+		// adapter: adapter({
+		// 	out: 'build',
+		// 	precompress: true,
+		// 	env: {
+		// 		host: '127.0.0.1'
+		// 	}
+		// }),
 		
 
 		// Override http methods in the Todo forms
@@ -27,19 +28,19 @@ const config = {
 		},
 
 		// https://vitejs.dev/config/
-		// vite: {
+		vite: {
 		// 	plugins: [createHtmlPlugin({
 		// 		minify: true
 		// 	})],
-		// 	build: {
-		// 		rollupOptions: {
-		// 			external: ['discord-api-types/payloads/v9', 'discord-api-types', 'discord-api-types/v9'],
-		// 			output: {
-		// 				// manualChunks: undefined,
-		// 			},
-		// 		},
-		// 	},
-		// },
+			build: {
+				rollupOptions: {
+					// external: ['discord-api-types/payloads/v9', 'discord-api-types', 'discord-api-types/v9'],
+					output: {
+						manualChunks: undefined,
+					},
+				},
+			},
+		},
 	}
 };
 
diff --git a/yarn.lock b/yarn.lock
index 86717dc..35be23e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1803,10 +1803,10 @@ shebang-regex@^3.0.0:
   resolved "https://registry.yarnpkg.com/shebang-regex/-/shebang-regex-3.0.0.tgz#ae16f1644d873ecad843b0307b143362d4c42172"
   integrity sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==
 
-skyblock-assets@^2.0.4:
-  version "2.0.4"
-  resolved "https://registry.yarnpkg.com/skyblock-assets/-/skyblock-assets-2.0.4.tgz#a4d5677ec4bbc38647eb447de50649ad1b34d27d"
-  integrity sha512-DM55zASqtf4/24dgPmzvEg17ADXvCZl+S8YPHCJCjECQgxVHkKGTJoOE6mUeHhEuUIEOlX4jyWMaZdtmuFDFnQ==
+skyblock-assets@^2.0.6:
+  version "2.0.6"
+  resolved "https://registry.yarnpkg.com/skyblock-assets/-/skyblock-assets-2.0.6.tgz#5c12d1df5594f8e26905204c92fe7be659e47d22"
+  integrity sha512-Urtw2iHLu/OnSfsfTGPFMsk7hiagUi47Xu4iplhKRNg1sxHzWS4SHvYumk6Kw8TL9nyMHCwbYj87vEIGrL3J5Q==
 
 slash@^3.0.0:
   version "3.0.0"