Improve search settings

assets/book.scss

@@ -139,20 +139,20 @@ ul.pagination {
 
 .book-search {
   #book-search-input {
+    opacity: .33;
+
     border: 0;
-    border-bottom: $padding-1 solid $gray-200;
+    border-bottom: $padding-1 solid $body-font-color;
     outline: none;
 
     padding: $padding-4 $padding-8 $padding-4 $padding-16 + $padding-4;
-    margin-bottom: $padding-4;
-
     width: 85%;
   
     background: url("svg/search.svg") left center no-repeat;
     background-size: $padding-16;
 
     &:focus {
-      border-bottom-color: $body-font-color;
+      opacity: 1;
     }
   }
 

assets/search-data.js

@@ -14,9 +14,9 @@
   window.bookSearch = {
     pages: pages,
     idx: lunr(function() { 
-      this.ref('idx');
-      this.field('title');
-      this.field('content');
+      this.ref("idx");
+      this.field("title", { boost: 10000 });
+      this.field("content");
 
       pages.forEach(this.add, this);
     }),

assets/search.js

@@ -6,14 +6,12 @@
   const dummy = document.querySelector("#book-search-dummy");
 
   input.addEventListener("focus", init);
+  input.addEventListener("keyup", search);
 
   function init() {
     loadScript("{{ "lunr.min.js" | relURL }}")
-    loadScript("{{ $searchData.RelPermalink }}", function() {
-      input.disabled = false;
-      input.addEventListener("keyup", search);
-      search();
-    });
+    loadScript("{{ $searchData.RelPermalink }}", search);
+
     input.removeEventListener("focus", init);
   }
 
@@ -22,9 +20,25 @@
       results.removeChild(results.firstChild);
     }
 
-    if (input.value) {
-      const hits = window.bookSearch.idx.search(`${input.value}*`);
-      hits.slice(0, 10).forEach(function(hit) {
+    if (!input.value || !window.bookSearch) {
+      return
+    }
+
+    const terms = lunr.tokenizer(input.value);
+    const searchHits = window.bookSearch.idx.query(function(query) {
+      query.term(terms, {
+        boost: 100,
+      });
+      query.term(terms, {
+        boost: 10,
+        wildcard: lunr.Query.wildcard.LEADING | lunr.Query.wildcard.TRAILING,
+      });
+      query.term(terms, {
+        editDistance: 2
+      });
+    });
+
+    searchHits.slice(0, 10).forEach(function(hit) {
       const page = window.bookSearch.pages[hit.ref];
       const li = dummy.querySelector("li").cloneNode(true),
             a = li.querySelector("a");
@@ -35,7 +49,6 @@
       results.appendChild(li);
     });
   }
-  }
 
   function loadScript(src, callback) {
     const script = document.createElement("script");

exampleSite/resources/_gen/assets/js/search-data.js_da973b2166501f614a67d55884e62fdb.json

@@ -1 +1 @@
-{"Target":"search-data.min.cab714d6cdc1fd81a6e2d8e454a03c6b8c74b4680118a20d06f2f4cc11365cdf.js","MediaType":"application/javascript","Data":{"Integrity":"sha256-yrcU1s3B/YGm4tjkVKA8a4x0tGgBGKINBvL0zBE2XN8="}}
+{"Target":"search-data.min.34183091f91a205581bbdcc247f638b72d22f51e34ab573b24519f95c4a92895.js","MediaType":"application/javascript","Data":{"Integrity":"sha256-NBgwkfkaIFWBu9zCR/Y4ty0i9R40q1c7JFGflcSpKJU="}}

exampleSite/resources/_gen/assets/js/search.js_db9e329433ffca0798ed12c88043b3b3.content

@@ -1,5 +1,6 @@
-(function(){const input=document.querySelector("#book-search-input");const results=document.querySelector("#book-search-results");const dummy=document.querySelector("#book-search-dummy");input.addEventListener("focus",init);function init(){loadScript("/example/lunr.min.js")
-loadScript("/example/search-data.min.cab714d6cdc1fd81a6e2d8e454a03c6b8c74b4680118a20d06f2f4cc11365cdf.js",function(){input.disabled=false;input.addEventListener("keyup",search);search();});input.removeEventListener("focus",init);}
+(function(){const input=document.querySelector("#book-search-input");const results=document.querySelector("#book-search-results");const dummy=document.querySelector("#book-search-dummy");input.addEventListener("focus",init);input.addEventListener("keyup",search);function init(){loadScript("/example/lunr.min.js")
+loadScript("/example/search-data.min.34183091f91a205581bbdcc247f638b72d22f51e34ab573b24519f95c4a92895.js",search);input.removeEventListener("focus",init);}
 function search(){while(results.firstChild){results.removeChild(results.firstChild);}
-if(input.value){const hits=window.bookSearch.idx.search(`${input.value}*`);hits.slice(0,10).forEach(function(hit){const page=window.bookSearch.pages[hit.ref];const li=dummy.querySelector("li").cloneNode(true),a=li.querySelector("a");a.href=page.href;a.textContent=page.title;results.appendChild(li);});}}
+if(!input.value||!window.bookSearch){return}
+const terms=lunr.tokenizer(input.value);const searchHits=window.bookSearch.idx.query(function(query){query.term(terms,{boost:100,});query.term(terms,{boost:10,wildcard:lunr.Query.wildcard.LEADING|lunr.Query.wildcard.TRAILING,});query.term(terms,{editDistance:2});});searchHits.slice(0,10).forEach(function(hit){const page=window.bookSearch.pages[hit.ref];const li=dummy.querySelector("li").cloneNode(true),a=li.querySelector("a");a.href=page.href;a.textContent=page.title;results.appendChild(li);});}
 function loadScript(src,callback){const script=document.createElement("script");script.defer=true;script.src=src;script.onload=callback;document.head.append(script);}})();

exampleSite/resources/_gen/assets/js/search.js_db9e329433ffca0798ed12c88043b3b3.json

@@ -1 +1 @@
-{"Target":"search.min.afa201b2745d9b5797e20db513cc1109f4ab834ef3290ffc160dc856c39654ee.js","MediaType":"application/javascript","Data":{"Integrity":"sha256-r6IBsnRdm1eX4g21E8wRCfSrg07zKQ/8Fg3IVsOWVO4="}}
+{"Target":"search.min.1f579a6bfcf647662ed7d1c6328560f89ac36825f447b8babab6da52f23738a7.js","MediaType":"application/javascript","Data":{"Integrity":"sha256-H1eaa/z2R2Yu19HGMoVg+JrDaCX0R7i6urbaUvI3OKc="}}

exampleSite/resources/_gen/assets/scss/book.scss_48b060fe05b0a273d182ef83c0605941.json

@@ -1 +1 @@
-{"Target":"book.min.86522616af955ba5e872c9c750ed949308f9065c096d3de681ff68732ba9d89d.css","MediaType":"text/css","Data":{"Integrity":"sha256-hlImFq+VW6XocsnHUO2Ukwj5BlwJbT3mgf9ocyup2J0="}}
+{"Target":"book.min.d957ded8b0d85eeacfd42502592de956866a48868f317cb69b9776c15309f870.css","MediaType":"text/css","Data":{"Integrity":"sha256-2Vfe2LDYXurP1CUCWS3pVoZqSIaPMXy2m5d2wVMJ+HA="}}