From d703b06447a48a8239cfa2416277d3266f92a913 Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Mon, 15 Apr 2024 20:05:53 -0700
Subject: feat: replace hover cover with image tooltip

---
 src/lib/Tools/SequelSpy.svelte | 32 +++-----------------------------
 1 file changed, 3 insertions(+), 29 deletions(-)

(limited to 'src/lib/Tools/SequelSpy.svelte')

diff --git a/src/lib/Tools/SequelSpy.svelte b/src/lib/Tools/SequelSpy.svelte
index 94a7be62..2aaa5f60 100644
--- a/src/lib/Tools/SequelSpy.svelte
+++ b/src/lib/Tools/SequelSpy.svelte
@@ -9,16 +9,10 @@
 	import { page } from '$app/stores';
 	import { browser } from '$app/environment';
 	import { season as getSeason } from '$lib/Media/Anime/season';
-	import {
-		onMouseEnter,
-		onMouseLeave,
-		onMouseMove,
-		type HoverCoverResponse
-	} from '$lib/Media/Cover/hoverCover';
-	import HoverCover from '$lib/Media/Cover/HoverCover.svelte';
 	import Skeleton from '$lib/Loading/Skeleton.svelte';
 	import identity from '$stores/identity';
 	import LogInRestricted from '$lib/Error/LogInRestricted.svelte';
+	import tooltip from '$lib/Tooltip/tooltip';
 
 	export let user: AniListAuthorisation;
 
@@ -26,7 +20,6 @@
 	const urlParameters = browser ? new URLSearchParams(window.location.search) : null;
 	let year = parseOrDefault(urlParameters, 'year', new Date().getFullYear());
 	let season = parseOrDefault(urlParameters, 'season', getSeason());
-	let hoverCoverState: HoverCoverResponse = {};
 
 	$: {
 		if (year.toString().length === 4 && $identity.id !== -2 && user)
@@ -70,25 +63,8 @@
 						<a
 							href={`https://anilist.co/anime/${prequel.id}`}
 							target="_blank"
-							on:mouseenter={() => {
-								const response = onMouseEnter(prequel);
-
-								hoverCoverState.hovering = response.hovering;
-								hoverCoverState.item = response.item;
-								hoverCoverState.media = response.media;
-							}}
-							on:mouseleave={() => {
-								const response = onMouseLeave();
-
-								hoverCoverState.hovering = response.hovering;
-								hoverCoverState.item = response.item;
-								hoverCoverState.media = response.media;
-							}}
-							on:mousemove={(e) => {
-								const response = onMouseMove(e, 300);
-
-								hoverCoverState.style = response.style;
-							}}
+							title={`<img src="${prequel.coverImage.extraLarge}" style="width: 250px; object-fit: cover; border-radius: 8px;" />`}
+							use:tooltip
 						>
 							<MediaTitle title={prequel.title} />
 						</a>
@@ -105,6 +81,4 @@
 		The count ratio is the number of episodes you've seen of any direct prequels, and the total
 		number of episodes of all direct prequels.
 	</div>
-
-	<HoverCover options={hoverCoverState} width={300} />
 {/if}
-- 
cgit v1.2.3