From 7caece3c40f6e61c6609e85ded60698568848746 Mon Sep 17 00:00:00 2001
From: Étienne Loks <etienne.loks@iggdrasil.net>
Date: Tue, 27 Mar 2018 12:52:19 +0200
Subject: Search input: add a clear field button

---
 ishtar_common/forms_common.py                       | 12 ++++++++----
 ishtar_common/static/js/ishtar.js                   |  3 +++
 ishtar_common/templates/blocks/bs_form_snippet.html |  8 +-------
 ishtar_common/templates/widgets/search_input.html   | 13 +++++++++++++
 ishtar_common/widgets.py                            |  4 ++++
 5 files changed, 29 insertions(+), 11 deletions(-)
 create mode 100644 ishtar_common/templates/widgets/search_input.html

(limited to 'ishtar_common')

diff --git a/ishtar_common/forms_common.py b/ishtar_common/forms_common.py
index 94dd7b8ee..c7cea9bdc 100644
--- a/ishtar_common/forms_common.py
+++ b/ishtar_common/forms_common.py
@@ -297,7 +297,8 @@ class OrganizationForm(ManageOldType, NewItemForm):
 
 
 class OrganizationSelect(TableSelect):
-    search_vector = forms.CharField(label=_(u"Full text search"))
+    search_vector = forms.CharField(label=_(u"Full text search"),
+                                    widget=widgets.SearchWidget)
     name = forms.CharField(label=_(u"Name"), max_length=300)
     organization_type = forms.ChoiceField(label=_(u"Type"), choices=[])
 
@@ -411,7 +412,8 @@ class BaseOrganizationForm(forms.ModelForm):
 
 
 class PersonSelect(TableSelect):
-    search_vector = forms.CharField(label=_(u"Full text search"))
+    search_vector = forms.CharField(label=_(u"Full text search"),
+                                    widget=widgets.SearchWidget)
     name = forms.CharField(label=_(u"Name"), max_length=200)
     surname = forms.CharField(label=_(u"Surname"), max_length=50)
     email = forms.CharField(label=_(u"Email"), max_length=75)
@@ -538,7 +540,8 @@ class PersonUserFormSelection(PersonFormSelection):
 
 
 class IshtarUserSelect(TableSelect):
-    search_vector = forms.CharField(label=_(u"Full text search"))
+    search_vector = forms.CharField(label=_(u"Full text search"),
+                                    widget=widgets.SearchWidget)
     username = forms.CharField(label=_(u"Username"), max_length=200)
     name = forms.CharField(label=_(u"Name"), max_length=200)
     surname = forms.CharField(label=_(u"Surname"), max_length=50)
@@ -927,7 +930,8 @@ class SourceForm(CustomForm, ManageOldType):
 
 
 class SourceSelect(TableSelect):
-    search_vector = forms.CharField(label=_(u"Full text search"))
+    search_vector = forms.CharField(label=_(u"Full text search"),
+                                    widget=widgets.SearchWidget)
     authors = forms.IntegerField(
         widget=widgets.JQueryAutoComplete(
             "/" + settings.URL_PATH + 'autocomplete-author',
diff --git a/ishtar_common/static/js/ishtar.js b/ishtar_common/static/js/ishtar.js
index 126373b94..b5d701528 100644
--- a/ishtar_common/static/js/ishtar.js
+++ b/ishtar_common/static/js/ishtar.js
@@ -262,6 +262,9 @@ $(document).ready(function(){
     });
     $("a.async-link").click(manage_async_link);
     $(".chosen-select").chosen();
+    $(".clear-search").click(function(){
+        $(this).parent().parent().children('input').prop("value", "");
+    });
 });
 
 $(document).on("click", '#to_bottom_arrow', function(){
diff --git a/ishtar_common/templates/blocks/bs_form_snippet.html b/ishtar_common/templates/blocks/bs_form_snippet.html
index 7c7d4175a..818c654d1 100644
--- a/ishtar_common/templates/blocks/bs_form_snippet.html
+++ b/ishtar_common/templates/blocks/bs_form_snippet.html
@@ -18,13 +18,7 @@
 {% elif field.name == 'search_vector' and forloop.counter0 == 0 %}
 <div class="form-row">
     <div class="form-group col-lg-10">
-        <div class="input-group">
-          <span class="input-group-prepend">
-            <span class="input-group-text">
-               <i class="fa fa-search" aria-hidden="true"></i></span>
-          </span>
-          {{field|safe}}
-        </div>
+        {{field|safe}}
         {% if field.help_text %}
         <small><a data-toggle="collapse" href="#{{field.auto_id}}_help"
                   aria-expanded="false" aria-controls="{{field.auto_id}}_help">
diff --git a/ishtar_common/templates/widgets/search_input.html b/ishtar_common/templates/widgets/search_input.html
new file mode 100644
index 000000000..c68d2347d
--- /dev/null
+++ b/ishtar_common/templates/widgets/search_input.html
@@ -0,0 +1,13 @@
+<div class="input-group search-widget">
+    <span class="input-group-prepend">
+      <span class="input-group-text">
+         <i class="fa fa-search" aria-hidden="true"></i>
+      </span>
+    </span>
+    <input type="{{ widget.type }}" name="{{ widget.name }}"{% if widget.value != None %} value="{{ widget.value|stringformat:'s' }}"{% endif %}{% include "django/forms/widgets/attrs.html" %} />
+    <span class="input-group-append">
+      <span class="input-group-text clear-search">
+        <i class="fa fa-times" aria-hidden="true"></i>
+      </span>
+    </span>
+</div>
diff --git a/ishtar_common/widgets.py b/ishtar_common/widgets.py
index a9fcdf798..ca4036f4c 100644
--- a/ishtar_common/widgets.py
+++ b/ishtar_common/widgets.py
@@ -286,6 +286,10 @@ if settings.SURFACE_UNIT == 'square-metre':
     AreaWidget = SquareMeterWidget
 
 
+class SearchWidget(forms.TextInput):
+    template_name = 'widgets/search_input.html'
+
+
 class JQueryAutoComplete(forms.TextInput):
     def __init__(self, source, associated_model=None, options=None, attrs=None,
                  new=False, url_new='', multiple=False, limit=None,
-- 
cgit v1.2.3