blob: 2656a696cf786c8a54493c65736a74c066f6aa5f (
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
|
<script lang="ts">
import type { Media } from "$lib/Data/AniList/media";
import MediaTitleDisplay from "$lib/List/MediaTitleDisplay.svelte";
import type { SubsPleaseEpisode } from "$lib/Media/Anime/Airing/Subtitled/subsPlease";
import { outboundLink } from "$lib/Media/links";
import tooltip from "$lib/Tooltip/tooltip";
import { abbreviate } from "$lib/Utility/string";
import settings from "$stores/settings";
export let media: Media | null;
export let entry: SubsPleaseEpisode;
export let cover = true;
export let showTooltip = true;
const abbreviateTo = 40;
const titleSelect = (media: Media | null) =>
media
? media.title.english || media.title.romaji || media.title.native
: null;
</script>
<a
href={media
? outboundLink(media, 'anime', $settings.displayOutboundLinksTo)
: outboundLink(
null,
'anime',
$settings.displayOutboundLinksTo,
true,
titleSelect(media) || entry.title
)}
target="_blank"
title={`<img src="${
$settings.displayDataSaver ? media?.coverImage.medium : media?.coverImage.extraLarge
}" style="width: 250px; object-fit: cover; border-radius: 8px;" />`}
use:tooltip
data-tooltip-disable={media && cover ? false : true}
>
{#if media}
<MediaTitleDisplay
title={media.title}
abbreviate
{abbreviateTo}
tooltip={showTooltip
? media.title.english?.length > abbreviateTo ||
media.title.romaji?.length > abbreviateTo ||
media.title.native?.length > abbreviateTo
: false}
/>
{:else}
<span title={entry.title} use:tooltip>
{abbreviate(entry.title, abbreviateTo)}
</span>
{/if}
</a>
|