add grid/list switch for compounds list view

Former-commit-id: 1e14d69cb89f7c42b4ebb07a10a02e608590b4cd

ippisite/ippidb/templates/compound_list.html

@@ -40,7 +40,8 @@
 
 <main class="col-12 col-md-9 col-xl-10 pl-md-5 bd-content" role="main">
     <form>
-        <div class="row m-2 border border-bg-light"><span>{{ count }} compounds</span>
+        <div class="">
+        <span class="m-2"><span>{{ count }} compounds</span>
             {% if selected_ppis or selected_diseases or selected_taxonomies or selected_boundcomplexes %}
                 <span>&nbsp;-&nbsp;filters:&nbsp;</span>
                 {% if selected_ppis %}
@@ -64,10 +65,19 @@
                     {% endfor %}
                 {% endif %}
             {% endif %}
+        </span>
+        <span class="btn-group float-right">
+            <a class="btn btn-default btn-outline-primary {% if not display_list %}active{% endif %}" href="#" {% if display_list %}onclick="modifyUrl('display_list', null)"{% endif %}>
+                <i class="fa fa-th" title="Vignettes"></i>
+            </a>
+            <a class="btn btn-default btn-outline-primary {% if display_list %}active{% endif %}" href="#" {% if not display_list %}onclick="modifyUrl('display_list', true)"{% endif %}>
+                <i class="fa fa-bars" title="List"></i>
+            </a>
+        </span>
         </div>
     </form>
 {% if compounds %}
-    {% if display_table %}
+    {% if display_list %}
         {% for compound in compounds %}
             {% include "compound_table_item.html" with compound=compound %}
         {% endfor %}

ippisite/ippidb/views.py

@@ -211,6 +211,7 @@ def compound_list(request):
     except EmptyPage:
         # If page is out of range (e.g. 9999), deliver last page of results.
         compounds = paginator.page(paginator.num_pages)
+    display_list = request.GET.get('display_list')
     return render(request, 'compound_list.html', {'compounds': compounds,
                                                   'count': count,
                                                   'selected_ppis': selected_ppis,
@@ -224,7 +225,8 @@ def compound_list(request):
                                                   'taxonomies_all': taxonomies_all,
                                                   'selected_boundcomplexes': selected_boundcomplexes,
                                                   'boundcomplexes': boundcomplexes,
-                                                  'boundcomplexes_all': boundcomplexes_all
+                                                  'boundcomplexes_all': boundcomplexes_all,
+                                                  'display_list': display_list
                                                 })
 
 def compound_card(request, compound_id):