{% extends 'base.html.twig' %}

{% block title %}AFC E-learning{% endblock %}

{% block body %}

{% include 'partials/accountNavbar.html.twig' %}

<section class="tertiary-section">
    <div class="main-bloc">
        <div class="content">
        {% for qcm in try.qcmSelected %}
            <div class="pos-f-t mb-3">
            <nav class="navbar border navbar-light px-3">
                <div>
                {% if try.scorePerQcm[loop.index0] > 0 %}
                    <span class="material-icons text-success me-2">done_outline</span>{# {{ try.scorePerQcm[loop.index0] }} #}
                {% else %}
                    <span class="material-icons text-danger me-2">clear</span>{# {{ try.scorePerQcm[loop.index0] }} #}
                {% endif %}
                <span class="ms-2">{{ qcm.question }}</span>
                </div>
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarToggleExternalContent{{ loop.index0 }}" aria-controls="navbarToggleExternalContent{{ loop.index0 }}" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
                </button>
            </nav>
            <div class="collapse" id="navbarToggleExternalContent{{ loop.index0 }}">
                <div class="border p-4">
                {% for ans in qcm.answers %}
  
                    <p class="lead-answers">           
                    {% if ans.learnerAnswer == 1 %}
                        <span class="material-icons secondary-color">
                            keyboard_arrow_right
                        </span>
                    {% else %}
                        <span class="material-icons text-light">
                            keyboard_arrow_right
                        </span>
                    {% endif %}
                      
                    {% if ans.state == 1 %}
                        <strong class="text-success">{{ ans.answer }}</strong>
                    {% else %}
                        <span class="text-secondary">{{ ans.answer }}</span>
                    {% endif %}
                    </p>

                {% endfor %}
                </div>
            </div>
            </div>
        {% endfor %}
        </div>
    </div>
    <div class="side-bloc">
            <h1 class="text-secondary mb-4">Correction</h1>
            
            <h3 class="text-secondary mb-4">Note : {% if try.scoreTotal >= module.howManyQcmInTest / 2 %} <span class="text-success">{{ try.scoreTotal|number_format(1) }} / {{ module.howManyQcmInTest }}</span> {% else %} <span class="text-danger">{{ try.scoreTotal|number_format(1) }} / {{ module.howManyQcmInTest }}</span> {% endif %}</h3>
            {% if try.scoreTotal >= module.howManyQcmInTest / 2 and tryState == 3 %}
                <p>Vous pouvez accedez au module suivant :</p>
                {% if lastModule == true %}
                    <div class="row-btn">
                    <a href="{{ path('training_module', {'slug': training.slug, 'slugModule': module.slugModule}) }}"  class="js-timer shadow bg-white return-btn mr-3" data-toggle="tooltip" data-placement="left" title="Retourner au menu du module">
                    <span class="material-icons">
                        keyboard_return
                    </span>
                    </a>
                    <a href="{{ path('training_final_test_prepare', {'slug': training.slug}) }}" class="js-timer secondary-btn">Passer à l'examin final</a>
                    </div>
                {% else %}
                    <div class="row-btn">
                    <a href="{{ path('training_module', {'slug': training.slug, 'slugModule': module.slugModule}) }}"  class="js-timer return-btn shadow bg-white me-3" data-toggle="tooltip" data-placement="left" title="Retourner au menu du module">
                    <span class="material-icons">
                        keyboard_return
                    </span>
                    </a>
                    <a href="{{ path('training_module_qcm_correct', {'slug': training.slug, 'orderNumber': module.orderNumber}) }}" class="js-timer secondary-btn shadow">Module suivant</a>
                    </div>
                {% endif %}
            {% else %}
                <p>La note obtenu est insuffisante pour acceder au module suivant, réviser le module, et réassyer !</p>
                <a href="{{ path('training_module_qcm_reset', {'slug': training.slug, 'orderNumber': module.orderNumber}) }}" class="js-timer primary-btn">Revenir aux module.</a>
            {% endif %}
    </div>
</section>
{% endblock %}