Merge 46821a5 into 1b7b611

eea · Jun 13, 2017 · 8b47591 · 8b47591
2 parents 1b7b611 + 46821a5
commit 8b47591
Show file tree

Hide file tree

Showing 5 changed files with 85 additions and 37 deletions.
diff --git a/gemet/thesaurus/__init__.py b/gemet/thesaurus/__init__.py
@@ -65,3 +65,9 @@
     'narrower': 'broader',
     'related': 'related',
 }
+
+EXACT_QUERY = 0
+BEGIN_WITH_QUERY = 1
+END_WITH_QUERY = 2
+CONTAIN_QUERY = 3
+ALL_SEARCH_MODES = 4
diff --git a/gemet/thesaurus/static/thesaurus/css/style.css b/gemet/thesaurus/static/thesaurus/css/style.css
@@ -12,6 +12,10 @@ a:visited{
 
 #workarea {
     font-family: 'Roboto', sans-serif;
+    margin-top: -26px;
+    padding-top: 26px;
+    overflow-x: visible;
+    font-size: 110%
 }
 
 .direction-rtl ul,
@@ -399,6 +403,10 @@ hr {
     .hidden-mobile {
         display: none!important;
     }
+    #workarea {
+        clear: none;
+        border: none;
+    }
 }
 
 @media (min-width: 701px) {
@@ -667,7 +675,6 @@ hr {
 #workarea {
     /*padding-bottom: 60px;*/
     margin-left: 0;
-    overflow-x: hidden;
     font-size: 110%;
 }
 
@@ -714,6 +721,7 @@ hr {
     margin-top: 1rem;
     margin-bottom: 1rem;
     text-align: center;
+    position:relative;
 }
 
 
@@ -1240,6 +1248,15 @@ li:hover .btn-remove-down {
     border: 3px solid #00446a;
 }
 
+.search_bar_fix {
+    position: absolute;
+    margin-left:5rem;
+    border: none;
+    z-index: 1000;
+    right: 0;
+    bottom: calc(100% + 1rem + 1px);
+}
+
 .edit-page > .element > .element > .input-field.visible {
     display: inline-block!important;
 }
@@ -1249,17 +1266,20 @@ li:hover .btn-remove-down {
     box-shadow: none;
     font-weight: 600;
     font-size: 14px;
-    width: 80%;
     padding: .5em;
     margin: 0;
     overflow: hidden;
-    margin-left: 7.8rem;
 }
 
 .search_bar input[type=text]:focus {
     outline: none;
 }
 
+.search_bar input::placeholder {
+    font-size: 14px;
+    text-align: center;
+}
+
 .search_bar button[type=submit] {
     background: white;
     color: rgba(255, 255, 255, 0);
@@ -1299,10 +1319,8 @@ li:hover .btn-remove-down {
 .search_bar .search_dropdown {
     font-weight: 600;
     min-width: 17px;
-    border-right: 1px solid #ddd;
     color: #555;
-    border-radius: 2px 0 0 2px;
-    position: absolute;
+    position: relative;
     top: 0;
     left: 0;
     bottom: 0;
@@ -1312,6 +1330,7 @@ li:hover .btn-remove-down {
     -ms-user-select: none;
     user-select: none;
     box-sizing: content-box;
+    border:none;
 }
 
 .search_bar .search_dropdown:after {
@@ -1331,12 +1350,17 @@ li:hover .btn-remove-down {
     border-right-color: #ccc;
 }
 
+#js-change-language {
+    font-size: 10.5px;
+    padding: 0;
+    margin: 0;
+}
+
 .search_bar .search_dropdown > select {
     position: relative;
     white-space: nowrap;
     font-size: 15px;
     border: none;
-    margin-top: 7px;
     background: none;
 }
 
@@ -1436,6 +1460,12 @@ li:hover .btn-remove-down {
     }
 }
 
+@media (max-width: 600px)  {
+    .search_bar input::placeholder {
+        font-size: 10px;
+    }
+}
+
 .related-terms {
     display: flex;
     flex-wrap: wrap;
@@ -1809,11 +1839,6 @@ a.btn {
         transform: translateX(0);
         /*overflow: auto!important;*/
     }
-    .search_bar input[type=text] {
-        margin-left: 38%;
-        /* margin-right: -7%; */
-        width: 49%;
-    }
     .search_bar.huge {
         max-width: 88%;
     }
@@ -1823,9 +1848,6 @@ a.btn {
     #workarea .content {
         padding: 0 1rem;
     }
-    #workarea {
-        margin-top: 0;
-    }
     .gemet-menu {
         display: block;
     }

diff --git a/gemet/thesaurus/static/thesaurus/js/main.js b/gemet/thesaurus/static/thesaurus/js/main.js
@@ -11,6 +11,13 @@ $(document).ready(function() {
     $('#js-change-language').on('change', function() {
         var url = $(this).find(':selected').attr('href'); // get selected value
         if (url) { // require a URL
+            if ($('#id_query').val())  {
+                if (url.indexOf('?') > -1)
+                    url = url + "&query=" + $('#id_query').val();
+                else
+                    url = url + "?query=" + $('#id_query').val();
+
+            }
             window.location = url; // redirect
         }
         return false;

diff --git a/gemet/thesaurus/templates/header.html b/gemet/thesaurus/templates/header.html
@@ -6,6 +6,18 @@
   <div class="header-title">
     <div class="title">GEMET</div>
     <div class="subtitle">General<br>Multilingual<br>Environmental<br>Thesaurus</div>
+    <div class="search_bar search_bar_fix">
+      <div class="search_dropdown">
+        <select name="select-language" id="js-change-language">
+        {% for lang in languages %}
+          <option value="{{ lang.code }}"
+          href="{% if code %}{% url view lang.code code %}{% else %}{% url view lang.code  %}{% endif %}{% if get_params %}?{{ get_params }}{% endif %}"
+          {% if language.code == lang.code%}selected="selected"{% endif %}
+          >{{ lang.name }}</option>
+        {% endfor %}
+        </select>
+      </div>
+    </div>
   </div>
   <div class="gemet-menu">
   <button title="mobile-menu-button" class="expand-button menu-button"><i class="fa fa-bars" aria-hidden="true"></i></button>
@@ -28,23 +40,18 @@
 </div>
 
 <div class="search_bar huge">
-  <div class="search_dropdown">
-    <select name="select-language" id="js-change-language">
-      {% for lang in languages %}
-        <option value="{{ lang.code }}"
-        href="{% if code %}{% url view lang.code code %}{% else %}{% url view lang.code  %}{% endif %}{% if get_params %}?{{ get_params }}{% endif %}"
-        {% if language.code == lang.code%}selected="selected"{% endif %}
-          >{{ lang.name }}</option>
-      {% endfor %}
-    </select>
-  </div>
-
   <form method="get"
         action='{% url "search" language.code %}'
         id='search-form'
         name="search-query"
         placeholder="Concepts, Groups, Themes...">
-    {{ search_form }}
+    {% for field in search_form %}
+      {{ field.label_tag }}
+      <input id="{{ field.id_for_label }}" type="text" name="{{ field.name }}"
+             value="{{ request.GET.query }}" maxlength="{{ field.field.max_length }}"
+             placeholder="Search concepts by name (active language: {{ language }})"
+             title="Search concepts by name (active language: {{ language }})"/>
+    {% endfor %}
     <button type="submit" value="Search">Search</button>
   </form>
 

diff --git a/gemet/thesaurus/utils.py b/gemet/thesaurus/utils.py
@@ -9,6 +9,8 @@
 
 from gemet.thesaurus import PENDING, PUBLISHED, DELETED_PENDING
 from gemet.thesaurus import SEARCH_FIELDS, SEARCH_SEPARATOR
+from gemet.thesaurus import EXACT_QUERY, END_WITH_QUERY, BEGIN_WITH_QUERY
+from gemet.thesaurus import CONTAIN_QUERY, ALL_SEARCH_MODES
 from gemet.thesaurus.models import Concept, Group, Property, Version
 
 
@@ -39,16 +41,20 @@ def regex_search(query, language, heading):
     )
 
 
-def search_queryset(query, language, search_mode=1, heading='Concepts',
+def search_queryset(query, language, search_mode=EXACT_QUERY, heading='Concepts',
                     api_call=False, status_values=[]):
     status_values = status_values or Property.PUBLISHED_STATUS_OPTIONS
     if api_call:
-        if search_mode == 4:
+        if search_mode == ALL_SEARCH_MODES:
             values = (
-                api_search(query, language, status_values, 0, heading) or
-                api_search(query, language, status_values, 1, heading) or
-                api_search(query, language, status_values, 2, heading) or
-                api_search(query, language, status_values, 3, heading)
+                api_search(query, language, status_values,
+                           EXACT_QUERY, heading) or
+                api_search(query, language, status_values,
+                           BEGIN_WITH_QUERY, heading) or
+                api_search(query, language, status_values,
+                           END_WITH_QUERY, heading) or
+                api_search(query, language, status_values,
+                           CONTAIN_QUERY, heading)
             )
         else:
             values = api_search(query, language, status_values, search_mode,
@@ -61,10 +67,10 @@ def search_queryset(query, language, search_mode=1, heading='Concepts',
 
 def api_search(query, language, status_values, search_mode, headings):
     search_types = {
-        0: [query],
-        1: [query + '%%'],
-        2: ['%%' + query],
-        3: ['%%' + query + '%%']
+        EXACT_QUERY: [query],
+        BEGIN_WITH_QUERY: [query + '%%'],
+        END_WITH_QUERY: ['%%' + query],
+        CONTAIN_QUERY: ['%%' + query + '%%']
     }
     query_search = search_types.get(search_mode)