diff options
| author | Fuwn <[email protected]> | 2024-10-09 00:41:20 -0700 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2024-10-09 00:41:43 -0700 |
| commit | 998b63a35256ac985a5a2714dd1ca451af4dfd8a (patch) | |
| tree | 50796121a9d5ab0330fdc5d7e098bda2860d9726 /src/lib/Media/Anime/Airing/AiringTime.svelte | |
| parent | feat(graphql): add badgeCount field (diff) | |
| download | due.moe-998b63a35256ac985a5a2714dd1ca451af4dfd8a.tar.xz due.moe-998b63a35256ac985a5a2714dd1ca451af4dfd8a.zip | |
chore(prettier): use spaces instead of tabs
Diffstat (limited to 'src/lib/Media/Anime/Airing/AiringTime.svelte')
| -rw-r--r-- | src/lib/Media/Anime/Airing/AiringTime.svelte | 266 |
1 files changed, 133 insertions, 133 deletions
diff --git a/src/lib/Media/Anime/Airing/AiringTime.svelte b/src/lib/Media/Anime/Airing/AiringTime.svelte index 2bbbde84..53a39c39 100644 --- a/src/lib/Media/Anime/Airing/AiringTime.svelte +++ b/src/lib/Media/Anime/Airing/AiringTime.svelte @@ -1,139 +1,139 @@ <script lang="ts"> - import type { Media } from '$lib/Data/AniList/media'; - import settings from '$stores/settings'; - import { onDestroy, onMount } from 'svelte'; - import type { MediaPrequel } from '$lib/Data/AniList/prequels'; - import tooltip from '$lib/Tooltip/tooltip'; - import locale from '$stores/locale'; - - 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 = ''; - let updateInterval: NodeJS.Timeout; - - onMount(() => { - const setAiringTime = () => { - time = ''; - timeFrame = ''; - dateString = ''; - - const airingAt = anime.nextAiringEpisode?.airingAt; - const untilAiring = airingAt - ? Math.round((airingAt - Date.now() / 1000) * 100) / 100 - : undefined; - let hours = null; - const shortenCountdown = $settings.displayShortCountdown; - - 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) { - let minutes = Math.round(untilAiring / 60); - - few = true; - - if (minutes > 60) { - hours = minutes / 60; - - if (hours > 24) { - const days = Math.floor(hours / 24); - const weeks = Math.floor(days / 7); - - few = false; - - if (weeks >= 1.5) { - timeFrame = `${weeks}${shortenCountdown ? 'w' : ' week'}${ - weeks === 1 || shortenCountdown ? '' : 's' - }`; - - const residualDays = days % 7; - - if (residualDays > 0) - timeFrame += `${shortenCountdown ? '' : ' '}${residualDays}${ - shortenCountdown ? 'd' : ' day' - }${residualDays === 1 || shortenCountdown ? '' : 's'}`; - } else { - timeFrame += `${days}${shortenCountdown ? 'd' : ' day'}${ - days === 1 || shortenCountdown ? '' : 's' - }`; - } - - const residualHours = Math.floor(hours - days * 24); - - if (residualHours > 0) - timeFrame += `${shortenCountdown ? '' : ' '}${residualHours}${ - shortenCountdown ? 'h' : ' hour' - }${residualHours === 1 || shortenCountdown ? '' : 's'}`; - } else { - const residualMinutes = Math.round(minutes - Math.floor(hours) * 60); - - timeFrame += `${Math.floor(hours).toFixed(0)}${shortenCountdown ? 'h' : ' hour'}${ - Math.floor(hours) === 1 || shortenCountdown ? '' : 's' - }`; - - if (residualMinutes > 0) - timeFrame += `${shortenCountdown ? '' : ' '}${residualMinutes}${ - shortenCountdown ? 'm' : ' minute' - }${residualMinutes === 1 || shortenCountdown ? '' : 's'}`; - } - } else { - minutes = Math.round(minutes); - - timeFrame += `${minutes}${shortenCountdown ? 'm' : ' minute'}${ - minutes === 1 || shortenCountdown ? '' : 's' - }`; - } - - opacity = Math.max(50, 100 - (untilAiring / 60 / 60 / 24 / 7) * 50); - dateString = $locale().dateFormatter(new Date(airingAt ? airingAt * 1000 : 0)); - } - }; - - setAiringTime(); - - updateInterval = setInterval(setAiringTime, 30000); - }); - - onDestroy(() => clearInterval(updateInterval)); + import type { Media } from '$lib/Data/AniList/media'; + import settings from '$stores/settings'; + import { onDestroy, onMount } from 'svelte'; + import type { MediaPrequel } from '$lib/Data/AniList/prequels'; + import tooltip from '$lib/Tooltip/tooltip'; + import locale from '$stores/locale'; + + 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 = ''; + let updateInterval: NodeJS.Timeout; + + onMount(() => { + const setAiringTime = () => { + time = ''; + timeFrame = ''; + dateString = ''; + + const airingAt = anime.nextAiringEpisode?.airingAt; + const untilAiring = airingAt + ? Math.round((airingAt - Date.now() / 1000) * 100) / 100 + : undefined; + let hours = null; + const shortenCountdown = $settings.displayShortCountdown; + + 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) { + let minutes = Math.round(untilAiring / 60); + + few = true; + + if (minutes > 60) { + hours = minutes / 60; + + if (hours > 24) { + const days = Math.floor(hours / 24); + const weeks = Math.floor(days / 7); + + few = false; + + if (weeks >= 1.5) { + timeFrame = `${weeks}${shortenCountdown ? 'w' : ' week'}${ + weeks === 1 || shortenCountdown ? '' : 's' + }`; + + const residualDays = days % 7; + + if (residualDays > 0) + timeFrame += `${shortenCountdown ? '' : ' '}${residualDays}${ + shortenCountdown ? 'd' : ' day' + }${residualDays === 1 || shortenCountdown ? '' : 's'}`; + } else { + timeFrame += `${days}${shortenCountdown ? 'd' : ' day'}${ + days === 1 || shortenCountdown ? '' : 's' + }`; + } + + const residualHours = Math.floor(hours - days * 24); + + if (residualHours > 0) + timeFrame += `${shortenCountdown ? '' : ' '}${residualHours}${ + shortenCountdown ? 'h' : ' hour' + }${residualHours === 1 || shortenCountdown ? '' : 's'}`; + } else { + const residualMinutes = Math.round(minutes - Math.floor(hours) * 60); + + timeFrame += `${Math.floor(hours).toFixed(0)}${shortenCountdown ? 'h' : ' hour'}${ + Math.floor(hours) === 1 || shortenCountdown ? '' : 's' + }`; + + if (residualMinutes > 0) + timeFrame += `${shortenCountdown ? '' : ' '}${residualMinutes}${ + shortenCountdown ? 'm' : ' minute' + }${residualMinutes === 1 || shortenCountdown ? '' : 's'}`; + } + } else { + minutes = Math.round(minutes); + + timeFrame += `${minutes}${shortenCountdown ? 'm' : ' minute'}${ + minutes === 1 || shortenCountdown ? '' : 's' + }`; + } + + opacity = Math.max(50, 100 - (untilAiring / 60 / 60 / 24 / 7) * 50); + dateString = $locale().dateFormatter(new Date(airingAt ? airingAt * 1000 : 0)); + } + }; + + setAiringTime(); + + updateInterval = setInterval(setAiringTime, 30000); + }); + + onDestroy(() => clearInterval(updateInterval)); </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> + <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> + <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} |