{% extends 'app/' ~ template ~ '.html.twig' %}

{% block content %}
    <div class="component">
        <div class="component-wr section-separator">
            <h1 class="mb-0">
                {{ formation.title }}
                <small>{{ formation.subtitle }}</small>
            </h1>

            <div class="media media-is-responsive-tablet">
                {% if formation.picture is not null %}
                    <div class="media-left">
                        <img src="{{ formation.picture|image(null, 'formation') }}">
                    </div>
                {% endif %}
                <div class="media-body">
                    {{ formation.content|raw }}
                    {% if formation.attachments is not empty %}
                        <table class="table table-hover">
                            {% for attachment in formation.attachments %}
                                {% if is_granted('read', attachment) %}
                                    <tr>
                                        <td style="width:90%;">{{ attachment.title }}</td>
                                        <td>
                                            <a class="btn btn-primary uppercase pull-right"
                                               href="{{ path('formation_file', {'fileId': attachment.file.id}) }}">
                                                {{ 'app.common.components.download.action'|trans }}
                                            </a>
                                        </td>
                                    </tr>
                                {% endif %}
                            {% endfor %}
                        </table>
                    {% endif %}
                    {% if sessionsFormation is not empty %}
                        <h3>Les sessions disponibles :</h3>
                        <div class="table-responsive">
                            <table class="table table-hover">
                                {% for session in sessionsFormation %}
                                    <tr>
                                        <td style="width:100%;">
                                            <i class="fa fa-calendar" aria-hidden="true"></i> {{ session.period }}<br>
                                            <i class="fa fa-map-marker" aria-hidden="true"></i> {{ session.place }}
                                        </td>

                                        <td>
                                            <a class="btn btn-primary uppercase pull-right"
                                               href="{{ path('session_show', {'formationId': formation.id, 'id': session.id}) }}">
                                                {{ 'app.see_sessions'|trans }}
                                            </a>
                                        </td>
                                    </tr>
                                {% endfor %}
                            </table>
                        </div>
                    {% endif %}
                </div>
            </div>

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