{% block inlinetinymce_widget %}
    {% if placeholder is not defined %}
        {% set placeholder = '' %}
    {% endif %}
    {% if theme is not defined %}
        {% set theme = '' %}
    {% endif %}
    {% if classes is not defined %}
        {% set classes = '' %}
    {% endif %}
    {% if content_max_limit is not defined %}
        {% set content_max_limit = 10000 %}
    {% endif %}
    {% if (content_max_limit|number_format)  == -1 %}
        {% set content_max_limit = 10000 %}
    {% endif %}
    {# ATTENTION: ça signifie qu'il faut expliciter si vous voulez ne pas avoir de limite mini #}
    {% if content_min_limit is not defined %}
        {% set content_min_limit = 1 %}
    {% endif %}
    {% if (content_min_limit|number_format)  == -1 %}
        {% set content_min_limit = 0 %}
    {% endif %}
    <div id="{{ full_name }}" {# un input:hidden est automatiquement ajouté, nommé avec cet id #}
         name="inline_{{ full_name }}"
         contentEditable=true
         data-placeholder="{{ placeholder }}"
         title="{{ placeholder }}" {# TODO: gérer attribut title #}
         class="inlinetinymce tinymce {{ classes }} fichier_commun"
         data-content-max-limit="{{ content_max_limit }}"
         data-content-min-limit="{{ content_min_limit }}"
         data-theme="{{ theme }}">
        {% if value is iterable %} {# test if is array #}
        {% else %}
        {{ value|raw }}
        {% endif %}
    </div>
{% endblock %}

{% block textareaormedia_widget %}
    {# exemples de valeurs (qui servent de préfixe aux sous-widgets):
     # fullname: form[association]
     # id: form_association_{{ counter }}
    #}

    {# pour déterminer quelle est la valeur actuelle: media ou contenu dans wysiwyg ? #}
    {% set media_id = '' %}
    {% set editor_value = '' %}
    {% if 'media_id_' in value  %}
        {% set media_id = value |replace({'media_id_': ''}) %}
        {% set editor_value = '' %}
    {% else %}
        {% set media_id = 0 %}
        {% set editor_value = value|raw %}
    {% endif %}

    {% if theme is not defined %}
        {% set theme = 'normale' %}
    {% endif %}

    <div class="textareaormedia">
        <div class="wysiwyg_part">
            {% with {
                'id': id ~ '_tinymce',
                'full_name': full_name ~ '[tinymce]',
                'value': editor_value,
                'theme': theme
                }
            %}
            {{ block('inlinetinymce_widget') }}
            {% endwith %}
        </div>
        <div class="media_part">
            <input type="hidden"
                   id="{{ id }}_media"
                   class="media_to_show media_hidden"
                   name="{{ full_name }}[media]"
                   data-test-nico2="{{ id }}"
                   value="{{ media_id }}" />

            <div class="widget_media" data-visu-of="#{{ id }}_media"></div>

            <button type="button" id="{{ id }}_buttonmedia"
                    name="{{ full_name }}[buttonmedia]" class="btn btn-primary popin btnMedia my-2"
                    data-target="#{{ id }}_media"
                    data-href="{{ path('courses_media_gallery_popin') }}"
                    data-content-href="{{ url('courses_media_index', {'gallery': true,
                        'selectable':true,
                        'with_buttons': false,
                        'type':'__type__',
                        'filter':'__filter__',
                        'limit':'__limit__',
                        'columns' : '__columns__',
                        'category':'__category__'
                    }) }}"
                    data-title="Choisissez un media pour ce composant">Choisir un média</button>
        </div>
    </div>
{% endblock %}

{% block association_form_widget %}
    {# exemples de valeurs (qui servent de préfixe aux sous-widgets):
     # fullname: form[association]
     # id: form_association_{{ counter }}
    #}
    <div id="form_association_{{ name }}" class="row col-12">
        <div class="col-lg-6">
            {% set value1 = '' %}
            {% set value2 = '' %}
            {% if(value is not null) %}
                {% set value1 = value[0] %}
                {% set value2 = value[1] %}
            {% endif %}
            {% with {
                'id': id ~ '_asso1',
                'full_name': full_name ~ '[asso1]',
                'value': value1
                }
            %}
                {{ block('textareaormedia_widget') }}
            {% endwith %}
        </div>
        <div class="col-lg-6">
            {% with {
                'id': id ~ '_asso2',
                'full_name': full_name ~ '[asso2]',
                'value': value2
                }
            %}
                {{ block('textareaormedia_widget') }}
            {% endwith %}
        </div>
    </div>
{% endblock %}


{# sert pour composant#new et composant#edit #}
{# "qcm reponses" sont les affirmations à valider/invalider #}
{% block qcm_reponses_proto %}
    <div class="headerQuestion d-flex align-items-center">
        <i class="fa fa-lg fa-check-circle-o iconReponse mx-2" aria-hidden="true"></i>
        <h3 class="libelleReponse mt-2"> Réponse n°</h3>
        <i id="iconRemove" class="fa fa-trash-o fa-lg removeQCM_reponse ml-auto"></i>
    </div>
    <div id="form_qcm___name___reponses___name__" class="elementsRep d-flex align-items-center mb-2 col-12">
        <div class="form-group col mb-0">
            <input type="text" id="form_qcm___name___reponses___name___texteRep" name="form[qcm][__name__][reponses][__name__][texteRep]" {#required="required"#} class="form-control elementText" />
        </div>

        {# BOUTON MEDIA #}
        <input type="hidden"
               id="form_qcm___name___reponses___name___media"
               class="media_to_show media_hidden"
               name="form[qcm][__name__][reponses][__name__][media]"
               value="0" />
        <div class="widget_media mr-2" data-visu-of="#form_qcm___name___reponses___name___media"></div>
        <div class="btnGroupMedia col-2 ml-auto">
            <button type="button" id="form_qcm___name___reponses___name___buttonmedia"
                    name="form[qcm][__name__][reponses][__name__][buttonmedia]"
                    class="btn btn-primary popin btnMedia col-12 my-1"
                    data-target="#form_qcm___name___reponses___name___media"
                    data-href="{{ path('courses_media_gallery_popin') }}"
                    data-content-href="{{ url('courses_media_index', {'gallery': true,
                        'selectable':true,
                        'with_buttons': false,
                        'type':'__type__',
                        'filter':'__filter__',
                        'limit':'__limit__',
                        'columns' : '__columns__',
                        'category':'__category__'
                    }) }}"
                    data-title="Choisissez un media pour ce composant">
                Média
            </button>
            <button class="btn btn-danger btnRemoveMedia col-12"
                    type="button"
                    data-title="Supprimer le média de la réponse">
                Annuler
            </button>
        </div>
        <div class="form-group etatReponse" hidden>
            <select id="form_qcm___name___reponses___name___etatReponse" name="form[qcm][__name__][reponses][__name__][etatReponse]" class="ui fluid dropdown form-control select">
                <option value="0">Faux</option>
                <option value="1">Vraie</option>
            </select>
        </div>
        <div class="btn-group col-2" role="group">
            <button class="btn btn-block btn-secondary btnVrai" type="button" onclick="changerEtatReponse(this);">VRAI</button>
            <button class="btn btn-block btn-danger btnFaux mt-0" type="button" onclick="changerEtatReponse(this);">FAUX</button>
        </div>
    </div>
{% endblock %}
{# "qcm questions" sont les énoncés (contexte) de chaque bloc d'affirmations #}
{% block qcm_question_proto %}
    <div class="row qcmQuestionBlock list-group-item">
        <div class="contentReponses list-group-item" data-type="libre">
            <div class="headerReponses d-flex align-items-center mb-2">
                <i class="fa fa-lg fa-check-circle iconQuestion mx-2" aria-hidden="true"></i>
                <h2 class="mt-2"> Réponses</h2>
                <div class="btn-group mx-2 boutonsTypeQCM" role="group" data-etat="">
                    <button class="btn btn-block btn-secondary btnVraiFaux mt-0" type="button" onclick="changerTypeQCM(this);" title="Vrai ou Faux">Vrai/Faux</button>
                    <button class="btn btn-block btn-primary btnLibre w-auto mt-0" type="button" onclick="changerTypeQCM(this);" title="0 ou plusieurs réponses justes (checkboxes)">LIBRE</button>
                    <button class="btn btn-block btn-secondary btnVF mt-0 w-auto" type="button" onclick="changerTypeQCM(this);" title="1 seule réponse juste (radios)">SIMPLE</button>
                </div>
            </div>
            <ul id="qcm-reponses-list"
                class="qcm-reponses-list liststylenone p-0"
                    {# data-prototype="{{ form_widget(form.qcm.vars.prototype.reponses.vars.prototype)|e }}" #}
                data-prototype="{{ block('qcm_reponses_proto') |e }}"
                data-widget-qcm='<li class="qcmReponsesBlock list-group-item"></li>'></ul>
            <button type="button" class="add-another-collection-widget form-control addQCM-reponse my-3 btn btn-block btn-outline-success">Ajouter une réponse</button>
        </div>
    </div>
{% endblock %}