{{ define "main" }}
<h1>{{ .Title }}</h1>
<div id="search"></div>
<noscript><p>Searching needs JavaScript.</p></noscript>
<p id="search-missing" class="note" hidden>The search index is not available in this preview: it is generated by <code>make build</code>.</p>
<link rel="stylesheet" href="{{ "pagefind/pagefind-ui.css" | relURL }}">
<script src="{{ "pagefind/pagefind-ui.js" | relURL }}"></script>
<script>
  if (window.PagefindUI) {
    // the site may live in a sub-directory: its root is the parent of this page
    const root = new URL("..", location.href).pathname;
    const ui = new PagefindUI({
      element: "#search",
      baseUrl: root,
      showSubResults: false,
      pageSize: 10,
      // images are stored with page-relative addresses: make them absolute
      processResult: (result) => {
        if (result.meta && result.meta.image) {
          result.meta.image = new URL(result.meta.image, new URL(result.url, location.href)).pathname;
        }
        return result;
      },
    });
    const q = new URLSearchParams(location.search).get("q");
    if (q) ui.triggerSearch(q);
  } else {
    document.getElementById("search-missing").hidden = false;
  }
</script>
{{ end }}