51 lines
1.2 KiB
JavaScript
51 lines
1.2 KiB
JavaScript
let fuse
|
|
const fuseOptions = {
|
|
shouldSort: true,
|
|
includeMatches: true,
|
|
threshold: 0.0,
|
|
tokenize:true,
|
|
location: 0,
|
|
distance: 100,
|
|
maxPatternLength: 32,
|
|
minMatchCharLength: 1,
|
|
keys: [
|
|
{name:"title",weight:0.8},
|
|
{name:"contents",weight:0.5},
|
|
{name:"tags",weight:0.3},
|
|
{name:"categories",weight:0.3}
|
|
]
|
|
}
|
|
|
|
window.onload = function () {
|
|
fetch('/db/db.json')
|
|
.then(resp => resp.json())
|
|
.then(data => {
|
|
fuse = new Fuse(data, fuseOptions)
|
|
})
|
|
}
|
|
|
|
const input = document.getElementById('searchInput')
|
|
const results = document.getElementById('searchResults')
|
|
|
|
input.addEventListener('keyup', (e) => {
|
|
const items = fuse.search(e.target.value)
|
|
|
|
if (items.length > 0) {
|
|
let itemList = ''
|
|
|
|
for (let i in items) {
|
|
itemList += `<div class="resultItem">`
|
|
+ `<div class="resultItem__media" style="background-image: url(${items[i].item.image});"></div>`
|
|
+ `<div class="resultItem__body">`
|
|
+ `<h3 class="resultItem__title"><a href="${items[i].item.permalink}">${items[i].item.title}</a></h3>`
|
|
+ `<div class="resultItem__footer">${items[i].item.date}</div>`
|
|
+ `</div>`
|
|
+ `</div>`
|
|
}
|
|
|
|
results.innerHTML = itemList
|
|
} else {
|
|
results.innerHTML = ''
|
|
}
|
|
})
|