{# -*- mode: jinja-html -*- #}
{% extends 'base.j2' %}

{% block styles %}
{{super()}}
<style>
.dept-name {
    font-size: 120%;
    font-weight: bold;
}
.dept {
    background-color: bisque;
    border-radius: 12px;
    padding: 8px;
    margin-bottom: 12px;
}
.dept label {
    font-weight: normal;
}
button[name="action"] {
    margin-right: 32px;
}
#submit-button:disabled {
  background-color: #CCCCCC;
  color: #888888;
  cursor: not-allowed;
  border: 1px solid #AAAAAA;
}
</style>
{% endblock %}

{% block app_content %}

<h2>Création d'une copie de {{ etud.html_link_fiche() | safe }}</h2>

<div class="help"> 

<p>Utiliser cette page lorsqu'un étudinat change de département. ScoDoc gère
séparéement les étudiants des départements. Il faut donc dans ce cas
exceptionnel créer une copie de l'étudiant et l'inscrire dans un semestre de son
nouveau département. Seules les donénes sur l'identité de l'étudiant (état
civil, adresse, ...) sont dupliquées. Dans le noveau département, les résultats
obtenus dans le département d'origine ne seront pas visibles.
</p>

<p>Si des UEs ou compétences de l'ancien département doivent être validées dans
le nouveau, il faudra utiliser ensuite une "validation d'UE antérieure".
</p>

<p>Attention: seuls les départements dans lesquels vous avez la permission
d'inscrire des étudiants sont présentés ici. Il faudra peut-être solliciter
l'administrateur de ce ScoDoc.
</p> 

<p>Dans chaque département autorisés, seuls les semestres non verrouillés sont
montrés. Choisir le semestre destination et valider le formulaire.
</p>

<p>Ensuite, ne pas oublier d'inscrire l'étudiant à ses groupes, notamment son
parcours si besoin.
</p>

</div>

<form method="POST">
    {% for dept in departements.values() %}
        <div class="dept">
            <div class="dept-name">Département {{ dept.acronym }}</div>
            {% for sem in formsemestres_by_dept[dept.id]%}
            <div>
                <label>
                    <input type="radio" class="formsemestre" name="formsemestre_id" value="{{ sem.id }}"> 
                    {{ sem.html_link_status() | safe }}
                </label>
            </div>
            {% endfor %}
        </div>
    {% endfor %}
    <button type="submit" name="action" value="submit" disabled id="submit-button">Créer une copie de l'étudiant et l'inscrire au semestre choisi</button>
    <button type="submit" name="action" value="cancel">Annuler</button>
</form>

<script>
    const radioButtons = document.querySelectorAll('input.formsemestre');
    const submitButton = document.getElementById('submit-button');

    radioButtons.forEach(radioButton => {
        radioButton.addEventListener('change', () => {
            const isAnyRadioButtonChecked = [...radioButtons].some(radioButton => radioButton.checked);
            if (isAnyRadioButtonChecked) {
                submitButton.removeAttribute('disabled');
            } else {
                submitButton.setAttribute('disabled', 'disabled');
            }
        });
    });
</script>

{% endblock %}