feat: Add hash-based article navigation for back/forward button support#8764
feat: Add hash-based article navigation for back/forward button support#8764sliekens wants to merge 2 commits into
Conversation
There was a problem hiding this comment.
Pull request overview
Adds hash-based navigation for expanding/collapsing articles so browser back/forward traversal can close/reopen articles and allow bookmarking of specific entries.
Changes:
- Update
toggleContent()to set/clearlocation.hashwhen switching/expanding/collapsing articles. - Add
init_article_history()to expand/collapse articles on initial load andhashchange. - Initialise the new history handler from
init_main_afterDOM().
|
What concretely does it do when navigating through multiple articles? |
|
What concretely happens when navigating through multiple articles? If you’d rather, I can change this behavior so that only a single history entry is kept. In that case, navigating between articles wouldn’t build up a stack, but that would require a bit more implementation work. |
|
I think I'd prefer the latter, but I suppose we'll see what the others have to say. |
|
In fact I would also prefer the single history entry, which aligns better with the intended design of getting back to the overview quickly. Current behavior: stack.mp4 |
|
Updated to the single history entry, I believe this is closer to what most people expect when pressing back: single.mp4The difference is especially noticeable on mobile 🙂. |
|
The interaction's a bit odd if you go back to a page where the article ID doesn't exist because it was from further down, then open some article, scroll down, and press back. Instead of closing the opened article it'll now open the previously opened article. |
- Update URL hash when articles are expanded/collapsed (#article-{id})
- Listen for hashchange events to handle browser back/forward
- Enable bookmarkable URLs for individual articles
- Auto-expand articles when loading URL with hash fragment
Closes #8759
Changes proposed in this pull request:
toggleContent()inp/scripts/main.jsto update URL hash when articles are expanded or collapsedinit_article_history()function to handle hash change events and initial page load with hash#article-{id}hash fragmentsHow to test the feature manually:
#article-{id}), then press your browser's back button - the article should collapse instead of leaving FreshRSSPull request checklist:
Unit tests: FreshRSS uses PHPUnit for backend tests; there are no JavaScript unit tests in this codebase, so this is N/A for JS changes
Documentation: no user attention required for this change.