blob: d07f45f132461edd4e624ca7f7e8ff8e8e11568f (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
|
<script lang="ts">
import MediaTitleDisplay from '$lib/List/MediaTitleDisplay.svelte';
import type { Media } from '$lib/Data/AniList/media';
import { outboundLink } from '$lib/Media/links';
import LinkedTooltip from '$lib/Tooltip/LinkedTooltip.svelte';
import settings from '$stores/settings';
export let media: Media[];
export let type: 'anime' | 'manga';
export let upcoming = false;
export let notYetReleased = false;
export let lastUpdatedMedia: number;
</script>
<ul>
{#each media as title}
{@const progress = (title.mediaListEntry || { progress: 0 }).progress}
{#if type === 'anime' ? upcoming || notYetReleased || progress !== (title.nextAiringEpisode?.episode || 9999) - 1 : progress !== title.episodes}
<li class="entry">
<span class="content">
<LinkedTooltip
id={`${type}-${title.id}`}
content={`<img src="${
$settings.displayDataSaver ? title.coverImage.medium : title.coverImage.extraLarge
}" style="width: 250px; object-fit: cover; border-radius: 8px;" />`}
pin={`${type}-${title.id}`}
pinPosition={type === 'anime' ? 'right' : 'left'}
disable={!$settings.displayHoverCover}
>
<a
href={$settings.displayCopyMediaTitleNotLink
? '#'
: outboundLink(title, type, $settings.displayOutboundLinksTo)}
on:click={(e) => {
if ($settings.displayCopyMediaTitleNotLink) {
e.preventDefault();
navigator.clipboard.writeText(title.title.romaji);
}
}}
target="_blank"
>
<span
style={lastUpdatedMedia === title.id && title.chapters !== progress
? 'color: lightcoral'
: ''}
>
<MediaTitleDisplay title={title.title} />
</span>
</a>
</LinkedTooltip>
{#if $settings.displaySocialButton}
[<a href={`https://anilist.co/${type}/${title.id}/social`} target="_blank">S</a>]
{/if}
<slot name="information" {progress} {title} />
</span>
</li>
{/if}
{/each}
</ul>
|