[TASK] add quick search index
This commit is contained in:
parent
e7405c4edb
commit
b2d1995085
@ -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");
|
||||
}
|
||||
|
@ -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>
|
||||
|
@ -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");
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user