Untitled

mail@pastecode.io avatar
unknown
php_laravel_blade
a year ago
37 kB
0
Indexable
Never
@extends('public.templates.base')

@section('pageCSS')
<link rel="stylesheet" href="{{url('assets/css/swiper/swiper.min.css')}}">
@stop

@section('header')
@include('public.templates.header')
@endsection

@section('main-content')
<?php
    //dd($attractionItems);
        $v_Title = json_decode($p_Content->titulo,1)[$p_Language];
        $v_ShortDescription = json_decode($p_Content->descricao_curta,1)[$p_Language];
        $v_Description = json_decode($p_Content->descricao,1)[$p_Language];
        $v_Testimonial = json_decode($p_Content->depoimento,1)[$p_Language];
        $v_TestimonialAuthor = json_decode($p_Content->depoimento_autor,1)[$p_Language];
        //dd($p_Content->url);
        
    ?>

<main class="destinations__page--single">

    <!-- \\ Begin Banner Section \\ -->


    <div class="Banner_sec" id="home">


        <!--  \\ Begin banner Side -->

        <div class="bannerside lazy" data-src="{{url('/portal/assets/imgs/images/detalhes_destinos/bannerdefundo.jpg')}}">
            <div class="container">
                <div class="col-12">

                    <!--  \\ Begin Left Side -->

                    <div class="leftside col-6">
                        <h1> <i class="fa fa-map-marker"></i> {{$p_Content->nome}}</h1>
                        @if($district)
                            <p>{{$district ? "Distrito de {$district}" : ''}}</p>
                        @endif
                        
                        <p class="short-description">{{$v_ShortDescription}}</p>

                        <div class="takeMeThere">
                            <a href="https://www.google.com/maps/dir/My+Location/{{$p_Content->latitude}},{{$p_Content->longitude}}" target="_blank">
                                <img class="lazy" data-src="{{url('portal/assets/imgs/images/equipamento/me_leve_ate.png')}}" alt="{{$p_Content->nome}}">
                            </a>
                            <a href="https://www.google.com/maps/dir/My+Location/{{$p_Content->latitude}},{{$p_Content->longitude}}" target="_blank">
                                <p class="mr-2">Me Leve até Lá</p>
                            </a>
                            
                        </div>

                        <div class="more-info d-flex flex-row">
                        
                            <div class="col-5 d-flex flex-row justify-content-between align-items-center">
                            <div class="climate">
                                <img id="tempImg" alt=""
                                    style="margin-left:auto;margin-right:auto;display:block;"
                                    src="{{url('/portal/assets/imgs/clima/04d.png')}}">
                                <p id="temp" style="text-align:center;">2,3º</p>
                                
                            </div>
                                
                                <div class="area d-flex flex-column  align-items-center  text-white">
                                    @if($p_Content->minas_360)
                                <a href="{{$p_Content->minas_360}}" target="_blank"><img src="{{url('/portal/assets/imgs/binoculo_360.png')}}">
                                    <p style="text-align:center;">360º</p>
                                </a>
                                @endif
                                </div>
                                
                            </div>
    
                            <div class="col-7">
                                @if($p_Content->facebook != null)
                                    <a href="{{$p_Content->facebook}}" target="_blank">
                                        <object type="image/svg+xml" data="{{url("portal/assets/imgs/images/social_networks/face.svg")}}"></object>
                                    </a>
                                @endif
                                @if($p_Content->instagram != null)
                                    <a href="{{$p_Content->instagram}}" target="_blank">
                                        <object type="image/svg+xml" data="{{url("portal/assets/imgs/images/social_networks/insta.svg")}}"></object>
                                    </a>    
                                @endif
                                @if($p_Content->twitter != null)
                                    <a href="{{$p_Content->twitter}}" target="_blank">
                                        <object type="image/svg+xml" data="{{url("portal/assets/imgs/images/social_networks/twitter.svg")}}"></object>
                                    </a>
                                @endif
                                @if($p_Content->whatsapp != null)
                                <?php 
                                    $phoneNumberFormat = strtr($p_Content->whatsapp, array('(' => '', ')' => '', '-'=>'', ' '=>''));
                                ?>
                                <a href="https://api.whatsapp.com/send?phone=55{{$phoneNumberFormat}}&text= Olá, gostaria de maiores informações sobre {{$p_Content->nome}}" target="_blank">
                                        <object type="image/svg+xml" data="{{url("portal/assets/imgs/images/social_networks/whatsapp.svg")}}"></object>
                                    </a>
                                @endif
    
                                <p class="tel">{{$p_Content->telefone}}</p>
                                <p>
                                    <a class="site" href="{{$p_Content->site}}" target="_blank">
                                        {{$p_Content->site}}
                                    </a>
                                </p>
                                <p class="e-mail">{{$p_Content->email}}</p>
                            </div> 
                        </div>
                        <!--  \\ 360  -->
                    </div>

                    <!--  \\ Begin Right Side -->

                    <div class="rightside animated fadeIn col-6">

                        <!-- Slider main container -->
                        <!-- Slider main container -->
                        <div class="banner swiper-container">
                            <!-- Additional required wrapper -->
                            <div class="swiper-wrapper">
                                <!-- Slides -->
                                <div class="swiper-slide">
                                    <img class="lazy" data-src="{{url($p_Content->url)}}" alt="">
                                </div>
                                @if(isset($p_PhotoGallery) && count($p_PhotoGallery) > 0)
                                    @foreach($p_PhotoGallery as $gallery)
                                        <div class="swiper-slide">
                                            <img class="lazy" data-src="{{url($gallery->url)}}" alt="">
                                        </div>
                                    @endforeach
                                @endif
                            </div>
                            <div class="swiper-button-next"></div>
                            <div class="swiper-button-prev"></div>
                        </div>
                        <div class="interaction d-flex justify-content-around text-white">
                                                        
                            <div class="like {{$p_Content->id}}-destination">
                                <i class="fa fa-heart-o like-btn"
                                data-id="{{$p_Content->id}}-destination"
                                data-name="{{$p_Content->nome}}"
                                data-type="Destinos"
                                data-style="destinations"
                                data-module="destinations"
                                data-city="none"
                                data-url="{{route("destination.show", ['p_lang' => 'pt', 'slug' => $p_Content->slug])}}"
                                data-img="{{$p_Content->url}}">
                                    <span class="font-light">Gostei</span>
                                </i> 
                              </div>

                            <div class="share">
                                <i class="fa fa-share-alt"></i> Compartilhe
                            </div>
                            
                        </div>

                    </div>

                    <!--  // End Right Side // -->
                </div>
            </div>

           
                    @include('public.includes.socialShare',[
                        'slug' => route("destination.show", ['p_lang' => 'pt', 'slug' => $p_Content->slug]),
                        'name' => $p_Content->nome
                    ])
                    
              

            <!--  // End banner Side // -->

        </div>


    </div> <!-- // End Banner Section // -->
    <?php $covidWarning = null ?>
    {{-- Alerta Covid 19--}}
@if(isset($covidWarning))
    <section class="warning__covid mt-3">
        <div class="container">
            <div class="row no-gutters">
                <ul class="accordion__list w-100">
                    <li class="accordion__item">
                        <div class="accordion__itemTitleWrap">
                            <h3 class="accordion__itemTitle text-uppercase covid-title">Alerta de viagem: Covid-19</h3>
                            <div class="accordion__itemIconWrap"><svg viewBox="0 0 24 24"><polyline fill="none" points="21,8.5 12,17.5 3,8.5 " stroke="#ED1D24" stroke-miterlimit="10" stroke-width="2"/></svg></div>
                        </div>    
                        <div class="accordion__itemContent day__description mt-2">
                            <div class="row">
                                <div class="updated__at small">Atualizado em: {{ isset($covidWarning->updated_at) ? date('d/m/Y', strtotime($covidWarning->updated_at)) : ''}}</div>
                            </div>
                            <div class="row mt-3">
                                <h4 class="text-uppercase w-100 barreiras">Barreiras Sanitárias</h4>
                                <div class="warning__covid--info d-flex align-items-center w-100">
                                    <img class="mr-2" src="{{url('portal/assets/imgs/images/minas_consciente/destino/barreira.png')}}" alt="">
                                    <p>{{isset($covidWarning->barreiras) ? $covidWarning->barreiras : ''}}</p>
                                </div>
                            </div>
                            <div class="row mt-3">
                                <h4 class="text-uppercase w-100 funcionamento">Funcionamento dos estabelecimentos</h4>
                                <h4 class="text-uppercase w-100 gray">Quantidade</h4>
                                @if(isset($covidWarning->funcionamento_qtde_hospedagem))
                                <div class="warning__covid--info d-flex align-items-center w-100 mt-3">
                                    <img class="mr-2" src="{{url('portal/assets/imgs/images/minas_consciente/destino/hospedagem.png')}}" alt="">
                                    <h5>Hospedagem</h5>
                                </div>
                                <p>{{isset($covidWarning->funcionamento_qtde_hospedagem) ? $covidWarning->funcionamento_qtde_hospedagem : ''}}</p>
                                @endif
                                
                                @if(isset($covidWarning->funcionamento_qtde_restaurantes))
                                <div class="warning__covid--info d-flex align-items-center w-100 mt-3">
                                    <img class="mr-2" src="{{url('portal/assets/imgs/images/minas_consciente/destino/alimentacao.png')}}" alt="">
                                    <h5>Alimentacão</h5>
                                </div>
                                <p>{{isset($covidWarning->funcionamento_qtde_restaurantes) ? $covidWarning->funcionamento_qtde_restaurantes : ''}}</p>
                                @endif

                                @if(isset($covidWarning->funcionamento_qtde_parques))
                                <div class="warning__covid--info d-flex align-items-center w-100 mt-3">
                                    <img class="mr-2" src="{{url('portal/assets/imgs/images/minas_consciente/destino/parques.png')}}" alt="">
                                    <h5>Parques</h5>
                                </div>
                                <p>{{isset($covidWarning->funcionamento_qtde_parques) ? $covidWarning->funcionamento_qtde_parques : ''}}</p>
                                @endif
                                @if(isset($covidWarning->funcionamento_qtde_atrativos_naturais))
                                <div class="warning__covid--info d-flex align-items-center w-100 mt-3">
                                    <img class="mr-2" src="{{url('portal/assets/imgs/images/minas_consciente/destino/parques.png')}}" alt="">
                                    <h5>Atrativos Naturais</h5>
                                </div>
                                <p>{{isset($covidWarning->funcionamento_qtde_atrativos_naturais) ? $covidWarning->funcionamento_qtde_atrativos_naturais : ''}}</p>
                                @endif
                                @if(isset($covidWarning->funcionamento_qtde_atrativos_culturais))
                                <div class="warning__covid--info d-flex align-items-center w-100 mt-3">
                                    <img class="mr-2" src="{{url('portal/assets/imgs/images/minas_consciente/destino/cultural.png')}}" alt="">
                                    <h5>Atrativos Culturais</h5>
                                </div>
                                <p>{{isset($covidWarning->funcionamento_qtde_atrativos_culturais) ? $covidWarning->funcionamento_qtde_atrativos_culturais : ''}}</p>
                                @endif

                                <h4 class="text-uppercase w-100 gray mt-4">Carga Horária</h4>
                                @if(isset($covidWarning->carga_horaria_hospedagem))
                                <div class="warning__covid--info d-flex align-items-center w-100 mt-3">
                                    <img class="mr-2" src="{{url('portal/assets/imgs/images/minas_consciente/destino/hospedagem.png')}}" alt="">
                                    <h5>Hospedagem</h5>
                                </div>
                                <p>{{isset($covidWarning->carga_horaria_hospedagem) ? $covidWarning->carga_horaria_hospedagem : ''}}</p>
                                @endif
                                @if(isset($covidWarning->carga_horaria_restaurantes))
                                <div class="warning__covid--info d-flex align-items-center w-100 mt-3">
                                    <img class="mr-2" src="{{url('portal/assets/imgs/images/minas_consciente/destino/alimentacao.png')}}" alt="">
                                    <h5>Alimentacão</h5>
                                </div>
                                <p>{{isset($covidWarning->carga_horaria_restaurantes) ? $covidWarning->carga_horaria_restaurantes : ''}}</p>
                                @endif
                                @if(isset($covidWarning->carga_horaria_parques))
                                <div class="warning__covid--info d-flex align-items-center w-100 mt-3">
                                    <img class="mr-2" src="{{url('portal/assets/imgs/images/minas_consciente/destino/parques.png')}}" alt="">
                                    <h5>Parques</h5>
                                </div>
                                <p>{{isset($covidWarning->carga_horaria_parques) ? $covidWarning->carga_horaria_parques : ''}}</p>
                                @endif
                                @if(isset($covidWarning->carga_horaria_atrativos_naturais))
                                <div class="warning__covid--info d-flex align-items-center w-100 mt-3">
                                    <img class="mr-2" src="{{url('portal/assets/imgs/images/minas_consciente/destino/parques.png')}}" alt="">
                                    <h5>Atrativos Naturais</h5>
                                </div>
                                <p>{{isset($covidWarning->carga_horaria_atrativos_naturais) ? $covidWarning->carga_horaria_atrativos_naturais : ''}}</p>
                                @endif
                                @if(isset($covidWarning->carga_horaria_atrativos_culturais))
                                <div class="warning__covid--info d-flex align-items-center w-100 mt-3">
                                    <img class="mr-2" src="{{url('portal/assets/imgs/images/minas_consciente/destino/cultural.png')}}" alt="">
                                    <h5>Atrativos Culturais</h5>
                                </div>
                                <p>{{isset($covidWarning->carga_horaria_atrativos_culturais) ? $covidWarning->carga_horaria_atrativos_culturais : ''}}</p>
                                @endif
                                
                            </div>
                            <div class="line-bottom mt-3 mb-3"></div>
                        </div>
                       
                    </li>
                    
                </ul>
            </div>
        </div>
    </section>
@endif
    <section class="info">

        <div class="container">

            

            {{-- @if(strlen($v_Description) > 100)
                    {!! substr($v_Description, 0, 100) !!}
                    <span class="read-more-show hide_content">Mais</span>
                    <span class="read-more-content"> {!! substr($v_Description,100,strlen($v_Description)) !!} 
                    <span class="read-more-hide hide_content">Menos
                @else
                    {!! $v_Description !!}        
                @endif --}}


            <div class="see-more__container--text">
                {!! $v_Description !!}
            </div>
            <div class="see-more__container">
                <p class="see-more__container--button see-more">Ver mais</p>
            </div>

        </div>


    </section>

    <section class="options">

        <div class="container">

            <ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">

                <li class="nav-item">
                    <a class="nav-link active" id="pills-profile-tab" data-toggle="pill" href="#atracoes" role="tab"
                        aria-controls="pills-profile" aria-selected="false">Atrações</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link" id="pills-contact-tab" data-toggle="pill" href="#hospedagem" role="tab"
                        aria-controls="pills-contact" aria-selected="false">Hospedagem</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link" id="pills-contact-tab" data-toggle="pill" href="#servicos" role="tab"
                        aria-controls="pills-contact" aria-selected="false">Serviços</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link" id="pills-contact-tab" data-toggle="pill" href="#alimentacao" role="tab"
                        aria-controls="pills-contact" aria-selected="false">Alimentação</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link" id="pills-contact-tab" data-toggle="pill" href="#lazer" role="tab"
                        aria-controls="pills-contact" aria-selected="false">Lazer</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link" id="pills-home-tab" data-toggle="pill" href="#roteiros" role="tab"
                        aria-controls="pills-home" aria-selected="true">Roteiros</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link" id="pills-home-tab" data-toggle="pill" href="#eventos" role="tab"
                        aria-controls="pills-home" aria-selected="true">Eventos</a>
                </li>

            </ul>

            <div class="tab-content" id="pills-tabContent">
                
                <div class="tab-pane fade destinations__page--carousel" id="eventos" role="tabpanel"
                    aria-labelledby="pills-home-tab">
                    @if(count($p_CityEvents) > 0)
                    <h6>{{count($p_CityEvents) == 1 ? 'evento' : 'eventos'}} em {{$p_Content->nome}} e região</h6>

                    <div class="slider swiper-container">
                        <!-- Additional required wrapper -->
                        <div class="swiper-wrapper">
                    
                        @foreach($p_CityEvents as $event)

                        <div class="swiper-slide lazy" data-src="{{url($event->url )}}">
                                <a href="{{url($p_Language.'/eventos/'.str_slug($p_Content->nome).'/'.$event->slug)}}" class="img">
                                    <div class="destinations__page--destination-name">
                                     <span>{{mb_convert_case($event->nome, MB_CASE_TITLE, "UTF-8")}} </span>

                                    </div>

                                </a>

                            
                        </div>

                        @endforeach
                        </div>
                        <div class="swiper-button-next"></div>
                        <div class="swiper-button-prev"></div>
                    </div>
                    @else
                    
                    <div class="alert alert-info text-center" role="alert">
                        Não há eventos registrados para <strong>{{$p_Content->nome}}</strong> no momento.
                    </div>
                    
                    @endif
                </div>

                <div class="tab-pane fade show active destinations__page--carousel" id="atracoes" role="tabpanel"
                    aria-labelledby="pills-profile-tab">

                    @if(count($attractionItems) > 0)
                    
                    @foreach($attractionItems as $key => $value)
                    <h6>
                        {{$key == 'naturais' ? "atrações naturais em {$p_Content->nome}" : ''}} 
                        {{$key == 'culturais' ? "atrações culturais em {$p_Content->nome}" : ''}}
                        {{$key =='item' ? "atrações em {$p_Content->nome}" : ''}}
                    </h6>
                    
                    <div class="slider swiper-container">
                        <!-- Additional required wrapper -->
                        <div class="swiper-wrapper">
                        @foreach($value as $attraction)

                        <div class="swiper-slide lazy" data-src="{{url($attraction['capa'])}}">

                                <a href="{{url($p_Language.'/atracoes/'.$attraction['slug'])}}" class="img">
                                    <div class="destinations__page--destination-name">
                                       <span>{{$attraction['nome']}}</span> 
                                    </div>
                                    
                                </a>
                            
                        </div>


                        @endforeach
                    
                </div>
                <div class="swiper-button-next"></div>
                <div class="swiper-button-prev"></div>
            </div>
                    @endforeach
                    @else
                    <div class="alert alert-info text-center" role="alert">
                        Não há atrações registradas para <strong>{{$p_Content->nome}}</strong> no momento.
                    </div>
                    @endif
                </div>

                <div class="tab-pane fade destinations__page--carousel" id="hospedagem" role="tabpanel"
                    aria-labelledby="pills-contact-tab">

                    @if(count($hospedagem) > 0)
                    <h6>{{count($hospedagem) == 1 ? 'opção' : 'opções'}} para o seu conforto em {{$p_Content->nome}}</h6>

                    <div class="slider swiper-container">
                        <!-- Additional required wrapper -->
                        <div class="swiper-wrapper">

                        @foreach($hospedagem as $attraction)

                        <div class="swiper-slide lazy" data-src="{{url($attraction['capa'])}}">

                                <a href="{{url($p_Language.'/apoio/'.$attraction['slug'])}}" class="img">
                                    <div class="destinations__page--destination-name">
                                       <span>{{$attraction['nome_pt']}}</span> 
                                    </div>
                                    
                                </a>

                            
                        </div>
                        @endforeach
                    
                    </div>
                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                </div>
                    @else
                    <div class="alert alert-info text-center" role="alert">
                        Não há opções de hospedagem registrados para <strong>{{$p_Content->nome}}</strong> no momento.
                    </div>
                    @endif

                </div>

                <div class="tab-pane fade destinations__page--carousel" id="servicos" role="tabpanel"
                    aria-labelledby="pills-contact-tab">

                    @if(count($services) > 0)
            <h6>{{count($services) == 1 ? 'opção de serviço' : 'opções de serviço'}} em {{$p_Content->nome}}</h6>
                    
            <div class="slider swiper-container">
                <!-- Additional required wrapper -->
                <div class="swiper-wrapper">

                        @foreach($services as $attraction)

                        <div class="swiper-slide lazy" data-src="{{url($attraction['capa'])}}">

                                <a href="{{url($p_Language.'/apoio/'.$attraction['slug'])}}" class="img">
                                    <div class="destinations__page--destination-name">
                                      <span>{{$attraction['nome_pt']}}</span>  
                                    </div>
                                    
                                </a>

                        </div>
                        @endforeach
                        </div>
                        <div class="swiper-button-next"></div>
                        <div class="swiper-button-prev"></div>
                    </div>
                    @else
                    <div class="alert alert-info text-center" role="alert">
                        Não há opções de serviços registrados para <strong>{{$p_Content->nome}}</strong> no momento.
                      </div>
                    @endif
                </div>

                <div class="tab-pane fade destinations__page--carousel" id="alimentacao" role="tabpanel"
                    aria-labelledby="pills-contact-tab">
                    @if(count($food) > 0)
                    <h6>opções para Alimentação em {{$p_Content->nome}}</h6>
                    
                    <div class="slider swiper-container">
                        <!-- Additional required wrapper -->
                        <div class="swiper-wrapper">

                        @foreach($food as $attraction)

                        <div class="swiper-slide lazy" data-src="{{url($attraction['capa'])}}">

                                <a href="{{url($p_Language.'/apoio/'.$attraction['slug'])}}" class="img">
                                    <div class="destinations__page--destination-name">
                                       <span>{{$attraction['nome_pt']}}</span> 
                                    </div>
                                    
                                </a>
                        </div>
                        @endforeach
                    </div>
                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                </div>
                    @else
                    <div class="alert alert-info text-center" role="alert">
                        Não há opções para alimentação registrados para <strong>{{$p_Content->nome}}</strong> no momento.
                      </div>
                    @endif
                </div>

                <div class="tab-pane fade destinations__page--carousel" id="lazer" role="tabpanel"
                    aria-labelledby="pills-contact-tab">
                    @if(count($lazer) > 0)
                    <h6>opções para o seu lazer em {{$p_Content->nome}}</h6>
                    
                    <div class="slider swiper-container">
                        <!-- Additional required wrapper -->
                        <div class="swiper-wrapper">

                        @foreach($lazer as $attraction)

                        <div class="swiper-slide lazy" data-src="{{url($attraction['capa'])}}">

                                <a href="{{url($p_Language.'/apoio/'.$attraction['slug'])}}" class="img">
                                    <div class="destinations__page--destination-name">
                                       <span>{{$attraction['nome_pt']}}</span> 
                                    </div>
                                    
                                </a>

                        </div>
                        @endforeach
                    </div>
                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                </div>
                    @else
                    <div class="alert alert-info text-center" role="alert">
                        Não há opções de lazer registrados para <strong>{{$p_Content->nome}}</strong> no momento.
                    </div>
                    @endif
                </div>

                <div class="tab-pane fade destinations__page--carousel" id="roteiros" role="tabpanel"
                    aria-labelledby="pills-contact-tab">
                    @if(count($tourPackages) > 0)
                    <h6>Roteiros Turísticos em {{$p_Content->nome}}</h6>
                    
                    <div class="slider swiper-container">
                        <!-- Additional required wrapper -->
                        <div class="swiper-wrapper">

                        @foreach($tourPackages as $package)

                        <div class="swiper-slide lazy" data-src="{{url($package->images[0]->url)}}">

                                <a href="{{route('tourPackage.show', ['pt', $package->slug])}}" class="img">
                                    

                                    <div class="box__info--top {{str_slug($package->type)}}">
                                        {{$package->type}}
                                    </div>
        
                                    <div class="box__info--bottom">
                                        <div class="row flex-column">
                                            <div class="package__name">
                                                <i class="medium-star fa fa-star"></i> {{$package->name['pt']}}
                                            </div>
                                        </div>
                                    </div>
                                    
                                </a>

                        </div>
                        @endforeach
                    </div>
                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                </div>
                    @else
                    <div class="alert alert-info text-center" role="alert">
                        Não há roteiros registrados para <strong>{{$p_Content->nome}}</strong> no momento.
                    </div>
                    @endif
                </div>

            </div>
            <!--pills content tabs-->



        </div>
        <!--CONTAINER-->



    </section>



</main>
@stop

@section('footer')
@include('public.templates.footer')
@endsection
@section('pageScript')
<script src="{{url('assets/js/swiper/swiper.min.js')}}"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenMax.min.js"></script>
<script>
    var mySwiper = new Swiper ('.banner', {
      // Optional parameters
        autoplay: {
            delay: 3000,
        },
        effect:'fade',
        fadeEffect: {
            crossFade: true
        },
        

        // If we need pagination
        pagination: {
            el: '.swiper-pagination',
        },

        // Navigation arrows
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },

        // And if we need scrollbar
        scrollbar: {
            el: '.swiper-scrollbar',
        },
    })

    var swiper = new Swiper('.slider', {
    slidesPerView: 3,
    spaceBetween: 0,
    // hashNavigation: true,
    // replaceState: true,
    
    observer: true,
    observeParents: true,
    // init: false,
    pagination: {
      el: '.swiper-pagination',
      clickable: true,
    },
    navigation: {
      nextEl: '.swiper-button-next',
      prevEl: '.swiper-button-prev',
    },
    breakpoints: {
      '@0.00': {
        slidesPerView: 3,
        spaceBetween: 5,
      },
      '@0.75': {
        slidesPerView: 3,
        spaceBetween: 20,
      },
      '@1.00': {
        slidesPerView: 3,
        spaceBetween: 40,
      },
      '@1.50': {
        slidesPerView: 5,
        spaceBetween: 5,
      },
    }
  });

  var Accordion = function() {
  
  var
  toggleItems,
  items;

var _init = function() {
  toggleItems     = document.querySelectorAll('.accordion__itemTitleWrap');
  toggleItems     = Array.prototype.slice.call(toggleItems);
  items           = document.querySelectorAll('.accordion__item');
  items           = Array.prototype.slice.call(items);
  
  _addEventHandlers();
  TweenLite.set(items, {visibility:'visible'});
  TweenMax.staggerFrom(items, 0.9,{opacity:0, x:-100, ease:Power2.easeOut}, 0.3)
}

var _addEventHandlers = function() {
  toggleItems.forEach(function(element, index) {
    element.addEventListener('click', _toggleItem, false);
  });
}

var _toggleItem = function() {
  var parent = this.parentNode;
  var content = parent.children[1];
  if(!parent.classList.contains('is-active')) {
    parent.classList.add('is-active');
    TweenLite.set(content, {height:'auto'})
    TweenLite.from(content, 0.6, {height: 0, immediateRender:false, ease: Back.easeOut})
    
  } else {
    parent.classList.remove('is-active');
    TweenLite.to(content, 0.3, {height: 0, immediateRender:false, ease: Power1.easeOut})
  }
}

return {
  init: _init
}

}();
Accordion.init();

</script>

<!-- Social Sharing plugin -->
<!-- Go to www.addthis.com/dashboard to customize your tools -->
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-56a0debd79357d1c" async="async">
</script>
<script>
    
@include('public.includes.climate')

$('.interaction .share').on('click', function(){
    $(this).toggleClass('active');
    if($(this).hasClass('active')){
        $('.social-share').fadeIn();
    } else{
        $('.social-share').fadeOut();
    }    
    
});
//hash navigation tabs

let categoryHash = window.location.hash
        let splitedHash = categoryHash.split('/');
        console.log(splitedHash)
        if(splitedHash[0]){
            $('#pills-tab li a').each(function(i){
                if($(this).is('.active')) $(this).removeClass('active');
            });

            $('#pills-tabContent div').each(function(i){
                if($(this).is('.active')) $(this).removeClass('active');
            });
        }
        
        
        if(splitedHash[0]){
            $('[href*="'+splitedHash[0]+'"]').addClass('active');
            $(splitedHash[0]).addClass('active show');
        }

        //scroll to subcategory if exists
        
        
        if(splitedHash[1] && splitedHash[1] != 'undefined'){
            $(document).ready(function(){
                const navHeight = $('.fixed__menu').outerHeight() + 40;
                $('html, body').animate({
                    scrollTop: $(splitedHash[1]).offset().top - navHeight
                }, 'slow');
            });
        }
        // else{
        //     $(document).ready(function(){
        //         const navHeight = $('.fixed__menu').outerHeight() + 40;
        //         if($('#top-title')){
        //             $('html, body').animate({
        //                 scrollTop: $('#top-title').offset().top - navHeight
        //             }, 'slow');
        //         }
        //     });
        // }

</script>


@stop