forked from Ruderverein-Donau-Linz/rowt
43 lines
1.3 KiB
TypeScript
43 lines
1.3 KiB
TypeScript
import './scss/app.scss'
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
console.log("init");
|
|
initSearch();
|
|
});
|
|
|
|
function initSearch() {
|
|
const input = <HTMLInputElement>document.querySelector('#filter-js');
|
|
|
|
if(input) {
|
|
filterElements(input.value);
|
|
|
|
input.addEventListener('input', () => {
|
|
filterElements(input.value);
|
|
});
|
|
}
|
|
}
|
|
|
|
function filterElements(input: string) {
|
|
const elements = document.querySelectorAll('form[data-filterable="true"]');
|
|
let resultWrapper = <HTMLElement>document.querySelector('#filter-result-js'),
|
|
amountShownElements = 0;
|
|
|
|
Array.prototype.forEach.call(elements, (element: HTMLElement) => {
|
|
// 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';
|
|
amountShownElements ++;
|
|
}
|
|
});
|
|
|
|
if(resultWrapper) {
|
|
resultWrapper.innerHTML = (amountShownElements === 0 ? 'Kein Ergebnis gefunden' : '<strong>' + amountShownElements + '</strong>' + (amountShownElements > 1 ? ' Ergebnisse' : ' Ergebnis') + ' gefunden');
|
|
}
|
|
}
|