blob: 6553c769b67b93b7b087375d2d284b458b0ed974 (
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
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
|
<script lang="ts">
import type { Media } from "$lib/Data/AniList/media";
import settings from "$stores/settings";
import type { MediaPrequel } from "$lib/Data/AniList/prequels";
import tooltip from "$lib/Tooltip/tooltip";
import locale from "$stores/locale";
import airingNow from "$stores/airingNow";
import { formatCountdown } from "./format";
export let originalAnime: Media;
export let upcoming = false;
const anime = originalAnime;
let opacity = 100;
let timeFrame = "";
let time = "";
let nextEpisode = anime.nextAiringEpisode?.episode || 0;
let few = true;
let dateString = "";
const setAiringTime = () => {
time = "";
timeFrame = "";
dateString = "";
const airingAt = anime.nextAiringEpisode?.airingAt;
const untilAiring = airingAt
? Math.round((airingAt - $airingNow / 1000) * 100) / 100
: undefined;
time = new Date(airingAt ? airingAt * 1000 : 0).toLocaleTimeString([], {
hour12: !$settings.display24HourTime,
hour: "numeric",
minute: "2-digit",
});
if (
(anime as unknown as MediaPrequel).startDate &&
new Date(
anime.startDate.year,
(anime as unknown as MediaPrequel).startDate.month,
(anime as unknown as MediaPrequel).startDate.day,
) < new Date()
)
return `<span class="opaque">on ${new Date(
anime.startDate.year,
(anime as unknown as MediaPrequel).startDate.month,
(anime as unknown as MediaPrequel).startDate.day,
).toLocaleDateString()}</span>`;
if (untilAiring !== undefined) {
const formatted = formatCountdown(untilAiring);
timeFrame = formatted.text;
few = formatted.few;
opacity = Math.max(50, 100 - (untilAiring / 60 / 60 / 24 / 7) * 50);
dateString = $locale().dateFormatter(
new Date(airingAt ? airingAt * 1000 : 0),
);
}
};
$: {
$airingNow;
setAiringTime();
}
</script>
{#if upcoming}
<span title={dateString} use:tooltip style={`opacity: ${opacity}%;`}>
{nextEpisode}{#if anime.episodes !== null}<span class="opaque">/{anime.episodes}</span>
{/if} in {timeFrame}
<span class="opaque">
{#if few && $settings.displayCoverModeAnime}<br />{/if}{few ? `(${time})` : ''}
</span>
</span>
{:else}
<span title={dateString} use:tooltip style={`opacity: ${opacity}%;`}>
{nextEpisode} in {#if few && $settings.displayCoverModeAnime}<br />{/if}{#if few}<b>
{timeFrame}
</b>{:else}{timeFrame}{/if}
{few ? `(${time})` : ''}
</span>
{/if}
|