Fix and improve the search functionality

eddiesigner · Aug 7, 2019 · 4f90657 · 4f90657
1 parent 55533f8
commit 4f90657
Show file tree

Hide file tree

Showing 5 changed files with 22 additions and 20 deletions.
diff --git a/assets/js/app.js b/assets/js/app.js
diff --git a/assets/js/post.js b/assets/js/post.js
diff --git a/package.json b/package.json
@@ -54,5 +54,5 @@
     "desktop": "assets/screenshot-desktop.jpg",
     "mobile": "assets/screenshot-mobile.jpg"
   },
-  "version": "0.1.9"
+  "version": "0.2.0"
 }
diff --git a/src/js/app.js b/src/js/app.js
@@ -111,12 +111,12 @@ $(document).ready(() => {
       matchAllTokens: true,
       maxPatternLength: 32,
       minMatchCharLength: 1,
-      keys: ['title']
+      keys: ['title', 'custom_excerpt', 'html']
     }
 
     api.posts.browse({
       limit: 'all',
-      fields: 'id, title, url, published_at'
+      fields: 'id, title, url, published_at, custom_excerpt, html'
     })
       .then((posts) => {
         for (var i = 0, len = posts.length; i < len; i++) {
@@ -182,18 +182,20 @@ $(document).ready(() => {
   $inputSearch.keyup(() => {
     if ($inputSearch.val().length > 0 && fuse) {
       const results = fuse.search($inputSearch.val())
+      let htmlString = ''
 
       if (results.length > 0) {
         for (var i = 0, len = results.length; i < len; i++) {
-          $searchResults.html(`
+          htmlString += `
           <article class="m-result">\
             <a href="${results[i].url}" class="m-result__link">\
               <h3 class="m-result__title">${results[i].title}</h3>\
               <span class="m-result__date">${formatDate(results[i].published_at)}</span>\
             </a>\
-          </article>
-        `)
+          </article>`
         }
+
+        $searchResults.html(htmlString)
       } else {
         $searchResults.html('<p class="m-no-found align-center">0 results for your search, try something different.</>')
       }

diff --git a/src/js/post.js b/src/js/post.js
@@ -20,6 +20,18 @@ function onScrolling() {
   requestTicking()
 }
 
+function adjustShare(timeout) {
+  if (!isMobile('1023px')) {
+    stickybits('.js-sticky', { stickyBitStickyOffset: 100 })
+    $('body').removeClass('share-menu-displayed')
+  } else {
+    $('body').addClass('share-menu-displayed')
+    setTimeout(() => {
+      $aosWrapper.removeAttr('data-aos')
+    }, timeout)
+  }
+}
+
 function onResizing() {
   setHeights()
   adjustShare(100)
@@ -109,18 +121,6 @@ $(document).ready(() => {
     }
   }
 
-  function adjustShare(timeout) {
-    if (!isMobile('1023px')) {
-      stickybits('.js-sticky', { stickyBitStickyOffset: 100 })
-      $('body').removeClass('share-menu-displayed')
-    } else {
-      $('body').addClass('share-menu-displayed')
-      setTimeout(() => {
-        $aosWrapper.removeAttr('data-aos')
-      }, timeout)
-    }
-  }
-
   adjustImageGallery()
   adjustShare(1000)