{% extends 'base.html.twig' %}

{% block title %}Customer Testimonials | {{ parent() }}{% endblock %}

{% block stylesheets %}
    {{ parent() }}
    <link rel="stylesheet" href="{{ asset('css/jquery.fancybox.css') }}">
{% endblock %}

{% block body %}
    <h1>Customer Testimonials</h1>
    {% for x in 1..total_testimonials %}
        {#{% for x in 1..20 %}#}
        {% if (x % 2) == 1 %}
            <div class='row'>
        {% endif %}
        <div class='col col-sm-6'>
            {% if (x % 4 == 0 or (x - 1) % 4 == 0) and not media_done %}
                {% if media_testimonial[media_count]['type'] == 'youtube' %}
                    <div class='embed-responsive embed-responsive-16by9 my-3'>
                        <iframe class='embed-responsive-item' src='https://www.youtube.com/embed/{{ media_testimonial[media_count]['content']|raw }}?rel=0'></iframe>
                    </div>
                {% else %}
                    <a
                            class='fancybox my-3'
                            rel='group{{ media_count }}'
                            style='display:table;margin:0 auto;'
                            href='{{ asset('images/'~media_testimonial[media_count]['content']~'.jpg') }}'>
                        <img class="img-fluid" src="{{ asset('images/'~media_testimonial[media_count]['content']~'-small.jpg') }}">
                    </a>
                {% endif %}
                {% set media_count = media_count + 1 %}
                {% if media_count == media_testimonial|length %}
                    {% set media_done = true %}
                {% endif %}
            {% else %}
                <div class='card my-3'>
                    <div class='card-body'>
                        {{ text_testimonials[text_count]['content']|raw }}
                    </div>
                    <div class='card-footer'>
                        {{ text_testimonials[text_count]['name'] }} - {{ text_testimonials[text_count]['location'] }}
                    </div>
                </div>
                {% set text_count = text_count + 1 %}
            {% endif %}
        </div>
        {% if (x % 2 == 0) or (x == total_testimonials) %}
            </div>
        {% endif %}
    {% endfor %}
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script src="{{ asset('js/jquery.fancybox.pack.js') }}"></script>
    <script>
        $(document).ready(function () {
            $(".fancybox").fancybox();
        });
    </script>
{% endblock %}