diff --git a/README.md b/README.md index 918f312b..fcc8fca8 100644 --- a/README.md +++ b/README.md @@ -25,7 +25,6 @@ Modern material design for Invidious - Add different search filters. - Playlist support. - History deletion. -- Load more for comments, history, subscriptions & search results. - PWA support. ## Previews diff --git a/materialious/src/lib/Api/index.ts b/materialious/src/lib/Api/index.ts index 68a2d11b..73d9fe65 100644 --- a/materialious/src/lib/Api/index.ts +++ b/materialious/src/lib/Api/index.ts @@ -30,7 +30,19 @@ export async function getDislikes(videoId: string): Promise { return await resp.json(); } -export async function getComments(videoId: string, parameters: { sort_by: "top" | "new", source: "youtube" | "reddit", continuation?: string; }): Promise { +export async function getComments(videoId: string, parameters: { + sort_by?: "top" | "new", + source?: "youtube" | "reddit", + continuation?: string; +}): Promise { + if (typeof parameters.sort_by === "undefined") { + parameters.sort_by = "top"; + } + + if (typeof parameters.source === "undefined") { + parameters.source = "youtube"; + } + const path = new URL(buildPath(`comments/${videoId}`)); path.search = new URLSearchParams(parameters).toString(); const resp = await fetch(path); @@ -50,8 +62,22 @@ export async function getSearchSuggestions(search: string): Promise { + if (typeof options.sort_by === "undefined") { + options.sort_by = "relevance"; + } + + if (typeof options.type === "undefined") { + options.type = "video"; + } + + if (typeof options.page === "undefined") { + options.page = "1"; + } + const path = new URL(buildPath("search")); path.search = new URLSearchParams({ ...options, q: search }).toString(); const resp = await fetch(path); diff --git a/materialious/src/routes/history/+page.svelte b/materialious/src/routes/history/+page.svelte index b0536f3a..27649b92 100644 --- a/materialious/src/routes/history/+page.svelte +++ b/materialious/src/routes/history/+page.svelte @@ -2,7 +2,7 @@ import { getHistory, getVideo } from '$lib/Api'; import type { VideoPlay } from '$lib/Api/model'; import VideoList from '$lib/VideoList.svelte'; - import { onMount } from 'svelte'; + import { onDestroy, onMount } from 'svelte'; import { activePage } from '../../store'; activePage.set('history'); @@ -10,18 +10,36 @@ let history: VideoPlay[] = []; let loaded = false; - async function loadPageHistory(page: number = 1) { - const videoIds = await getHistory(page); + let currentPage = 1; + + async function loadPageHistory() { + const videoIds = await getHistory(currentPage); let promises = []; for (const videoId of videoIds) { promises.push(getVideo(videoId)); } - history = [...history, ...(await Promise.all(promises))]; + + const loadedHistory = await Promise.all(promises); + history = [...history, ...loadedHistory]; + } + + async function handleScroll() { + const { scrollTop, clientHeight, scrollHeight } = document.documentElement; + if (scrollTop + clientHeight >= scrollHeight - 5) { + currentPage += 1; + await loadPageHistory(); + } } onMount(async () => { await loadPageHistory(); loaded = true; + + window.addEventListener('scroll', handleScroll); + }); + + onDestroy(() => { + window.removeEventListener('scroll', handleScroll); }); diff --git a/materialious/src/routes/search/[slug]/+page.svelte b/materialious/src/routes/search/[slug]/+page.svelte index cd9ac70c..49bc1ea6 100644 --- a/materialious/src/routes/search/[slug]/+page.svelte +++ b/materialious/src/routes/search/[slug]/+page.svelte @@ -1,10 +1,32 @@ - + diff --git a/materialious/src/routes/search/[slug]/+page.ts b/materialious/src/routes/search/[slug]/+page.ts index 3f9ed812..3de36928 100644 --- a/materialious/src/routes/search/[slug]/+page.ts +++ b/materialious/src/routes/search/[slug]/+page.ts @@ -2,6 +2,7 @@ import { getSearch } from '$lib/Api/index.js'; export async function load({ params }) { return { - search: await getSearch(params.slug, { sort_by: "relevance", type: "video" }) + search: await getSearch(params.slug, { type: "video" }), + slug: params.slug }; } \ No newline at end of file diff --git a/materialious/src/routes/subscriptions/+page.svelte b/materialious/src/routes/subscriptions/+page.svelte index 78fd4ef4..d93855a2 100644 --- a/materialious/src/routes/subscriptions/+page.svelte +++ b/materialious/src/routes/subscriptions/+page.svelte @@ -1,10 +1,32 @@ - + diff --git a/materialious/src/routes/watch/[slug]/+page.svelte b/materialious/src/routes/watch/[slug]/+page.svelte index 5093bbe9..2ade4dc7 100644 --- a/materialious/src/routes/watch/[slug]/+page.svelte +++ b/materialious/src/routes/watch/[slug]/+page.svelte @@ -1,5 +1,5 @@