@extends('layouts.frontend')

@section('advr')
@include('frontend.__partials.adsl', ['adst' => $ads5,'adsd' => $ads6])
@endsection
@section('advl')
@include('frontend.__partials.adsr', ['adst' => $ads7,'adsd' => $ads8])
@endsection
@section('content')
@php
    $active_ads = '';
    $ads = explode(",",$company->ads);
    if(in_array(2, $ads) ||(Auth::user() && isset(Auth::user()->expired_at) && Auth::user()->expired_at >= date("Y-m-d"))){
    $active_ads = 1;
    }else{
    $active_ads = 0;
    }
@endphp
<div class="col-sm-6 col-md-6 col-xs-12">
    <div class="categories-box">
        <div class="heading-title header-title--1 text-left">
            <div class="heading-title__h-group">

                <h2><img src="{{asset('public/egyptianindustry/assets/img/slogen.png')}}" /></h2>

                @include('frontend.__partials.search')
                @include('frontend.__partials.remmber')

            </div>
        </div>

        <div class="f-listings">
            <div class="f-listings-item">
                <div class="f-listings-item__media">
                    <div class="row">
                        <div class="col-md-8 col-sm-8 col-xs-8">
                            @if(App::getLocale() == 'en')
                            <h1 class="f-listings-item__title">{{$company->title_en}}</h1>
                            @else
                            <h1 class="f-listings-item__title">{{$company->title}}</h1>
                            @endif

                        </div>
                        @if(isset($company->main_image) && !empty($company->main_image))
                            @if($active_ads == 1)
                                <div class="col-md-4 col-sm-4 col-xs-4 gallery">
                                    <a href="{{$company->main_image}}" class="" rel="prettyPhoto"><img src="{{$company->main_image}}" alt="{{$company->title}}"></a>
                                </div>
                            @endif
                        @endif
                    </div>
                </div>
                @if(App::getLocale() == 'en')
                @include('frontend.__partials.detail_en', ['company' => $company,'active_ads'=>$active_ads])
                @else
                @include('frontend.__partials.detail', ['company' => $company,'active_ads'=>$active_ads])
                @endif
                <div class="sharethis-inline-share-buttons"></div>
            <br />    
            </div>
        </div>

    </div>

    @if($active_ads == 1)

    <!-- Slider main container -->
    @if(isset($company) && $company->getMedia('images')->count())
    <div class="swiper-container">
        <!-- Additional required wrapper -->

        <ul class="swiper-wrapper my-gallery" itemscope itemtype="http://schema.org/ImageGallery">
            <!-- Slides -->
            @foreach($company->getMedia('images') as $key => $image)
            @if($image->hasCustomProperty('main-image'))
            @else
            <li class="swiper-slide">
                <a href="{{ $image->getUrl() }}" data-size="1200x600">
                    <img src="{{ $image->getUrl() }}"  style="width: 100%;height: 100%;"/>
                </a>
            </li>
            @endif
            @endforeach

        </ul>

        <!-- Add Pagination -->
        <div class="swiper-pagination"></div>

        <!-- If we need navigation buttons -->
        <div class="swiper-button-prev"></div>
        <div class="swiper-button-next"></div>
    </div>
    @endif



    <!-- Root element of PhotoSwipe. Must have class pswp. -->
    <div class="pswp" tabindex="-1" role="dialog" aria-hidden="true">

        <!-- Background of PhotoSwipe. 
            It's a separate element, as animating opacity is faster than rgba(). -->
        <div class="pswp__bg"></div>

        <!-- Slides wrapper with overflow:hidden. -->
        <div class="pswp__scroll-wrap">

            <!-- Container that holds slides. PhotoSwipe keeps only 3 slides in DOM to save memory. -->
            <!-- don't modify these 3 pswp__item elements, data is added later on. -->
            <div class="pswp__container">
                <div class="pswp__item"></div>
                <div class="pswp__item"></div>
                <div class="pswp__item"></div>
            </div>

            <!-- Default (PhotoSwipeUI_Default) interface on top of sliding area. Can be changed. -->
            <div class="pswp__ui pswp__ui--hidden">

                <div class="pswp__top-bar">

                    <!--  Controls are self-explanatory. Order can be changed. -->

                    <div class="pswp__counter"></div>

                    <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>

                    <button class="pswp__button pswp__button--share" title="Share"></button>

                    <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button>

                    <button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>

                    <!-- Preloader demo https://codepen.io/dimsemenov/pen/yyBWoR -->
                    <!-- element will get class pswp__preloader--active when preloader is running -->
                    <div class="pswp__preloader">
                        <div class="pswp__preloader__icn">
                            <div class="pswp__preloader__cut">
                                <div class="pswp__preloader__donut"></div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
                    <div class="pswp__share-tooltip"></div>
                </div>

                <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)">
                </button>

                <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)">
                </button>

                <div class="pswp__caption">
                    <div class="pswp__caption__center"></div>
                </div>

            </div>

        </div>

    </div>

    <!-- Swiper JS -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.7/css/swiper.min.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.7/js/swiper.min.js"></script>

    <!-- Initialize Swiper -->
    @if(isset($company->map) && !empty($company->map))
    <div class="map">
        <iframe src=" {{$company->map}}" width="100%" height="350" frameborder="0" style="border:0" allowfullscreen></iframe>
    </div>
    @endif
    @endif

</div>
@endsection