From c18dd0ea0a1d7c26a77a582dd29308648db2cbfd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Herv=C3=A9=20=20MENAGER?= <herve.menager@pasteur.fr>
Date: Fri, 13 Apr 2018 09:41:17 +0200
Subject: [PATCH] hyperlink-based tab navigation for the compound card, first
draft
Former-commit-id: 6e2693ace25440b4b5d051bbcc45a8c40446883e
---
ippisite/ippidb/templates/base.html | 4 ++--
ippisite/ippidb/templates/compound_card.html | 18 +++++++++++++++---
2 files changed, 17 insertions(+), 5 deletions(-)
diff --git a/ippisite/ippidb/templates/base.html b/ippisite/ippidb/templates/base.html
index b37f3425..33a95383 100644
--- a/ippisite/ippidb/templates/base.html
+++ b/ippisite/ippidb/templates/base.html
@@ -93,7 +93,7 @@
data: radarChartData,
options: { scaleLineWidth : 1, pointLabelFontFamily : "'Helvetica Neue'", pointLabelFontSize : 12, scaleOverride : true, scaleSteps : 5, scaleStepWidth : 0.2}});
};
- var drawLeLleBiplotChart = function(canvasId, compoundId, compoundFamily, plotData){
+ var drawLeLleBiplotChart = function(canvasId, compoundId, compoundFamily, plotData, tabHash){
var currentCompoundData = [];
var currentFamilyData = [];
var otherFamiliesData = [];
@@ -150,7 +150,7 @@
var datasetIndex = activePoints[0]._datasetIndex;
var selectedIndex = activePoints[0]._index;
var id = scatterChart.data.datasets[datasetIndex].data[selectedIndex].id;
- window.location = '/compound/'+id;
+ window.location = '/compound/' + id + '#' + tabHash;
};
};
</script>
diff --git a/ippisite/ippidb/templates/compound_card.html b/ippisite/ippidb/templates/compound_card.html
index d9698b7d..60047844 100644
--- a/ippisite/ippidb/templates/compound_card.html
+++ b/ippisite/ippidb/templates/compound_card.html
@@ -153,8 +153,7 @@
<canvas id="radar"></canvas>
<script>
- drawCompoundDescriptorRadarChart('radar', {{ compound.molecular_weight }}, {{ compound.a_log_p }}, {{ compound.nb_donor_h }}, {{ compound.nb_acceptor_h }}, {{ compound.tpsa }}, {{ compound.nb_rotatable_bonds }}, {{ compound.nb_benzene_like_rings }}, {{ compound.fsp3 }}, {{ compound.nb_chiral_centers }});
-
+ drawCompoundDescriptorRadarChart('radar', {{ compound.molecular_weight }}, {{ compound.a_log_p }}, {{ compound.nb_donor_h }}, {{ compound.nb_acceptor_h }}, {{ compound.tpsa }}, {{ compound.nb_rotatable_bonds }}, {{ compound.nb_benzene_like_rings }}, {{ compound.fsp3 }}, {{ compound.nb_chiral_centers }});
</script>
</div>
</div>
@@ -166,7 +165,7 @@
<div class="card-body">
<canvas id="le_lle_biplot"></canvas>
<script>
- drawLeLleBiplotChart('le_lle_biplot', {{ compound.id }}, '{{ compound.best_pXC50_activity_ppi_name|default_if_none:"No target family identified" }}', {{ biplot_data | safe }})
+ drawLeLleBiplotChart('le_lle_biplot', {{ compound.id }}, '{{ compound.best_pXC50_activity_ppi_name|default_if_none:"No target family identified" }}', {{ biplot_data | safe }}, 'v-pills-pharmacology');
</script>
</div>
</div>
@@ -228,4 +227,17 @@
</div>
</div>
</div>
+<script>
+ $(document).ready(function(){
+ var tabHash = document.location.hash;
+ if(!$(tabHash)){
+ tabHash = '#' + $('.nav-link.active')[0].attr('id');
+ }
+ $('[href="'+tabHash+'"]').tab('show');
+ });
+ $('a.nav-link').on('shown.bs.tab', function (e) {
+ window.location.hash = e.target.hash;
+ window.scrollTo(0, 0);
+ });
+</script>
{% endblock %}
--
GitLab