experimenting with algolia search

This commit is contained in:
Tom Johnson
2016-01-21 17:29:06 -08:00
parent ccc0490aad
commit fcae37b779
16 changed files with 1247 additions and 123 deletions

38
_includes/search.html Normal file
View File

@ -0,0 +1,38 @@
<div class="search">
<input type="text" placeholder="search...">
</div>
<div class="results">
<ul id="users"></ul>
</div>
<script src="http://cdn.jsdelivr.net/algoliasearch/3/algoliasearch.min.js"></script>
<script>
$(document).ready(function() {
var client = algoliasearch('{{site.algolia.application_id}}', '{{site.algolia.search_only_api_key}}');
var index = client.initIndex('{{site.algolia.index_name}}');
var $input = $('input');
$input.keyup(function() {
index.search($input.val(), {
hitsPerPage: 10,
facets: '*'
}, searchCallback);
}).focus();
});
function searchCallback(err, content) {
console.log(content);
if (err) {
console.error(err);
return;
}
var $users = $('#users');
$users.empty();
for (var i = 0; i < content.hits.length; i++) {
$users.append('<li> <a href="' + content.hits[i].url + '">' + content.hits[i].title + '</a></li>');
}
};
</script>

View File

@ -24,9 +24,9 @@
{% if subcategory.external_url %}
<li><a href="{{subcategory.external_url}}" target="_blank">{{subcategory.title}}</a></li>
{% elsif page.url == subcategory.url %}
<li class="active"><a href="{{subcategory.url | replace: "/",""}}">{{subcategory.title}}</a></li>
<li class="active"><a href="{{subcategory.url | prepend: ".."}}">{{subcategory.title}}</a></li>
{% else %}
<li><a href="{{subcategory.url | replace: "/",""}}">{{subcategory.title}}</a></li>
<li><a href="{{subcategory.url | prepend: ".."}}">{{subcategory.title}}</a></li>
{% endif %}
{% endif %}
{% endfor %}
@ -73,22 +73,22 @@
<li>
<!-- start search -->
<div id="search-demo-container">
<input type="text" id="search-input" placeholder="{{site.data.strings.search_placeholder_text}}">
<ul id="results-container"></ul>
</div>
<script src="../js/jekyll-search.js" type="text/javascript"></script>
<script type="text/javascript">
SimpleJekyllSearch.init({
searchInput: document.getElementById('search-input'),
resultsContainer: document.getElementById('results-container'),
dataSource: '../search.json',
searchResultTemplate: '<li><a href="{url}" title="{{page.title | replace: "'", "\"}}">{title}</a></li>',
noResultsText: '{{site.data.strings.search_no_results_text}}',
limit: 10,
fuzzy: true,
})
</script>
<!--<div id="search-demo-container">-->
<!--<input type="text" id="search-input" placeholder="{{site.data.strings.search_placeholder_text}}">-->
<!--<ul id="results-container"></ul>-->
<!--</div>-->
<!--<script src="../js/jekyll-search.js" type="text/javascript"></script>-->
<!--<script type="text/javascript">-->
<!--SimpleJekyllSearch.init({-->
<!--searchInput: document.getElementById('search-input'),-->
<!--resultsContainer: document.getElementById('results-container'),-->
<!--dataSource: '../search.json',-->
<!--searchResultTemplate: '<li><a href="{url}" title="{{page.title | replace: "'", "\"}}">{title}</a></li>',-->
<!--noResultsText: '{{site.data.strings.search_no_results_text}}',-->
<!--limit: 10,-->
<!--fuzzy: true,-->
<!--})-->
<!--</script>-->
<!-- end search -->
</li>
{% comment %}