{% if number_of_photos == 1 %}

    {% for photo in property.photos %}

        <a href="/uploads/images/large/{{ photo.photo }}" data-toggle="lightbox"
           data-gallery="main-gallery">

            <img class="card-img-top lazyload" src="{{ asset('/images/transparent.png') }}"
                 data-src="/uploads/images/medium/{{ photo.photo }}"
                 alt="{{ property.address }}"
                 title="{{ property.address }}"/>
        </a>

    {% endfor %}

{% elseif number_of_photos > 1 %}

    <!-- Bootstrap Slider -->
    <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">

        <!-- Carousel indicators -->
        <ol class="carousel-indicators">
            {% for i in 0..number_of_photos-1 %}
                <li data-target="#carouselExampleIndicators" data-slide-to="{{ i }}" class=""></li>
            {% endfor %}
        </ol>

        <div class="carousel-inner">

            {% for photo in property.photos %}

                <div class="carousel-item {% if loop.index == 1 %}active{% endif %}">

                    <a href="/uploads/images/large/{{ photo.photo }}" data-toggle="lightbox"
                       data-gallery="main-gallery">

                        <img class="card-img-top lazyload" src="{{ asset('/images/transparent.png') }}"
                             data-src="/uploads/images/medium/{{ photo.photo }}"
                             alt="{{ property.address }}"
                             title="{{ property.address }}"/>
                    </a>
                </div>
            {% endfor %}

        </div>

        <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button"
           data-slide="prev">
            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
        </a>

        <a class="carousel-control-next" href="#carouselExampleIndicators" role="button"
           data-slide="next">
            <span class="carousel-control-next-icon" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
        </a>

    </div>

{% endif %}