Streamlining Hierarchical Facets Implementation at VuFind Summit 2023
Discover how VuFind has simplified hierarchical facets implementation since 2014, moving away from jsTree to a more efficient HTML-based approach. This change has led to significantly less code to maintain, simpler loading of facet data, and fewer AJAX and Solr requests. Explore the evolution from complex jsTree renderings to a cleaner, more user-friendly solution, enhancing accessibility and overall usability for users at the National Library of Finland.
Download Presentation
Please find below an Image/Link to download the presentation.
The content on the website is provided AS IS for your information and personal use only. It may not be sold, licensed, or shared on other websites without obtaining consent from the author. If you encounter any issues during the download, it is possible that the publisher has removed the file from their server.
You are allowed to download the files provided on this website for personal or commercial use, subject to the condition that they are used lawfully. All files are the property of their respective owners.
The content on the website is provided AS IS for your information and personal use only. It may not be sold, licensed, or shared on other websites without obtaining consent from the author.
E N D
Presentation Transcript
VuFind Hierarchical Facets Rewrite VuFind Summit 2023 Ere Maijala, 24 Aug 2023
Hierarchical Facets Introduction VuFind has supported hierarchical facets since 2014 Implemented using jsTree There were reasons for this Loaded from JSON retrieved with AJAX Two different routes depending on whether deferred facets are in use
Issues Making hierarchical facets resemble normal facets is complicated with jsTree Two different rendering paths easily lead to discrepancies Accessibility leaves a lot to desire I broke keyboard access while fixing other issues jsTree does a lot that we don t need (and need to avoid)
Solution Simple HTML nested lists Same template for the facet items as normal facets A tiny bit of JS to toggle aria-expanded attribute of a button CSS to expand or collapse facets based on the aria-expanded attribute above Cleanup of old AJAX handlers and special cases
Result Much less code to maintain Much simpler loading of facet data Less AJAX and Solr requests ~400 less code lines One less jQuery-based library Pull request #3406 Disclaimer: the pull request has not had any reviews yet, and this is the second iteration already, so things may change! TODO: collection hierarchies
facebook.com/finnapalvelu twitter.com/finnafi instagram.com/finna.fi #Finnafi The National Library of Finland Library Network Services
