| | |
|---|
| | | import FlexSearch from "flexsearch" |
|---|
| | | import FlexSearch, { DefaultDocumentSearchResults } from "flexsearch" |
|---|
| | | import { ContentDetails } from "../../plugins/emitters/contentIndex" |
|---|
| | | import { registerEscapeHandler, removeAllChildren } from "./util" |
|---|
| | | import { FullSlug, normalizeRelativeURLs, resolveRelative } from "../../util/path" |
|---|
| | |
|---|
| | | title: string |
|---|
| | | content: string |
|---|
| | | tags: string[] |
|---|
| | | [key: string]: any |
|---|
| | | } |
|---|
| | | |
|---|
| | | // Can be expanded with things like "term" in the future |
|---|
| | | type SearchType = "basic" | "tags" |
|---|
| | | let searchType: SearchType = "basic" |
|---|
| | | let currentSearchTerm: string = "" |
|---|
| | | const encoder = (str: string) => str.toLowerCase().split(/([^a-z]|[^\x00-\x7F])/) |
|---|
| | | const encoder = (str: string) => { |
|---|
| | | return str |
|---|
| | | .toLowerCase() |
|---|
| | | .split(/\s+/) |
|---|
| | | .filter((token) => token.length > 0) |
|---|
| | | } |
|---|
| | | |
|---|
| | | let index = new FlexSearch.Document<Item>({ |
|---|
| | | charset: "latin:extra", |
|---|
| | | encode: encoder, |
|---|
| | | document: { |
|---|
| | | id: "id", |
|---|
| | |
|---|
| | | |
|---|
| | | // If search is active, then we will render the first result and display accordingly |
|---|
| | | if (!container.classList.contains("active")) return |
|---|
| | | if (e.key === "Enter") { |
|---|
| | | if (e.key === "Enter" && !e.isComposing) { |
|---|
| | | // If result has focus, navigate to that one, otherwise pick first result |
|---|
| | | if (results.contains(document.activeElement)) { |
|---|
| | | const active = document.activeElement as HTMLInputElement |
|---|
| | |
|---|
| | | itemTile.classList.add("result-card") |
|---|
| | | itemTile.id = slug |
|---|
| | | itemTile.href = resolveUrl(slug).toString() |
|---|
| | | itemTile.innerHTML = `<h3>${title}</h3>${htmlTags}${ |
|---|
| | | enablePreview && window.innerWidth > 600 ? "" : `<p>${content}</p>` |
|---|
| | | }` |
|---|
| | | itemTile.innerHTML = ` |
|---|
| | | <h3 class="card-title">${title}</h3> |
|---|
| | | ${htmlTags} |
|---|
| | | <p class="card-description">${content}</p> |
|---|
| | | ` |
|---|
| | | itemTile.addEventListener("click", (event) => { |
|---|
| | | if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey) return |
|---|
| | | hideSearch() |
|---|
| | |
|---|
| | | searchLayout.classList.toggle("display-results", currentSearchTerm !== "") |
|---|
| | | searchType = currentSearchTerm.startsWith("#") ? "tags" : "basic" |
|---|
| | | |
|---|
| | | let searchResults: FlexSearch.SimpleDocumentSearchResultSetUnit[] |
|---|
| | | let searchResults: DefaultDocumentSearchResults<Item> |
|---|
| | | if (searchType === "tags") { |
|---|
| | | currentSearchTerm = currentSearchTerm.substring(1).trim() |
|---|
| | | const separatorIndex = currentSearchTerm.indexOf(" ") |
|---|
| | |
|---|
| | | // return at least 10000 documents, so it is enough to filter them by tag (implemented in flexsearch) |
|---|
| | | limit: Math.max(numSearchResults, 10000), |
|---|
| | | index: ["title", "content"], |
|---|
| | | tag: tag, |
|---|
| | | tag: { tags: tag }, |
|---|
| | | }) |
|---|
| | | for (let searchResult of searchResults) { |
|---|
| | | searchResult.result = searchResult.result.slice(0, numSearchResults) |
|---|
