aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--layouts/_default/baseof.html2
-rw-r--r--layouts/_default/search.html10
-rw-r--r--layouts/_default/single.html5
-rw-r--r--static/js/search.js163
4 files changed, 89 insertions, 91 deletions
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 85993a1..7f7c5ae 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -6,5 +6,7 @@
{{- partial "header.html" . -}}
{{- block "main" . }}{{- end }}
{{- partial "footer.html" . -}}
+
+ {{- block "footerfiles" . }}{{- end }}
</body>
</html>
diff --git a/layouts/_default/search.html b/layouts/_default/search.html
index 7dd02df..817f4b5 100644
--- a/layouts/_default/search.html
+++ b/layouts/_default/search.html
@@ -8,7 +8,7 @@
{{ define "main" }}
<section class="bg-near-white">
<div class="mw7 center pv4" >
- <form action="{{ "search" | absURL }}">
+ <form action="{{ .Permalink }}">
<input id="search-query" name="s"/>
</form>
<div id="search-results">
@@ -20,9 +20,11 @@
<script id="search-result-template" type="text/x-js-template">
<div id="summary-${key}" class="bt bb b--black-10 ph4">
<h4><a href="${link}">${title}</a></h4>
- <p>${snippet}</p>
- ${ isset tags }<p>Tags: ${tags}</p>${ end }
- ${ isset categories }<p>Categories: ${categories}</p>${ end }
+ <p>${snippet}&hellip;</p>
+
+
+ ${ isset tags }<p><i class="fa fa-tags"></i> Tags: ${tags}</p>${ end }
+ ${ isset categories }<p><i class="fa fa-bookmark"></i> Categories: ${categories}</p>${ end }
</div>
</script>
{{ end }}
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 2d1cd68..1fab028 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -20,7 +20,8 @@
<footer class="mw7 center ph3 pb2 bt bb cf b--black-50">
{{ with .Params.tags }}
<div class="fl-ns w-50-ns mb2">
- <h5 class="f5 ttu black-60">Tagged in</h5>
+
+ <h5 class="f5 ttu black-60"><i class="fa fa-lg fa-tags"></i> Tagged in</h5>
{{ range . }}
<a class="f5 link br1 ph3 pv2 blue dib hover-bg-light-blue hover-white ba"
href="{{ $.Site.LanguagePrefix }}/tags/{{ . | urlize }}/">{{ . }}</a>
@@ -29,7 +30,7 @@
{{ end }}
<div class="fl-ns w-50-ns mb2">
- <h5 class="f5 ttu black-60">Share in Social Networks</h5>
+ <h5 class="f5 ttu black-60"><i class="fas fa-lg fa-share-alt"></i> Share in Social Networks</h5>
{{ range .Site.Params.sharingOptions }}
<a class="f4 link br1 ph3 pv2 blue dib hover-bg-light-blue hover-white ba" target="new" href="{{ printf .url $.Permalink }}">
<i class="fab {{ .icon }}"></i>
diff --git a/static/js/search.js b/static/js/search.js
index add8549..46627bc 100644
--- a/static/js/search.js
+++ b/static/js/search.js
@@ -1,108 +1,101 @@
summaryInclude=60;
-var fuseOptions = {
- shouldSort: true,
- includeMatches: true,
- threshold: 0.0,
- tokenize:true,
- location: 0,
- distance: 100,
- maxPatternLength: 32,
- minMatchCharLength: 1,
- keys: [
- {name:"title",weight:0.8},
- {name:"contents",weight:0.5},
- {name:"tags",weight:0.3},
- {name:"categories",weight:0.3}
- ]
+const fuseOptions = {
+ shouldSort: true,
+ includeMatches: true,
+ threshold: 0.0,
+ tokenize:true,
+ location: 0,
+ distance: 100,
+ maxPatternLength: 32,
+ minMatchCharLength: 2,
+ keys: [
+ {name:"title",weight:0.8},
+ {name:"contents",weight:0.5},
+ {name:"tags",weight:0.3},
+ {name:"categories",weight:0.3}
+ ]
};
+const getQueryByParam = param => decodeURIComponent(
+ (location.search.split(param + '=')[1] || '').split('&')[0]
+).replace(/\+/g, ' ')
+var searchQuery = getQueryByParam("s");
-var searchQuery = param("s");
if(searchQuery){
- $("#search-query").val(searchQuery);
- executeSearch(searchQuery);
+ $("#search-query").val(searchQuery);
+ executeSearch(searchQuery);
}else {
- $('#search-results').append("<p>Please enter a word or phrase above</p>");
+ $('#search-results').append("<p>Please enter a word or phrase above</p>");
}
function executeSearch(searchQuery){
- $.getJSON( "/index.json", function( data ) {
- var pages = data;
- var fuse = new Fuse(pages, fuseOptions);
- var result = fuse.search(searchQuery);
- console.log({"matches":result});
- if(result.length > 0){
- populateResults(result);
- }else{
- $('#search-results').append("<p>No matches found</p>");
- }
- });
+
+ fetch("/index.json")
+ .then(response => response.json())
+ .then(data => {
+ let fuse = new Fuse(data, fuseOptions);
+ let result = fuse.search(searchQuery);
+ console.log({"matches":result});
+ if(result.length > 0){
+ populateResults(result);
+ }else{
+ $('#search-results').append("<p>No matches found</p>");
+ }
+ });
}
function populateResults(result){
- $.each(result,function(key,value){
- var contents= value.item.contents;
- var snippet = "";
- var snippetHighlights=[];
- var tags =[];
- if( fuseOptions.tokenize ){
- snippetHighlights.push(searchQuery);
- }else{
- $.each(value.matches,function(matchKey,mvalue){
- if(mvalue.key == "tags" || mvalue.key == "categories" ){
- snippetHighlights.push(mvalue.value);
- }else if(mvalue.key == "contents"){
- start = mvalue.indices[0][0]-summaryInclude>0?mvalue.indices[0][0]-summaryInclude:0;
- end = mvalue.indices[0][1]+summaryInclude<contents.length?mvalue.indices[0][1]+summaryInclude:contents.length;
- snippet += contents.substring(start,end);
- snippetHighlights.push(mvalue.value.substring(mvalue.indices[0][0],mvalue.indices[0][1]-mvalue.indices[0][0]+1));
- }
- });
- }
+ result.forEach(d => console.log( d) )
- if(snippet.length<1){
- snippet += contents.substring(0,summaryInclude*2);
- }
- //pull template from hugo templarte definition
- var templateDefinition = $('#search-result-template').html();
- //replace values
- var output = render(templateDefinition,{key:key,title:value.item.title,link:value.item.permalink,tags:value.item.tags,categories:value.item.categories,snippet:snippet});
- $('#search-results').append(output);
+ $.each(result,function(key,value){
+ var contents= value.item.contents;
+ var snippet = "";
- $.each(snippetHighlights,function(snipkey,snipvalue){
- $("#summary-"+key).mark(snipvalue);
- });
+ if(snippet.length<1){
+ snippet += contents.substring(0,summaryInclude*2);
+ }
+ //pull template from hugo templarte definition
+ var templateDefinition = $('#search-result-template').html();
+ //replace values
+ var output = render(templateDefinition,{key:key,
+ title:value.item.title,
+ link:value.item.permalink,
+ tags:value.item.tags,
+ categories:value.item.categories,
+ snippet:snippet});
+ $('#search-results').append(output);
- });
-}
+ let snippetHighlights=[];
+ snippetHighlights.push(searchQuery);
+ snippetHighlights.forEach(value => $("#summary-"+key).mark(value));
-function param(name) {
- return decodeURIComponent((location.search.split(name + '=')[1] || '').split('&')[0]).replace(/\+/g, ' ');
+ });
}
function render(templateString, data) {
- var conditionalMatches,conditionalPattern,copy;
- conditionalPattern = /\$\{\s*isset ([a-zA-Z]*) \s*\}(.*)\$\{\s*end\s*}/g;
- //since loop below depends on re.lastInxdex, we use a copy to capture any manipulations whilst inside the loop
- copy = templateString;
- while ((conditionalMatches = conditionalPattern.exec(templateString)) !== null) {
- if(data[conditionalMatches[1]]){
- //valid key, remove conditionals, leave contents.
- copy = copy.replace(conditionalMatches[0],conditionalMatches[2]);
- }else{
- //not valid, remove entire section
- copy = copy.replace(conditionalMatches[0],'');
+ var conditionalMatches,conditionalPattern,copy;
+ conditionalPattern = /\$\{\s*isset ([a-zA-Z]+) \s*\}(.+)\$\{\s*end\s*}/g;
+ // Since loop below depends on re.lastInxdex, we use a copy to capture any
+ // manipulations whilst inside the loop.
+ copy = templateString;
+ while ((conditionalMatches = conditionalPattern.exec(templateString)) !== null) {
+ if(data[conditionalMatches[1]]){
+ // Valid key: Remove conditionals, leave contents.
+ copy = copy.replace(conditionalMatches[0],conditionalMatches[2]);
+ }else{
+ // Not valid: Remove entire section.
+ copy = copy.replace(conditionalMatches[0],'');
+ }
+ }
+ templateString = copy;
+ // Now any conditionals removed we can do simple substitution.
+ var key, find, re;
+ for (key in data) {
+ find = '\\$\\{\\s*' + key + '\\s*\\}';
+ re = new RegExp(find, 'g');
+ templateString = templateString.replace(re, data[key]);
}
- }
- templateString = copy;
- //now any conditionals removed we can do simple substitution
- var key, find, re;
- for (key in data) {
- find = '\\$\\{\\s*' + key + '\\s*\\}';
- re = new RegExp(find, 'g');
- templateString = templateString.replace(re, data[key]);
- }
- return templateString;
+ return templateString;
}