wowchemy-search.js 6.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203
  1. /*************************************************
  2. * Wowchemy
  3. * https://github.com/wowchemy/wowchemy-hugo-modules
  4. *
  5. * In-built Fuse based search algorithm.
  6. **************************************************/
  7. /* ---------------------------------------------------------------------------
  8. * Configuration.
  9. * --------------------------------------------------------------------------- */
  10. // Configure Fuse.
  11. let fuseOptions = {
  12. shouldSort: true,
  13. includeMatches: true,
  14. tokenize: true,
  15. threshold: search_config.threshold, // Set to ~0.3 for parsing diacritics and CJK languages.
  16. location: 0,
  17. distance: 100,
  18. maxPatternLength: 32,
  19. minMatchCharLength: search_config.minLength, // Set to 1 for parsing CJK languages.
  20. keys: [
  21. {name: 'title', weight: 0.99} /* 1.0 doesn't work o_O */,
  22. {name: 'summary', weight: 0.6},
  23. {name: 'authors', weight: 0.5},
  24. {name: 'content', weight: 0.2},
  25. {name: 'tags', weight: 0.5},
  26. {name: 'categories', weight: 0.5},
  27. ],
  28. };
  29. // Configure summary.
  30. let summaryLength = 60;
  31. /* ---------------------------------------------------------------------------
  32. * Functions.
  33. * --------------------------------------------------------------------------- */
  34. // Get query from URI.
  35. function getSearchQuery(name) {
  36. return decodeURIComponent((location.search.split(name + '=')[1] || '').split('&')[0]).replace(/\+/g, ' ');
  37. }
  38. // Set query in URI without reloading the page.
  39. function updateURL(url) {
  40. if (history.replaceState) {
  41. window.history.replaceState({path: url}, '', url);
  42. }
  43. }
  44. // Pre-process new search query.
  45. function initSearch(force, fuse) {
  46. let query = $('#search-query').val();
  47. // If query deleted, clear results.
  48. if (query.length < 1) {
  49. $('#search-hits').empty();
  50. $('#search-common-queries').show();
  51. }
  52. // Check for timer event (enter key not pressed) and query less than minimum length required.
  53. if (!force && query.length < fuseOptions.minMatchCharLength) return;
  54. // Do search.
  55. $('#search-hits').empty();
  56. $('#search-common-queries').hide();
  57. searchAcademic(query, fuse);
  58. let newURL =
  59. window.location.protocol +
  60. '//' +
  61. window.location.host +
  62. window.location.pathname +
  63. '?q=' +
  64. encodeURIComponent(query) +
  65. window.location.hash;
  66. updateURL(newURL);
  67. }
  68. // Perform search.
  69. function searchAcademic(query, fuse) {
  70. let results = fuse.search(query);
  71. // console.log({"results": results});
  72. if (results.length > 0) {
  73. $('#search-hits').append('<h3 class="mt-0">' + results.length + ' ' + i18n.results + '</h3>');
  74. parseResults(query, results);
  75. } else {
  76. $('#search-hits').append('<div class="search-no-results">' + i18n.no_results + '</div>');
  77. }
  78. }
  79. // Parse search results.
  80. function parseResults(query, results) {
  81. $.each(results, function (key, value) {
  82. let content_key = value.item.section;
  83. let content = '';
  84. let snippet = '';
  85. let snippetHighlights = [];
  86. // Show abstract in results for content types where the abstract is often the primary content.
  87. if (['publication', 'event'].includes(content_key)) {
  88. content = value.item.summary;
  89. } else {
  90. content = value.item.content;
  91. }
  92. if (fuseOptions.tokenize) {
  93. snippetHighlights.push(query);
  94. } else {
  95. $.each(value.matches, function (matchKey, matchValue) {
  96. if (matchValue.key == 'content') {
  97. let start = matchValue.indices[0][0] - summaryLength > 0 ? matchValue.indices[0][0] - summaryLength : 0;
  98. let end =
  99. matchValue.indices[0][1] + summaryLength < content.length
  100. ? matchValue.indices[0][1] + summaryLength
  101. : content.length;
  102. snippet += content.substring(start, end);
  103. snippetHighlights.push(
  104. matchValue.value.substring(
  105. matchValue.indices[0][0],
  106. matchValue.indices[0][1] - matchValue.indices[0][0] + 1,
  107. ),
  108. );
  109. }
  110. });
  111. }
  112. if (snippet.length < 1) {
  113. snippet += value.item.summary; // Alternative fallback: `content.substring(0, summaryLength*2);`
  114. }
  115. // Load template.
  116. let template = $('#search-hit-fuse-template').html();
  117. // Localize content types.
  118. if (content_key in content_type) {
  119. content_key = content_type[content_key];
  120. }
  121. // Parse template.
  122. let templateData = {
  123. key: key,
  124. title: value.item.title,
  125. type: content_key,
  126. relpermalink: value.item.relpermalink,
  127. snippet: snippet,
  128. };
  129. let output = render(template, templateData);
  130. $('#search-hits').append(output);
  131. // Highlight search terms in result.
  132. $.each(snippetHighlights, function (hlKey, hlValue) {
  133. $('#summary-' + key).mark(hlValue);
  134. });
  135. });
  136. }
  137. function render(template, data) {
  138. // Replace placeholders with their values.
  139. let key, find, re;
  140. for (key in data) {
  141. find = '\\{\\{\\s*' + key + '\\s*\\}\\}'; // Expect placeholder in the form `{{x}}`.
  142. re = new RegExp(find, 'g');
  143. template = template.replace(re, data[key]);
  144. }
  145. return template;
  146. }
  147. /* ---------------------------------------------------------------------------
  148. * Initialize.
  149. * --------------------------------------------------------------------------- */
  150. // If Academic's in-built search is enabled and Fuse loaded, then initialize it.
  151. if (typeof Fuse === 'function') {
  152. // Wait for Fuse to initialize.
  153. $.getJSON(search_config.indexURI, function (search_index) {
  154. let fuse = new Fuse(search_index, fuseOptions);
  155. // On page load, check for search query in URL.
  156. if ((query = getSearchQuery('q'))) {
  157. $('body').addClass('searching');
  158. $('.search-results').css({opacity: 0, visibility: 'visible'}).animate({opacity: 1}, 200);
  159. $('#search-query').val(query);
  160. $('#search-query').focus();
  161. initSearch(true, fuse);
  162. }
  163. // On search box key up, process query.
  164. $('#search-query').keyup(function (e) {
  165. clearTimeout($.data(this, 'searchTimer')); // Ensure only one timer runs!
  166. if (e.keyCode == 13) {
  167. initSearch(true, fuse);
  168. } else {
  169. $(this).data(
  170. 'searchTimer',
  171. setTimeout(function () {
  172. initSearch(false, fuse);
  173. }, 250),
  174. );
  175. }
  176. });
  177. });
  178. }