{% extends "tabbed.html" %}

{% block title %}q2-vsearch : fastq_stats{% endblock %}

{% block head %}
<style media="screen">
    body {
        overflow: hidden; /* hide rounding error in viewport calc */
    }

    iframe {
        height: 80vh;
        width: 100%;
        border: none;
    }

    #q2templatesheader ~ .row > iframe {
	height: calc(80vh - 85px);
    }
</style>
{% endblock %}

{% block tabcontent %}
<div class="row">
    <div class="col-lg-12">
        <h1>vsearch - fastq_stats</h1>
        {% set colsize = 6 if paired else 12 %}
        <div class="row">
            <div class="col-lg-{{ colsize }}">
                <h4>Forward Reads</h4>
                <a href="{{ datafiles.forward.stats }}" href="{{ datafiles.forward.stats }}">Download as TXT</a>
                <p style="margin-top: 15px">
                    <iframe src="{{ datafiles.forward.stats }}" frameborder="0" width="95%"></iframe>
                </p>
            </div>
            {% if paired %}
            <div class="col-lg-{{ colsize }}">
                <h4>Reverse Reads</h4>
                <a href="{{ datafiles.reverse.stats }}" download="{{ datafiles.reverse.stats }}">Download as TXT</a>
                <p style="margin-top: 15px">
                    <iframe src="{{ datafiles.reverse.stats }}" frameborder="0" width="95%"></iframe>
                </p>
            </div>
            {% endif %}
        </div>
    </div>
</div>
{% endblock %}