diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte
index 080e1ef..ec600d8 100644
--- a/frontend/src/App.svelte
+++ b/frontend/src/App.svelte
@@ -12,6 +12,8 @@
simklUser,
simklWatchList,
title,
+ watchListPage,
+ animePerPage,
} from "./GlobalVariablesAndHelperFunctions.svelte";
import {
CheckIfAniListLoggedIn,
@@ -41,8 +43,10 @@
aniListWatchlist.subscribe((value) => aniListWatchListLoaded = value)
- let page = 1
- let perPage = 20
+ let page: number
+ let perPage: number
+ watchListPage.subscribe(value => page = value)
+ animePerPage.subscribe(value => perPage = value)
const size = "xl"
onMount(async () => {
@@ -84,9 +88,9 @@
})
})
- function ChangeWathcListPage(newPage: number) {
+ function ChangeWatchListPage(newPage: number) {
GetAniListUserWatchingList(newPage, perPage, MediaListSort.UpdatedTimeDesc).then((result) => {
- page = newPage
+ watchListPage.set(newPage)
aniListWatchlist.set(result)
aniListLoggedIn.set(true)
})
@@ -111,19 +115,19 @@
{:else}
-
{/if}
{#each {length: aniListWatchListLoaded.data.Page.pageInfo.lastPage} as _, i}
{#if i+1 === page}
- ChangeWathcListPage(i+1)}
+ ChangeWatchListPage(i+1)}
class="flex items-center justify-center px-4 h-10 leading-tight border border-gray-300 bg-gray-100 dark:border-gray-700 dark:bg-gray-700 dark:text-white">{i+1}
{:else}
- ChangeWathcListPage(i+1)}
+ ChangeWatchListPage(i+1)}
class="flex items-center justify-center px-4 h-10 leading-tight text-gray-500 bg-white border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">{i+1}
{/if}
@@ -136,7 +140,7 @@
{:else}
- ChangeWathcListPage(page+1)}
+ ChangeWatchListPage(page+1)}
class="flex items-center justify-center px-4 h-10 leading-tight text-gray-500 bg-white border border-gray-300 rounded-e-lg hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">Next
{/if}
@@ -188,19 +192,19 @@
{:else}
- ChangeWathcListPage(page-1)}
+ ChangeWatchListPage(page-1)}
class="flex items-center justify-center px-4 h-10 ms-0 leading-tight text-gray-500 bg-white border border-e-0 border-gray-300 rounded-s-lg hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">Previous
{/if}
{#each {length: aniListWatchListLoaded.data.Page.pageInfo.lastPage} as _, i}
{#if i+1 === page}
- ChangeWathcListPage(i+1)}
+ ChangeWatchListPage(i+1)}
class="flex items-center justify-center px-4 h-10 leading-tight border border-gray-300 bg-gray-100 dark:border-gray-700 dark:bg-gray-700 dark:text-white">{i+1}
{:else}
- ChangeWathcListPage(i+1)}
+ ChangeWatchListPage(i+1)}
class="flex items-center justify-center px-4 h-10 leading-tight text-gray-500 bg-white border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">{i+1}
{/if}
@@ -213,7 +217,7 @@
{:else}
- ChangeWathcListPage(page+1)}
+ ChangeWatchListPage(page+1)}
class="flex items-center justify-center px-4 h-10 leading-tight text-gray-500 bg-white border border-gray-300 rounded-e-lg hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">Next
{/if}
diff --git a/frontend/src/GlobalVariablesAndHelperFunctions.svelte b/frontend/src/GlobalVariablesAndHelperFunctions.svelte
index 33d11bf..741977b 100644
--- a/frontend/src/GlobalVariablesAndHelperFunctions.svelte
+++ b/frontend/src/GlobalVariablesAndHelperFunctions.svelte
@@ -1,7 +1,7 @@