From f0767e860609ac5d3a33b26357cb21ec4f16922c Mon Sep 17 00:00:00 2001 From: Fuwn Date: Sun, 7 Jan 2024 00:13:40 -0800 Subject: refactor(hovercover): simple state --- src/lib/List/Manga/CleanMangaList.svelte | 27 ++++++++++++++++----------- 1 file changed, 16 insertions(+), 11 deletions(-) (limited to 'src/lib/List/Manga') diff --git a/src/lib/List/Manga/CleanMangaList.svelte b/src/lib/List/Manga/CleanMangaList.svelte index b7f983b2..396ac38c 100644 --- a/src/lib/List/Manga/CleanMangaList.svelte +++ b/src/lib/List/Manga/CleanMangaList.svelte @@ -7,7 +7,12 @@ import ListTitle from '../ListTitle.svelte'; import MediaTitle from '../MediaTitleDisplay.svelte'; import HoverCover from '$lib/Media/Cover/HoverCover.svelte'; - import { onMouseEnter, onMouseLeave, onMouseMove } from '$lib/Media/Cover/hoverCover'; + import { + onMouseEnter, + onMouseLeave, + onMouseMove, + type HoverCoverResponse + } from '$lib/Media/Cover/hoverCover'; export let media: Media[]; export let cleanCache: () => void; @@ -23,9 +28,7 @@ export let rateLimited: boolean; export let authorised: boolean; - let hovering = false; - let hoveredMedia: Media | null = null; - let imageStyle = ''; + let hoverCoverState: HoverCoverResponse = {}; {#if authorised} @@ -75,19 +78,21 @@ on:mouseenter={() => { const response = onMouseEnter(manga); - hovering = response.hovering; - hoveredMedia = response.media; + hoverCoverState.hovering = response.hovering; + hoverCoverState.item = response.item; + hoverCoverState.media = response.media; }} on:mouseleave={() => { const response = onMouseLeave(); - hovering = response.hovering; - hoveredMedia = response.media; + hoverCoverState.hovering = response.hovering; + hoverCoverState.item = response.item; + hoverCoverState.media = response.media; }} on:mousemove={(e) => { - const response = onMouseMove(e); + const response = onMouseMove(e, 300); - imageStyle = response.style; + hoverCoverState.style = response.style; }} > - + -- cgit v1.2.3