From 36118117f008a5dc91068d0c69a52e43e7928e85 Mon Sep 17 00:00:00 2001 From: Inverle Date: Mon, 15 Dec 2025 15:12:12 +0100 Subject: Improve scrolling into filter in sidebar (#8307) Follow-up of https://github.com/FreshRSS/FreshRSS/pull/8281 todo: * [x] Include labels (prefix `t_`) too * [x] Keep sidebar scrollTop when using the nav menu * [ ] ~~Make this work in the reader view's sidebar too~~ for separate PR * [x] Prevent whole page from scrolling on `scrollIntoView()` call, just scroll in the sidebar (probably related: https://github.com/FreshRSS/FreshRSS/pull/8306#issuecomment-3647414618) This TODO will be done in a separate PR since it requires optimizing the sidebar toggle code. edit: it does work on Chrome already though, but only if `#stream` isn't too large / breaks randomly (Firefox is slower it seems) --- p/scripts/main.js | 25 +++++++++++++++++++++---- 1 file changed, 21 insertions(+), 4 deletions(-) (limited to 'p/scripts') diff --git a/p/scripts/main.js b/p/scripts/main.js index b8af7e1a5..570785832 100644 --- a/p/scripts/main.js +++ b/p/scripts/main.js @@ -1028,17 +1028,18 @@ function init_column_categories() { const sidebar_scrollTop = sessionStorage.getItem('FreshRSS_sidebar_scrollTop'); if (sidebar_scrollTop) { - // Restore sidebar scroll position (navigated from sidebar) + // Restore sidebar scroll position (navigated from sidebar or nav menu) document.querySelector('ul#sidebar').scrollTop = +sidebar_scrollTop; sessionStorage.removeItem('FreshRSS_sidebar_scrollTop'); } else { - // Scroll into filtered feed/category on sidebar (navigated from anywhere) + // Scroll into filtered feed/category/label on sidebar (navigated from anywhere) const params = new URLSearchParams(location.search); const get = params.get('get'); - if (params.has('get') && (get.startsWith('f_') || get.startsWith('c_'))) { + if (params.has('get') && (get.startsWith('f_') || get.startsWith('c_') || get.startsWith('t_'))) { const selectedEl = document.getElementById(get); if (selectedEl) { - selectedEl.scrollIntoView({ block: get.startsWith('f_') ? 'center' : 'start' }); + selectedEl.scrollIntoView({ block: !get.startsWith('c_') ? 'center' : 'start' }); + document.documentElement.scrollTop = 0; // Prevent unwanted scroll of page } } } @@ -2251,6 +2252,7 @@ function init_normal() { init_actualize(); faviconNbUnread(); + // Keep exact sidebar scroll state for specific navigations const sidebar = document.querySelector('ul#sidebar'); if (sidebar) { sidebar.addEventListener('click', (e) => { @@ -2265,6 +2267,21 @@ function init_normal() { } }); } + const nav_menu = document.querySelector('nav.nav_menu'); + if (nav_menu) { + nav_menu.addEventListener('click', (e) => { + const target = e.target.closest('a.btn:not(#actualize):not(.dropdown-toggle), button[type="submit"]'); + if (target) { + sessionStorage.setItem('FreshRSS_sidebar_scrollTop', sidebar.scrollTop); + } + }); + } + const new_article = document.querySelector('div#new-article'); + if (new_article) { + new_article.addEventListener('click', () => { + sessionStorage.setItem('FreshRSS_sidebar_scrollTop', sidebar.scrollTop); + }); + } document.addEventListener("visibilitychange", () => { if (document.visibilityState === "hidden") { -- cgit v1.2.3