Search in navbar

README.md

@@ -4,8 +4,6 @@ Bouquins in Go
 
 ## TODO
 
-* search (table results: authors, tags...)
-* search in header
 * About
 * translations
 * tests

assets/js/bouquins.js

@@ -26,7 +26,7 @@ Vue.component('results-list', {
     icon: function() {
       switch (this.type) {
         case 'books':
-          return 'icon';
+          return 'book';
         case 'authors':
           return 'user';
         case 'series':
@@ -289,6 +289,7 @@ if (document.getElementById("search")) {
   new Vue({
     el: '#search',
     data: {
+      urlParams: [],
       authors: [],
       books: [],
       series: [],
@@ -376,6 +377,15 @@ if (document.getElementById("search")) {
           this.q = this.urlParams.q;
         }
       },
+      urlParse: function() {
+        var match,
+        pl     = /\+/g,  // Regex for replacing addition symbol with a space
+        search = /([^&=]+)=?([^&]*)/g,
+        decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
+        query  = window.location.search.substring(1);
+        while (match = search.exec(query))
+          this.urlParams[decode(match[1])] = decode(match[2]);
+      },  
       sendQuery: function(url, error, success) {
         var xmh = new XMLHttpRequest();
         var v;
@@ -403,6 +413,12 @@ if (document.getElementById("search")) {
       stdError: function(code, resp) {
         console.log('ERROR ' + code + ': ' + resp);
       }
+    },
+    created: function() {
+      this.urlParse();
+    },
+    mounted: function() {
+      this.searchUrl();
     }
   });
 }

templates/header.html

@@ -18,7 +18,7 @@
           <li><a href="/search">Recherche</a></li>
           <li><a href="#">A propos</a></li>
         </ul>
-        <form class="navbar-form navbar-right" role="search" method="get" action="search.html">
+        <form class="navbar-form navbar-right" role="search" method="get" action="/search/">
           <div class="form-group">
             <input name="q" type="text" class="form-control" placeholder="Recherche">
           </div>