{% extends 'frontend/front-end-base.html.twig' %}

{% block title %} {{ page_title|default('Resources')|raw|striptags }} {% endblock %}

{% block body %}

    {% embed "frontend/panel/content-page-title.html.twig" %}
        {% block pageTitle %}
            {{ page_title|default('Resorces')|raw }}
        {% endblock %}

        {% block bannerImage %}
            {% set imagePath = asset('build/images/newsletter.png') %}
            {% if currentResourceCategory is not null and currentResourceCategory.imagePath is defined and currentResourceCategory.imagePath is not null %}
                {% set imagePath = asset(imageDirectory ~ currentResourceCategory.imagePath) %}
            {% endif %}
            background: url('{{ imagePath }}') top center no-repeat; background-size: cover;
        {% endblock %}

        {% block headerFontClass %} acba-blue-font {% endblock %}
    {% endembed %}

    <!-- Start Section -->
    <section class="col-md-12 bg-light py-5">
        <div class="container">
            <div class="row">

                {% if resourceCategories is defined and resourceCategories|length > 0 %}
                    {% for resourceCategory in resourceCategories %}

                        {% set activeClass = '' %}
                        {% if currentResourceCategory.id is same as(resourceCategory.id) %}
                            {% set activeClass = 'active' %}
                        {% endif %}

                        <div class="col col-xs-12 pb-3 resources-nav {{ activeClass }}">
                            <div class="h-100 bg-white py-5 shadow">
                                <div class="h1 text-success text-center"><i
                                            class="{{ resourceCategory.iconClass }}"></i></div>
                                <h2 class="h5 mt-4 text-center">
                                    <a class="text-decoration-none"
                                       href="{{ url('frontend_resources', {'resourceCategoryId':resourceCategory.id, 'resourceCategoryTitle':resourceCategory.name}) }}">{{ resourceCategory.name }}</a>
                                </h2>
                            </div>
                        </div>
                    {% endfor %}
                {% endif %}
            </div>
        </div>
    </section>
    <!-- End Section -->

    <section class="col-md-12 text-start bg-white py-5">
        <div class="container">

            {% if currentResourceCategory is defined and currentResourceCategory is not null %}
                <h2 class="py-5 my-4 acba-blue-font big-h2">{{ currentResourceCategory.name }}</h2>

                <div class="row">
                    <div class="col-md-12 my-3">

                        {% if resources is defined and resources|length > 0 %}
                            {% for resource in resources %}

                                {% set pdfDocument = resource.frenchDocument %}
                                {% if resource.englishDocument is defined and resource.englishDocument is not null %}
                                    {% set pdfDocument = resource.englishDocument %}
                                {% endif %}

                                <div class="row my-5 pagination-item">
                                    <div class="col-md-5 mr-2 snippet-image-container">
                                        <a class=" text-decoration-none" href="{{ absolute_url(path('frontend_download_resource', {'filename':pdfDocument})) }}"
                                           title="Download - {{ resource.title }} - resource" rel="noopener noreferrer"
                                           target="_blank"
                                        >
                                        <img src="{{ asset(imageDirectory ~ resource.imagePath) }}" alt="{{ resource.title }} image" class="img img-fluid">
                                        </a>
                                    </div>
                                    <div class="col-md-6">
                                        <h3 class="acba-blue-font my-3">
                                            {#pdf-modal-view#}    <a class=" acba-blue-font text-decoration-none" href="{{ absolute_url(path('frontend_download_resource', {'filename':pdfDocument})) }}"
                                               title="Download - {{ resource.title }} - resource"
                                                target="_blank" rel="noopener noreferrer"
                                            >
                                                {{ resource.title }}
                                            </a>

                                        </h3>
                                        <div class="resource-download-container">
                                            Download:
                                            {% if resource.englishDocument is not null %}
                                                <a class="" href="{{ absolute_url(path('frontend_download_resource', {'filename':resource.englishDocument})) }}"
                                                   title="Download English article"
                                                   target="_blank" rel="noopener noreferrer"
                                                >EN</a> |
                                            {% endif %}

                                            {% if resource.frenchDocument is not null %}
                                                <a class="" href="{{ absolute_url(path('frontend_download_resource', {'filename':resource.frenchDocument})) }}"
                                                   title="Download French article"
                                                   target="_blank" rel="noopener noreferrer"
                                                >FR</a>
                                            {% endif %}
                                        </div>
                                        <div>
                                            {% if resource.datePublished is defined and resource.datePublished is not null %}
                                                <span class="text-light">Posted on {{ resource.datePublished.format('Y-m-d') }} </span>
                                            {% elseif resource.dateCreated is not null %}
                                                <span class="text-light">Posted on {{ resource.dateCreated.format('Y-m-d') }} </span>
                                            {% endif %}
                                        </div>
                                    </div>
                                </div>
                            {% endfor %}
                        {% endif %}

                        <div class="row">
                            <div class="col-md-12">
                                <ul class="pagination w-100 pagination-links-container">
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            {% endif %}
        </div>
    </section>

    {% embed "frontend/panel/resource-snippet-block.html.twig" %}
    {% endembed %}

{% endblock %}

{% block javascripts %}
    <script type="text/javascript">
    </script>
{% endblock %}