Add harp

3 files changed, 118 insertions, 17 deletions

diff --git a/src/lib/APITypes.d.ts b/src/lib/APITypes.d.ts
index 5b14842..8986f9a 100644
--- a/src/lib/APITypes.d.ts
+++ b/src/lib/APITypes.d.ts
@@ -5,14 +5,13 @@ export interface CleanMemberProfile {
 }
 
 export interface CleanMemberProfilePlayer extends CleanPlayer {
+	// The profile name may be different for each player, so we put it here
 	profileName: string
 	firstJoin: number
 	lastSave: number
 	purse: number
 	stats: StatItem[]
-	rawHypixelStats: {
-		[key: string]: number
-	}
+	rawHypixelStats: { [key: string]: number }
 	minions: CleanMinion[]
 	fairySouls: FairySouls
 	inventories?: Inventories
@@ -21,6 +20,8 @@ export interface CleanMemberProfilePlayer extends CleanPlayer {
 	zones: Zone[]
 	collections: Collection[]
 	slayers: SlayerData
+	pets: PetsData
+	harp: HarpData
 }
 
 export interface CleanMember extends CleanBasicMember {
@@ -242,12 +243,30 @@ export interface CleanBasicMember {
 }
 
 export interface Bank {
-	balance?: number;
-	history: BankHistoryItem[];
+	balance?: number
+	history: BankHistoryItem[]
 }
 export interface BankHistoryItem {
-	change: number;
-	total: number;
-	timestamp: number;
-	name: string;
+	change: number
+	total: number
+	timestamp: number
+	name: string
+}
+
+
+export interface HarpSong {
+	id: string
+	/** A number between 0 and 1 representing the user's best completion */
+	progress: number
+	completions: number
+	perfectCompletions: number
+}
+
+export interface HarpData {
+	selected: {
+		id: string
+		timestamp: number
+	} | null
+	claimedMelodysHair: boolean
+	songs: HarpSong[]
 }
diff --git a/src/lib/sections/Harp.svelte b/src/lib/sections/Harp.svelte
new file mode 100644
index 0000000..438f354
--- /dev/null
+++ b/src/lib/sections/Harp.svelte
@@ -0,0 +1,70 @@
+<script lang="ts">
+	import type { CleanMemberProfile } from '$lib/APITypes'
+	import Emoji from '$lib/Emoji.svelte'
+	import { cleanId, millisecondsToTime, toTitleCase } from '$lib/utils'
+
+	export let data: CleanMemberProfile
+</script>
+
+<div class="info-text primary-info-text">
+	<p>Claimed Melody's hair: <Emoji value={data.member.harp.claimedMelodysHair ? '✅' : '❌'} /></p>
+	{#if data.member.harp.selected}
+		<p>
+			Selected song:
+			<b class="info-text-value">{toTitleCase(cleanId(data.member.harp.selected.id))}</b>
+			<span class="harp-selection-timeago">
+				{millisecondsToTime(Date.now() - data.member.harp.selected.timestamp)} ago
+			</span>
+		</p>
+	{/if}
+</div>
+<div class="harp-songs-list">
+	{#each data.member.harp.songs as song}
+		<div class="harp-song" class:selected-harp-song={song.id === data.member.harp.selected?.id}>
+			<h3>{toTitleCase(cleanId(song.id))}</h3>
+			<div class="info-text">
+				{#if song.completions}
+					<p>Completions: <b class="info-text-value">{song.completions}</b></p>
+					<p>Perfect completions: <b class="info-text-value">{song.perfectCompletions}</b></p>
+				{:else}
+					<p>Progress: <b class="info-text-value">{Math.floor(song.progress * 100)}%</b></p>
+				{/if}
+			</div>
+		</div>
+	{/each}
+</div>
+
+<style>
+	p {
+		margin: 0;
+	}
+
+	.primary-info-text {
+		margin: 0.5em 0;
+	}
+
+	.info-text {
+		color: var(--theme-darker-text);
+	}
+	.info-text .info-text-value {
+		color: var(--theme-main-text);
+	}
+
+	.harp-songs-list {
+		display: flex;
+		flex-wrap: wrap;
+		max-width: 40rem;
+		column-gap: 0.5rem;
+		row-gap: 0.5rem;
+	}
+	.harp-song {
+		border: 1px solid rgba(255, 255, 255, 0.1);
+		background: rgba(0, 0, 0, 0.1);
+		padding: 0.75em;
+		border-radius: 1em;
+		width: 12em;
+	}
+	.selected-harp-song {
+		border: 1px solid rgba(255, 255, 255, 0.2);
+	}
+</style>
diff --git a/src/routes/player/[player]/[profile].svelte b/src/routes/player/[player]/[profile].svelte
index 4d4761b..ce27635 100644
--- a/src/routes/player/[player]/[profile].svelte
+++ b/src/routes/player/[player]/[profile].svelte
@@ -48,6 +48,7 @@
 	import { cleanId } from '$lib/utils'
 	import Head from '$lib/Head.svelte'
 	import Toc from '$lib/Toc.svelte'
+	import Harp from '$lib/sections/Harp.svelte'
 
 	export let data: CleanMemberProfile
 	export let pack: MatcherFile
@@ -61,12 +62,13 @@
 		if (data.member.stats?.find(s => s.category === 'fishing')) categories.push('fishing')
 		if (data.member.stats?.find(s => s.category === 'races')) categories.push('races')
 		categories.push('misc')
-		categories.push('minions')
-		if (data.member.slayers) categories.push('slayers')
+		if (data.member.minions.some(m => m.levels.some(l => l))) categories.push('minions')
+		if (data.member.slayers && data.member.slayers.xp > 0) categories.push('slayers')
 		categories.push('zones')
 		if (data.member.collections && data.member.collections.length > 0)
 			categories.push('collections')
 		if (data.profile.bank.balance !== undefined) categories.push('bank')
+		if (data.member.harp.selected !== null) categories.push('harp')
 		categories.push('leaderboards')
 	}
 
@@ -160,12 +162,14 @@
 					{/if}
 				{/each}
 			{/if}
-			<section>
-				<Collapsible id="minions">
-					<h2 slot="title">Minions</h2>
-					<Minions {data} />
-				</Collapsible>
-			</section>
+			{#if categories.includes('minions')}
+				<section>
+					<Collapsible id="minions">
+						<h2 slot="title">Minions</h2>
+						<Minions {data} />
+					</Collapsible>
+				</section>
+			{/if}
 			{#if categories.includes('slayers')}
 				<section>
 					<Collapsible id="slayers">
@@ -196,6 +200,14 @@
 					</Collapsible>
 				</section>
 			{/if}
+			{#if categories.includes('harp')}
+				<section>
+					<Collapsible id="harp">
+						<h2 slot="title">Harp</h2>
+						<Harp {data} />
+					</Collapsible>
+				</section>
+			{/if}
 			<section>
 				<Collapsible id="leaderboards">
 					<h2 slot="title">Leaderboards</h2>