Put advanced search inside a modal - get a text summary of advanced search

2 files changed, 33 insertions, 7 deletions

diff --git a/ishtar_common/templates/base.html b/ishtar_common/templates/base.html
index fa62acdd2..d5d138bd2 100644
--- a/ishtar_common/templates/base.html
+++ b/ishtar_common/templates/base.html
@@ -32,6 +32,8 @@
     var activate_own_search_url = '{% url "activate-own-search" %}';
     var activate_all_search_msg = "{% trans 'Searches in the shortcut menu deal with all items.' %}";
     var activate_own_search_msg = "{% trans 'Searches in the shortcut menu deal with only your items.' %}";
+    var YES = "{% trans 'yes' %}";
+    var NO = "{% trans 'no' %}";
     </script>
     {% endcompress %}
     {% compress css %}
diff --git a/ishtar_common/templates/blocks/bs_form_snippet.html b/ishtar_common/templates/blocks/bs_form_snippet.html
index c636465f3..c9716794c 100644
--- a/ishtar_common/templates/blocks/bs_form_snippet.html
+++ b/ishtar_common/templates/blocks/bs_form_snippet.html
@@ -36,9 +36,10 @@
     </div>
     <div class="form-group col-lg">
         <p class="text-right">
-            <a class="btn btn-secondary btn-sm" data-toggle="collapse" href="#tail-form"
-               aria-expanded="false" aria-controls="tail-form">
-                {% trans "Advanced search" %}</a>
+            <button class="btn btn-secondary btn-sm" data-toggle="modal"
+               data-target="#modal-advanced-search">
+                {% trans "Advanced search" %} <i class="fa fa-cogs" aria-hidden="true"></i>
+            </button>
         </p>
     </div>
 
@@ -50,11 +51,21 @@
     </div>
     {% endif %}
 </div>
+<div class="alert alert-info" role="alert" id="advanced-search-resume">
+    <strong><i class="fa fa-cogs" aria-hidden="true"></i>{% trans ":" %}&nbsp;</strong>
+    <span id="advanced-search-resume-content"></span>
+</div>
 {% else %}
 {% if search and forloop.counter0 == 1 %}
-<div class="collapse" id="tail-form">
-    <div class="card card-body">
-        <div class="form-row">
+<div class="modal" id="modal-advanced-search" tabindex="-1" role="dialog"
+     data-backdrop="static" data-keyboard="false" aria-hidden="true">
+    <div class="modal-dialog modal-lg">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5>{% trans "Advanced search" %}</h5>
+            </div>
+            <form id="advanced-search-form">
+            <div class="modal-body form-row">
 {% endif %}
 
 {% if not search and forloop.counter0|divisibleby:2 or search and forloop.counter1|divisibleby:2 %}
@@ -65,10 +76,23 @@
       {% include "blocks/bs_field_snippet.html" %}
 {% if forloop.last %}
 {% if search and forloop.counter0 >= 1 %}
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary advanced-search-reset"
+                        data-dismiss="modal">{% trans 'Reset' %}</button>
+                <button type="button" class="btn btn-primary advanced-search-valid"
+                        data-dismiss="modal">{% trans "Validate" %}</button>
+            </div>
+            </form>
+        </div>
     </div>
-  </div>
 {% endif %}
 </div>
 {% endif %}
 {% endif %}
 {% endfor %}
+
+{% if search %}
+<script type="text/javascript">
+$(register_advanced_search);</script>
+{% endif %}