{% extends 'template.html' %}

{% block title %}
Eddy summary
{% endblock title %}

{% block subtitle %}
<h3><code>{{ eddyOut.eddy_dir }}</code></h4>
<p>Eddy out file name prefix: {{ eddyOut.eddy_prefix|basename }}</p>
{% endblock subtitle %}

{% block linkline %}
<a class="btn btn-primary btn-lg" href="{{ study_out_html }}" role="button">Back to study level summary &raquo;</a>
{% endblock %}

{% block content %}
<div class="container">
<!-- Example row of columns -->
<div class="row">
  <div class="col-md-12">
    <h2>Motion summary</h2>
    <p class="font-weight-bold">Motion parameters extracted from the Eddy output.</p> 
    <p>Restricted : "This doesn't matter for the correction of the images, it makes no difference if we estimate a large constant EC components and small movement or if we estimate a small EC component and large movement. The corrected images will be (close to) identical. But it matters if one wants to know how much the subject moved. We therefore supplies this file that estimates the movement RMS as above, but which disregards translation in the PE direction."</p>

        <table class="table">
            <tr>
                <th scope="col">Restricted absolute motion</th>
                <th scope="col">Restricted relative motion</th>
                <th scope="col">Number of outlier slices</th>
                <th scope="col">Sum of standard deviations<br>in each outlier slice</th>
                <th scope="col">Mean of standard deviations<br>in each outlier slice</th>
                <th scope="col">Standard deviation of standard deviations<br>in each outlier slice</th>
            </tr>
            <tr>
            {% for key, value in eddyOut.df_motion.items() %}
                {% if key == 'number_of_outlier_slices' %}
                    <td scope="col">{{ value.0 }}</td>
                {% else %}
                    <td scope="col">{{ "%.2f"|format(value|float) }}</td>
                {% endif %}
            {% endfor %}
            </tr>
        </table>

        <br>
        <h3>Outlier slice count for each B shell</h3>
        <table class="table">
            <tr>
                <th scope="col">B-shells</th>
                <th scope="col">Number of outlier slices</th>
                <th scope="col">Number of affected volumes</th>
                <th scope="col">Affected volume</th>
                <th scope="col">Number of total volumes in the shell</th>
            </tr>
            {% for bval, table in eddyOut.eddy_outlier_df.groupby('B value') %}
            <tr>
                <td scope="col">{{bval}}</td>
                <td scope="col">{{table|length}}</td>
                <td scope="col">{{table.groupby('Volume')|length}}</td>
                <td scope="col">
                    {% for vol, vol_table in table.groupby('Volume') %}
                    {{vol}} : 
                        {% for index, row in vol_table.iterrows() %}
                            {{ row.Slice }}
                        {% endfor %}
                        <br>
                    {% endfor %}
                </td>
                <td scope="col">{{eddyOut.volume_in_each_bshell[bval]}}</td>
            </tr>
            {% endfor %}
        </table>

    <br>
    <h2>Outlier slices</h2>
    <p class="font-weight-bold">Information about the slices that were marked as outliers by Eddy.</p> 
    <p><code>Standard deviation</code> : denotes how many standard deviations off the mean difference between observation and prediction is. </p>
    <p><code>standard deviation of the square root</code>: denote how many standard deviations off the square root of the mean squared difference between observation and prediction is.</p>
    <p>The table has been order to show the slice with the highest standard deviation of the square root.</p>


        <table class="table">
            <tr>
                <th scope="col">Volume Number</th>
                <th scope="col">Slice number</th>
                <th scope="col">B-value</th>
                <th scope="col">Standard deviation</th>
                <th scope="col">Square root standard deviation</th>
                <th scope="col">Rank</th>
            </tr>
            {% for row_num, row in eddyOut.eddy_outlier_df.iterrows() %}
                <tr>
                    <td scope="col">{{ "%.0f"|format(row.0|float) }}</td>
                    <td scope="col">{{ "%.0f"|format(row.1|float) }}</td>
                    <td scope="col">{{ "%.0f"|format(row.2|float) }}</td>
                    <td scope="col">{{ "%.2f"|format(row.3|float) }}</td>
                    <td scope="col">{{ "%.2f"|format(row.4|float) }}</td>
                    <td scope="col">{{ "%.0f"|format(row.5|float) }}</td>
                </tr>
            {% endfor %}
        </table>
    <br>

    <br><br>
    {% if image_list %}
        <h2>Outlier slice & replacement images</h2>
        <p class="font-weight-bold">Show how each outlier slice was replaced by Eddy</p> 
    {% endif %}

        <div class="col>
        </div>
        <div class="col-6">
           <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
             <ol class="carousel-indicators">
               <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
               <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
               <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
             </ol>
             <div class="carousel-inner">
               <div class="carousel-item active">
                 <img class="d-block w-100" src="{{ image_list[0] }}" alt="First slide">
               </div>
                {% for img_path in image_list %}
                   <div class="carousel-item">
                       <img class="d-block w-100" src="{{ img_path }}" alt="{{ loop }} slide">
                   </div>
               {% endfor %}
             </div>

             <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
               <span class="carousel-control-prev-icon" aria-hidden="true"></span>
               <span class="sr-only">Previous</span>
             </a>
             <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
               <span class="carousel-control-next-icon" aria-hidden="true"></span>
               <span class="sr-only">Next</span>
             </a>
           </div>
        </div>

    <br><br><br>

    <h2>Post eddy shell alignment information</h2>
        {% for subtitle, table in eddyOut.post_eddy_shell_alignment_df.groupby('subtitle') %} 
        <p class="font-weight-bold">{{ subtitle }}</p> 
            <table class="table">
                <tr>
                    <th scope="col">x-tr (mm)</th>
                    <th scope="col">y-tr (mm)</th>
                    <th scope="col">z-tr (mm)</th>
                    <th scope="col">x-rot (deg)</th>
                    <th scope="col">y-rot (deg)</th>
                    <th scope="col">z-rot (deg)</th>
                    <th scope="col">Sum</th>
                    <th scope="col">Shell info</th>
                </tr>
                {% for row_num, row in table.iterrows() %}
                    <tr>
                        <td scope="col">{{ "%.0f"|format(row.0|float) }}</td>
                        <td scope="col">{{ "%.0f"|format(row.1|float) }}</td>
                        <td scope="col">{{ "%.2f"|format(row.2|float) }}</td>
                        <td scope="col">{{ "%.2f"|format(row.3|float) }}</td>
                        <td scope="col">{{ "%.0f"|format(row.4|float) }}</td>
                        <td scope="col">{{ "%.0f"|format(row.5|float) }}</td>
                        <td scope="col">{{ "%.0f"|format(row.7|float) }}</td>
                        <td scope="col">{{ row.6 }}</td>
                    </tr>
                {% endfor %}
            </table>
        {% endfor %}
    <br>

    <h2>Post eddy shell PE translation information</h2>
        {% for subtitle, table in eddyOut.post_eddy_shell_PE_translation_parameters_df.groupby('subtitle') %} 
            <p class="font-weight-bold">{{ subtitle }}</p> 
            <table class="table">
            {% for row_num, row in table.iterrows() %}
                <tr>
                {% for col in row %}
                    <td scope="col">{{ col }}</td>
                {% endfor %}
                </tr>
            {% endfor %}
            </table>
        {% endfor %}
  </div>
</div>
{% endblock content %}