{% extends "base.j2.html" %}

{% block title %}GEMINI query interface{% endblock %}

{% block head %}{% endblock %}


{% block body %}

<div class='row page'>



	<!--
		<form action="/query" method="GET">
			<input class="span6" type="text" size="100" maxlength="1000" name="query">
			<input type="submit" name="save" value="save">
		</form>
	-->



	<form class="well span6 offset3">
		<div class="row">
			<div class="span3">
				<p>
					<h3>GEMINI database:</h3>
					<em>{{dbfile}}</em>
				</p>
			</div>
			<div class="span2 offset1">
<!--				<img src="/static/img/gemini.png" width="150px" class="img-rounded">
-->
			</div>
		</div>
		<hr>
		<div class="control-group">
			<label class="control-label" for="query">
				<strong>Query</strong>
				<br>
				<em>e.g., select chrom, start, end, ref, alt, gts.sample1 from variants limit 10</em>
			</label>
			<div class="controls">
                <textarea rows="4" class="span6" name="query", >{{query}}</textarea>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="gt-filter">
				<strong>Genotype Filters</strong>
				<br>
				<em>(e.g., (gt_types.sample1 == HET and gt_types.sample2 == HOM_REF))</em>
			</label>
			<div class="controls">
                <textarea rows="3" class="span6" name="gt_filter", >{{gt_filter}}</textarea>
			</div>
		</div>
		<div class="control-group">
			<label class="checkbox">
				<input type="checkbox" value="{{use_header}}" name = "use_header" id="use_header"> Add a header?
			</label>
		</div>
		<div class="control-group">
			<label class="checkbox">
				<input type="checkbox" value="{{igv_links}}" name = "igv_links" id="igv_links">
                Make rows into IGV links (enable port 60151 in IGV)?
                <br>
                <strong>Note:</strong><em>  If checked, you must include</em> <code>chrom</code>,
                    <code>start</code>, and <code>end</code> in your query.
			</label>
		</div>
		<div class="control-group">
			<div class="controls">
				<button type="submit" class="btn btn-large btn-primary" name="submit" value="submit">
					Submit
				</button>
				<button type="submit" class="btn btn-large btn-success" name="save" value="save">
					Save as text file
				</button>
				{%if tmp_file%}
				<a href="/static/{{tmp_file}}" class="btn btn-large">
					Click for results
				</a>
				{% endif %}
			</div> <!-- end of debug-pane -->
		</div>
	</div>
</form>


{% if not igv_links_error %}
<div class="span12 table-wrapper">

    	<table class='table table-striped table-hover table-condensed' data-provides="rowlink">
    		<tbody>
    			{% for row in rows %}
    			<tr>
                    {% if igv_links %}
                        <td>
                            <a href="http://localhost:60151/goto?locus={{row['chrom']}}:{{row['start']}}-{{row['end']}}"></a>
                        </td>
                    {% endif %}
    				{%for col in row %}
    				<td>{{ row[col]}}</td>
    				{% endfor %}
    			</tr>
    			{% endfor %}
    		</tbody>
    	</table>
</div> <!-- end of debug-pane -->
{% else %}
<div class="alert alert-error span7 offset2" >
    <strong>Error: </strong>If requesting links to IGV, you must select chrom, start, and end.
</div>
{% endif %}



</div><!-- end of page -->

{% endblock %}
