{{ define "body_class" }}search{{ end }}

{{ define "head_extra" }}
{{- $search := resources.Get "css/search.css" | minify | fingerprint -}}
<link rel="stylesheet" href="{{ $search.RelPermalink }}" integrity="{{ $search.Data.Integrity }}" crossorigin="anonymous">
{{- if site.Params.search.enable | default true }}
{{- $pagefindCss := "pagefind/pagefind-ui.css" | relLangURL }}
<link rel="preload" as="style" href="{{ $pagefindCss }}" onload="this.onload=null;this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="{{ $pagefindCss }}"></noscript>
{{- end }}
{{ end }}

{{ define "main" }}
<header class="list-header">
  <h1 class="list-title">{{ .Title | default (i18n "search") }}</h1>
  {{- with .Description }}<p class="list-description">{{ . }}</p>{{ end }}
</header>

{{- if site.Params.search.enable | default true }}
<div id="search" class="search-container" data-pagefind-ui></div>

<noscript>
  <p class="search-noscript">{{ i18n "searchNoScript" | default "Tìm kiếm yêu cầu JavaScript." }}</p>
</noscript>
{{- else }}
<p class="search-disabled">{{ i18n "searchDisabled" | default "Tìm kiếm hiện không khả dụng trên trang này." }}</p>
{{- end }}
{{ end }}

{{ define "scripts" }}
{{- if site.Params.search.enable | default true }}
<script type="module">
  import { PagefindUI } from "{{ "pagefind/pagefind-ui.js" | relLangURL }}";
  new PagefindUI({
    element: "#search",
    showSubResults: true,
    showImages: false,
    resetStyles: false,
    translations: {
      placeholder: {{ i18n "searchPlaceholder" | default "Tìm bài viết..." | jsonify }},
      clear_search: {{ i18n "clearSearch" | default "Xoá" | jsonify }},
      load_more: {{ i18n "loadMore" | default "Xem thêm" | jsonify }},
      search_label: {{ i18n "search" | default "Tìm kiếm" | jsonify }},
      filters_label: {{ i18n "filters" | default "Bộ lọc" | jsonify }},
      zero_results: {{ i18n "zeroResults" | default "Không có kết quả cho [SEARCH_TERM]" | jsonify }},
      many_results: {{ i18n "manyResults" | default "[COUNT] kết quả cho [SEARCH_TERM]" | jsonify }},
      one_result: {{ i18n "oneResult" | default "[COUNT] kết quả cho [SEARCH_TERM]" | jsonify }},
      alt_search: {{ i18n "altSearch" | default "Không có kết quả cho [SEARCH_TERM]. Đang hiển thị kết quả cho [DIFFERENT_TERM]." | jsonify }},
      search_suggestion: {{ i18n "searchSuggestion" | default "Không có kết quả cho [SEARCH_TERM]. Thử các từ khoá: [DIFFERENT_TERMS]." | jsonify }},
      searching: {{ i18n "searching" | default "Đang tìm [SEARCH_TERM]..." | jsonify }}
    }
  });
</script>
{{- end }}
{{ end }}