Simplify sidebar scroll preservation using only x-navigate directive

- Remove custom sessionStorage scroll management logic
- Rely solely on x-navigate directive from Alpine for scroll preservation
- x-navigate handles automatic scroll position saving and restoring
- Cleaner and simpler implementation
- Keep x-navigate directive on all sidebar links
This commit is contained in:
2025-12-04 02:13:28 +09:00
parent ec7aaf44a9
commit 1e20982e00

View File

@@ -259,72 +259,6 @@ class="fixed inset-y-0 left-0 top-16 w-64 bg-white border-r border-gray-200 over
<!-- Global Keyboard Shortcuts -->
<script>
// Sidebar scroll position management per page
function getSidebarScrollKey() {
// Use current page URL to create a unique key for scroll position
return 'kb_sidebar_scroll_' + window.location.pathname;
}
function saveSidebarScroll() {
const sidebar = document.getElementById('kb-sidebar');
if (sidebar) {
const scrollPos = sidebar.scrollTop;
const key = getSidebarScrollKey();
sessionStorage.setItem(key, scrollPos);
console.log('Saved sidebar scroll for ' + window.location.pathname + ':', scrollPos);
}
}
function restoreSidebarScroll() {
const sidebar = document.getElementById('kb-sidebar');
if (!sidebar) return;
// Use requestAnimationFrame to ensure DOM is fully rendered
requestAnimationFrame(() => {
const key = getSidebarScrollKey();
const savedPos = sessionStorage.getItem(key);
console.log('Retrieved from sessionStorage for ' + window.location.pathname + ':', savedPos);
if (savedPos !== null && parseInt(savedPos, 10) > 0) {
const pos = parseInt(savedPos, 10);
sidebar.scrollTop = pos;
console.log('Restored sidebar scroll for ' + window.location.pathname + ' to:', pos);
}
});
}
// Intercept sidebar link clicks
document.addEventListener('click', function(e) {
const sidebar = document.getElementById('kb-sidebar');
if (!sidebar) return;
const link = e.target.closest('a');
if (sidebar.contains(link)) {
console.log('Sidebar link clicked, saving scroll');
saveSidebarScroll();
}
}, true);
// Save before Alpine navigation
document.addEventListener('alpine:navigating', saveSidebarScroll);
// Restore after Alpine navigation
document.addEventListener('alpine:navigated', () => {
console.log('Alpine navigated event fired, attempting restore');
restoreSidebarScroll();
});
// For page load/reload
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', () => {
console.log('DOMContentLoaded - calling restoreSidebarScroll');
restoreSidebarScroll();
});
} else {
console.log('Document already loaded - calling restoreSidebarScroll');
setTimeout(restoreSidebarScroll, 100);
}
document.addEventListener('keydown', function(e) {
if ((e.ctrlKey || e.metaKey) && e.key === 'k') {
e.preventDefault();