{% extends "sco_page.j2" %}
{% import 'bootstrap/wtf.html' as wtf %}

{% block styles %}
{{super()}}
<style>
span.mod-label {
    display: inline-block;
    min-width: 300px;
}
#mf .mod-label label {
    display: inline-block;
    min-width: 100px;
}
.field-apo {
    display: inline-block;
    min-width: 300px;
}
.field-edt {
    display: inline-block;
    min-width: 200px;
}
#mf input {
    display: inline;
    width: auto;
}

</style>
{% endblock %}

{% macro render_text_field(field_apo, field_edt, codes_apo_module) %}
<div class="form-group">
    <span class="mod-label">
        {{ field_apo.label(class_="form-label") }}
        <span class="code-apo-module">{{codes_apo_module|join(", ") or ("<em>non défini</em>"|safe)}}</span>
    </span>
    <span class="field-apo">{{field_apo(class_="form-field")}}</span>
    <span class="field-edt">{{field_edt(class_="field-edt")}}</span>
    {%- for error in field_apo.errors %}
        <span class="form-error">{{ error }}</span>
    {% endfor %}
    {%- for error in field_edt.errors %}
        <span class="form-error">{{ error }}</span>
    {% endfor %}
</div>
{% endmacro %}


{% block app_content %}

<div class="tab-content">
<h2>Codes Apogée et emploi du temps des modules du semestre</h2>

<p class="help">Les codes élément Apogée sont utilisés pour les exports des
résultats et peuvent aussi l'être pour connecter l'emploi du temps. Si votre
logiciel d'emploi du temps utilise des codes différents, vous pouvez aussi
indiquer un code EDT spécifique.
</p>

<p class="help">Les codes Apogée modules rappelés à gauche sont ceux définis
dans la formation: il sont utilisés sauf si on spécifie un code ici.
Pour les modifier, aller dans l'édition de la formation.
</p>


<div class="row">
    <div class="col-md-8">
        <form id="mf" class="form form-horizontal" method="post" enctype="multipart/form-data" role="form">
            {{ form.hidden_tag() }}
            {{ wtf.form_errors(form, hiddens="only") }}
            <div class="form-group">
                <span class="mod-label">
                    <label>Module</label>
                    <span class="code-apo-module">Code Apo. Module</span>
                    <span class="field-apo">Code(s) Apogée</span>
                    <span class="field-edt">Code EDT</span>
                </span>
            </div>
            {% for modimpl in formsemestre.modimpls_sorted %}
                {{ render_text_field(form["modimpl_apo_" ~ modimpl.id], form["modimpl_edt_" ~ modimpl.id], modimpl.module.get_codes_apogee()) }}
            {% endfor %}
            <div class="form-group">
                {{ wtf.form_field(form.submit) }}
                {{ wtf.form_field(form.cancel) }}
            </div>
        </form>
    </div>
</div>

</div>
{% endblock %}