blob: 6d8dcf762b18a8037f39e8d3a9b5af47344a8127 (
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
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
|
<script lang="ts">
import Spacer from '$lib/Layout/Spacer.svelte';
import type { AWCBadgesGroup } from '$lib/Data/awc';
import { cdn, thumbnail } from '$lib/Utility/image';
import type { Preferences } from '../../../graphql/$types';
import FallbackBadge from './FallbackBadge.svelte';
import './badges.css';
export let awcPromise: Promise<Response>;
export let categoryFilter: string | null;
export let isOwner: boolean;
export let preferences: Preferences;
const awcBadgesGrouped = (awcResponse: string): AWCBadgesGroup[] => {
return Array.from(
new DOMParser().parseFromString(awcResponse, 'text/html').querySelectorAll('.container')
).flatMap((c) => {
const container = c as HTMLDivElement;
const header = container.querySelector('.container-header') as HTMLDivElement;
if (!header) return [];
if (!['Anime', 'Manga', 'Special'].includes(header.innerText)) return [];
if (header.innerText === 'Special') {
return [
{
group: header.innerText,
badges: Array.from(container.querySelectorAll('.badge-display img')).map((b) => {
const badge = b as HTMLImageElement;
return {
link: '#',
description: badge.alt,
image: badge.src.includes('placeholder')
? cdn('https://awc.moe/static/images/badge-placeholder.png')
: badge.src
};
})
}
];
}
return [
{
group: header.innerText,
badges: Array.from(container.querySelectorAll('.badge-display a')).map((b) => {
const badge = b as HTMLAnchorElement;
const image = badge.querySelector('img') as HTMLImageElement;
return {
link: badge.href,
description: image.alt,
image: image.src.includes('placeholder')
? cdn('https://awc.moe/static/images/badge-placeholder.png')
: image.src
};
})
}
];
}) as AWCBadgesGroup[];
};
</script>
{#await awcPromise then badges}
{#if badges}
{#await badges.clone().text() then text}
{@const parsedBadges = awcBadgesGrouped(text)}
{#if parsedBadges.length > 0}
{#each parsedBadges as group}
<details open={categoryFilter || isOwner ? false : true}>
<summary>
Anime Watching Club <span class="opaque">|</span>
{group.group}
</summary>
<Spacer />
<div class="badges">
{#each group.badges as badge, index}
<div id={`badge-${index}`}>
<FallbackBadge
{badge}
source={cdn(thumbnail(badge.image))}
alternative={badge.description}
fallback={thumbnail(badge.image)}
hideOnError={preferences.hide_missing_badges}
awc
{index}
{preferences}
/>
</div>
{/each}
</div>
</details>
<Spacer />
{/each}
{/if}
{/await}
{/if}
{/await}
|