implemented endles scrolling on bookmark list page

Signed-off-by: Stephan Richter <s.richter@srsoftware.de>
This commit is contained in:
2025-08-07 23:53:40 +02:00
parent 1ff28c5ed4
commit c4b4088620

View File

@@ -10,6 +10,11 @@
import Template from './Template.svelte';
let bookmarks = $state(null);
let loader = {
offset : 0,
limit : 16,
active : true
}
let new_bookmark = $state({
comment:{
source:null,
@@ -40,13 +45,18 @@
}
}
async function loadBookmarks(offset=0,limit=100){
const url = api(`bookmark/list?offset=${offset}&limit=${limit}`);
async function loadBookmarks(){
const url = api(`bookmark/list?offset=${loader.offset}&limit=${loader.limit}`);
const resp = await fetch(url,{credentials:'include'});
if (resp.ok){
const raw = await resp.json();
bookmarks = Object.values(raw).sort((a, b) => new Date(b.timestamp) - new Date(a.timestamp));
let merged = bookmarks ? bookmarks : {}
merged = { ...bookmarks , ...raw };
bookmarks = Object.values(merged).sort((a, b) => new Date(b.timestamp) - new Date(a.timestamp));
loader.offset += loader.limit;
loader.active = false;
error = false;
onscroll(null);
} else {
error = await resp.html();
}
@@ -75,9 +85,17 @@
}
}
function onscroll(ev){
if (window.innerHeight + window.scrollY >= document.body.offsetHeight && !loader.active) {
loader.active = true;
loadBookmarks();
}
}
onMount(loadBookmarks);
</script>
<svelte:window {onscroll} />
<fieldset>
<legend>{t('Bookmarks')}</legend>
{#if error}