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)
|
|
|
|
})
|