graphite/Sharkey
1
0
Fork 0
mirror of https://git.joinsharkey.org/Sharkey/Sharkey.git synced 2024-11-23 20:23:08 +02:00
Code Issues Projects Releases Packages Wiki Activity

✌️

Browse source
This commit is contained in:
tamaina 2023-07-13 03:53:48 +00:00
parent f5a019a6d6
commit 974f7c13d3
1 changed files with 29 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
packages/frontend/src/components/MkPagination.vue
View file

@ -226,6 +226,25 @@ watch([$$(weakBacked), $$(contentEl)], () => {
return removeListener; return removeListener;
})(); })();
}); });
/**
* アイテムを上に追加した場合に追加分だけスクロールを下にずらす
* @param fn DOM操作(unshiftItemsなどで)
*/
function adjustScroll(fn: () => void) {
const oldHeight = scrollableElement.scrollHeight;
const oldScroll = scrollableElement.scrollTop;
fn();
return nextTick(() => {
const top = oldScroll + (scrollableElement.scrollHeight - oldHeight);
scroll(scrollableElement, { top, behavior: 'instant' });
if (top > TOLERANCE) {
weakBacked = true;
backed = true;
}
return nextTick();
});
}
//#endregion //#endregion
/** /**
@ -493,7 +512,7 @@ function unshiftItems(newItems: MisskeyEntity[], limit = displayLimit.value) {
const length = newItems.length + items.value.size; const length = newItems.length + items.value.size;
items.value = new Map([...arrayToEntries(newItems), ...items.value].slice(0, limit)); items.value = new Map([...arrayToEntries(newItems), ...items.value].slice(0, limit));
if (length >= displayLimit.value) more.value = true; if (length >= limit) more.value = true;
} }
/** /**
@ -507,9 +526,16 @@ function concatItems(oldItems: MisskeyEntity[]) {
if (length >= displayLimit.value) more.value = true; if (length >= displayLimit.value) more.value = true;
} }
function executeQueue() { async function executeQueue() {
const queueArr = Array.from(queue.value.entries()); const queueArr = Array.from(queue.value.entries());
unshiftItems(queueArr.slice(0, props.pagination.limit).map(v => v[1]).reverse()); adjustScroll(() => {
unshiftItems(
queueArr.slice(0, props.pagination.limit).map(v => v[1]).reverse(),
Infinity,
);
}).then(() => {
items.value = new Map([...items.value].slice(0, displayLimit.value));
});
queue.value = new Map(queueArr.slice(props.pagination.limit)); queue.value = new Map(queueArr.slice(props.pagination.limit));
} }