rewrite search.js without jQuery

_src/_assets/js/_search.js

@@ -7,76 +7,66 @@
 
 const krlcSearch = (() => { // eslint-disable-line no-unused-vars
     const _config = {
-        searchlink: $('.search-btn, .js-search-init'),
-        searcharea: $('.search-area'),
-        searchfield: $('#search-input'),
-        searchpop: $('#search-popover')
+        searchlink: document.getElementsByClassName('search-btn')[0],
+        searcharea: document.getElementsByClassName('search-area')[0],
+        searchclose: document.getElementsByClassName('search-close')[0],
+        searchfield: document.getElementById('search-input'),
+        searchpop: document.getElementById('search-popover'),
+        searchresults: document.getElementById('search-results')
     }
 
     const _private = {
         searchHide() {
             // Revert all search elements
-            _config.searcharea
-                .removeClass('animation-slidedown')
-                .addClass('animation-bounceOutUp')
-                .on('animationend webkitAnimationEnd oAnimationEnd', () => {
-                    $('body').removeClass('has-search-open')
-                })
-            _config.searchpop.addClass('hide')
+            _config.searcharea.classList.remove('animation-slidedown')
+            _config.searcharea.classList.add('animation-bounceOutUp')
+            _config.searchpop.classList.add('hide')
+            document.body.classList.remove('has-search-open')
         },
 
         searchClose() {
-            $('.search-close').on('click', e => {
+            _config.searchclose.addEventListener('click', e => {
                 e.preventDefault()
 
                 _private.searchHide()
 
                 // Empty search field
-                _config.searchfield.val('').blur()
+                _config.searchfield.value = ''
+                _config.searchfield.blur()
             })
         },
 
         searchShow() {
-            _config.searchlink.on('click', e => {
+            _config.searchlink.addEventListener('click', e => {
                 e.preventDefault()
 
                 // Show search field
-                _config.searcharea
-                    .removeClass('is-ready animation-bounceOutUp')
-                    .addClass('is-ready animation-slidedown')
-                    .on('animationend webkitAnimationEnd oAnimationEnd', () => {
-                        $('body').addClass('has-search-open')
-                    })
+                _config.searcharea.classList.remove('is-ready', 'animation-bounceOutUp')
+                _config.searcharea.classList.add('is-ready', 'animation-slidedown')
+                document.body.classList.add('has-search-open')
 
                 _config.searchfield.focus()
 
                 SimpleJekyllSearch({ // eslint-disable-line new-cap
-                    searchInput: document.getElementById('search-input'),
-                    resultsContainer: document.getElementById('search-results'),
+                    searchInput: _config.searchfield,
+                    resultsContainer: _config.searchresults,
                     json: '/api/search.json',
                     searchResultTemplate: '<a class="search-link" href="{url}">{title}</a>',
                     fuzzy: false
                 })
 
                 // Hide menu too just in case
-                if ($('body').hasClass('has-menu-open')) {
-                    $('body').removeClass('has-menu-open')
+                if (document.body.classList.contains('has-menu-open')) {
+                    document.body.classList.remove('has-menu-open')
                 }
 
-                // Bind the hide controls
-                $(document).bind('click.hidethepop', () => {
-                    _private.searchHide()
-
-                    // Unbind the hide controls
-                    $(document).unbind('click.hidethepop')
-                })
-
                 // Dont close thepop when click on thepop
-                _config.searchpop.on('click', e => {
+                _config.searchpop.addEventListener('click', e => {
                     e.stopPropagation()
                 })
+
                 // Dont close thepop when click on search field
-                _config.searchfield.on('click', e => {
+                _config.searchfield.addEventListener('click', e => {
                     e.stopPropagation()
                 })
 
@@ -85,8 +75,8 @@ const krlcSearch = (() => { // eslint-disable-line no-unused-vars
             })
 
             // Show popup upon first keypress
-            _config.searchfield.on('keyup', () => {
-                _config.searchpop.removeClass('hide')
+            _config.searchfield.addEventListener('keyup', () => {
+                _config.searchpop.classList.remove('hide')
             })
 
             // Listen for close icon

_src/_assets/js/kremalicious3.js

@@ -11,18 +11,10 @@
 //=include _modals.js
 /* eslint-enable spaced-comment */
 
-
-//
-// Init jQuery-based modules
-//
-$(document).ready(() => {
-    krlcSearch.init()
-})
-
-
 //
 // Init js modules
 //
+krlcSearch.init()
 krlcMenu.init()
 krlcModals.init()