37 lines
1 KiB
Svelte
37 lines
1 KiB
Svelte
|
<svelte:options runes={true} />
|
||
|
|
|
||
|
|
<script lang="ts">
|
||
|
|
import {onMount} from "svelte";
|
||
|
|
import {goto} from "$app/navigation";
|
||
|
|
import {AlbumState} from "$lib/components/custom/Views/album-pages-utils.svelte";
|
||
|
|
import AlbumComponent from "$lib/components/custom/Views/AlbumComponent.svelte";
|
||
|
|
|
||
|
|
let scrollY = $state(0);
|
||
|
|
let scrollYMax = $state(1);
|
||
|
|
let albums: AlbumState = $state(new AlbumState());
|
||
|
|
albums.setMode("highest")
|
||
|
|
|
||
|
|
function updateScroll(self) {
|
||
|
|
scrollY = self.scrollTop;
|
||
|
|
scrollYMax = self.scrollTopMax;
|
||
|
|
}
|
||
|
|
|
||
|
|
$effect(() => {
|
||
|
|
if(scrollY/scrollYMax > 0.7 && albums.length === 100 && !albums.paginating) {
|
||
|
|
console.log("triggered")
|
||
|
|
albums.paginating = true;
|
||
|
|
albums.fetchAlbums();
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
function selectAlbum(albumId) {
|
||
|
|
goto(`/album/${albumId}`);
|
||
|
|
console.log(albumId);
|
||
|
|
}
|
||
|
|
|
||
|
|
onMount(() => {
|
||
|
|
albums.fetchAlbums();
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<AlbumComponent {albums} {updateScroll} {selectAlbum} />
|