Fix highlight style not loaded and fix console error when no search box

Close #614
This commit is contained in:
George Cushen committed 2018-08-01 22:21:04 +01:00
1 parent efc201cf0c
commit 46ba1bb8e3
3 files changed
+68 -62

No files matched your search

+4
View File
@@ -82,3 +82,7 @@
version = "2.9.0"
sri = "sha256-0vcZrdMQksHcHrY60tPnVK71jnB3wX/JpMcah5BffjA="
url = "https://cdnjs.cloudflare.com/ajax/libs/instantsearch.js/%s/instantsearch-theme-algolia.min.css"
[css.highlight]
version = "9.12.0"
sri = "" # No SRI as highlight style is determined at run time.
url = "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/%s/styles/%s.min.css"
+60 -58
View File
@@ -69,72 +69,74 @@
{{ printf "<script src=\"%s\" integrity=\"%s\" crossorigin=\"anonymous\"></script>" (printf $js.instantsearch.url $js.instantsearch.version) $js.instantsearch.sri | safeHTML }}
{{ end }}
<script>
const content_type = {
'post': {{ i18n "posts" }},
'project': {{ i18n "projects" }},
'publication' : {{ i18n "publications" }},
'talk' : {{ i18n "talks" }}
};
if ( $('#search-box').length ) {
const content_type = {
'post': {{ i18n "posts" }},
'project': {{ i18n "projects" }},
'publication' : {{ i18n "publications" }},
'talk' : {{ i18n "talks" }}
};
function getTemplate(templateName) {
return document.querySelector(`#${templateName}-template`).innerHTML;
}
const options = {
appId: {{ .Site.Params.search.algolia.app_id }},
apiKey: {{ .Site.Params.search.algolia.api_key }},
indexName: {{ .Site.Params.search.algolia.index_name }},
routing: true,
searchParameters: {
hitsPerPage: 10
},
searchFunction: function(helper) {
let searchResults = document.querySelector('#search-hits')
if (helper.state.query === '') {
searchResults.style.display = 'none';
return;
}
helper.search();
searchResults.style.display = 'block';
function getTemplate(templateName) {
return document.querySelector(`#${templateName}-template`).innerHTML;
}
};
const search = instantsearch(options);
// Initialize search box.
search.addWidget(
instantsearch.widgets.searchBox({
container: '#search-box',
placeholder: {{ i18n "search_placeholder" }}
})
);
// Initialize search results.
search.addWidget(
instantsearch.widgets.infiniteHits({
container: '#search-hits',
templates: {
empty: '<div class="search-no-results">' + {{ i18n "search_no_results" }} + '</div>',
item: getTemplate('search-hit')
const options = {
appId: {{ .Site.Params.search.algolia.app_id }},
apiKey: {{ .Site.Params.search.algolia.api_key }},
indexName: {{ .Site.Params.search.algolia.index_name }},
routing: true,
searchParameters: {
hitsPerPage: 10
},
cssClasses: {
showmoreButton: 'btn btn-primary btn-outline'
searchFunction: function(helper) {
let searchResults = document.querySelector('#search-hits')
if (helper.state.query === '') {
searchResults.style.display = 'none';
return;
}
helper.search();
searchResults.style.display = 'block';
}
})
);
};
// On render search results, localize the content type metadata.
search.on('render', function() {
$('.search-hit-type').each(function( index ) {
let content_key = $( this ).text();
if (content_key in content_type) {
$( this ).text(content_type[content_key]);
}
const search = instantsearch(options);
// Initialize search box.
search.addWidget(
instantsearch.widgets.searchBox({
container: '#search-box',
placeholder: {{ i18n "search_placeholder" }}
})
);
// Initialize search results.
search.addWidget(
instantsearch.widgets.infiniteHits({
container: '#search-hits',
templates: {
empty: '<div class="search-no-results">' + {{ i18n "search_no_results" }} + '</div>',
item: getTemplate('search-hit')
},
cssClasses: {
showmoreButton: 'btn btn-primary btn-outline'
}
})
);
// On render search results, localize the content type metadata.
search.on('render', function() {
$('.search-hit-type').each(function( index ) {
let content_key = $( this ).text();
if (content_key in content_type) {
$( this ).text(content_type[content_key]);
}
});
});
});
// Start search.
search.start();
// Start search.
search.start();
}
</script>
{{ end }}
+4 -4
View File
@@ -56,15 +56,15 @@
{{ else if isset .Site.Params "highlight" }}
{{ $scr.Set "highlight_enabled" .Site.Params.highlight }}
{{ end }}
{{ if $scr.Get "highlight_enabled" }}
{{ if ($scr.Get "highlight_enabled") }}
{{ $v := $css.highlight.version }}
{{ with .Site.Params.highlight_style }}
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/{{ $v }}/styles/{{ . }}.min.css">
{{ printf "<link rel=\"stylesheet\" href=\"%s\" crossorigin=\"anonymous\">" (printf $css.highlight.url $css.highlight.version .) | safeHTML }}
{{ else }}
{{ if eq ($scr.Get "light") true }}
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/{{ $v }}/styles/github.min.css">
{{ printf "<link rel=\"stylesheet\" href=\"%s\" crossorigin=\"anonymous\">" (printf $css.highlight.url $css.highlight.version "github") | safeHTML }}
{{ else }}
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/{{ $v }}/styles/dracula.min.css">
{{ printf "<link rel=\"stylesheet\" href=\"%s\" crossorigin=\"anonymous\">" (printf $css.highlight.url $css.highlight.version "dracula") | safeHTML }}
{{ end }}
{{ end }}
{{ end }}