121 lines
3.5 KiB
Plaintext
121 lines
3.5 KiB
Plaintext
<div class="search">
|
|
<div class="search__main">
|
|
<form id="search_form">
|
|
<label>Wat zoek je?</label><input class="search__input" type="text">
|
|
<button type="submit">Zoek!</button>
|
|
</form>
|
|
</div>
|
|
<div id="search_wrapper" class="fancy_link_container"></div>
|
|
</div>
|
|
<script src="https://unpkg.com/lunr/lunr.js"></script>
|
|
|
|
<script>
|
|
function clearDiv(element) {
|
|
while (element.lastElementChild) {
|
|
element.removeChild(element.lastElementChild);
|
|
}
|
|
}
|
|
|
|
function myFunction(event) {
|
|
doSearch(event.target[0].value);
|
|
event.preventDefault();
|
|
}
|
|
|
|
const wrapper = document.getElementById("search_wrapper");
|
|
const form = document.getElementById('search_form');
|
|
form.addEventListener('submit', myFunction);
|
|
|
|
var doSearch = (e) => {};
|
|
|
|
function parseUrlParams () {
|
|
const url = window.location.search;
|
|
if(!url) return {};
|
|
const paramsBuilder = {};
|
|
for(let currentVar of url.substring(1).split("&")) {
|
|
var pair = currentVar.split('=');
|
|
paramsBuilder[pair[0]] = decodeURIComponent(pair[1]);
|
|
}
|
|
|
|
return paramsBuilder;
|
|
};
|
|
|
|
function resetFromUrl() {
|
|
const urlParams = parseUrlParams();
|
|
|
|
if(urlParams["q"]) {
|
|
doSearch(urlParams["q"]);
|
|
form[0].value = urlParams["q"];
|
|
} else {
|
|
form[0].value = "";
|
|
clearDiv(wrapper);
|
|
}
|
|
}
|
|
|
|
function ready() {
|
|
Array.prototype.stableSort = function(cmp) {
|
|
cmp = !!cmp ? cmp : (a, b) => {
|
|
if (a < b) return -1;
|
|
if (a > b) return 1;
|
|
return 0;
|
|
};
|
|
let stabilizedThis = this.map((el, index) => [el, index]);
|
|
let stableCmp = (a, b) => {
|
|
let order = cmp(a[0], b[0]);
|
|
if (order != 0) return order;
|
|
return a[1] - b[1];
|
|
}
|
|
stabilizedThis.sort(stableCmp);
|
|
for (let i=0; i<this.length; i++) {
|
|
this[i] = stabilizedThis[i][0];
|
|
}
|
|
return this;
|
|
}
|
|
|
|
Array.prototype.sortByKey = function(key) {
|
|
return this.sort(function(a, b) {
|
|
var x = key(a); var y = key(b);
|
|
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
|
|
});
|
|
}
|
|
|
|
function render_results(div, partials) {
|
|
const create_wrapper= document.createElement('div');
|
|
for(let partial of partials) {
|
|
create_wrapper.innerHTML = partial;
|
|
div.appendChild(create_wrapper.firstChild);
|
|
}
|
|
if (partials.length == 0) {
|
|
create_wrapper.innerHTML = "Geen verenigingen gevonden :(";
|
|
div.appendChild(create_wrapper);
|
|
}
|
|
}
|
|
|
|
const documents = <%= CreateFullTextIndex.new(@items.find_all("**/verenigingen/*") + @items.find_all("**/konventen/*")).call.to_json %>;
|
|
const partials = <%= to_partials_search(all_groups()) %>;
|
|
|
|
const index = lunr(function () {
|
|
this.field('id', {boost: 15});
|
|
this.field('title', {boost: 10});
|
|
this.field('verkort', {boost: 8});
|
|
this.field('konvent', {boost: 3});
|
|
this.field('body');
|
|
this.ref('url');
|
|
|
|
documents.forEach(function(i) { this.add(i); }, this);
|
|
});
|
|
|
|
doSearch = (query) => {
|
|
clearDiv(wrapper);
|
|
render_results(wrapper, index.search(query).sortByKey(i => partials[i.ref].titel).stableSort((a, b) => b.score - a.score).map(i => partials[i.ref].html));
|
|
|
|
window.history.pushState("search state", "", window.location.pathname + "?q="+query);
|
|
};
|
|
|
|
resetFromUrl();
|
|
}
|
|
|
|
document.addEventListener("DOMContentLoaded", ready);
|
|
window.addEventListener("popstate", resetFromUrl);
|
|
|
|
</script>
|