diff options
| author | Fuwn <[email protected]> | 2024-10-02 02:52:44 -0700 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2024-10-02 02:52:44 -0700 |
| commit | 767c251175523c080fb0f5c7943309ed9ab60764 (patch) | |
| tree | 963983982c324b981baf54404715e890d2c6b429 /src/lib/Tools/SequelSpy/Prequels.svelte | |
| parent | chore(npm): fix graphql builder (diff) | |
| download | due.moe-767c251175523c080fb0f5c7943309ed9ab60764.tar.xz due.moe-767c251175523c080fb0f5c7943309ed9ab60764.zip | |
refactor(SequelSpy): move prequel list to component
Diffstat (limited to 'src/lib/Tools/SequelSpy/Prequels.svelte')
| -rw-r--r-- | src/lib/Tools/SequelSpy/Prequels.svelte | 35 |
1 files changed, 35 insertions, 0 deletions
diff --git a/src/lib/Tools/SequelSpy/Prequels.svelte b/src/lib/Tools/SequelSpy/Prequels.svelte new file mode 100644 index 00000000..ab1c4ac5 --- /dev/null +++ b/src/lib/Tools/SequelSpy/Prequels.svelte @@ -0,0 +1,35 @@ +<script lang="ts"> + import type { MediaPrequel } from '$lib/Data/AniList/prequels'; + import MediaTitleDisplay from '$lib/List/MediaTitleDisplay.svelte'; + import { airingTime } from '$lib/Media/Anime/Airing/time'; + import LinkedTooltip from '$lib/Tooltip/LinkedTooltip.svelte'; + import settings from '$stores/settings'; + import type { Media } from '$lib/Data/AniList/media'; + + export let currentPrequels: MediaPrequel[]; + + const prequelAiringTime = (prequel: MediaPrequel) => + airingTime(prequel as unknown as Media, null, false, true); +</script> + +<ul> + {#each currentPrequels.sort((a, b) => new Date(a.startDate.year, a.startDate.month - 1, a.startDate.day).getTime() - new Date(b.startDate.year, b.startDate.month - 1, b.startDate.day).getTime()) as prequel} + <li id={`${prequel.id}`}> + <LinkedTooltip + content={`<img src="${ + $settings.displayDataSaver ? prequel.coverImage.medium : prequel.coverImage.extraLarge + }" style="width: 250px; object-fit: cover; border-radius: 8px;" />`} + pin={`${prequel.id}`} + pinPosition="top" + disable={!$settings.displayHoverCover} + > + <a href={`https://anilist.co/anime/${prequel.id}`} target="_blank"> + <MediaTitleDisplay title={prequel.title} /> + </a> + <span class="opaque">|</span> + {prequel.seen}<span class="opaque">/{prequel.episodes}</span> + {@html prequelAiringTime(prequel)} + </LinkedTooltip> + </li> + {/each} +</ul> |