philipp/website-risg
1
0
Fork 0
Code Issues 4 Pull Requests Actions Packages Projects Releases Wiki Activity

[TASK] add quick search index

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/law.rs
View File

@ -117,7 +117,7 @@ pub(crate) fn create_law_files() -> String {
let site = Parts::new().perform(site); let site = Parts::new().perform(site);
li_of_files.push_str(&format!( 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"); fs::write(&format!("output/{law_name}.html"), &site).expect("Unable to write file");
} }

7
templates/index.html
View File

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

31
templates/static/app.js
View File

@ -2,8 +2,39 @@ document.addEventListener("DOMContentLoaded", function () {
changeTheme(); changeTheme();
initcolorTheme(); initcolorTheme();
apply_stickies(); 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() { function changeTheme() {
let toggleBtn = document.querySelector("#theme-toggle-js"); let toggleBtn = document.querySelector("#theme-toggle-js");