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

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

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

    {% include 'partials/filter.html.twig' %}
    <section class="secondary-section">
        <div class="content">
            <div class="banner">
                <h1 class="h4 text-secondary">{{ chapter.title }}</h1>
                <div>
                    {% if chapter.summarySheetFileName != null %}
                    <span class="material-icons text-secondary mr-4" data-toggle="tooltip" data-placement="top" 
                    title="Télécharger une fiche résumé format pdf">
                        help
                    </span>   

                    <a href="{{ asset('uploads/summarysummary/' ~ chapter.summarySheetFileName) }}" target="_blank" class="download-btn mx-3 shadow">
                        Résumé pdf
                    <span class="material-icons">
                        get_app
                    </span>
                    </a>
                    {% endif %}

                    <button class="menu-btn" id="step-menu-btn">
                        <span class="material-icons">
                            list
                        </span>
                    </button>
                </div>
            </div>
            <div class="chapter-content">
                {% if chapter.video %}
                    <div class="text-center">
                    {{ chapter.video|raw }}
                    </div>
                    <p class="text-center">Code de la vidéo : <strong class="secondary-color">{{ chapter.videoCode }}</strong></p>
                {% endif %}
                {{ chapter.content|raw }}

            {# La première fois que le stagiaire remplis l'étude, ou 
               doit recommencer une étude de cas suis à une invalidation  #} 
            {% if chapter.category.name == 'Etude de cas' %}
            {% if lastCaseStudy == false or caseStudyState == 0 %}
                <div class="card shadow my-3">
                    <div class="card-header">
                        <h3>
                        <span class="material-icons secondary-color" data-toggle="tooltip" data-placement="top" title="L'étude de cas sera corrigé par le formateur, vous pouvez accéder aux autres chapitres en cliquant sur 'chapitre suivant' une fois l'étude de cas envoyer">
                            help_outline
                        </span>
                        Exercice</h3>
                        {% if lastCaseStudy == true and caseStudyState == 0 %}
                        <p class="text-warning"> Votre précédente étude de cas n'a point été validé, veuillez recommencer. </p>
                        {% endif %}
                    </div>
                    <div class="card-body">
                        {{ form_start(form) }}
                        {{ form_widget(form) }}
                        {# <input type="submit" value="Envoyer" class="js-timer secondary-btn"> #}
                        <button class="js-timer my-4 secondary-btn bg-success">Envoyer</button>
                        {{ form_end(form) }}
                    </div>
                </div>
            {% endif %}
            {% endif %}
            {# Etude de cas en attente de correction #}
            {% if chapter.category.name == 'Etude de cas' and
                  caseStudyState == 1 %}
            <div class="card shadow mb-3 mt-3">
                <div class="card-header">
                    <h3 class="text-secondary mb-0">
                        <span class="material-icons secondary-color" data-toggle="tooltip" data-placement="top" title="L'étude de cas sera corrigé par le formateur, vous pouvez accéder aux autres chapitres en cliquant sur 'chapitre suivant' une fois l'étude de cas envoyer">
                            help_outline
                        </span> 
                        Exercice -
                        <span class="badge bg-warning mb-3">En cours de correction</span></h3>
                        <p class="lead text-warning">Merci d'envoyer un SMS au <strong>06 75 10 93 78</strong>, vous recevrez un sms de retour des la correction de vos études de cas pour passer au <strong>module</strong> suivant</p>
                </div>
                <div class="card-body">
                    <div class="alert border border-secondary p-5">
                        {{ lastCaseStudy.writingResponse }}
                    </div>
                </div>
            </div>
            {% endif %}

            {# Etude de cas validé #}
            {% if chapter.category.name == 'Etude de cas' and
                  caseStudyState == 2 %}
            <div class="card shadow mb-3 mt-3">
                <div class="card-header">
                    <h3><span class="badge badge-success">Validé</span> Exercice</h3>
                </div>
                <div class="card-body">
                    <div class="alert border border-success p-5">
                    {{ lastCaseStudy.writingResponse }}
                    </div>
                </div>
            </div>
            {% endif %}
              
            {% if isLastChap == true 
                and caseStudyState == 2 
                and chapter.category.name == 'Etude de cas' %}
                
                <div class="my-3 d-flex justify-content-center">
                    <a href="{{ path('training_module', {'slug': training.slug, 'slugModule': module.slugModule}) }}" class="return-btn bg-white shadow mr-3 js-timer">
                        <span class="material-icons">
                            keyboard_return
                        </span>
                    </a>
                    {% if module.hasQcmTest == true and qcmState == 1 %}
                        <a href="{{ path('training_module_qcm_prepare', {'slug' : training.slug, 'id' : module.id }) }}" class="secondary-btn js-timer">Questionnaire</a>
                    {% endif %}
                    {% if module.hasQcmTest == true and qcmState == 3 %}
                        <a href="{{ path('training_module_qcm', {'slug': training.slug, 'orderNumber': module.orderNumber}) }}" class="secondary-btn shadow">Revoir la correction</a>
                    {% endif %}
                </div>
            {% endif %}
            {% if isLastChap == true
                 and caseStudyState == 1 
                 and chapter.category.name == 'Etude de cas' %}
                <p>aide : profité du temps de correction pour préparé le test du module !</p>
                <a href="{{ path('training_module', {'slug': training.slug, 'slugModule': module.slugModule}) }}" class="return-btn bg-white shadow js-timer">
                    <span class="material-icons">
                        keyboard_return
                    </span>
                </a>
            {% endif %}

            {% if caseStudyState == 1 or caseStudyState == 2 %}
                {% if isLastChap == false %} 
                <div class="d-flex justify-content-center my-3 mt-5" style="justify-content:center;">
                    <a href="{{ path('training_module', {'slug': training.slug, 'slugModule': module.slugModule}) }}" class="return-btn bg-white shadow mr-3 js-timer">
                    <span class="material-icons">
                        keyboard_return
                    </span>
                    </a>
                    <a href="{{ path('training_chapter_next', {'slug': training.slug, 'slugModule': module.slugModule, 'slugChapter': chapter.slugChapter }) }}" class="ms-4 shadow secondary-btn js-timer">Chapitre terminé</a>
                </div>
                {% endif %}
            {% endif %}

            {% if chapter.category.name == "Cours" %}
                 {% if isLastChap == true %}
                 <div class="d-flex justify-content-center my-3">
                    <a href="{{ path('training_module', {'slug': training.slug, 'slugModule': module.slugModule}) }}" class="return-btn bg-white shadow mr-3 js-timer">
                    <span class="material-icons">
                        keyboard_return
                    </span>
                    </a>
                    {#
                    {% if module.hasQcmTest == true %}
                    #}
                    <a href="{{ path('training_chapter_next', {'slug': training.slug, 'slugModule': module.slugModule, 'slugChapter': chapter.slugChapter }) }}" class="ms-4 secondary-btn js-timer">Chapitre terminé</a>
                    {#
                    {% else %}
                    <a href="{{ path('training_module_qcm_correct', {'slug': training.slug, 'orderNumber': module.orderNumber}) }}" class="secondary-btn js-timer">Terminé le chapitre et passer au module suivant</a>
                    {% endif %}
                    #}
                 </div>
                 {% else %}
                <div class="d-flex justify-content-center my-3">
                   
                        <a href="{{ path('training_module', {'slug': training.slug, 'slugModule': module.slugModule}) }}" class="return-btn shadow bg-white mr-3 js-timer">
                            <span class="material-icons">
                                keyboard_return
                            </span>
                        </a>

                        <a href="{{ path('training_chapter_next', {'slug': training.slug, 'slugModule': module.slugModule, 'slugChapter': chapter.slugChapter }) }}" class="shadow secondary-btn js-timer ms-4">
                            Chapitre terminé
                        </a>
                
                </div>
                 {% endif %}
            {% endif %}

            </div>
        </div>
        {% include 'partials/trainingStepperChap.html.twig' %}
    </section>

    <input type="hidden" value="{{ training.slug }}" id="training-slug">

{% endblock %}

{% block javascripts %}
    {{ encore_entry_script_tags('js/sidemenu') }}
{% endblock %}