{% extends "::admin.html.twig" %}
{% block title %} Liste des Médias  {% endblock %}
{% block entete %} Liste des Médias {% endblock %}
{% block body %}
    <div class="container-fluid container-fullw bg-white">
        <div class="row">
            <div class="col-md-12">

                <div class="row">
                    <div class="col-md-12 space20">

                        <a class="btn btn-primary" href="{{ path('admin_media_new') }}" style="color:#fff;">Ajouter
                            Media <i class="fa fa-plus"></i></a>
                        <button id="btnImage" class="btn btn-primary" type="submit" style="color:#fff;">Media Images <i
                                    class="fa fa-picture-o"></i></button>
                        <button id="btnVideo" class="btn btn-primary" type="submit" style="color:#fff;">Media Vidéos <i
                                    class="fa fa-video-camera"></i></button>
                    </div>
                </div>

                {{ include('default/flashBag.html.twig') }}
                {% if nbrMedias == 0 %}

                <div class="section-title text-center">
                    <div class="row">
                        <div class="col-md-8 col-md-offset-2">
                            <h2 class="text-uppercase mt-0 line-height-1">Aucune <span class="text-theme-colored2">donnée disponible</span>
                            </h2>
                        </div>
                    </div>
                </div>
                {% else %}
                <div class="tableImage">
                    <table class="table table-responsive table-striped table-bordered table-hover table-full-width" id="sample_1">
                        <thead>
                        <tr>
                            <th width="10%">Photos</th>

                            <th width="10%">Date</th>
                            <th width="70%">Titre</th>
                            {#<th width="45%">URL</th>#}
                            <th width="10%">Action</th>
                        </tr>
                        </thead>
                        <tbody>

                            {% for media in mediasImages %}
                                <tr>


                                    <td>
                                        {% if media.picture is not null %}
                                            <img style="width: 50px;"
                                                 src="{{ asset('uploads/images/' ~ media.picture) }}">
                                        {% else %}
                                            <img style="width: 50px;" src="{{ asset('assets/images/meeting.jpg') }}">
                                        {% endif %}
                                    </td>
                                    <td>{{ media.date | date('d/m/y') }}</td>
                                    <td>{{ media.title }}</td>
                                    {#<td>#}
                                    {#<iframe width="50" height="50" src="https://www.youtube.com/embed/{{ media.URL|slice(32, 50) }}"#}
                                    {#frameborder="0"#}
                                    {#allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"#}
                                    {#allowfullscreen></iframe>#}
                                    {#</td>#}


                                    <td>
                                        <a class="btn btn-success btn-xs" title="edit"
                                           href="{{ path('admin_media_edit',{'id':media.id}) }}"> <span
                                                    class="fa fa-edit"
                                                    style="color:white"></span></a>
                                        <a href="{{ path('admin_media_delete',{'id':media.id}) }}"
                                           class="btn btn-danger btn-xs user-remove" title="supprimer"
                                           data-toggle="confirmation" class="delete-row">
                                            <span class="fa fa-trash-o" style="color:white"></span></a>
                                    </td>
                                </tr>
                            {% endfor %}
                        </tbody>
                    </table>

                </div>


                <div class="tableVideo" style="display: none;">

                    <table class="table table-responsive table-striped table-bordered table-hover table-full-width" id="sample_1">
                        <thead>
                        <tr>
                            {#<th width="5%">Photos</th>#}
                            <th width="10%">URL</th>
                            <th width="10%">Date</th>
                            <th width="70%">Titre</th>
                            <th width="10%">Action</th>
                        </tr>
                        </thead>
                        <tbody>

                            {% for video in mediasVideos %}
                                <tr>
                                    <td>
                                        <iframe width="50" height="50"
                                                src="https://www.youtube.com/embed/{{ video.URL|slice(32, 50) }}"
                                                frameborder="0"
                                                allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
                                                allowfullscreen></iframe>
                                    </td>
                                    <td>{{ video.date | date('d/m/y') }}</td>
                                    <td>{{ video.title }}</td>


                                    <td>
                                        <a class="btn btn-success btn-xs" title="edit"
                                           href="{{ path('admin_media_edit',{'id':video.id}) }}"> <span
                                                    class="fa fa-edit"
                                                    style="color:white"></span></a>
                                        <a href="{{ path('admin_media_delete',{'id':video.id}) }}"
                                           class="btn btn-danger btn-xs user-remove" title="supprimer"
                                           data-toggle="confirmation" class="delete-row">
                                            <span class="fa fa-trash-o" style="color:white"></span></a>
                                    </td>
                                </tr>
                            {% endfor %}
                        {% endif %}
                        </tbody>
                    </table>

                </div>

            </div>
        </div>
    </div>
{% endblock %}