-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathsearch.05daba52664889fa2ade18f8f9ad0d59d4902ed096aac71878d1b194401aa7b8.js
86 lines (86 loc) · 2.9 KB
/
search.05daba52664889fa2ade18f8f9ad0d59d4902ed096aac71878d1b194401aa7b8.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
(() => {
// <stdin>
(function() {
const searchParams = new URLSearchParams(window.location.search);
const keywords = searchParams.get("search").trim();
const searchInput = document.getElementById("search-input");
const resultContainer = document.getElementById("search-result");
const emptyResult = document.getElementById("search-result-empty");
if (keywords) {
searchInput.value = keywords;
search(keywords);
} else {
return;
}
const fuseOptions = {
includeScore: true,
includeMatches: true,
minMatchCharLength: searchOptions.minMatchCharLength,
threshold: searchOptions.threshold,
// refer layouts/search/search.json
keys: [
{ name: "title", weight: 0.8 },
{ name: "content", weight: 0.5 },
{ name: "tags", weight: 0.2 },
{ name: "categories", weight: 0.2 }
]
};
function search(keywords2) {
fetch("./index.json").then((response) => response.json()).then((data) => {
const fuse = new Fuse(data, fuseOptions);
const result = fuse.search(keywords2);
if (result.length > 0) {
showResult(keywords2, result);
emptyResult.classList.add("hidden");
} else {
resultContainer.innerHTML = "";
emptyResult.classList.remove("hidden");
}
});
}
const resultTemplate = `
<article class="flex flex-col gap-y-3 p-6 mt-6 mx-2 md:mx-0 rounded-lg shadow-md bg-white dark:bg-gray-700" id="result-{{= it.index }}">
<h2 class="text-4xl font-semibold text-slate-800 dark:text-slate-200">
<a href="{{= it.permalink }}">{{! it.title }}</a>
</h2>
<h3 class="my-4 text-large text-slate-600 dark:text-slate-300">
{{! it.snippet }}
</h3>
<ul class="flex flex-row flex-wrap text-slate-500 dark:text-slate-300">
{{~ it.categories :v }}
<li>
<span
class="text-sm mr-2 px-2 py-1 rounded border border-emerald-800 bg-emerald-800 text-slate-50">
{{!v}}
</span>
</li>
{{~}}
{{~ it.tags :v }}
<li>
<span
class="flex flex-row text-sm mr-2 py-1">
{{= it.tagIcon }}
<span class="ml-0">{{!v}}</span>
</span>
</li>
{{~}}
</ul>
</article>
`;
function showResult(keywords2, result) {
const templateFn = doT.template(resultTemplate);
const tagIcon = document.getElementById("tag-icon").innerHTML;
resultContainer.innerHTML = "";
for (const [index, entry] of result.entries()) {
const item = entry.item;
const content = entry.item.content;
item.snippet = content.substring(0, searchOptions.summaryInclude * 2) + "…";
item.tagIcon = tagIcon;
item.index = index;
resultContainer.innerHTML += templateFn(item);
}
const instance = new Mark(resultContainer);
instance.mark(keywords2);
}
})();
})();