{% set id_container = 'listeLesson' ~ lesson.id %}
<div id="{{ id_container }}" class="list-group listActivities"
     data-url="{{ path('courses_lesson_list_activite', {'id': lesson.id}) }}"
     data-order="{{ path('courses_lesson_activity_order_update', {'id': lesson.id}) }}">
    <ul class="sortable-activities lesson-opened">
        {% set counterAct = 1 %}
        {% for activite in activites %}
            <li class="connected-activity" data-index="{{ counterAct }}">
                <div class="list-group-item activite activite{{ loop.index }}" data-id-activity="{{ activite.activite.id }}" data-id-liaison="{{ activite.id }}">
                    <div class="headerActivity d-flex align-items-center">
                        {% if activite.activite.active == 0 %}
                            <i class="fa fa-ban fa-lg mb-2" aria-hidden="true"></i>
                        {% endif %}
                        <h5><b>Activité n°{{ activite.activite.id }}</b></h5>
                        <i class="fa fa-files-o fa-lg iconActivity mb-2" aria-hidden="true"></i>
                        <div class="inputLibelleActivity" data-href="{{ path('courses_activite_edit', {'idLiaison': activite.id}) }}" data-origin-href="{{ path('courses_activite_edit', {'idLiaison': '_id_activity_'}) }}" title="{{ activite.activite.libelle }}">
                            <label for="inp" class="inp">
                                <input type="text" class="input" placeholder="&nbsp;" maxlength="250">
                                <span class="label ellipsis">{{ activite.activite.libelle }}</span>
                                <span class="border"></span>
                            </label>
                        </div>
                        <span class="badge badge-activity badge-secondary mb-2">0</span>

                        {# <div class="tg-list-item">
                            <input class="tgl tgl-flip adaptabilite" id="adapt{{ activite.id }}" type="checkbox" {% if activite.adaptabilite == true %}checked{% endif %}>
                            <label class="tgl-btn toggleAdapt m-0" data-tg-off="Classic" data-tg-on="Adapt." for="adapt{{ activite.id }}"></label>
                        </div> #}
                        <div class="btn-group btn-group-toggle btn-adapt-group" data-toggle="buttons" id="adapt{{ activite.id }}">
                            <label class="btn btn-sm btn-secondary btn-adapt {% if activite.adaptabilite == '0' %}active{% endif %}">
                                <input type="radio" name="options" value="0"> <i class="fa fa-ban m-0" aria-hidden="true"></i>
                            </label>
                            <label class="btn btn-sm btn-secondary btn-adapt {% if activite.adaptabilite == '1' %}active{% endif %}">
                                <input type="radio" name="options" value="1">Adapt <i class="fa fa-arrow-down m-0" aria-hidden="true"></i>
                            </label>
                            <label class="btn btn-sm btn-secondary btn-adapt {% if activite.adaptabilite == '2' %}active{% endif %}">
                                <input type="radio" name="options" value="2">Adapt <i class="fa fa-arrow-up m-0" aria-hidden="true"></i>
                            </label>
                        </div>

                        <input class="mx-2 notePlancher form-control" type="number" name="notePlancher" min="0" max="100" title="Note plancher"  placeholder="Note plancher" {% if activite.adaptabilite == 0  %}style="display:none"{% endif %} value="{{ activite.notePlancher }}">
                        <i class="fa fa-book fa-lg nbLeconParent" aria-hidden="true" style="cursor:pointer"></i>

                        <div class="toggleActivity my-0 mr-2 ml-auto">
                            <button type="button" class="btn btn-xs btn-toggle active" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="toggleActivity(this);">
                                <div class="handle"></div>
                            </button>
                        </div>
                        <a href="{{ path('courses_activite_index', {
                                'id': activite.activite.id,
                                'formation_id': 0,
                                'module_id': 0,
                                'lecon_id': 0,
                                'counter_activite': 0,
                                'ajax':false,
                                'pleine_page': true,
                                'session': 0
                            }) |raw }}"
                           data-href-pattern="{{ path('courses_activite_index', {
                               'id': '_id_activity_',
                               'formation_id': 0,
                               'module_id': 0,
                               'lecon_id': 0,
                               'counter_activite': 0,
                               'ajax':false,
                               'pleine_page': true,
                               'session': 0
                           }) |raw }}"
                           target="_blank"
                           class="iconAperçu my-0 mx-2">
                            <i class="fa fa-eye fa-lg apercuSettings m-0" title="Voir l'aperçu"></i>
                        </a>
                        <i id="removeAct{{ activite.id }}" class="fa fa-trash-o fa-lg removeActivity removeIcon my-0 mx-2" title="Supprimer" onclick="removeActivity(this);" data-url="{{ path('courses_lesson_remove_activity', {'id': activite.id}) }}" data-origin-url="{{ path('courses_lesson_remove_activity', {'id': '_id_activity_'}) }}"></i>
                    </div>
                    <div class="contentActivity">
                        <div class="liste-Composants" data-path="{{ path('courses_activite_list_composant', {'id': activite.activite.id}) }}" data-index-activity="{{ loop.index }}">
                            {{ render(controller(
                                'CoursesBundle:Activite:listComposants',
                                { 'id': activite.activite.id,
                                    'counter' : loop.index
                                }
                            )) }}
                        </div>
                        <div class="elementAjoutComposant popinComposant"
                             data-idActivite="{{ activite.activite.id }}"
                             data-origin-url-valid="{{ path('courses_activite_add_composant', {'id': "_id_activity_"}) }}"
                             data-url-valid="{{ path('courses_activite_add_composant', {'id': activite.activite.id}) }}"
                             data-origin-href="{{ path('courses_composants_list_active', {'id': "_id_activity_"}) }}"
                             data-href="{{ path('courses_composants_list_active', {'id': activite.activite.id}) }}"
                             data-title="Ajouter des composants">
                            <div class="rotating-dashed composants"></div>
                            <h6 class="my-auto createComposant" style="color:white;" data-href="{{ path('courses_popin_create_composant') }}" data-title="Création de composant">Créer un composant</h6>
                            <i class="fa fa-search fa-lg iconPlusComposant fa-flip-horizontal ml-auto" aria-hidden="true"></i>
                        </div>
                    </div>
                </div>
            </li>
            {% set counterAct = counterAct+1 %}
        {% endfor %}
    </ul>
</div>

<script>

</script>