fragginwagon/memory-infrastructure-palace
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

✨ Enhance scrolling logic with virtual scroller API support for large files and improve fallback behavior

Browse Source
This commit is contained in:
Greg Jacobs
2026-01-28 21:16:02 +00:00
parent a8b92e1d3b
commit 32698e5261
1 changed files with 40 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
code/websites/pokedex.online/src/views/GamemasterExplorer.vue
View File

@@ -758,43 +758,50 @@ function scrollToResult() {
})); }));
} }
// Retry logic for virtual scroller rendering // Use virtual scroller API if available (for large files)
const attemptScroll = (attempt = 0) => { if (virtualScroller.value && displayLines.value.length > 1000) {
const lineElement = document.querySelector(`[data-line="${lineNumber}"]`); nextTick(() => {
virtualScroller.value.scrollToItem(lineIndex);
});
} else {
// Fallback for non-virtual scrolled content
const attemptScroll = (attempt = 0) => {
const lineElement = document.querySelector(`[data-line="${lineNumber}"]`);
if (lineElement) { if (lineElement) {
// Scroll only within the container, not the whole page // Scroll only within the container, not the whole page
const container = lineElement.closest('.scroller, .lines-container'); const container = lineElement.closest('.scroller, .lines-container');
if (container) { if (container) {
// Get element's position relative to the container // Get element's position relative to the container
const elementOffsetTop = lineElement.offsetTop; const elementOffsetTop = lineElement.offsetTop;
const containerHeight = container.clientHeight; const containerHeight = container.clientHeight;
const elementHeight = lineElement.offsetHeight; const elementHeight = lineElement.offsetHeight;
// Calculate scroll position to center element in container // Calculate scroll position to center element in container
const scrollTo = const scrollTo =
elementOffsetTop - containerHeight / 2 + elementHeight / 2; elementOffsetTop - containerHeight / 2 + elementHeight / 2;
container.scrollTo({ top: scrollTo, behavior: 'smooth' }); container.scrollTo({ top: scrollTo, behavior: 'smooth' });
}
return true;
} else if (attempt < 3) {
// Virtual scroller may not have rendered yet, try again
setTimeout(() => attemptScroll(attempt + 1), 50);
return false;
} else {
// Fallback: scroll container to approximate position
const container = document.querySelector('.scroller, .lines-container');
if (container) {
const estimatedScroll =
(lineIndex / fileLines.value.length) *
(container.scrollHeight - container.clientHeight);
container.scrollTop = estimatedScroll;
}
return false;
} }
return true; };
} else if (attempt < 3) {
// Virtual scroller may not have rendered yet, try again
setTimeout(() => attemptScroll(attempt + 1), 50);
return false;
} else {
// Fallback: scroll container to approximate position
const container = document.querySelector('.scroller, .lines-container');
if (container) {
const estimatedScroll =
(lineIndex / fileLines.value.length) *
(container.scrollHeight - container.clientHeight);
container.scrollTop = estimatedScroll;
}
return false;
}
};
attemptScroll(); attemptScroll();
}
} }
function applyHistoryItem(item) { function applyHistoryItem(item) {