algolia-indices/demo.js

78 строки
1.9 KiB
JavaScript
Исходник Постоянная ссылка Обычный вид История

2018-05-14 18:27:08 +03:00
const html = require('nanohtml')
2019-05-28 22:37:53 +03:00
const algoliasearch = require('algoliasearch')
const instantsearch = require('instantsearch.js').default
2018-05-14 18:27:08 +03:00
document.title = 'Electron Search'
const $main = html`
<main>
<div id="search-box"></div>
<div id="refinement-list"></div>
<div id="hits"></div>
</main>
`
2018-05-16 23:51:23 +03:00
const hitTemplate = `
{{#_highlightResult.icon64}}
2019-05-28 22:37:53 +03:00
<img src="https://electronjs.org/app-img/{{#helpers.highlight}}{ "attribute": "slug" }{{/helpers.highlight}}/{{#helpers.highlight}}{ "attribute": "icon64" }{{/helpers.highlight}}">
<b>{{#helpers.highlight}}{ "attribute": "name" }{{/helpers.highlight}}</b> -
{{#helpers.highlight}}{ "attribute": "description" }{{/helpers.highlight}}
2018-05-16 23:51:23 +03:00
{{/_highlightResult.icon64}}
2018-05-17 00:07:43 +03:00
2018-05-16 23:51:23 +03:00
{{^_highlightResult.icon64}}
2019-05-28 22:37:53 +03:00
{{{type.value}}}
<b>{{#helpers.highlight}}{ "attribute": "title" }{{/helpers.highlight}}</b> -
{{#helpers.highlight}}{ "attribute": "tldr" }{{/helpers.highlight}}
2018-05-16 23:51:23 +03:00
{{/_highlightResult.icon64}}
`
2018-05-14 18:27:08 +03:00
document.body.appendChild($main)
const search = instantsearch({
2019-05-28 22:37:53 +03:00
searchClient: algoliasearch('L9LD9GHGQJ', '24e7e99910a15eb5d9d93531e5682370'),
2018-05-14 18:27:08 +03:00
indexName: 'electron-apis',
routing: true
})
search.addWidget(
instantsearch.widgets.hits({
container: '#hits',
templates: {
empty: 'No results',
2018-05-16 23:51:23 +03:00
item: hitTemplate
},
2019-05-28 22:37:53 +03:00
transformItems: items =>
// eslint-disable-next-line
items.map(item => (console.log(item), {
...item
}))
2018-05-14 18:27:08 +03:00
})
)
search.addWidget(
instantsearch.widgets.searchBox({
container: '#search-box',
placeholder: 'Search Electron APIs'
})
)
search.addWidget(
instantsearch.widgets.refinementList({
container: '#refinement-list',
2019-05-28 22:37:53 +03:00
attribute: 'type',
2018-05-15 01:20:13 +03:00
limit: 10,
templates: {
header: 'Types'
}
2018-05-14 18:27:08 +03:00
})
)
search.start()
2018-05-15 01:20:13 +03:00
search.on('render', (...args) => {
2018-05-16 23:51:23 +03:00
// console.log('algolia render', args)
2018-05-15 01:20:13 +03:00
})
search.on('error', (...args) => {
console.log('algolia error', args)
})