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

{% block title %}
    {{parent()}}: Exercice n°{{ composant.id }}
    {% if titre is defined %}
        {{ titre }}
    {% endif %}
{% endblock %}

{% block body %}
    {% include 'breadcrumb.html.twig' %}
    <div class="container-fluid">
        <div id="ui-view">
            <div>
                <div class="animated fadeIn">
                    <div class="card composant terminee">
                        <div class="card-header">
                            <h1>
                                {% if titre is defined %}
                                    {{ titre }}
                                {% endif %}
                            </h1>
                        </div>
                        <div class="card-body">
                            {% include '@Courses/Exercices/show_inner.html.twig' with {
                                'cacher_submit_individuel': true,
                                'param_readonly': false,
                                'render_inner': true
                            }  %}
                        </div>
                        {#
                        <div class="card-footer etatReponse attente">
                            <h1 class="solution m-0 mr-2 mt-1">
                                Solution : <span class="soluce"></span>
                            </h1>
                        </div>
                        #}
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block body_before_end %}
    {{ parent() }}
    {{ tinymce_init( { 'theme': {'simple':{}} } ) }}

    {# temporaire #}
    <script src="{{ asset('js/ns_rustine_tinymceinline.js') }}?{{ date().timestamp }}"></script>
{% endblock %}

{% block stylesheets %}
    {{ parent() }}
    <link href="{{ asset('css/ns_module_activite.css') }}" rel="stylesheet" >
{% endblock %}

{% block javascripts %}
    {{ parent() }}

    <script>
    var debug = false
    window.PATH_MEDIA_PREVIEW = "{{ path('courses_media_show', {'id': '__media_id__', 'preview': true, 'simple_vue':true})|raw }}"
    window.arr_to_click = [];
    window.arr_ready = []; // se remplira de $.deferred chaque" fois que nécessaire
    </script>
    <script src="{{ asset('js/courses_media_gallery.js') }}?{{ date().timestamp }}"></script>
    <script src="{{ asset('js/courses_media_createedit.js') }}?{{ date().timestamp }}"></script>
    <script src="{{ asset('js/courses_lecon_showactivites.js') }}?{{ date().timestamp }}"></script>

    {% if composant.type.id == 1 %}
        <script src="{{ asset('js/courses_lecon_showactivites_multipleChoice.js') }}?{{ date().timestamp }}"></script>
        <script>
        $(document).ready(function() {
            window.bindQCM();
            window.previewMedias();
        });
        </script>
    {% elseif composant.type.id == 2 %}
        <script src="{{ asset('js/courses_lecon_showactivites_gappFillSD.js') }}?{{ date().timestamp }}"></script>
        <script>
        $(document).ready(function() {
            window._bindGapfillSD();
        });
        </script>
    {% elseif composant.type.id == 3 %}
        <script src="{{ asset('js/courses_lecon_showactivites_gappFillW.js') }}?{{ date().timestamp }}"></script>
        <script>
        $(document).ready(function() {
            window._bindGapfillW();
        });
        </script>
    {% elseif composant.type.id == 4 %}
        <script src="{{ asset('js/courses_lecon_showactivites_association.js') }}?{{ date().timestamp }}"></script>
        <script type="text/javascript" src="{{ asset('js/jsplumb.js') }}?{{ date().timestamp }}"></script>

        <script>
            //rustine pour jsplumb, trabsférée en fin de previewMedia()
            window.PATH_MEDIA_PREVIEW = "{{ path('courses_media_show', {'id': '__media_id__', 'preview': true, 'simple_vue':true})|raw }}";

            interval_fix_jsplumb = setInterval(window.ns_fix_jsplumb, 1000);

            $(document).ready(function() {
                window.previewMedias();
                // une fois que tout est chargé, initialiser tinyMCE
                window.initTinyMCE();
                // et activer les exercices:
                if('undefined' !== typeof window.jsPlumb) {
                    window.bindAssociation() //brancher jsplumb que si tente de résoudre exercice, pas si juste create ou edit

                    // window.validerDeferredComposantCharge('association');
                }
            });
        </script>
    {% elseif composant.type.id == 5 %}
        <script src="{{ asset('js/courses_lecon_showactivites_openQuestion.js') }}?{{ date().timestamp }}"></script>
        <script>
        $(document).ready(function() {
            window._bindOpenQuestion();
        });
        </script>
    {% else  %}
        <script>
        $(document).ready(function() {
            window.previewMedias();
        });
        </script>
    {% endif %}

    {% set est_exercice = false %}
    {% if composant.type.id == 1 or composant.type.id == 2 or composant.type.id == 3 or composant.type.id == 4 or composant.type.id == 5 %}
        {% set est_exercice = true %}
        <script>
            $(document).ready(function() {
                $.when.apply($, window.arr_ready).then(function(arg){
                    var jq_composant = $('.composant');
                    window.getCorrectionBo({{ composant.jsonContent|raw }}, jq_composant, {{ composant.type.id }});
                });
            });
        </script>
    {% endif %}
{% endblock %}