compound_list.html 8.95 KB
Newer Older
1
{% extends "queries.html" %}
2
{% load customtags %}
Hervé  MENAGER's avatar
Hervé MENAGER committed
3
    
4
{% block title %}compounds list{% endblock %}
Hervé  MENAGER's avatar
Hervé MENAGER committed
5
6

{% block content %}
7
<div id="mainnav">
8
        <nav class="secondary-nav">
9
10
11
        <div class="inner-wrap">
            <ul>
                <li>
12
                    <a href="/compound">By Compounds</a>
13
14
                </li>
                <li>
15
                    <a href="/queries/pockets">By Pockets</a>
16
17
18
19
20
21
                </li>
            </ul>
        </div>
    </nav>
</div>
<div class="inner-wrap">
Rachel TORCHET's avatar
Rachel TORCHET committed
22
23
    <nav class="breadcrumb breadNav" role="navigation">
        <div class="breadNav-label">You are here</div>
24
        <div aria-labelledby="breadcrumb-label">
Rachel TORCHET's avatar
Rachel TORCHET committed
25
          {% block breadcrumb %} <a href="/compound/" class="breadNav-link">{{block.super}}</a> > By compounds</a>{% endblock %} 
26
27
28
        </div>
    </nav>
</div>
Hervé  MENAGER's avatar
Hervé MENAGER committed
29
30
31

<div class="container-fluid">
<div class="row flex-xl-nowrap">
32

33
<main class="col-12" role="main">
34
    <form>
35
        <div class="row">
36
       {% include "multiselection_button.html" with label="PPI Family" param_name="family" %}
37
38
39
40
       {% include "multiselection_button.html" with label="PPI" param_name="ppi" %}
       {% include "multiselection_button.html" with label="Disease" param_name="disease" %}
       {% include "multiselection_button.html" with label="Organism" param_name="taxonomy" %}
       {% include "multiselection_button.html" with label="Bound complex" param_name="boundcomplex" %}
41
       {% include "slider_button.html" with label="Molecular weight" param_name="molecular_weight" %}
42
       {% include "slider_button.html" with label="AlogP" param_name="a_log_p" %}
43
       {% include "slider_button.html" with label="H donors" param_name="nb_donor_h" %}
44
45
        </div>
        <div class="row">
46
        <span class="col-md-6"><span>{{ compounds.paginator.count }} compounds</span>
47
            {% if selected_ppis or selected_diseases or selected_taxonomies or selected_boundcomplexes or molecular_weight != molecular_weight_max or a_log_p != a_log_p_max or nb_donor_h != nb_donor_h_max%}
48
49
50
                <span>&nbsp;-&nbsp;filters:&nbsp;</span>
                {% if selected_ppis %}
                    {% for selected in selected_ppis %}
51
                        {% include "selected_badge.html" with param_name="ppi" selected=selected %}
52
53
54
55
                    {% endfor %}
                {% endif %}
                {% if selected_diseases %}
                    {% for selected in selected_diseases %}
56
                        {% include "selected_badge.html" with param_name="disease" selected=selected %}
57
58
59
60
                    {% endfor %}
                {% endif %}
                {% if selected_taxonomies %}
                    {% for selected in selected_taxonomies %}
61
                        {% include "selected_badge.html" with param_name="taxonomy" selected=selected %}
62
63
64
65
                    {% endfor %}
                {% endif %}
                {% if selected_boundcomplexes %}
                    {% for selected in selected_boundcomplexes %}
66
                        {% include "selected_badge.html" with param_name="boundcomplex" selected=selected %}
67
68
                    {% endfor %}
                {% endif %}
69
70
71
                {% if molecular_weight != molecular_weight_max %}
                    {% include "slider_badge.html" with param_name="molecular_weight" param_value=molecular_weight param_label="MW cutoff" %}
                {% endif %}
72
73
74
                {% if a_log_p != a_log_p_max %}
                    {% include "slider_badge.html" with param_name="a_log_p" param_value=a_log_p param_label="AlogP cutoff" %}
                {% endif %}
75
76
77
                {% if nb_donor_h != nb_donor_h_max %}
                    {% include "slider_badge.html" with param_name="nb_donor_h" param_value=nb_donor_h param_label="H donors" %}
                {% endif %}
78
            {% endif %}
79
        </span>
80
81
82
83
84
        <div class="dropdown">
            <button class="btn btn-secondary dropdown-toggle" type="button" id="sortMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                <i class="fas fa-sort-amount-down" title="sort by"></i>
            </button>
            <div class="dropdown-menu" aria-labelledby="sortMenuButto">
85
86
                {% for sort_by_value, sort_by_entry in sort_by_options.items %}
                        <a class="dropdown-item {% if sort_by_value == sort_by %}active{% endif %}" href="#" onclick="modifyUrl('sort_by','{{ sort_by_value }}')">{{ sort_by_entry.name }} ({{ sort_by_entry.order }})</a>
87
                {% endfor %}
88
89
            </div>
        </div>
90
        <span class="btn-group col-md-2">
91
            <a class="btn btn-default btn-outline-primary {% if display == 'v' %}active{% endif %}" href="#" {% if display != 'v' %}onclick="modifyUrl('display', 'v')"{% endif %}>
92
                <i class="fa fa-th" title="Thumbnails"></i>
93
            </a>
94
            <a class="btn btn-default btn-outline-primary {% if display == 'l' %}active{% endif %}" href="#" {% if display != 'l' %}onclick="modifyUrl('display', 'l')"{% endif %}>
95
96
                <i class="fa fa-bars" title="List"></i>
            </a>
97
98
99
            <a class="btn btn-default btn-outline-primary {% if display == 't' %}active{% endif %}" href="#" {% if display != 't' %}onclick="modifyUrl('display', 't')"{% endif %}>
                <i class="fa fa-table" title="Table"></i>
            </a>
100
        </span>
101
102
        </div>
    </form>
Hervé  MENAGER's avatar
Hervé MENAGER committed
103
{% if compounds %}
104
105
106
107
108
109
    <div class="row">
    {% if display == 'v' %}
        {% for compound in compounds %}
            {% include "compound_v_item.html" with compound=compound %}
        {% endfor %}
    {% elif display == 'l'%}
110
        {% for compound in compounds %}
111
            {% include "compound_l_item.html" with compound=compound %}
112
113
        {% endfor %}
    {% else %}
114
        {% include "compound_t_list.html" with compounds=compounds %}
115
    {% endif %}
116
    </div>
Hervé  MENAGER's avatar
Hervé MENAGER committed
117
{% else %}
118
    <p>Nothing found there!</p>
Hervé  MENAGER's avatar
Hervé MENAGER committed
119
120
121
122
123
124
{% endif %}					
                    </main>
</div>
</div>

<nav>
125
  <ul class="pagination pagination-sm justify-content-end col-12">
Hervé  MENAGER's avatar
Hervé MENAGER committed
126
127
    {% if compounds.has_previous %}
    <li class="page-item">
128
129
130
131
      <a class="page-link" href="?{% url_replace request 'page' compounds.previous_page_number  %}" aria-label="Previous">
        <span aria-hidden="true">&laquo;</span>
        <span class="sr-only">Previous</span>
      </a>
Hervé  MENAGER's avatar
Hervé MENAGER committed
132
133
134
135
136
137
138
139
140
    </li>
    {% endif %}

    <li class="page-item disabled">
     <span class="page-link">Page {{ compounds.number }} of {{ compounds.paginator.num_pages }}.</span>
    </li>

    {% if compounds.has_next %}
    <li class="page-item">
141
142
143
144
      <a class="page-link" href="?{% url_replace request 'page' compounds.next_page_number  %}" aria-label="Next">
        <span aria-hidden="true">&raquo;</span>
        <span class="sr-only">Next</span>
      </a>
Hervé  MENAGER's avatar
Hervé MENAGER committed
145
146
    </li>
    {% endif %}
147
148
149
150
151
152
153
154
155
156

    <li class="page-item ml-3">
      <div class="input-group input-group-sm">
        <input id="pageNumber" type="number" min="1" max="{{compounds.paginator.num_pages}}" step="1" placeholder="page #" style="width: 4em;" aria-label="Page number">
        <div class="input-group-append">
          <button class="btn btn-outline-primary" type="button" onclick="modifyUrl('page',$('#pageNumber').val())">Go</button>
        </div>
      </div>
    </li>

Hervé  MENAGER's avatar
Hervé MENAGER committed
157
158
  </ul>
</nav>
159

160
  {% include "multiselection_modal.html" with label="PPI Family" selected_list=selected_families unselected_list=families param_name="family" all_param_name="families_all" all_param_value=families_all %}
161
162
163
164
  {% include "multiselection_modal.html" with label="PPI" selected_list=selected_ppis unselected_list=ppis param_name="ppi" all_param_name="ppis_all" all_param_value=ppis_all %}
  {% include "multiselection_modal.html" with label="Disease" selected_list=selected_diseases unselected_list=diseases param_name="disease" all_param_name="diseases_all" all_param_value=diseases_all %}
  {% include "multiselection_modal.html" with label="Organism" selected_list=selected_taxonomies unselected_list=taxonomies param_name="taxonomy" all_param_name="taxonomies_all" all_param_value=taxonomies_all %}
  {% include "multiselection_modal.html" with label="Bound complex" selected_list=selected_boundcomplexes unselected_list=boundcomplexes param_name="boundcomplex" all_param_name="boundcomplexes_all" all_param_value=boundcomplexes_all %}
165
166
  {% include "slider_modal.html" with label="Molecular Weight" param_name="molecular_weight" param_min=molecular_weight_min param_max=molecular_weight_max param_value=molecular_weight step='50' param_label='Select a cutoff value for the molecular weight of the compounds to be selected'%}
  {% include "slider_modal.html" with label="AlogP" param_name="a_log_p" param_min=a_log_p_min param_max=a_log_p_max param_value=a_log_p step='1' param_label='Select a cutoff value for the AlogP of the compounds to be selected'%}
167
  {% include "slider_modal.html" with label="H donors" param_name="nb_donor_h" param_min=nb_donor_h_min param_max=nb_donor_h_max param_value=nb_donor_h step='1' param_label='Select a cutoff value for the number of H donors in the compounds to be selected'%}
168

Hervé  MENAGER's avatar
Hervé MENAGER committed
169
{% endblock %}