view templates/main_template.html @ 1:964ec10d568c

new NIST wrapper demo tools
author pieter.lukasse@wur.nl
date Thu, 22 Jan 2015 16:15:30 +0100
parents cce6989ed423
children
line wrap: on
line source

<html>
<!-- see http://jinja.pocoo.org/docs/dev/templates/
     and http://jinja.pocoo.org/docs/dev/tricks/ -->
<head>
	<link rel="stylesheet" type="text/css" href="lib/jquery.dataTables.css">
	<script type="text/javascript" charset="utf8" src="lib/jquery-1.11.1.js"></script>
	<script type="text/javascript" charset="utf8" src="lib/jquery.dataTables.js"></script>
	<script type="text/javascript" charset="utf8" src="lib/d3.v3.js"></script>
	<script type="text/javascript" src="spectrum_gen.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
	    	$("#myTable").DataTable();
		});
	</script>
	<style>
	    /*This part is mainly used by spectrum visualization: */
		body {
		  font: 10px sans-serif;
		}
		.y.axisRight text {
		    fill: orange;
		}
		.y.axisLeft text {
		    fill: steelblue;
		}
		.axis path,
		.axis line {
		  fill: none;
		  stroke: #000;
		  shape-rendering: crispEdges;
		}
		.bar1 {
		  fill: steelblue;
		}
		.bar2 {
		  fill: orange;
		}
	</style>	
	
</head>
<body>
	<table id="myTable" class="display">
		<thead>
			<tr>
				<th>id</th>
				<th>compound_name</th>
				<th>formula</th>
				<th>lib_name</th>
				<th>id_in_lib</th>
				<th>mf</th>
				<th>rmf</th>
				<th>prob</th>
				<th>cas</th>
				<th>mw</th>
				<th>spectrum</th>
				<th>comparison</th>
			</tr>
		</thead>
		<tbody>	
{% for entry in hits_dict['id'] %}
			<tr>
				<td>{{hits_dict['id'][loop.index-1]}} </td> 
				<td>{{hits_dict['compound_name'][loop.index-1]}} </td> 
				<td>{{hits_dict['formula'][loop.index-1]}} </td> 
				<td>{{hits_dict['lib_name'][loop.index-1]}} </td> 
				<td>{{hits_dict['id_in_lib'][loop.index-1]}} </td> 
				<td>{{hits_dict['mf'][loop.index-1]}} </td> 
				<td>{{hits_dict['rmf'][loop.index-1]}} </td> 
				<td>{{hits_dict['prob'][loop.index-1]}} </td> 
				<td>{{hits_dict['cas'][loop.index-1]}} </td> 
				<td>{{hits_dict['mw'][loop.index-1]}} </td> 
				<td><button onclick="renderSpectrumFromMSPString('{{spectra_dict[hits_dict['id'][loop.index-1]]}}','body')">
				View</button> 
				</td>
				<td><button onclick="renderComparisonSpectrum('{{spectra_dict[hits_dict['id'][loop.index-1]]}}','{{hits_dict['cas'][loop.index-1]}}','body')">
				View comparison</button> 
				</td>
			</tr>
{% endfor %}
		</tbody>
	</table>
</body>
</html>