fix search with jqeury version

2 files changed, 103 insertions, 95 deletions

diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 15a0287..feb8f57 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -52,8 +52,10 @@
     {{ with $.GitInfo }}{{ with $.Site.Params.gitCommitPrefix }} | <span style="color: #999999; font-size: 60%;">Page content generated from commit: <a href="{{ . }}/{{ $.GitInfo.AbbreviatedHash }}" title="log: {{ $.GitInfo.Subject }}">{{ $.GitInfo.AbbreviatedHash }}</a>{{ end }}{{end}}
   </div>
   <!-- Bootstrap core JavaScript -->
-  <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
-  <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>
+  <script
+  src="https://code.jquery.com/jquery-3.6.0.min.js"
+  integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
+  crossorigin="anonymous"></script><script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>
 
   <!-- Plugin JavaScript -->
   <script async src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js" integrity="sha512-0QbL0ph8Tc8g5bLhfVzSqxe9GERORsKhIn1IrpxDAgUsbBGz/V7iSav2zzW325XGd1OMLdL4UiqRJj702IeqnQ==" crossorigin="anonymous"></script>
diff --git a/static/js/search.js b/static/js/search.js
index f2379a5..aeec728 100644
--- a/static/js/search.js
+++ b/static/js/search.js
@@ -1,108 +1,114 @@
 
-summaryInclude=60;
-var fuseOptions = {
-  shouldSort: true,
-  includeMatches: true,
-  threshold: 0.0,
-  tokenize:true,
-  location: 0,
-  distance: 100,
-  maxPatternLength: 32,
-  minMatchCharLength: 3,
-  keys: [
-    {name:"title",weight:0.8},
-    {name:"contents",weight:0.5},
-    {name:"tags",weight:0.3}
-  ]
-};
+(function($) {
+  summaryInclude=60;
+    var fuseOptions = {
+      shouldSort: true,
+      includeMatches: true,
+      threshold: 0.0,
+      tokenize:true,
+      location: 0,
+      distance: 100,
+      maxPatternLength: 32,
+      minMatchCharLength: 3,
+      keys: [
+        {name:"title",weight:0.8},
+        {name:"contents",weight:0.5},
+        {name:"tags",weight:0.3}
+      ]
+    };
 
 
-var searchQuery = param("s");
-if(searchQuery){
-  $("#search-query").val(searchQuery);
-  executeSearch(searchQuery);
-}else {
-  $('#search-results').append("<p>Please enter a word or phrase above</p>");
-}
-
+    var searchQuery = param("s");
+    if(searchQuery){
+      $("#search-query").val(searchQuery);
+      executeSearch(searchQuery);
+    }else {
+      $('#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>");
-    }
-  });
-}
 
-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"){
-          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));
+    function executeSearch(searchQuery){
+      $.ajax({
+        dataType: "json",
+        url: "/index.json", 
+        success: 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>");
+          }
         }
       });
     }
 
-    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);
+    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"){
+              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));
+            }
+          });
+        }
 
-    $.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);
 
-  });
-}
+        $.each(snippetHighlights,function(snipkey,snipvalue){
+          $("#summary-"+key).mark(snipvalue);
+        });
 
-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],'');
+    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],'');
+        }
+      }
+      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;
     }
-  }
-  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;
-}
+})(jQuery)
\ No newline at end of file