feat(search): replace tipue_search with lunr.js

Signed-off-by: Pablo Iranzo Gómez <[email protected]>

Update #275

templates/search.html

@@ -22,11 +22,14 @@
 <meta property="og:image" content="{{ FEATURED_IMAGE }}" />
 <meta name="twitter:image" content="{{ FEATURED_IMAGE }}" >
 {% endif %}
+<script src="https://unpkg.com/lunr/lunr.js"></script>
 {% endblock meta_tags_in_head %}
 
 {% block content %}
     <div class="span8 offset2">
-        <div id="tipue_search_content"><div id="tipue_search_loading"></div></div>
+        <div id="lunrsearchresults">
+            <ul></ul>
+        </div>
     </div>
 {% endblock content %}
 
@@ -37,21 +40,69 @@
 {% endif %}
 
 <script>
-$(document).ready(function() {
-     $('#tipue_search_input').tipuesearch({
-         {% if 'tipue_search' in PLUGINS %}
-             'mode' : 'json',
-         {% else %}
-             'mode': 'live',
-         {% endif %}
-         'show': 10,
-         'newWindow': false,
-         {# I cannot place following statements in the conditionals above because then Tipue Search fails to work. Possibly a bug in Tipue Search. #}
-         {% if not 'tipue_search' in PLUGINS %}
-             'liveDescription': '.article-content'
-         {% endif %}
-     });
-});
+var items = tipuesearch['pages'];
+var documents = tipuesearch["pages"]
+var counter = 0
+
+for (item in documents){
+    documents[item]['id'] = counter;
+    counter = counter +1;
+}
+
+var idx = lunr(function () {
+  this.ref('id')
+  this.field('title')
+  this.field('url')
+  this.field('text', { boost: 10 })
+  this.field('tags')
+
+  items.forEach(function (doc) {
+    this.add(doc)
+  }, this)
+})
+
+function lunr_search(term) {
+    document.getElementById('lunrsearchresults').innerHTML = '<ul></ul>';
+    if(term) {
+        document.getElementById('lunrsearchresults').innerHTML = "<p>Search results for '" + term + "'</p>" + document.getElementById('lunrsearchresults').innerHTML;
+        //put results on the screen.
+        var results = idx.search(term);
+        if(results.length>0){
+            //console.log(idx.search(term));
+            //if results
+            for (var i = 0; i < results.length; i++) {
+                // more statements
+                var ref = results[i]['ref'];
+                var url = documents[ref]['url'];
+                var title = documents[ref]['title'];
+                var body = documents[ref]['text'].substring(0,160)+'...';
+                document.querySelectorAll('#lunrsearchresults ul')[0].innerHTML = document.querySelectorAll('#lunrsearchresults ul')[0].innerHTML + "<li class='lunrsearchresult'><a href='" + url + "'><span class='title'>" + title + "</span></a><br /><span class='body'>"+ body +"</span><br /><span class='url'>"+ url +"</span></li>";
+            }
+        } else {
+            document.querySelectorAll('#lunrsearchresults ul')[0].innerHTML = "<li class='lunrsearchresult'>No results found...</li>";
+        }
+    }
+    return false;
+}
+
+function getQueryVariable(variable) {
+  var query = window.location.search.substring(1);
+  var vars = query.split('&');
+
+  for (var i = 0; i < vars.length; i++) {
+    var pair = vars[i].split('=');
+
+    if (pair[0] === variable) {
+      return decodeURIComponent(pair[1].replace(/\+/g, '%20'));
+    }
+  }
+}
+
+
+var searchTerm = getQueryVariable('q');
+if (searchTerm) {
+  lunr_search(searchTerm)
+}
 </script>
 
 {% endblock script %}