[TASK] add quick search index

This commit is contained in:
Marie Birner 2024-02-21 14:39:20 +01:00
parent e7405c4edb
commit b2d1995085
3 changed files with 39 additions and 1 deletions

View File

@ -117,7 +117,7 @@ pub(crate) fn create_law_files() -> String {
let site = Parts::new().perform(site);
li_of_files.push_str(&format!(
"<li><a href='./{law_name}' title='{law_name}' class='contrast'>{lawname}</a></li>"
"<li data-filterable='true' data-filter='{lawname} {law_name}'><a href='./{law_name}' title='{law_name}' class='contrast'>{lawname}</a></li>"
));
fs::write(&format!("output/{law_name}.html"), &site).expect("Unable to write file");
}

View File

@ -3,6 +3,13 @@
<body>
{{header}}
<main class="container">
<input
id="filter-js"
type="search"
name="search"
placeholder="Suchen"
aria-label="Suchen"
/>
<ol>
{{content}}
</ol>

View File

@ -2,8 +2,39 @@ document.addEventListener("DOMContentLoaded", function () {
changeTheme();
initcolorTheme();
apply_stickies();
initSearch();
});
function initSearch() {
const input = document.querySelector('#filter-js');
if(input) {
filterElements(input.value);
input.addEventListener('input', () => {
filterElements(input.value);
});
}
}
function filterElements(input) {
const elements = document.querySelectorAll('[data-filterable="true"]');
Array.prototype.forEach.call(elements, (element) => {
// set both strings (input & dataset filter) to lowercase to not be case sensitive
let filterString = element.dataset.filter?.toLocaleLowerCase();
// bulk hide all elements
element.style.display = 'none';
// show if input matches
if(filterString?.includes(input.toLocaleLowerCase())) {
element.style.display = 'flex';
}
});
}
function changeTheme() {
let toggleBtn = document.querySelector("#theme-toggle-js");