diff options
Diffstat (limited to 'src/lib/Tools')
| -rw-r--r-- | src/lib/Tools/SequelSpy.svelte | 27 |
1 files changed, 26 insertions, 1 deletions
diff --git a/src/lib/Tools/SequelSpy.svelte b/src/lib/Tools/SequelSpy.svelte index bedbf84e..5684463f 100644 --- a/src/lib/Tools/SequelSpy.svelte +++ b/src/lib/Tools/SequelSpy.svelte @@ -9,6 +9,8 @@ import { page } from '$app/stores'; import { browser } from '$app/environment'; import { season as getSeason } from '$lib/Media/Anime/season'; + import { onMouseEnter, onMouseLeave, onMouseMove } from '$lib/Media/Cover/hoverCover'; + import HoverCover from '$lib/Media/Cover/HoverCover.svelte'; export let user: AniListAuthorisation; @@ -16,6 +18,9 @@ const urlParameters = browser ? new URLSearchParams(window.location.search) : null; let year = parseOrDefault(urlParameters, 'year', new Date().getFullYear()); let season = parseOrDefault(urlParameters, 'season', getSeason()); + let hovering = false; + let hoveredMedia: Media | null = null; + let imageStyle = ''; $: { if (year.toString().length === 4) currentPrequels = prequels(user, year, season); @@ -50,7 +55,25 @@ {:then currentPrequels} <ul> {#each currentPrequels as prequel} - <li> + <li + on:mouseenter={() => { + const response = onMouseEnter(prequel); + + hovering = response.hovering; + hoveredMedia = response.media; + }} + on:mouseleave={() => { + const response = onMouseLeave(); + + hovering = response.hovering; + hoveredMedia = response.media; + }} + on:mousemove={(e) => { + const response = onMouseMove(e); + + imageStyle = response.style; + }} + > <a href={`https://anilist.co/anime/${prequel.id}`} target="_blank"> <MediaTitle title={prequel.title} /> </a> @@ -66,3 +89,5 @@ 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. </p> + +<HoverCover {hovering} {hoveredMedia} {imageStyle} /> |