9b753303df
as it is, trying to filter by the items in the array is frustrating as only the value is filtered on. this change allows for filtering on both.
53 lines
1.8 KiB
HTML
53 lines
1.8 KiB
HTML
<!-- banner -->
|
|
<div class="container section">
|
|
<div class="row">
|
|
<div class="col-lg-8 text-center mx-auto">
|
|
<h1 class="text-white mb-3">
|
|
{{ .Site.Params.banner.title | markdownify }}
|
|
</h1>
|
|
<p class="text-white mb-4">
|
|
{{ .Site.Params.banner.subtitle | markdownify }}
|
|
</p>
|
|
<div class="position-relative">
|
|
<input
|
|
id="search"
|
|
class="form-control"
|
|
placeholder="{{ .Site.Params.banner.placeholder }}"
|
|
/>
|
|
<i class="ti-search search-icon"></i>
|
|
<!-- Javascript -->
|
|
{{ $currentNode := . }} {{ $currentNode.Scratch.Set "pages" .Site.Pages
|
|
}} {{ $pages := ($currentNode.Scratch.Get "pages") }}
|
|
<script>
|
|
$.ui.autocomplete.filter = function (array, term) {
|
|
var matcher = new RegExp('(^| )' + $.ui.autocomplete.escapeRegex(term), 'i');
|
|
return $.grep(array, function (value) {
|
|
return matcher.test(value.label) || matcher.test(value.value) || matcher.test(value);
|
|
});
|
|
};
|
|
|
|
$(function() {
|
|
var projects = [
|
|
{{ range $pages }}
|
|
{
|
|
value: "{{ .Title }}",
|
|
label: "<p>{{.Plain}}</p>{{range.Params.Keywords}}<p>{{.}}</p>{{end}}",
|
|
url:"{{ .Permalink }}"
|
|
},
|
|
{{ end }}
|
|
];
|
|
$( "#search" ).autocomplete({
|
|
source: projects
|
|
})
|
|
.data( "ui-autocomplete" )._renderItem = function( ul, item ) {
|
|
return $( "<li>" )
|
|
.append( "<a href=" + item.url + " + \" "\" + >" + item.value + "</a>" + item.label )
|
|
.appendTo( ul );
|
|
};
|
|
});
|
|
</script>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- /banner -->
|