Commit a412d619 authored by Hervé  MENAGER's avatar Hervé MENAGER
Browse files

use smilesDrawer to draw compounds


Former-commit-id: bc1aea02c5aa48d2967c78ded8b19867d51c4db4
parent 6f5a4bb9
var drawSmiles = function(){
$('canvas[data-smiles]').each(function(){
var el = this;
var options = {width:$(el).attr('width'), height: $(el).attr('height')};
var smilesDrawer = new SmilesDrawer.Drawer(options);
SmilesDrawer.parse($(el).attr('data-smiles'), function(tree) {
// Draw to the canvas
smilesDrawer.draw(tree, el, 'light', false);
});
})
};
window.addEventListener("load",drawSmiles);
This diff is collapsed.
......@@ -18,8 +18,10 @@
<script src="/static/typeahead/typeahead.bundle.min.js"></script>
<script defer src="/static/font-awesome/js/fontawesome-all.min.js"></script>
<script src="/static/chartjs/Chart.bundle.js"></script>
<script src="/static/smilesdrawer/smiles-drawer.min.js"></script>
<script src="/static/js/ippidb.js" type="text/javascript"></script>
<script src="/static/js/ippidb-smilesdrawer.js" type="text/javascript"></script>
{% block extra_js %}{% endblock %}
<script type="text/javascript">
......
......@@ -29,7 +29,7 @@
</div>
<div class="card text-center">
<div class="card-body">
{% include "pubchem_img.html" %}
{% include "compound_smiles_draw.html" %}
</div>
</div>
</div>
......
<div class="row m-2 border border-info bg-light">
<div class="col-sm-3 border-info d-flex justify-content-center align-content-center">
<a href="/compounds/{{ compound.id }}">{% include "pubchem_img.html" %}</a>
<a href="/compounds/{{ compound.id }}">{% include "compound_smiles_draw.html" %}</a>
<h2 class="position-absolute" style="top:0.3em; left:0.3em;"><span class="badge badge-dark"><a href="/compounds/{{ compound.id }}">{{ compound.id }}</a></span></h2>
</div>
<div class="col-sm-9">
......
<canvas id="canvas-{{ compound.id }}" width="300" height="300" data-smiles="{{ compound.canonical_smile }}"></canvas>
<div class="p-2">
<div class="card border border-info">
<a href="/compounds/{{ compound.id }}">{% include "pubchem_img.html" %}</a>
<a href="/compounds/{{ compound.id }}">{% include "compound_smiles_draw.html" %}</a>
<h2 class="position-absolute" style="top:0.3em; left:0.3em;"><span class="badge badge-dark"><a href="/compounds/{{ compound.id }}">{{ compound.id }}</a></span></h2>
<div class="card-body" style="overflow:hidden; word-wrap:break-word;">
{%if compound.common_name %}<p class="ml-2">{{ compound.common_name }}</p>{% endif %}
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment