Browse Source

implemented endles scrolling on bookmark list page

Signed-off-by: Stephan Richter <s.richter@srsoftware.de>
featue/module_registry
Stephan Richter 3 months ago
parent
commit
c4b4088620
  1. 24
      frontend/src/routes/bookmark/Index.svelte

24
frontend/src/routes/bookmark/Index.svelte

@ -10,6 +10,11 @@ @@ -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 @@ @@ -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 @@ @@ -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}

Loading…
Cancel
Save