|
0
|
1 <html>
|
|
|
2 <!-- see http://jinja.pocoo.org/docs/dev/templates/
|
|
|
3 and http://jinja.pocoo.org/docs/dev/tricks/ -->
|
|
|
4 <head>
|
|
|
5 <link rel="stylesheet" type="text/css" href="lib/jquery.dataTables.css">
|
|
|
6 <script type="text/javascript" charset="utf8" src="lib/jquery-1.11.1.js"></script>
|
|
|
7 <script type="text/javascript" charset="utf8" src="lib/jquery.dataTables.js"></script>
|
|
|
8 <script type="text/javascript" charset="utf8" src="lib/d3.v3.js"></script>
|
|
|
9 <script type="text/javascript" src="spectrum_gen.js"></script>
|
|
|
10 <script type="text/javascript">
|
|
|
11 $(document).ready(function(){
|
|
|
12 $("#myTable").DataTable();
|
|
|
13 });
|
|
|
14 </script>
|
|
|
15 <style>
|
|
|
16 /*This part is mainly used by spectrum visualization: */
|
|
|
17 body {
|
|
|
18 font: 10px sans-serif;
|
|
|
19 }
|
|
|
20 .y.axisRight text {
|
|
|
21 fill: orange;
|
|
|
22 }
|
|
|
23 .y.axisLeft text {
|
|
|
24 fill: steelblue;
|
|
|
25 }
|
|
|
26 .axis path,
|
|
|
27 .axis line {
|
|
|
28 fill: none;
|
|
|
29 stroke: #000;
|
|
|
30 shape-rendering: crispEdges;
|
|
|
31 }
|
|
|
32 .bar1 {
|
|
|
33 fill: steelblue;
|
|
|
34 }
|
|
|
35 .bar2 {
|
|
|
36 fill: orange;
|
|
|
37 }
|
|
|
38 </style>
|
|
|
39
|
|
|
40 </head>
|
|
|
41 <body>
|
|
|
42 <table id="myTable" class="display">
|
|
|
43 <thead>
|
|
|
44 <tr>
|
|
|
45 <th>id</th>
|
|
|
46 <th>compound_name</th>
|
|
|
47 <th>formula</th>
|
|
|
48 <th>lib_name</th>
|
|
|
49 <th>id_in_lib</th>
|
|
|
50 <th>mf</th>
|
|
|
51 <th>rmf</th>
|
|
|
52 <th>prob</th>
|
|
|
53 <th>cas</th>
|
|
|
54 <th>mw</th>
|
|
|
55 <th>spectrum</th>
|
|
|
56 <th>comparison</th>
|
|
|
57 </tr>
|
|
|
58 </thead>
|
|
|
59 <tbody>
|
|
|
60 {% for entry in hits_dict['id'] %}
|
|
|
61 <tr>
|
|
|
62 <td>{{hits_dict['id'][loop.index-1]}} </td>
|
|
|
63 <td>{{hits_dict['compound_name'][loop.index-1]}} </td>
|
|
|
64 <td>{{hits_dict['formula'][loop.index-1]}} </td>
|
|
|
65 <td>{{hits_dict['lib_name'][loop.index-1]}} </td>
|
|
|
66 <td>{{hits_dict['id_in_lib'][loop.index-1]}} </td>
|
|
|
67 <td>{{hits_dict['mf'][loop.index-1]}} </td>
|
|
|
68 <td>{{hits_dict['rmf'][loop.index-1]}} </td>
|
|
|
69 <td>{{hits_dict['prob'][loop.index-1]}} </td>
|
|
|
70 <td>{{hits_dict['cas'][loop.index-1]}} </td>
|
|
|
71 <td>{{hits_dict['mw'][loop.index-1]}} </td>
|
|
|
72 <td><button onclick="renderSpectrumFromMSPString('{{spectra_dict[hits_dict['id'][loop.index-1]]}}','body')">
|
|
|
73 View</button>
|
|
|
74 </td>
|
|
|
75 <td><button onclick="renderComparisonSpectrum('{{spectra_dict[hits_dict['id'][loop.index-1]]}}','{{hits_dict['cas'][loop.index-1]}}','body')">
|
|
|
76 View comparison</button>
|
|
|
77 </td>
|
|
|
78 </tr>
|
|
|
79 {% endfor %}
|
|
|
80 </tbody>
|
|
|
81 </table>
|
|
|
82 </body>
|
|
|
83 </html> |
