feat(search): add more params for search and improve search index (#279)

.github/ISSUE_TEMPLATE/config.yml

@@ -1,5 +1,5 @@
 blank_issues_enabled: false
 contact_links:
-  - name: Theme Documentation
+  - name: Theme Documentation 主题文档
     url: https://hugoloveit.com/categories/documentation/
-    about: Please read the documentation carefully.
+    about: Please read the documentation carefully. 请先仔细阅读主题文档.

.github/ISSUE_TEMPLATE/feature-request.md

@@ -9,13 +9,13 @@ assignees: dillonzq
 
 ### Describe the feature you want 描述你的功能需求
 
-- Feature 1
-  I want this feature to solve ...
-- Feature 2
-  I want this feature to solve ...
+- Feature 1 功能需求 1
+  I want this feature to solve ... 我希望这个功能解决 ...
+- Feature 2 功能需求 2
+  I want this feature to solve ... 我希望这个功能解决 ...
 - ...
 
 ### Useful reference 有价值的参考
 
 If available, provide useful links to fulfill the feature.
-如果可以的话, 提供实现这个功能的参考链接.
+如果可以的话, 提供实现这个功能的相关参考链接.

README.md

@@ -113,14 +113,13 @@ I hope you will LoveIt ❤️!
 * **Dynamic scroll** supported by [Smooth Scroll](https://github.com/cferdinandi/smooth-scroll)
 * ...
 
-## Documentation
+## [Documentation](https://hugoloveit.com/categories/documentation/)
 
-* [Documentation Page](https://hugoloveit.com/categories/documentation/)
-* Build Documentation Locally:
+Build Documentation Locally:
 
-    ```bash
-    hugo server --source=exampleSite
-    ```
+```bash
+hugo server --source=exampleSite
+```
 
 ## Multilingual and i18n
 
@@ -134,6 +133,10 @@ LoveIt supports the following languages:
 * Italian
 * [Contribute with a new language](https://github.com/dillonzq/LoveIt/pulls)
 
+[Languages Compatibility](https://hugoloveit.com/theme-documentation-basics/#language-compatibility)
+
+## [Roadmap](https://github.com/dillonzq/LoveIt/projects/1)
+
 ## Questions, ideas, bugs, pull requests
 
 All feedback is welcome! Head over to the [issue tracker](https://github.com/dillonzq/LoveIt/issues).

README.zh-cn.md

@@ -108,14 +108,13 @@
 * 支持基于 [Smooth Scroll](https://github.com/cferdinandi/smooth-scroll) 的**滚动动画**
 * ...
 
-## 文档
+## [文档](https://hugoloveit.com/zh-cn/categories/documentation/)
 
-* [文档页面](https://hugoloveit.com/zh-cn/categories/documentation/)
-* 在本地构建文档:
+在本地构建文档:
 
-    ```bash
-    hugo server --source=exampleSite
-    ```
+```bash
+hugo server --source=exampleSite
+```
 
 ## 多语言和国际化
 
@@ -129,6 +128,10 @@ LoveIt 支持下列语言:
 * 意大利语
 * [贡献一种新的语言](https://github.com/dillonzq/LoveIt/pulls)
 
+[语言兼容性](https://hugoloveit.com/zh-cn/theme-documentation-basics/#language-compatibility)
+
+## [路线图](https://github.com/dillonzq/LoveIt/projects/1)
+
 ## 问题、想法、 bugs 和 PRs
 
 所有的反馈都是欢迎的！详见 [issue tracker](https://github.com/dillonzq/LoveIt/issues)。

exampleSite/config.toml

@@ -114,10 +114,14 @@ enableEmoji = true
         enable = true
         # type of search engine ("lunr", "algolia")
         type = "algolia"
-        # index length of the content
+        # max index length of the chunked content
         contentLength = 5000
         # placeholder of the search bar
         placeholder = ""
+        # max number of results length
+        maxResultLength = 10
+        # HTML tag name of the highlight part in results
+        highlightTag = "em"
         [languages.en.params.search.algolia]
           index = "index.en"
           appID = "PASDMWALPK"
@@ -303,10 +307,14 @@ enableEmoji = true
         enable = true
         # 搜索引擎的类型 ("lunr", "algolia")
         type = "algolia"
-        # 文章内容索引长度
+        # 文章内容最长索引长度
         contentLength = 5000
         # 搜索框的占位提示语
         placeholder = ""
+        # 最大结果数目
+        maxResultLength = 10
+        # 搜索结果中高亮部分的 HTML 标签
+        highlightTag = "em"
         [languages.zh-cn.params.search.algolia]
           index = "index.zh-cn"
           appID = "PASDMWALPK"
@@ -488,10 +496,14 @@ enableEmoji = true
         enable = true
         # type of search engine ("lunr", "algolia")
         type = "algolia"
-        # index length of the content
+        # max index length of the chunked content
         contentLength = 5000
         # placeholder of the search bar
         placeholder = ""
+        # max number of results length
+        maxResultLength = 10
+        # HTML tag name of the highlight part in results
+        highlightTag = "em"
         [languages.fr.params.search.algolia]
           index = "index.fr"
           appID = "PASDMWALPK"

exampleSite/content/posts/theme-documentation-basics.en.md

@@ -221,10 +221,14 @@ Please open the code block below to view the complete sample configuration :(far
     enable = true
     # type of search engine ("lunr", "algolia")
     type = "lunr"
-    # index length of the content
+    # max index length of the chunked content
     contentLength = 5000
     # placeholder of the search bar
     placeholder = ""
+    # {{< version 0.2.1 >}} max number of results length
+    maxResultLength = 10
+    # {{< version 0.2.1 >}} HTML tag name of the highlight part in results
+    highlightTag = "em"
     [params.search.algolia]
       index = ""
       appID = ""
@@ -955,25 +959,35 @@ Here is the search configuration in your [site configuration](#site-configuratio
   enable = true
   # type of search engine ("lunr", "algolia")
   type = "lunr"
-  # index length of the content
+  # max index length of the chunked content
   contentLength = 5000
+  # placeholder of the search bar
+  placeholder = ""
+  # {{< version 0.2.1 >}} max number of results length
+  maxResultLength = 10
+  # {{< version 0.2.1 >}} HTML tag name of the highlight part in results
+  highlightTag = "em"
   [params.search.algolia]
     index = ""
     appID = ""
     searchKey = ""
 ```
 
-{{< admonition note "How to choose the type of search engine?" >}}
+{{< admonition note "How to choose search engine?" >}}
 The following is a comparison of two search engines:
 
 * `lunr`: simple, no need to synchronize `index.json`, no limit for `contentLength`,
   but high bandwidth and low performance (Especially for Chinese which needs a large segmentit library)
 * `algolia`: high performance and low bandwidth, but need to synchronize `index.json` and limit for `contentLength`
+
+{{< version 0.2.1 >}} The content of the post is separated by `h2` HTML tag to improve query performance and basically implement full-text search.
+`contentLength` is used to limit the max index length of the part starting with `h2` HTML tag.
 {{< /admonition >}}
 
 {{< admonition tip "Tips about algolia" >}}
 You need to upload `index.json` files to algolia to activate searching.
-You could upload the `index.json` files by browsers but a script may be a better choice.
+You could upload the `index.json` files by browsers but a CLI tool may be better.
+[Algolia Atomic](https://github.com/chrisdmacrae/atomic-algolia) is a good choice.
 To be compatible with Hugo multilingual mode,
 you need to upload different `index.json` for each language to the different index of algolia, such as `zh-cn/index.json` or `fr/index.json`...
 {{< /admonition >}}

exampleSite/content/posts/theme-documentation-basics.fr.md

@@ -226,10 +226,14 @@ Please open the code block below to view the complete sample configuration :(far
     enable = true
     # type of search engine ("lunr", "algolia")
     type = "lunr"
-    # index length of the content
+    # max index length of the chunked content
     contentLength = 5000
     # placeholder of the search bar
     placeholder = ""
+    # {{< version 0.2.1 >}} max number of results length
+    maxResultLength = 10
+    # {{< version 0.2.1 >}} HTML tag name of the highlight part in results
+    highlightTag = "em"
     [params.search.algolia]
       index = ""
       appID = ""
@@ -960,25 +964,35 @@ Here is the search configuration in your [site configuration](#site-configuratio
   enable = true
   # type of search engine ("lunr", "algolia")
   type = "lunr"
-  # index length of the content
+  # max index length of the chunked content
   contentLength = 5000
+  # placeholder of the search bar
+  placeholder = ""
+  # {{< version 0.2.1 >}} max number of results length
+  maxResultLength = 10
+  # {{< version 0.2.1 >}} HTML tag name of the highlight part in results
+  highlightTag = "em"
   [params.search.algolia]
     index = ""
     appID = ""
     searchKey = ""
 ```
 
-{{< admonition note "How to choose the type of search engine?" >}}
+{{< admonition note "How to choose search engine?" >}}
 The following is a comparison of two search engines:
 
 * `lunr`: simple, no need to synchronize `index.json`, no limit for `contentLength`,
   but high bandwidth and low performance (Especially for Chinese which needs a large segmentit library)
 * `algolia`: high performance and low bandwidth, but need to synchronize `index.json` and limit for `contentLength`
+
+{{< version 0.2.1 >}} The content of the post is separated by `h2` HTML tag to improve query performance and basically implement full-text search.
+`contentLength` is used to limit the max index length of the part starting with `h2` HTML tag.
 {{< /admonition >}}
 
 {{< admonition tip "Tips about algolia" >}}
 You need to upload `index.json` files to algolia to activate searching.
-You could upload the `index.json` files by browsers but a script may be a better choice.
+You could upload the `index.json` files by browsers but a CLI tool may be better.
+[Algolia Atomic](https://github.com/chrisdmacrae/atomic-algolia) is a good choice.
 To be compatible with Hugo multilingual mode,
 you need to upload different `index.json` for each language to the different index of algolia, such as `zh-cn/index.json` or `fr/index.json`...
 {{< /admonition >}}

exampleSite/content/posts/theme-documentation-basics.zh-cn.md

@@ -224,10 +224,14 @@ hugo
     enable = true
     # 搜索引擎的类型 ("lunr", "algolia")
     type = "lunr"
-    # 文章内容索引长度
+    # 文章内容最长索引长度
     contentLength = 5000
     # 搜索框的占位提示语
     placeholder = ""
+    # 最大结果数目
+    maxResultLength = 10
+    # 搜索结果中高亮部分的 HTML 标签
+    highlightTag = "em"
     [params.search.algolia]
       index = ""
       appID = ""
@@ -938,7 +942,7 @@ defaultContentLanguage = "zh-cn"
 
 {{< version 0.2.0 >}}
 
-基于 [Lunr.js](https://lunrjs.com/) 或 [algolia](https://www.algolia.com/), **LoveIt** 主支持搜索功能.
+基于 [Lunr.js](https://lunrjs.com/) 或 [algolia](https://www.algolia.com/), **LoveIt** 主题支持搜索功能.
 
 ### 5.1 输出配置
 
@@ -958,24 +962,34 @@ defaultContentLanguage = "zh-cn"
 ```toml
 [params.search]
   enable = true
-  # type of search engine ("lunr", "algolia")
+  # 搜索引擎的类型 ("lunr", "algolia")
   type = "lunr"
-  # index length of the content
+  # 文章内容最长索引长度
   contentLength = 5000
+  # 搜索框的占位提示语
+  placeholder = ""
+  # 最大结果数目
+  maxResultLength = 10
+  # 搜索结果中高亮部分的 HTML 标签
+  highlightTag = "em"
   [params.search.algolia]
     index = ""
     appID = ""
     searchKey = ""
 ```
 
-{{< admonition note "怎样选择搜索引擎的类型?" >}}
+{{< admonition note "怎样选择搜索引擎?" >}}
 以下是两种搜索引擎的对比:
 
 * `lunr`: 简单, 无需同步 `index.json`, 没有 `contentLength` 的限制, 但占用带宽大且性能低 (特别是中文需要一个较大的分词依赖库)
 * `algolia`: 高性能并且占用带宽低, 但需要同步 `index.json` 且有 `contentLength` 的限制
+
+{{< version 0.2.1 >}} 文章内容被 `h2` HTML 标签切分来提供查询效果并且基本实现全文搜索.
+`contentLength` 用来限制 `h2` HTML 标签开头的内容部分的最大长度.
 {{< /admonition >}}
 
 {{< admonition tip "关于 algolia 的使用技巧" >}}
-你需要上传 `index.json` 到 algolia 来激活搜索功能. 你可以使用浏览器来上传 `index.json` 文件但是一个自动化的脚本可能是更好的选择.
+你需要上传 `index.json` 到 algolia 来激活搜索功能. 你可以使用浏览器来上传 `index.json` 文件但是一个自动化的脚本可能效果更好.
+[Algolia Atomic](https://github.com/chrisdmacrae/atomic-algolia) 是一个不错的选择.
 为了兼容 Hugo 的多语言模式, 你需要上传不同语言的 `index.json` 文件到对应的 algolia index, 例如 `zh-cn/index.json` 或 `fr/index.json`...
 {{< /admonition >}}

layouts/index.json

@@ -6,16 +6,25 @@
     {{- $pages = where $pages "Params.hiddenfromsearch" "!=" true -}}
 {{- end -}}
 {{- range $pages -}}
-    {{- $one := dict "objectID" .RelPermalink "uri" .RelPermalink "title" .Title "description" (.Description | default "") -}}
-    {{- $tags := .Params.tags | default slice -}}
-    {{- $one = delimit $tags "\n" | dict "tags" | merge $one -}}
-    {{- $publish_date := .PublishDate.Format (.Site.Params.dateFormat | default "2006-01-02") -}}
-    {{- $one = dict "date" $publish_date | merge $one -}}
-    {{- $content := .RawContent | htmlEscape -}}
-    {{- if gt .Site.Params.search.contentLength 0 -}}
-        {{- $content = substr $content 0 .Site.Params.search.contentLength -}}
+    {{- $uri := .RelPermalink -}}
+    {{- $meta := dict "uri" $uri "title" .Title "tags" .Params.tags "categories" .Params.categories -}}
+    {{- $meta = .PublishDate.Format ($.Site.Params.dateFormat | default "2006-01-02") | dict "date" | merge $meta -}}
+    {{- with .Description -}}
+        {{- $index = $index | append (dict "content" . "objectID" $uri | merge $meta) -}}
+    {{- end -}}
+    {{- $params := .Params | merge $.Site.Params.page -}}
+    {{- $content := dict "content" .Content "ruby" $params.ruby "fraction" $params.fraction "fontawesome" $params.fontawesome | partial "function/content.html" -}}
+    {{- range $i, $chunked := split $content "<h2 id=" -}}
+        {{- if gt $i 0 -}}
+            {{- $chunked = printf "<h2 id=%s" $chunked -}}
+        {{- end -}}
+        {{- $chunked = $chunked | plainify | htmlUnescape | replaceRE `[\n ]+` ` ` -}}
+        {{- if gt $.Site.Params.search.contentLength 0 -}}
+            {{- $chunked = substr $chunked 0 $.Site.Params.search.contentLength -}}
+        {{- end -}}
+        {{- $one := printf "%s:%d" $uri $i | dict "content" $chunked "objectID" | merge $meta -}}
+        {{- $index = $index | append $one -}}
     {{- end -}}
-    {{- $one = dict "content" $content | merge $one -}}
-    {{- $index = $index | append $one -}}
 {{- end -}}
+
 {{- $index | jsonify | safeJS -}}

layouts/partials/assets.html

@@ -167,6 +167,10 @@
     {{- partial "plugin/stylesheet.html" . -}}
 {{- end -}}
 
+{{- with (.Scratch.Get "this").styleArr -}}
+    <style>{{ delimit . "" | safeCSS }}</style>
+{{- end -}}
+
 <script type="text/javascript">
     window.config = {{ $config | jsonify | safeJS }};
 </script>

layouts/shortcodes/echarts.html

@@ -3,4 +3,4 @@
 {{- $width := cond .IsNamedParams (.Get "width") (.Get 0) | default "100%" -}}
 {{- $height := cond .IsNamedParams (.Get "height") (.Get 1) | default "30rem" -}}
 <div class="echarts" id="{{ $id }}" style="width: {{ $width }}; height: {{ $height }};"></div>
-{{- dict "echarts" true | merge (.Page.Scratch.Get "this") | .Page.Scratch.Set "this" -}}
+{{- .Page.Scratch.SetInMap "this" "echarts" true -}}

layouts/shortcodes/mapbox.html

@@ -30,4 +30,4 @@
 {{- $options := dict "lng" $lng "lat" $lat "zoom" $zoom "marked" $marked "lightStyle" $lightStyle "darkStyle" $darkStyle "geolocate" $geolocate "navigation" $navigation "scale" $scale "fullscreen" $fullscreen -}}
 {{- $id := partial "function/id.html" (dict "content" $options "scratch" .Page.Scratch) -}}
 <div class="mapbox" id="{{ $id }}" style="width: {{ $width }}; height: {{ $height }};"></div>
-{{- dict "mapbox" true | merge (.Page.Scratch.Get "this") | .Page.Scratch.Set "this" -}}
+{{- .Page.Scratch.SetInMap "this" "mapbox" true -}}

layouts/shortcodes/mermaid.html

@@ -1,3 +1,3 @@
 {{- $id := partial "function/id.html" (dict "content" (trim .Inner "\n") "scratch" .Page.Scratch) -}}
 <div class="mermaid" id="{{ $id }}"></div>
-{{- dict "mermaid" true | merge (.Page.Scratch.Get "this") | .Page.Scratch.Set "this" -}}
+{{- .Page.Scratch.SetInMap "this" "mermaid" true -}}

layouts/shortcodes/music.html

@@ -39,4 +39,4 @@
 {{- else -}}
     <meting-js server="{{ .Get 0 }}" type="{{ .Get 1 }}" id="{{ .Get 2 }}" theme="{{ $theme }}"></meting-js>
 {{- end -}}
-{{- dict "music" true | merge (.Page.Scratch.Get "this") | .Page.Scratch.Set "this" -}}
+{{- .Page.Scratch.SetInMap "this" "music" true -}}

layouts/shortcodes/style.html

@@ -1,8 +1,10 @@
 {{- $content := .Inner | .Page.RenderString -}}
 {{- $id := partial "function/id.html" (dict "content" $content) -}}
 {{- $tag := .Get 1 | default "div" -}}
+{{- printf `<%s id="%s">%s</%s>` $tag $id $content $tag | safeHTML -}}
+
 {{- $style := .Get 0 | printf "#%s{%s}" $id -}}
 {{- $res := resources.FromString (printf "temp/%s.scss" $id) $style -}}
 {{- $res = $res | toCSS (dict "targetPath" (printf "temp/%s.css" $id)) -}}
-{{- printf `<%s id="%s">%s</%s>` $tag $id $content $tag | safeHTML -}}
-<style>{{ $res.Content | safeCSS }}</style>
+{{- $styleArr := (.Page.Scratch.Get "this").styleArr | default slice -}}
+{{- $styleArr | append $res.Content | .Page.Scratch.SetInMap "this" "styleArr" -}}