1{% extends "base.html" %}
2
3{% block title %}search — {{ config.title }}{% endblock %}
4
5{% block content %}
6<h1>search</h1>
7<input type="text" id="search-input" class="search-input" placeholder="type to search..." autofocus />
8<p class="search-meta" id="search-meta"></p>
9<ul class="search-results" id="search-results"></ul>
10
11<script src="{{ config.base_url }}elasticlunr.min.js"></script>
12<script src="{{ config.base_url }}search_index.en.js"></script>
13<script>
14(function () {
15  var index = elasticlunr.Index.load(window.searchIndex);
16  var input = document.getElementById("search-input");
17  var results = document.getElementById("search-results");
18  var meta = document.getElementById("search-meta");
19
20  function truncate(text, len) {
21    if (!text) return "";
22    if (text.length <= len) return text;
23    return text.substring(0, len) + "...";
24  }
25
26  function search() {
27    var query = input.value.trim();
28    results.innerHTML = "";
29    if (!query) {
30      meta.textContent = "";
31      return;
32    }
33    var hits = index.search(query, { expand: true });
34    meta.textContent = hits.length + " result" + (hits.length !== 1 ? "s" : "");
35    if (hits.length === 0) return;
36    for (var i = 0; i < hits.length; i++) {
37      var doc = index.documentStore.getDoc(hits[i].ref);
38      var li = document.createElement("li");
39      li.innerHTML =
40        '<a class="title" href="' + doc.id + '">' + (doc.title || doc.id) + "</a>" +
41        '<p class="body">' + truncate(doc.body, 200) + "</p>";
42      results.appendChild(li);
43    }
44  }
45
46  input.addEventListener("input", search);
47})();
48</script>
49{% endblock %}