{#
Title: Testimonial Slider
Description: Bootstrap carousel slider for Testimonials (1 per slide) with dots and arrows.
Category: sliders
Icon: format-quote
Keywords: testimonial slider carousel
Mode: preview
Align: full
SupportsAlign: full false
#}

{% extends '/views/parts/logic/block-settings.twig' %}

{% block blocksettings %}
    {% set carousel_id = 'testimonialCarousel-' ~ (block.id|default('0')) %}

    <div class="testimonial-slider {{ outer_classes }}">
        <div class="{{ inner_classes }}">

            {% if fields.main_header %}
                <h2 class="mb-4">{{ fields.main_header }}</h2>
            {% endif %}

            {% if testimonials is not empty %}
                <div id="{{ carousel_id }}"
                     class="carousel slide"
                     data-bs-ride="{{ fields.behavior.autoplay ? 'carousel' : 'false' }}"
                        {% if fields.behavior.autoplay and fields.behavior.interval_ms %}
                            data-bs-interval="{{ fields.behavior.interval_ms }}"
                        {% endif %}
                >

                    {% if fields.show_dots %}
                        <div class="carousel-indicators">
                            {% for t in testimonials %}
                                <button
                                        type="button"
                                        data-bs-target="#{{ carousel_id }}"
                                        data-bs-slide-to="{{ loop.index0 }}"
                                        class="{{ loop.first ? 'active' : '' }}"
                                        {% if loop.first %}aria-current="true"{% endif %}
                                        aria-label="Slide {{ loop.index }}"
                                ></button>
                            {% endfor %}
                        </div>
                    {% endif %}

                    <div class="carousel-inner">

                        {% for t in testimonials %}
                            {% set meta = t.meta|default({}) %}

                            <div class="carousel-item {{ loop.first ? 'active' : '' }}">
                                <div class="card border-0">
                                    <div class="card-body">

                                        {% if testimonial_fields_to_show.quote and meta.quote %}
                                            <blockquote class="mb-3">
                                                <p class="mb-0">{{ meta.quote }}</p>
                                            </blockquote>
                                        {% endif %}

                                        {% if testimonial_fields_to_show.client_name and meta.client_name %}
                                            <p class="mb-1"><strong>{{ meta.client_name }}</strong></p>
                                        {% endif %}

                                          {% if testimonial_fields_to_show.job_title and meta.job_title %}
                                            <p class="mb-1">{{ meta.job_title }}</p>
                                        {% endif %}

                                        {% if testimonial_fields_to_show.client_company and meta.client_company %}
                                            <p class="mb-1">{{ meta.client_company }}</p>
                                        {% endif %}

                                        {% if testimonial_fields_to_show.client_website and meta.client_website %}
                                            <p class="mb-1">
                                                <a class="link-secondary" href="{{ meta.client_website }}" target="_blank" rel="noopener">Website</a>
                                            </p>
                                        {% endif %}

                                        {% if testimonial_fields_to_show.project_link and meta.project_link %}
                                            <p class="mb-0">
                                                <a class="link-secondary" href="{{ meta.project_link }}" target="_blank" rel="noopener">Project</a>
                                            </p>
                                        {% endif %}

                                        {% if testimonial_fields_to_show.testimonial_date and (meta.testimonial_date_formatted or meta.testimonial_date) %}
                                            <p class="text-body-secondary mt-2 mb-0">
                                                {{ meta.testimonial_date_formatted ?: meta.testimonial_date }}
                                            </p>
                                        {% endif %}

                                    </div>
                                </div>
                            </div>
                        {% endfor %}

                    </div>

                    {% if fields.show_arrows %}
                        <button class="carousel-control-prev" type="button" data-bs-target="#{{ carousel_id }}" data-bs-slide="prev">
                            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                            <span class="visually-hidden">Previous</span>
                        </button>

                        <button class="carousel-control-next" type="button" data-bs-target="#{{ carousel_id }}" data-bs-slide="next">
                            <span class="carousel-control-next-icon" aria-hidden="true"></span>
                            <span class="visually-hidden">Next</span>
                        </button>
                    {% endif %}

                </div>
            {% else %}
                <p>No testimonials found.</p>
            {% endif %}

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