Skip to content

Commit ae3122e

Browse files
author
Prasham Marfatia
committed
Update the web UI for better user interactivity and experience
1 parent 99568ba commit ae3122e

File tree

1 file changed

+67
-48
lines changed

1 file changed

+67
-48
lines changed

‎src/indra_cogex/apps/templates/source_target/source_target_results.html

+67-48
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,18 @@
44

55
{% block styles %}
66
{{ super() }}
7-
<link
8-
href="https://cdn.datatables.net/v/bs4/jszip-3.10.1/dt-2.0.7/b-3.0.2/b-html5-3.0.2/datatables.min.css"
9-
rel="stylesheet"
10-
/>
7+
<link href="https://cdn.datatables.net/v/bs4/jszip-3.10.1/dt-2.0.7/b-3.0.2/b-html5-3.0.2/datatables.min.css"
8+
rel="stylesheet"/>
9+
<style>
10+
.datatable-wrapper {
11+
width: 100%;
12+
overflow-x: auto;
13+
}
14+
.badge {
15+
margin-right: 0.3rem;
16+
margin-bottom: 0.3rem;
17+
}
18+
</style>
1119
{% endblock %}
1220

1321
{% block scripts %}
@@ -44,24 +52,26 @@
4452
{% endblock %}
4553

4654
{% macro render_table(df, table_id) -%}
47-
<table class="table table-hover table-striped datatable" id="{{ table_id }}" style="width: 100%;">
48-
<thead>
49-
<tr>
50-
{% for column in df.columns %}
51-
<th scope="col">{{ column }}</th>
52-
{% endfor %}
53-
</tr>
54-
</thead>
55-
<tbody>
56-
{% for row in df.values %}
55+
<div class="datatable-wrapper">
56+
<table class="table table-hover table-striped datatable" id="{{ table_id }}" style="width: 100%;">
57+
<thead>
5758
<tr>
58-
{% for value in row %}
59-
<td>{{ value }}</td>
59+
{% for column in df.columns %}
60+
<th scope="col">{{ column }}</th>
6061
{% endfor %}
6162
</tr>
62-
{% endfor %}
63-
</tbody>
64-
</table>
63+
</thead>
64+
<tbody>
65+
{% for row in df.values %}
66+
<tr>
67+
{% for value in row %}
68+
<td>{{ value }}</td>
69+
{% endfor %}
70+
</tr>
71+
{% endfor %}
72+
</tbody>
73+
</table>
74+
</div>
6575
{% endmacro %}
6676

6777
{% block container %}
@@ -95,12 +105,13 @@ <h4>Target Genes</h4>
95105
{% endfor %}
96106
</p>
97107

98-
{% if results.statements %}
108+
{% if results.statements and results.statements.items() %}
99109
<h3>INDRA Statements</h3>
100-
<p>Direct relationships between source and target genes from the INDRA database:</p>
101-
<div class="statements-container">
102-
{{ results.statements | safe }}
103-
</div>
110+
<p>Direct relationships between source and target genes:</p>
111+
{% for gene, statement in results.statements.items() %}
112+
<h4>{{ gene }}</h4>
113+
{{ statement | safe }}
114+
{% endfor %}
104115
{% endif %}
105116

106117
{% if results.interaction_plot %}
@@ -113,44 +124,52 @@ <h3>Interaction Types</h3>
113124
</div>
114125
{% endif %}
115126

116-
{% if results.pathways %}
117-
<h3>Shared Pathways</h3>
118-
<p>Biological pathways shared between source and target genes:</p>
119-
{{ render_table(results.pathways, "table-pathways") }}
127+
{% if results.discrete_analysis and results.discrete_analysis.get('go') is not none
128+
and results.discrete_analysis.get('go').shape[0] > 0 %}
129+
<h3>GO Analysis</h3>
130+
<p>Gene Ontology enrichment analysis:</p>
131+
{{ render_table(results.discrete_analysis.get('go'), "table-go") }}
132+
133+
{% if results.discrete_analysis.get('wikipathways') is not none
134+
and results.discrete_analysis.get('wikipathways').shape[0] > 0 %}
135+
<h3>WikiPathways Analysis</h3>
136+
{{ render_table(results.discrete_analysis.get('wikipathways'), "table-wiki") }}
137+
{% endif %}
120138
{% endif %}
121139

122-
{% if results.protein_families %}
140+
{% if results.protein_families is not none and results.protein_families.shape[0] > 0 %}
123141
<h3>Protein Families</h3>
124-
<p>Protein family relationships:</p>
142+
<p>Shared protein family relationships:</p>
125143
{{ render_table(results.protein_families, "table-families") }}
126144
{% endif %}
127145

128-
{% if results.go_terms %}
129-
<h3>GO Term Analysis</h3>
130-
<p>Shared Gene Ontology terms between source and target genes:</p>
131-
{{ render_table(results.go_terms.shared_terms, "table-go") }}
146+
{% if results.combined_pathways is not none and results.combined_pathways.shape[0] > 0 %}
147+
<h3>Combined Pathway Analysis</h3>
148+
<p>Combined REACTOME and WikiPathways analysis:</p>
149+
{{ render_table(results.combined_pathways, "table-combined-pathways") }}
150+
{% endif %}
151+
152+
{% if results.go_terms and results.go_terms.get('shared_terms') is not none
153+
and results.go_terms.get('shared_terms').shape[0] > 0 %}
154+
<h3>GO Terms Analysis</h3>
155+
<p>Shared Gene Ontology terms:</p>
156+
{{ render_table(results.go_terms.get('shared_terms'), "table-shared-go") }}
132157
{% endif %}
133158

134-
{% if results.upstream %}
159+
{% if results.upstream and results.upstream.get('shared_proteins') %}
135160
<h3>Upstream Analysis</h3>
136161
<p>Shared upstream regulatory mechanisms:</p>
137-
{% if results.upstream.shared_proteins %}
138-
<h4>Shared Proteins</h4>
139-
<ul>
140-
{% for protein in results.upstream.shared_proteins %}
141-
<li>{{ protein }}</li>
142-
{% endfor %}
143-
</ul>
144-
{% endif %}
145-
{% if results.upstream.shared_entities %}
146-
<h4>Detailed Analysis</h4>
147-
{{ render_table(results.upstream.shared_entities, "table-upstream") }}
148-
{% endif %}
162+
<h4>Shared Proteins</h4>
163+
<p>
164+
{% for protein in results.upstream.get('shared_proteins') %}
165+
<span class="badge badge-primary">{{ protein }}</span>
166+
{% endfor %}
167+
</p>
149168
{% endif %}
150169

151170
{% if results.analysis_plot %}
152171
<h3>Statistical Analysis</h3>
153-
<p>Distribution of p-values and q-values for various analyses:</p>
172+
<p>Distribution of p-values and q-values:</p>
154173
<div class="plot-container">
155174
<img src="data:image/png;base64,{{ results.analysis_plot }}"
156175
alt="Statistical Analysis Plots"

0 commit comments

Comments
 (0)