@extends('site.template.template')

@section('conteudo')
<section class="container tm-home-section-1" id="more">
    <div class="section-margin-top" style="margin-top: 30px;">
        <div class="row">				
            <div class="tm-section-header" style="margin-bottom: 30px;">
                <div class="col-lg-3 col-md-3 col-sm-3"><hr></div>
                <div class="col-lg-6 col-md-6 col-sm-6"><h2 class="tm-section-title">Nossos Clientes</h2></div>
                <div class="col-lg-3 col-md-3 col-sm-3"><hr></div>	
            </div>
        </div>
        <div class="row">
            @if(count($ordem[2]) > 0 && count($elemento) > 0)

                @foreach($ordem[2] as $index => $id_cliente)

                    @foreach($elemento as $cliente)

                        @if($id_cliente == $cliente->id)
                            <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
                                <div class="tm-tours-box-1">

                                    @if( count($cliente->imagens) > 0)
                                        <div id="myCarousel_{{ $index }}" class="carousel slide" data-ride="carousel" style="width:360px; height:162px;">
                                            
                                            <!-- Indices -->
                                            <ol class="carousel-indicators">
                                                @foreach($cliente->imagens as $index_img => $imagem)
                                                        <li data-target="#myCarousel_{{ $index }}" data-slide-to="{{ $index_img }}" class="active"></li>
                                                @endforeach
                                            </ol>

                                            <!-- Fotos -->
                                            <div class="carousel-inner">
                                                @foreach($cliente->imagens as $index_img => $imagem)
                                                    @if($index_img == 0)
                                                        <div class="item active">
                                                    @else
                                                        <div class="item">
                                                    @endif
                                                            <img src="{{ asset($imagem->path) }}" class="center-block" >
                                                        </div>
                                                @endforeach
                                            </div>

                                            <!-- Setas -->
                                            <a class="left carousel-control" href="#myCarousel_{{ $index }}" data-slide="prev">
                                                <span class="glyphicon glyphicon-chevron-left"></span>
                                                <span class="sr-only">Previous</span>
                                            </a>
                                            <a class="right carousel-control" href="#myCarousel_{{ $index }}" data-slide="next">
                                                <span class="glyphicon glyphicon-chevron-right"></span>
                                                <span class="sr-only">Next</span>
                                            </a>
                                        </div>     
                                    @else
                                        <img src="{{ asset($imagem->path) }}" style="width:360px; height: 162px;"/>
                                    @endif

                                    <!-- Nome -->
                                    <div class="tm-tours-box-1-link">
                                        <div class="tm-tours-box-1-link-left" style="width: 100%">
                                            {{$cliente->nome}}
                                        </div>							
                                    </div>

                                    <!-- Descrição -->
                                    <div class="tm-tours-box-1-info">
                                        <div class="tm-tours-box-1-info-right">
                                            <p class="gray-text tours-1-description">{{$cliente->descricao}}</p>	
                                        </div>							
                                    </div>
                                </div>					
                            </div>
                        @endif

                    @endforeach
                
                @endforeach
                
            @elseif(count($elemento) > 0)
                @foreach($elemento as $index => $cliente)

                    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
                        <div class="tm-tours-box-1">

                            @if( count($cliente->imagens) > 0)
                                <div id="myCarousel_{{ $index }}" class="carousel slide" data-ride="carousel" style="width:360px; height:162px;">
                                    
                                    <!-- Indices -->
                                    <ol class="carousel-indicators">
                                        @foreach($cliente->imagens as $index_img => $imagem)
                                                <li data-target="#myCarousel_{{ $index }}" data-slide-to="{{ $index_img }}" class="active"></li>
                                        @endforeach
                                    </ol>

                                    <!-- Fotos -->
                                    <div class="carousel-inner">
                                        @foreach($cliente->imagens as $index_img => $imagem)
                                            @if($index_img == 0)
                                                <div class="item active">
                                            @else
                                                <div class="item">
                                            @endif
                                                    <img src="{{ asset($imagem->path) }}" class="center-block" >
                                                </div>
                                        @endforeach
                                    </div>

                                    <!-- Setas -->
                                    <a class="left carousel-control" href="#myCarousel_{{ $index }}" data-slide="prev">
                                        <span class="glyphicon glyphicon-chevron-left"></span>
                                        <span class="sr-only">Previous</span>
                                    </a>
                                    <a class="right carousel-control" href="#myCarousel_{{ $index }}" data-slide="next">
                                        <span class="glyphicon glyphicon-chevron-right"></span>
                                        <span class="sr-only">Next</span>
                                    </a>
                                </div>     
                            @else
                                <img src="{{ asset($imagem->path) }}" style="width:360px; height: 162px;"/>
                            @endif

                            <!-- Nome -->
                            <div class="tm-tours-box-1-link">
                                <div class="tm-tours-box-1-link-left" style="width: 100%">
                                    {{$cliente->nome}}
                                </div>							
                            </div>

                            <!-- Descrição -->
                            <div class="tm-tours-box-1-info">
                                <div class="tm-tours-box-1-info-right">
                                    <p class="gray-text tours-1-description">{{$cliente->descricao}}</p>	
                                </div>							
                            </div>
                        </div>					
                    </div>
                @endforeach
            @else
                Nenhum Cliente Cadastrado.
            @endif
        </div>
    </section>

@endsection