diff options
| -rw-r--r-- | src/lib/hololive.ts (renamed from src/routes/api/hololive/+server.ts.bak) | 38 | ||||
| -rw-r--r-- | src/routes/+layout.svelte | 2 | ||||
| -rw-r--r-- | src/routes/hololive/+page.svelte (renamed from src/routes/hololive/+page.svelte.bak) | 15 |
3 files changed, 21 insertions, 34 deletions
diff --git a/src/routes/api/hololive/+server.ts.bak b/src/lib/hololive.ts index fae1482b..d389cff2 100644 --- a/src/routes/api/hololive/+server.ts.bak +++ b/src/lib/hololive.ts @@ -1,24 +1,3 @@ -import { JSDOM } from 'jsdom'; - -export const GET = async ({ url }) => - Response.json( - parseScheduleHtml( - await ( - await fetch('https://schedule.hololive.tv', { - headers: { - Cookie: `timezone=${url.searchParams.get('timezone') || 'Asia/Tokyo'}` - } - }) - ).text() - ), - { - headers: { - 'Access-Control-Allow-Origin': 'https://due.moe', - 'Cache-Control': 'public, max-age=300, s-maxage=300' - } - } - ); - // https://github.com/wabilin/holo-schedule function mapNodeList<E extends Element, T>(list: NodeListOf<E>, mapper: (ele: E) => T): T[] { @@ -69,15 +48,14 @@ interface LiveBlock { streaming: boolean; } -function parseToLiveBlocks(html: string | Buffer): LiveBlock[] { - const { window } = new JSDOM(html); - const { document } = window; +function parseToLiveBlocks(html: string): LiveBlock[] { + const parser = new DOMParser(); + const doc = parser.parseFromString(html, 'text/html'); const year = new Date().getFullYear().toString(); - const rows = document.querySelectorAll('#all > .container > .row'); + const rows = doc.querySelectorAll('#all > .container > .row'); let date = ''; - const lives: LiveBlock[] = []; rows.forEach((row) => { @@ -87,10 +65,12 @@ function parseToLiveBlocks(html: string | Buffer): LiveBlock[] { date = date.match(/\d+\/\d+/)![0].replace('/', '-'); } - const allThumbnail: NodeListOf<HTMLAnchorElement> = row.querySelectorAll('a.thumbnail'); - allThumbnail.forEach((thumbnail) => { + const allThumbnail = row.querySelectorAll('a.thumbnail'); + allThumbnail.forEach((t) => { + const thumbnail = t as HTMLAnchorElement; const link = thumbnail.href; const streaming = thumbnail.style.borderColor === 'red'; + // The dataFromAThumbnail function needs to be adjusted to work with the parsed document. const { time, name, avatarImages, livePreviewImage } = dataFromAThumbnail(thumbnail); lives.push({ @@ -152,7 +132,7 @@ function getVideoId(link: string): string { * @param storedDict - An object stored { vtuberName: iconImageSrc } * @returns - Lives schedule and updated dict */ -function parseScheduleHtml(html: string | Buffer, storedDict: StreamerImageDict = {}): ParseResult { +export function parseScheduleHtml(html: string, storedDict: StreamerImageDict = {}): ParseResult { const liveBlocks = parseToLiveBlocks(html); const streamerImageDict = nextStreamerImageDict(liveBlocks, storedDict); diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index ce58e600..cc09bb94 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -113,7 +113,7 @@ <Dropdown items={[ { name: $locale().navigation.subtitleSchedule, url: root('/schedule') }, - // { name: $locale().navigation.hololive, url: root('/hololive') }, + { name: $locale().navigation.hololive, url: root('/hololive') }, { name: $locale().tools.tool.characterBirthdays.short, url: root('/birthdays') }, { name: $locale().navigation.newReleases, url: root('/updates') } ]} diff --git a/src/routes/hololive/+page.svelte.bak b/src/routes/hololive/+page.svelte index 76c0707f..42e01075 100644 --- a/src/routes/hololive/+page.svelte.bak +++ b/src/routes/hololive/+page.svelte @@ -3,6 +3,7 @@ import Message from '$lib/Loading/Message.svelte'; import Skeleton from '$lib/Loading/Skeleton.svelte'; import HeadTitle from '$lib/Home/HeadTitle.svelte'; + import { parseScheduleHtml } from '$lib/hololive'; interface ParseResult { lives: { @@ -19,7 +20,13 @@ let schedulePromise: Promise<Response>; - onMount(() => (schedulePromise = fetch('/api/hololive'))); + onMount(async () => { + schedulePromise = fetch('https://schedule.hololive.tv', { + headers: { + Cookie: 'timezone=Asia/Tokyo' + } + }); + }); const typeSchedule = (schedule: any) => schedule as ParseResult; </script> @@ -32,15 +39,15 @@ <Skeleton grid={true} count={100} width="49%" height="16.25em" /> {:then scheduleResponse} {#if scheduleResponse} - {#await scheduleResponse.json()} + {#await scheduleResponse.text()} <Message message="Parsing schedule ..." /> <Skeleton grid={true} count={100} width="49%" height="16.25em" /> {:then untypedSchedule} - {@const schedule = typeSchedule(untypedSchedule)} + {@const schedule = typeSchedule(parseScheduleHtml(untypedSchedule))} {#if schedule.lives.length === 0} - <Message message="No upcoming streams." /> + <Message message="No upcoming streams." loader="ripple" /> {/if} <div class="container"> |