/
search.js
65 lines (55 loc) · 1.95 KB
/
search.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
---
layout: compress-js
---
(function() {
'use strict';
const client = algoliasearch('5IGTHBX5JS', '7f7511d659569fcede7653d568b3206c');
const index = client.initIndex('blog_eleven');
const searchInput = document.getElementById('js-algolia__input');
const lang = window.site && window.site.lang;
moment.locale(lang || 'en');
function onQueryChange() {
const contentId = document.getElementById('js-content');
const contentSearchId = document.getElementById('js-content-search');
contentId.style.display = 'none';
contentSearchId.style.display = 'block';
if (!searchInput.value) {
contentId.style.display = 'block';
contentSearchId.style.display = 'none';
return;
}
index.search(searchInput.value, (err, content) => {
let htmlArticle = Object.keys(content.hits).reduce((article, key) => {
const hit = content.hits[key];
if (hit.type !== 'document' || hit.layout === 'author') {
return article;
}
const hitDate = moment(hit.date, 'YYYY-MM-DD HH:mm:ss ZZ');
return article + `
<div class="posts-teaser slice">
<div class="container">
<h2 class="posts-title">
<a class="no-link-style" href="${hit.url}">${hit.title}</a>
</h2>
<time class="posts-date meta">
<span class="meta-content">${hitDate.format('MMMM DD, YYYY')}</span>
</time>
<p class="excerpt">${hit.excerpt}</p>
<a class="button" href="${hit.url}">Lire l'article</a>
</div>
</div>
`;
}, '');
htmlArticle += `
<div class="container search-logo">
search by
<a href="https://algolia.com" target="_blank">
<span class="search-logo-bg"></span>
</a>
</div>
`;
contentSearchId.innerHTML = htmlArticle;
});
}
searchInput.addEventListener('keyup', onQueryChange);
})();