implemented endles scrolling on bookmark list page
Signed-off-by: Stephan Richter <s.richter@srsoftware.de>
This commit is contained in:
@@ -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}
|
||||
|
||||
Reference in New Issue
Block a user