From 5eb927565d19c179b6eb07a145f50002aa9208c9 Mon Sep 17 00:00:00 2001
From: Edward Betts <edward@4angle.com>
Date: Mon, 4 Jun 2018 11:53:28 +0100
Subject: [PATCH] Add 'only' filtering by facet.

---
 sourcing/templates/home.html | 28 +++++++++++++++++++++-------
 1 file changed, 21 insertions(+), 7 deletions(-)

diff --git a/sourcing/templates/home.html b/sourcing/templates/home.html
index 16c194f..329fb56 100644
--- a/sourcing/templates/home.html
+++ b/sourcing/templates/home.html
@@ -24,29 +24,33 @@
     <h5>item type</h5>
     {% for item_type in 'xanadoc', 'xanalink', 'sourcedoc' %}
       <div class="form-check">
-        <input class="form-check-input" type="checkbox" checked="checked" id="type_{{ item_type }}">
+        <input class="form-check-input facet_type" type="checkbox" checked="checked" id="type_{{ item_type }}">
         <label class="form-check-label" for="type_{{ item_type }}"> {{ item_type }}</label>
+        &ndash; <a href="#" class="only facet_type" data-facet-value="{{ item_type }}">only</a>
       </div>
     {% endfor %}
     <h5>user</h5>
     {% for item_user in users %}
       <div class="form-check">
-      <input class="form-check-input" type="checkbox" checked="checked" id="user_{{ item_user }}">
-      <label class="form-check-label" for="user_{{ item_user }}">{{ item_user }}</label><br/>
+      <input class="form-check-input facet_user" type="checkbox" checked="checked" id="user_{{ item_user }}">
+      <label class="form-check-label" for="user_{{ item_user }}">{{ item_user }}</label>
+      &ndash; <a href="#" class="only facet_user" data-facet-value="{{ item_user }}">only</a>
       </div>
     {% endfor %}
     <h5>link type</h5>
     {% for link_type in link_types %}
       <div class="form-check">
-      <input class="form-check-input" type="checkbox" checked="checked" id="link_type_{{ link_type }}">
-      <label class="form-check-label" for="link_type_{{ link_type }}">{{ link_type }}</label><br/>
+      <input class="form-check-input facet_link_type" type="checkbox" checked="checked" id="link_type_{{ link_type }}">
+      <label class="form-check-label" for="link_type_{{ link_type }}">{{ link_type }}</label>
+      &ndash; <a href="#" class="only facet_link_type" data-facet-value="{{ link_type }}">only</a>
       </div>
     {% endfor %}
     <h5>years</h5>
     {% for year in years %}
       <div class="form-check">
-      <input class="form-check-input" type="checkbox" checked="checked" id="year_{{ year }}">
-      <label class="form-check-label" for="year_{{ year }}">{{ year }}</label><br/>
+      <input class="form-check-input facet_year" type="checkbox" checked="checked" id="year_{{ year }}">
+      <label class="form-check-label" for="year_{{ year }}">{{ year }}</label>
+      &ndash; <a href="#" class="only facet_year" data-facet-value="{{ year }}">only</a>
       </div>
     {% endfor %}
     </form>
@@ -106,6 +110,16 @@
     }
 
     $('#lower-buttons').toggle(visible_count != 0);
+
+    $('a.only').click(function(e) {
+      e.preventDefault();
+      var facet = this.className.split(' ').filter(cls => cls.startsWith('facet_'))[0].substr(6);
+      var value = $(this).data('facet-value');
+      var pick = $('input#' + facet + '_' + value);
+      pick.prop('checked', true);
+      $('input.facet_' + facet).not(pick).prop('checked', false);
+      update_list();
+    });
   }
 
   $(update_list());