aboutsummaryrefslogtreecommitdiff
path: root/src/lib/Media/Cover/hoverCover.ts
diff options
context:
space:
mode:
authorFuwn <[email protected]>2024-10-09 00:41:20 -0700
committerFuwn <[email protected]>2024-10-09 00:41:43 -0700
commit998b63a35256ac985a5a2714dd1ca451af4dfd8a (patch)
tree50796121a9d5ab0330fdc5d7e098bda2860d9726 /src/lib/Media/Cover/hoverCover.ts
parentfeat(graphql): add badgeCount field (diff)
downloaddue.moe-998b63a35256ac985a5a2714dd1ca451af4dfd8a.tar.xz
due.moe-998b63a35256ac985a5a2714dd1ca451af4dfd8a.zip
chore(prettier): use spaces instead of tabs
Diffstat (limited to 'src/lib/Media/Cover/hoverCover.ts')
-rw-r--r--src/lib/Media/Cover/hoverCover.ts76
1 files changed, 38 insertions, 38 deletions
diff --git a/src/lib/Media/Cover/hoverCover.ts b/src/lib/Media/Cover/hoverCover.ts
index c2b6697c..3b364349 100644
--- a/src/lib/Media/Cover/hoverCover.ts
+++ b/src/lib/Media/Cover/hoverCover.ts
@@ -4,53 +4,53 @@ import type { SubsPleaseEpisode } from '../Anime/Airing/Subtitled/subsPlease';
import settings from '$stores/settings';
export interface HoverCoverResponse {
- // OnMouseEnterLeave
- hovering?: boolean;
- item?: SubsPleaseEpisode | null;
- media?: Media | null;
-
- // OnMouseMove
- height?: number;
- style?: string;
+ // OnMouseEnterLeave
+ hovering?: boolean;
+ item?: SubsPleaseEpisode | null;
+ media?: Media | null;
+
+ // OnMouseMove
+ height?: number;
+ style?: string;
}
export const onMouseEnter = (
- media: Media | Partial<Media> | null,
- item: SubsPleaseEpisode | null = null
+ media: Media | Partial<Media> | null,
+ item: SubsPleaseEpisode | null = null
) => {
- if (!get(settings).displayHoverCover && !item)
- return { hovering: false, item: null, media: null } as HoverCoverResponse;
+ if (!get(settings).displayHoverCover && !item)
+ return { hovering: false, item: null, media: null } as HoverCoverResponse;
- return { hovering: true, item, media } as HoverCoverResponse;
+ return { hovering: true, item, media } as HoverCoverResponse;
};
export const onMouseLeave = () => {
- return { hovering: false, item: null, media: null } as HoverCoverResponse;
+ return { hovering: false, item: null, media: null } as HoverCoverResponse;
};
export const onMouseMove = (event: MouseEvent, imageWidth = 250) => {
- const offset = 10;
- let imageLeft = 0;
- let imageTop = 0;
- const elements = document.getElementsByClassName('hover-image');
-
- if (elements.length === 0) return { height: 0, style: '' } as HoverCoverResponse;
-
- const response: HoverCoverResponse = {
- height: (elements[0] as HTMLImageElement).height,
- style: ''
- };
- const height = response.height || 0;
-
- imageLeft =
- event.pageX + height + offset > window.innerWidth
- ? event.pageX - imageWidth - offset
- : event.pageX + offset;
- imageTop =
- event.pageY - window.scrollY + height + offset > window.innerHeight
- ? event.pageY - window.scrollY - height - offset
- : event.pageY - window.scrollY + offset;
- response.style = `top: ${imageTop}px; left: ${imageLeft}px;`;
-
- return response;
+ const offset = 10;
+ let imageLeft = 0;
+ let imageTop = 0;
+ const elements = document.getElementsByClassName('hover-image');
+
+ if (elements.length === 0) return { height: 0, style: '' } as HoverCoverResponse;
+
+ const response: HoverCoverResponse = {
+ height: (elements[0] as HTMLImageElement).height,
+ style: ''
+ };
+ const height = response.height || 0;
+
+ imageLeft =
+ event.pageX + height + offset > window.innerWidth
+ ? event.pageX - imageWidth - offset
+ : event.pageX + offset;
+ imageTop =
+ event.pageY - window.scrollY + height + offset > window.innerHeight
+ ? event.pageY - window.scrollY - height - offset
+ : event.pageY - window.scrollY + offset;
+ response.style = `top: ${imageTop}px; left: ${imageLeft}px;`;
+
+ return response;
};