This commit is contained in:
2026-09-11 21:45:54 +02:00
parent 52ed9fd7bd
commit fe5763efe4
10 changed files with 233 additions and 33 deletions
+106 -15
View File
@@ -1155,10 +1155,26 @@ window.cancelAnimFrame = (function () {
const urlObj = new URL(itemUrl, window.location.origin);
let path = urlObj.pathname.replace(/\/+$/, '');
path = path.replace(/\/(?:\d+|[a-zA-Z0-9_-]{11})$/, '');
const postsEl = document.querySelector('.posts[data-current-page]');
const currentPage = postsEl ? parseInt(postsEl.dataset.currentPage, 10) : 1;
const currentGridPath = window._onaraCurrentGridUrl ? new URL(window._onaraCurrentGridUrl, window.location.origin).pathname.replace(/\/p\/\d+/, '').replace(/\/+$/, '') : '';
if (currentPage > 1 && !path.includes('/p/') && (!currentGridPath || currentGridPath === path)) {
// Check current grid URL if available and matching base path
if (window._onaraCurrentGridUrl) {
try {
const gridObj = new URL(window._onaraCurrentGridUrl, window.location.origin);
const gridBasePath = gridObj.pathname.replace(/\/p\/\d+/, '').replace(/\/+$/, '');
if (gridBasePath === path) {
return gridObj.pathname + (gridObj.search || '') + (gridObj.hash || '');
}
} catch {}
}
const postsEl = document.querySelector('.posts');
const activePagSpan = document.querySelector('.pagination span.btn.disabled, .pagination span.disabled');
const pagPage = activePagSpan ? parseInt(activePagSpan.textContent.trim(), 10) : 0;
const currentPage = (postsEl && postsEl.dataset.currentPage)
? parseInt(postsEl.dataset.currentPage, 10)
: (pagPage || postsEl?._infiniteState?.currentPage || postsEl?._infiniteState?.visiblePage || 1);
if (currentPage > 1 && !path.includes('/p/')) {
path = (path ? path : '') + '/p/' + currentPage;
}
if (!path) path = '/';
@@ -1216,6 +1232,14 @@ window.cancelAnimFrame = (function () {
if (window.initBackground) window.initBackground();
}
// Restore pagination container visibility on background grid
document.querySelectorAll('.pagination-container-fluid').forEach(el => {
const pagWrapper = el.querySelector('.pagination-wrapper');
if (!pagWrapper || pagWrapper.innerHTML.trim().length > 0) {
el.style.display = '';
}
});
if (!options.skipHistory) {
const returnUrl = window._onaraReturnUrl || getOnaraBaseUrl();
const returnTitle = window._onaraReturnTitle || window.f0ckDomain || '';
@@ -3971,7 +3995,16 @@ window.cancelAnimFrame = (function () {
// Clear and Hide navbar pagination for Item View (Never show grid pagination on item view)
// document.querySelectorAll('.pagination-wrapper').forEach(el => el.innerHTML = ''); // Don't destroy content (cached grid needs it)
document.querySelectorAll('.pagination-container-fluid').forEach(el => el.style.display = 'none');
if (!useOnara) {
document.querySelectorAll('.pagination-container-fluid').forEach(el => el.style.display = 'none');
} else {
document.querySelectorAll('.pagination-container-fluid').forEach(el => {
const pagWrapper = el.querySelector('.pagination-wrapper');
if (!pagWrapper || pagWrapper.innerHTML.trim().length > 0) {
el.style.display = '';
}
});
}
if (keySegments.length === 0) {
console.warn("loadItemAjax: No ID or slug match found in URL", url);
@@ -5740,7 +5773,7 @@ window.cancelAnimFrame = (function () {
}
}
delete postsContainer.dataset.currentPage; // Clear after reading
postsContainer.dataset.currentPage = p;
}
// Track initially loaded page
@@ -5823,6 +5856,7 @@ window.cancelAnimFrame = (function () {
// Update URL
infiniteState.visiblePage = newPage;
if (postsContainer) postsContainer.dataset.currentPage = newPage;
history.replaceState({}, '', buildUrl(newPage));
// Update Pagination
@@ -6882,6 +6916,33 @@ window.cancelAnimFrame = (function () {
}
});
}
// ── Grid Mode / thumbnail size picker ────────────────────────────────
const THUMB_SIZE_KEY = 'scroller_thumb_size';
const THUMB_SIZES = ['s', 'm', 'l', 'xl'];
const gridSizeBtns = overlay.querySelectorAll('.nav-grid-size-btn');
const applyNavThumbSize = (size) => {
if (!THUMB_SIZES.includes(size)) size = 'm';
document.documentElement.dataset.thumbSize = size;
localStorage.setItem(THUMB_SIZE_KEY, size);
gridSizeBtns.forEach(b => b.classList.toggle('active', b.dataset.thumbSize === size));
};
// Sync active state each time the modal opens
if (filterBtn) {
filterBtn.addEventListener('click', () => {
const cur = localStorage.getItem(THUMB_SIZE_KEY) || 'm';
gridSizeBtns.forEach(b => b.classList.toggle('active', b.dataset.thumbSize === cur));
});
}
gridSizeBtns.forEach(btn => {
btn.addEventListener('click', () => applyNavThumbSize(btn.dataset.thumbSize));
});
// Apply persisted size immediately on init (every page load)
applyNavThumbSize(localStorage.getItem(THUMB_SIZE_KEY) || 'm');
};
document.addEventListener('DOMContentLoaded', () => {
@@ -7662,26 +7723,49 @@ window.cancelAnimFrame = (function () {
// At ≤599px the sidebar is a pure overlay — never animate wrapper padding
const animateWrappers = window.innerWidth > 599;
// Grid/pagewrapper: snap instantly in both directions (no animated reflow).
// Pagination always animates — it tracks sidebar position with no reflow cost.
// All wrappers animate in sync with the sidebar so content and sidebar
// expand/collapse together rather than staggering.
const wrappers = getSidebarWrappers();
if (animateWrappers) {
wrappers.forEach(w => {
const isPagination = w.classList.contains('pagination-container-fluid');
const isMessages = w.classList.contains('messages-convo-page');
const prop = (isPagination || isMessages) ? 'right' : 'padding-right';
const targetVal = isHidden ? sidebarWidth + 'px' : '0px';
// Lightweight layouts (pagination, messages) animate smoothly.
// Heavy/reflow-intensive layouts snap instantly to avoid reflow lag.
const shouldAnimate = (isPagination || isMessages);
w.style.setProperty('transition', shouldAnimate ? `${prop} 0.3s ease-in-out` : 'none', 'important');
w.style.setProperty('transition', `${prop} 0.3s ease-in-out`, 'important');
w.style.setProperty(prop, targetVal, 'important');
});
void sidebar.offsetWidth; // settle layout before sidebar transform begins
}
// Animate the drag-zone pill in sync with the sidebar so it stays
// glued to the sidebar's left edge throughout the transition.
edgeZone.style.setProperty('transition', 'right 0.3s ease-in-out', 'important');
if (isHidden) {
// Opening: pill moves from right-edge → left of sidebar
edgeZone.style.right = sidebarWidth + 'px';
edgeZone.style.width = '25px';
edgeZone.style.pointerEvents = 'all';
} else {
// Closing: pill moves toward right-edge
edgeZone.style.right = '0px';
edgeZone.style.width = '30px';
edgeZone.style.pointerEvents = 'all';
}
// Animate the Onara modal wrapper's right edge in sync with the sidebar
// so the modal resizes at the same time instead of waiting for settle.
const onaraModal = document.getElementById('onara-modal');
if (onaraModal && animateWrappers) {
const targetModalRight = isHidden ? sidebarWidth + 'px' : '0px';
onaraModal.style.setProperty('transition',
'opacity 0.28s cubic-bezier(0.16,1,0.3,1), transform 0.28s cubic-bezier(0.16,1,0.3,1), right 0.3s ease-in-out',
'important');
onaraModal.style.setProperty('right', targetModalRight, 'important');
}
sidebar.style.setProperty('transition', 'transform 0.3s ease-in-out', 'important');
sidebar.style.transform = `translateX(${targetTranslate}px)`;
@@ -7689,9 +7773,11 @@ window.cancelAnimFrame = (function () {
const settle = () => {
if (settled) return;
settled = true;
// Freeze wrapper transitions so the class commit doesn't re-trigger them
// Freeze wrapper and edgeZone transitions so the class commit doesn't re-trigger them
wrappers.forEach(w => w.style.setProperty('transition', 'none', 'important'));
sidebar.style.setProperty('transition', 'none', 'important');
edgeZone.style.setProperty('transition', 'none', 'important');
if (onaraModal) onaraModal.style.setProperty('transition', 'none', 'important');
const toHidden = !isHidden;
document.body.classList.toggle('sidebar-right-hidden', toHidden);
localStorage.setItem('sidebarRightHidden', toHidden);
@@ -7699,6 +7785,11 @@ window.cancelAnimFrame = (function () {
sidebar.style.transform = '';
requestAnimationFrame(() => {
sidebar.style.removeProperty('transition');
edgeZone.style.removeProperty('transition');
if (onaraModal) {
onaraModal.style.removeProperty('transition');
onaraModal.style.removeProperty('right');
}
wrappers.forEach(w => {
w.style.removeProperty('transition');
w.style.removeProperty('padding-right');