1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
|
%div.card.bg-light
%div.card-body
%div.card-title
%h3 Neighbors:
#tabs
%ul.nav.nav-pills.nav-justified{:id=>"neighborTabs", :role=>"tablist"}
- @models.each_with_index do |model,i|
/ get predictionFeature type
- m = Model::Lazar.find model.model_id.to_s
%li.nav-item
%a.nav-link{:class => ("active" if i ==0), :href => "#results_#{i+1}", :id => "linkTab#{i+1}", data: {toggle:"tab"}}
= "#{model.endpoint} (#{model.species})"
%div.tab-content
- @predictions.each_with_index do |prediction,j|
#results.tab-pane{:id=>"#{j+1}", :class => ("active" if j == 0)}
- if prediction[:neighbors]
%div.table-responsive
%table.table.table-bordered.table-hover{:id=>"nTable#{j+1}"}
%thead
%tr
%th{:scope=>"col"}
Compound
%th{:scope=>"col"}
Measured Activity
%a.btn.fa.fa-info-circle{:href=>"javascript:void(0)", :title=>"Measured Activity", :tabindex=>"0", data: {trigger:"focus", container:"body", toggle:"popover", placement:"auto", html:"true", content:"Experimental result(s) from the training dataset."}, :style=>"z-index:auto+10;"}
%th{:scope=>"col"}
Similarity
%a.btn.fa.fa-info-circle{:href=>"javascript:void(0)", :title=>"Similarity", :tabindex=>"0", data: {trigger:"focus", container:"body", toggle:"popover", placement:"auto", html:"true", content:"<a alt=\"Link opens in new window.\" title=\"Link opens in new window.\" target=\"_blank\" href=\"https://en.wikipedia.org/wiki/Jaccard_index\">Tanimoto/Jaccard</a> similarity based on <a alt=\"Link opens in new window.\" title=\"Link opens in new window.\" target=\"_blank\" href=\"https://openbabel.org/docs/dev/FileFormats/MolPrint2D_format.html\">Molprint2D</a> fingerprints."}, :style=>"z-index:auto+10;"}
%tbody
- type = @model_types[j]
- unit = @models[j].unit
- prediction[:neighbors].uniq.each_with_index do |neighbor,count|
%tr
/ Compound
- c = Compound.find(neighbor)
%td
%a.btn.btn-link{:href => "#details#{j+1}", data: { toggle: "modal", remote: "//#{ENV['VIRTUAL_HOST']}/prediction/#{CGI.escape(c.id.to_s)}/details", :id=>"link#{j+1}#{count}"}}
= embedded_svg(c.svg, :title=>"click for details")
/ Measured Activity
%td
- if neighbor[:measurement].is_a?(Array)
= (type == "Regression") ? neighbor[:measurement].collect{|value| "#{value.delog10.signif(3)} (#{unit})</br>#{c.mmol_to_mg(value.delog10).signif(3)} #{unit =~ /mmol\/L/ ? "(mg/L)" : "(mg/kg_bw/day)"}"}.join("</br>") : neighbor[:measurement].join(", ")
- else
- if !neighbor[:measurement].nil?
= (type == "Regression") ? "#{neighbor[:measurement].delog10.signif(3)} (#{unit})</br>#{c.mmol_to_mg(neighbor[:measurement].delog10).signif(3)} #{(unit =~ /\b(mmol\/L)\b/) ? "(mg/L)" : "(mg/kg_bw/day)"}" : neighbor[:measurement]
- if c.cid && c.cid != "0"
%p
%a{:href=>PUBCHEM_CID_URI+c.cid, :rel => "external"}
PubChem
%span.fa.fa-xs.fa-external-link
/ Similarity = tanimoto
%td
= neighbor[:similarity].round(3)
- else
%span.btn.btn-default.disabled
= "Not enough similar compounds in training dataset"
%div.modal.fade{:id=>"details#{j+1}", :role=>"dialog"}
%div.modal-dialog.modal-lg{:role=>"document"}
%div.modal-content
- @models.each_with_index do |model,i|
:javascript
// sort all neighbors tables by similarity
document.addEventListener('DOMContentLoaded', function() {
var id = '#{i+1}';
var table, rows, switching, i, x, y, shouldSwitch;
table = document.getElementById("nTable"+id);
switching = true;
/* Make a loop that will continue until
no switching has been done: */
while (switching) {
// Start by saying: no switching is done:
switching = false;
rows = table.rows;
/* Loop through all table rows (except the
first, which contains table headers): */
for (i = 1; i < (rows.length - 1); i++) {
// Start by saying there should be no switching:
shouldSwitch = false;
/* Get the two elements you want to compare,
one from current row and one from the next: */
x = rows[i].getElementsByTagName("TD")[2];
y = rows[i + 1].getElementsByTagName("TD")[2];
// Check if the two rows should switch place:
if (parseFloat(x.innerHTML) < parseFloat(y.innerHTML)) {
// If so, mark as a switch and break the loop:
shouldSwitch = true;
break;
}
}
if (shouldSwitch) {
/* If a switch has been marked, make the switch
and mark that a switch has been done: */
rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
switching = true;
}
}
}, false);
|
