add search support using fusejs

assets/js/search.js

@@ -0,0 +1,24 @@
+import * as params from '@params';
+
+const search_input = document.querySelector("#search-input");
+const search_result = document.querySelector("#search-result");
+
+let fuse;
+
+window.onload = async function() {
+  const data = await fetch("../index.json").then(res => res.json());
+  const opts = params.search.fuse;
+  fuse = new Fuse(data, opts);
+}
+
+search_input.addEventListener("input", function () {
+  if (!fuse) return;
+  const results = fuse.search(this.value.trim());
+  let html = '';
+  if (results.length > 0) {
+    for (const v of results) {
+      html += `<li><a href="${v.item.permalink}">${v.item.title}</a></li>`;
+    }
+  }
+  search_result.innerHTML = html;
+})

assets/js/selectable.js

@@ -1,6 +1,8 @@
+import * as params from '@params';
+
 export function setup_selectable () {
-  const selectable = '{{ .Site.Params.selectable }}'
-  if (selectable === 'false') {
+  const selectable = params.selectable
+  if (!selectable) {
     document.documentElement.style = 'user-select:none'
   }
 }

assets/js/theme.js

@@ -1,7 +1,9 @@
-const comment = '{{ .Site.Params.comment.provider }}'
-const default_theme_config = '{{ .Site.Params.defaultTheme }}'
-const icon_light = '{{ index .Site.Params.switch 1 }}'
-const icon_dark = '{{ index .Site.Params.switch 0 }}'
+import * as params from '@params';
+
+const comment = params.comment.provider
+const default_theme_config = params.defaulttheme
+const icon_light = params.switch[1]
+const icon_dark = params.switch[0]
 const THEME_LIGHT = default_theme_config === 'system' ? 'light' : default_theme_config
 const THEME_DARK = 'dark'