This repository has been archived on 2024-01-30. You can view files and clone it, but cannot push or open issues or pull requests.
docs/static/search.js
stuebinm 20082e969f initial proof of concept
idea: write markdown, get a more-or-less readable with categories and search
because no one wants to deal with wikis (or just use fd & rg locally, I guess).

Add docs to `content/`; all subdirs of that need a _index.md file that defines
the theme. Categories are just strings and can be defined ad-hoc; the search
goes through all files in `content/` and subdirs based on a search index built
by zola when building the site.
2022-01-05 22:10:25 +01:00

52 lines
1.7 KiB
JavaScript

function mkDiv (res) {
let div = document.createElement("div");
let a = document.createElement("a");
a.innerText = res.doc.title;
a.href = res.ref;
let text = document.createElement("span");
text.innerText = res.doc.body.slice(0,400).replaceAll("\n", " ");
text.classList.add("searchresultprevtext");
div.appendChild(text);
div.appendChild(a);
return div;
}
window.onload = () => {
console.log("hello!")
let searchbox = document.getElementById("searchbox");
searchbox.innerHTML =
"<input id='searchinput' placeholder='search ...'></input> \
<div id='searchresults' style='display:none'></div>";
let searchinput = document.getElementById("searchinput");
let searchresults = document.getElementById("searchresults");
let index = elasticlunr.Index.load(window.searchIndex);
searchinput.addEventListener("keyup", () => {
let term = searchinput.value.trim();
let results = [];
if (term !== "") {
results = index.search(term, {});
console.log(results);
while (searchresults.lastChild) {
searchresults.removeChild(searchresults.lastChild)
}
if (results.length !== 0) {
let resultdivs = results.map(mkDiv);
resultdivs.map((div) => searchresults.appendChild(div));
} else {
searchresults.innerHTML =
term.length <= 4 ?
"<div>Need at least four characters to search.</div>"
: "<div>No results here.</div>";
}
searchresults.style.display = "initial";
} else {
searchresults.style.display = "none";
}
});
}