From 1f3addcca5bad9ed12ed3e1df7ba75859c650249 Mon Sep 17 00:00:00 2001 From: Alex Shpak Date: Tue, 16 Jul 2019 14:34:02 +0200 Subject: Implement search, loading on demand --- assets/search.js | 76 ++++++++++++++++++++++++++++++++------------------------ 1 file changed, 44 insertions(+), 32 deletions(-) (limited to 'assets/search.js') diff --git a/assets/search.js b/assets/search.js index 84e522a..63bb366 100644 --- a/assets/search.js +++ b/assets/search.js @@ -1,41 +1,53 @@ -addEventListener("load", function() { - let input = document.querySelector("#book-search"); - let results = document.querySelector("#book-search-results"); - - Promise.all([ - loadScript("{{ "lunr.min.js" | relURL }}"), - loadScript("{{ "index.json" | relURL }}") - ]).then(enableLunr); - - function enableLunr() { - results.idx = lunr(function() { - this.ref('href') - this.field('title') - this.field('content') - - window.lunrData.forEach(function (page) { - this.add(page) - }, this) +{{- $searchData := resources.Get "search-data.js" | resources.ExecuteAsTemplate "search-data.js" . | resources.Minify | resources.Fingerprint }} + +(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("{{ $searchData.RelPermalink }}", function() { + input.disabled = false; + input.addEventListener("keyup", search); + search(); }); - input.addEventListener("keyup", search); + input.removeEventListener("focus", init); } function search() { + while (results.firstChild) { + results.removeChild(results.firstChild); + } + if (input.value) { - var hits = results.idx.search(`${input.value}*`); - results.innerHTML = JSON.stringify(hits); - } else { - results.innerHTML = ''; + 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); + }); } } - function loadScript(src) { - return new Promise(function(resolve, reject) { - let script = document.createElement('script'); - script.src = src; - script.onload = () => resolve(script); - - document.head.append(script); - }); + function newLi(href, title) { + + + return li; + } + + function loadScript(src, callback) { + const script = document.createElement("script"); + script.defer = true; + script.src = src; + script.onload = callback; + + document.head.append(script); } -}); +})(); -- cgit v1.2.3