kb: add search form to home zone

welco/kb/templates/kb/zone.html

@@ -0,0 +1,8 @@
+{% load i18n %}
+<div>
+  <form class="kb-search" action="{% url 'kb-page-search-json' %}">
+    <input name="q"/> <button>{% trans 'Search' %}</button>
+  </form>
+  <ul class="result">
+  </ul>
+</div>

welco/kb/views.py

@@ -14,12 +14,17 @@
 # You should have received a copy of the GNU Affero General Public License
 # along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
+import json
+
 from django.core.urlresolvers import reverse_lazy
+from django.http import HttpResponse
+from django.views.decorators.csrf import csrf_exempt
 from django.views.generic import (DetailView, CreateView, UpdateView,
-        ListView, DeleteView)
+        ListView, DeleteView, TemplateView)
 
 from haystack.forms import SearchForm
 from haystack.generic_views import SearchView
+from haystack.query import SearchQuerySet
 
 from .models import Page
 
@@ -65,3 +70,29 @@ class PageSearchView(SearchView):
     form_class = SearchForm
 
 page_search = PageSearchView.as_view()
+
+
+class KbZone(TemplateView):
+    template_name = 'kb/zone.html'
+
+    def get_context_data(self, **kwargs):
+        context = super(KbZone, self).get_context_data(**kwargs)
+        context['form'] = SearchForm()
+        return context
+
+zone = csrf_exempt(KbZone.as_view())
+
+
+def page_search_json(request):
+    query = request.GET.get('q')
+    searchqueryset = SearchQuerySet()
+    sqs = searchqueryset.auto_query(query)
+    sqs.load_all()
+
+    result = []
+    for item in sqs:
+        result.append({'title': item.title, 'pk': item.pk});
+
+    response = HttpResponse(content_type='application/json')
+    json.dump({'data': result}, response, indent=2)
+    return response

welco/static/js/welco.js

@@ -6,16 +6,18 @@ $(function() {
     $(this).addClass('active');
     var source_type = $('div.source div[data-source-type]').data('source-type');
     var source_pk = $('div.source .active[data-source-pk]').data('source-pk');
-    $.ajax({url: $('.cell.qualif').data('zone-url'),
+    $('.cell[data-zone-url]').each(function(idx, zone) {
+      $.ajax({url: $(zone).data('zone-url'),
           data: {source_type: source_type,
                  source_pk: source_pk},
           async: true,
           dataType: 'html',
           success: function(data) {
-                  $('.cell.qualif > div').replaceWith(data);
-                  $('.cell.qualif select').select2();
+                  $(zone).find('> div').replaceWith(data);
+                  $(zone).find('select').select2();
           },
           error: function(error) { console.log(':(', error); }
+      });
     });
   });
   $('.qualif').delegate('button', 'click', function() {
@@ -33,4 +35,20 @@ $(function() {
     });
     return false;
   });
+  $('.kb').delegate('.kb-search', 'submit', function() {
+    var q = $(this).find('input').val();
+    var search_result_ul = $(this).parent().find('ul.result');
+    search_result_ul.empty();
+    $.getJSON($(this).attr('action'),
+            {'q': q},
+            function (response) {
+                    console.log('success!', response);
+                    $(response.data).each(function(idx, elem) {
+                            $('<li><a data-page-pk="' + elem.pk + '">' + elem.title + '</a>' + '</li>'
+                             ).appendTo(search_result_ul);
+                    });
+            }
+    );
+    return false;
+  });
 });

welco/templates/welco/home.html

@@ -8,7 +8,7 @@
 		<div class="cell document source top">
 			{{ source.render }}
 		</div>
-		<div class="cell knowledgedb">
+		<div class="cell kb" data-zone-url="{% url 'kb-zone' %}">
 			<h2>{% trans 'Knowledge Database' %}</h2>
 			<div>
 			<p>
@@ -69,7 +69,7 @@
 				</div>
 			</form>
 		</div>
-		<div class="cell qualif" data-zone-url="{% url 'qualification' %}">
+		<div class="cell qualif" data-zone-url="{% url 'qualif-zone' %}">
 			<h2>{% trans 'Qualification' %}</h2>
 			<div></div>
 		</div>

welco/urls.py

@@ -22,11 +22,13 @@ from . import apps
 
 urlpatterns = patterns('',
     url(r'^$', 'welco.views.home', name='home'),
-    url(r'^ajax/qualification$', 'welco.views.qualification', name='qualification'),
+    url(r'^ajax/qualification$', 'welco.views.qualification', name='qualif-zone'),
 
+    url(r'^ajax/kb$', 'welco.kb.views.zone', name='kb-zone'),
     url(r'^kb/$', 'welco.kb.views.page_list', name='kb-home'),
     url(r'^kb/add/$', 'welco.kb.views.page_add', name='kb-page-add'),
     url(r'^kb/search/$', 'welco.kb.views.page_search', name='kb-page-search'),
+    url(r'^kb/search/json/$', 'welco.kb.views.page_search_json', name='kb-page-search-json'),
     url(r'^kb/(?P<slug>[\w-]+)/$', 'welco.kb.views.page_detail', name='kb-page-view'),
     url(r'^kb/(?P<slug>[\w-]+)/edit$', 'welco.kb.views.page_edit', name='kb-page-edit'),
     url(r'^kb/(?P<slug>[\w-]+)/delete$', 'welco.kb.views.page_delete', name='kb-page-delete'),