infinity!!!
This commit is contained in:
@@ -798,6 +798,53 @@ window.requestAnimFrame = (function () {
|
|||||||
return path.replace(/\/$/, '') || '/';
|
return path.replace(/\/$/, '') || '/';
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Track currently visible page for URL updates
|
||||||
|
infiniteState.visiblePage = infiniteState.currentPage;
|
||||||
|
|
||||||
|
// Helper to find the active page marker
|
||||||
|
const updateUrlAndPagination = () => {
|
||||||
|
const markers = [...document.querySelectorAll('[data-page-start]')];
|
||||||
|
if (!markers.length) return;
|
||||||
|
|
||||||
|
const triggerPoint = window.innerHeight / 3;
|
||||||
|
let activeMarker = markers[0];
|
||||||
|
|
||||||
|
// Find the last marker that has passed the trigger point (is visible or above)
|
||||||
|
for (const marker of markers) {
|
||||||
|
const rect = marker.getBoundingClientRect();
|
||||||
|
if (rect.top < triggerPoint) {
|
||||||
|
activeMarker = marker;
|
||||||
|
} else {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const newPage = parseInt(activeMarker.dataset.pageStart);
|
||||||
|
if (newPage !== infiniteState.visiblePage) {
|
||||||
|
// Update URL
|
||||||
|
infiniteState.visiblePage = newPage;
|
||||||
|
history.replaceState({}, '', buildUrl(newPage));
|
||||||
|
|
||||||
|
// Update Pagination
|
||||||
|
const paginationHtml = activeMarker.dataset.paginationHtml;
|
||||||
|
if (paginationHtml) {
|
||||||
|
document.querySelectorAll('.pagination-wrapper').forEach(el => el.innerHTML = paginationHtml);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// Initialize marker for the first page
|
||||||
|
const initFirstPageMarker = () => {
|
||||||
|
const firstItem = postsContainer.querySelector('a');
|
||||||
|
const pag = document.querySelector('.pagination-wrapper');
|
||||||
|
if (firstItem && pag && !firstItem.dataset.pageStart) {
|
||||||
|
firstItem.dataset.pageStart = infiniteState.currentPage;
|
||||||
|
firstItem.dataset.paginationHtml = pag.innerHTML;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
initFirstPageMarker();
|
||||||
|
|
||||||
|
|
||||||
// Fetch and append more items
|
// Fetch and append more items
|
||||||
const loadMoreItems = async () => {
|
const loadMoreItems = async () => {
|
||||||
if (infiniteState.loading || !infiniteState.hasMore) return;
|
if (infiniteState.loading || !infiniteState.hasMore) return;
|
||||||
@@ -823,24 +870,27 @@ window.requestAnimFrame = (function () {
|
|||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
|
|
||||||
if (data.success && data.html) {
|
if (data.success && data.html) {
|
||||||
// Append new thumbnails
|
|
||||||
const currentPosts = document.querySelector("div.posts");
|
const currentPosts = document.querySelector("div.posts");
|
||||||
if (currentPosts) currentPosts.insertAdjacentHTML('beforeend', data.html);
|
if (currentPosts) {
|
||||||
|
// Create elements from HTML string
|
||||||
|
const temp = document.createElement('div');
|
||||||
|
temp.innerHTML = data.html;
|
||||||
|
const newItems = [...temp.children];
|
||||||
|
|
||||||
// Update state
|
if (newItems.length > 0) {
|
||||||
|
// Mark the first item of the new page
|
||||||
|
newItems[0].dataset.pageStart = data.currentPage;
|
||||||
|
newItems[0].dataset.paginationHtml = data.pagination;
|
||||||
|
|
||||||
|
// Append all new items
|
||||||
|
newItems.forEach(item => currentPosts.appendChild(item));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Update state (last loaded page)
|
||||||
infiniteState.currentPage = data.currentPage;
|
infiniteState.currentPage = data.currentPage;
|
||||||
infiniteState.hasMore = data.hasMore;
|
infiniteState.hasMore = data.hasMore;
|
||||||
|
|
||||||
// Update URL
|
|
||||||
history.replaceState({}, '', buildUrl(infiniteState.currentPage));
|
|
||||||
|
|
||||||
// Update pagination display if exists
|
|
||||||
const paginationLinks = document.querySelectorAll('.pagination .pagination-int-item, .pagination .btn');
|
|
||||||
paginationLinks.forEach(el => {
|
|
||||||
if (el.textContent.trim() == infiniteState.currentPage) {
|
|
||||||
el.classList.add('disabled');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
} else {
|
} else {
|
||||||
infiniteState.hasMore = false;
|
infiniteState.hasMore = false;
|
||||||
}
|
}
|
||||||
@@ -862,8 +912,11 @@ window.requestAnimFrame = (function () {
|
|||||||
const currentContainer = document.querySelector("div.posts");
|
const currentContainer = document.querySelector("div.posts");
|
||||||
// Only run if .posts exists (index/grid view)
|
// Only run if .posts exists (index/grid view)
|
||||||
if (!currentContainer) return;
|
if (!currentContainer) return;
|
||||||
|
if (currentContainer.classList.contains('no-infinite-scroll')) return; // Double check
|
||||||
if (!document.querySelector('#main')) return;
|
if (!document.querySelector('#main')) return;
|
||||||
|
|
||||||
|
updateUrlAndPagination();
|
||||||
|
|
||||||
const scrollPosition = window.innerHeight + window.scrollY;
|
const scrollPosition = window.innerHeight + window.scrollY;
|
||||||
const pageHeight = document.querySelector('#main').offsetHeight;
|
const pageHeight = document.querySelector('#main').offsetHeight;
|
||||||
const distanceFromBottom = pageHeight - scrollPosition;
|
const distanceFromBottom = pageHeight - scrollPosition;
|
||||||
|
|||||||
Reference in New Issue
Block a user