From e698a3214429318bcbbf13cb7dbb82f32a0bed14 Mon Sep 17 00:00:00 2001
From: Daniel Schadt <kingdread@gmx.de>
Date: Mon, 8 Aug 2022 15:08:13 +0200
Subject: add browse filters for track type

---
 fietsboek/static/fietsboek.js     |  4 ++--
 fietsboek/templates/browse.jinja2 | 16 +++++++++++++---
 fietsboek/views/browse.py         |  3 +++
 3 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/fietsboek/static/fietsboek.js b/fietsboek/static/fietsboek.js
index 2e88aa3..60de398 100644
--- a/fietsboek/static/fietsboek.js
+++ b/fietsboek/static/fietsboek.js
@@ -319,8 +319,8 @@ addHandler(".archive-checkbox", "change", () => {
  * @param event - The triggering event.
  */
 function clearInputButtonClicked(event) {
-  const input = event.target.closest(".input-group").querySelector("input");
-  input.value = "";
+  event.target.closest(".input-group").querySelectorAll("input").forEach((i) => i.value = "");
+  event.target.closest(".input-group").querySelectorAll("select").forEach((i) => i.value = "");
 }
 
 addHandler(".button-clear-input", "click", clearInputButtonClicked);
diff --git a/fietsboek/templates/browse.jinja2 b/fietsboek/templates/browse.jinja2
index 6a479ea..5ec7c05 100644
--- a/fietsboek/templates/browse.jinja2
+++ b/fietsboek/templates/browse.jinja2
@@ -66,8 +66,17 @@
           </div>
         </div>
 
-      {% if request.identity %}
-      <div class="col-12">
+      <div class="col-md-6">
+        <div class="input-group">
+          <button type="button" class="btn btn-outline-secondary button-clear-input"><i class="bi bi-eraser-fill"></i></button>
+          <select class="form-select" size="2" name="type[]" multiple>
+            <option value="ORGANIC"{% if "ORGANIC" in request.params.getall("type[]") %} selected{% endif %}>{{ _("page.browse.filter.type.organic") }}</option>
+            <option value="SYNTHETIC"{% if "SYNTHETIC" in request.params.getall("type[]") %} selected{% endif %}>{{ _("page.browse.filter.type.synthetic") }}</option>
+          </select>
+        </div>
+      </div>
+      <div class="col-md-6">
+        {% if request.identity %}
         {% macro render_switch(id, name, value, text) %}
         <div class="form-check form-switch">
           <input class="form-check-input" type="checkbox" role="switch" id="{{ id }}" name="{{ name }}" value="{{ value }}" {% if value in request.params.getall(name) %}checked{% endif %}>
@@ -77,8 +86,9 @@
         {{ render_switch("switchOnlyMyTracks", "show-only[]", "mine", _("page.browse.filter.my_tracks.only")) }}
         {{ render_switch("switchOnlyFriendsTracks", "show-only[]", "friends", _("page.browse.filter.friends_tracks_only")) }}
         {{ render_switch("switchOnlyMeTagged", "user-tagged", "on", _("page.browse.filter.me_tagged_only")) }}
+        {% endif %}
       </div>
-      {% endif %}
+
       </div>
 
       <div class="row g-3 mb-3">
diff --git a/fietsboek/views/browse.py b/fietsboek/views/browse.py
index 7120b0d..ffd3eae 100644
--- a/fietsboek/views/browse.py
+++ b/fietsboek/views/browse.py
@@ -135,6 +135,9 @@ class TrackFilters:
                            (track.owner == request.identity or
                             request.identity in track.tagged_people))
 
+        if 'type[]' in request.params:
+            filters.append(lambda track: track.type.name in request.params.getall('type[]'))
+
         return TrackFilters(filters)
 
 
-- 
cgit v1.2.3