@extends('layouts.public')

@section('title') {{trans('seo.title.post', ['title' => $post->title])}} @endsection

@section('content')
<div class="sub-banner overview-bgi">
    <div class="overlay">
        <div class="container">
            <div class="breadcrumb-area">
                <h1>{{$post->title}}</h1>
                <ul class="breadcrumbs">
                    <li><a href="{{route('public.index')}}">{!!trans('references.page.subtitle')!!}</a></li>
                    <li class="active">{!!trans('references.page.title')!!}</li>
                </ul>
            </div>
        </div>
    </div>
</div>

<div class="blog-body content-area">
    <div class="container">
        <div class="row">
            <div class="col-lg-8 col-md-8 col-xs-12">
                <div class="thumbnail blog-box clearfix">
                    <div id="gallery" style="display: none;">
                        <img src="{{asset($post->thumbnail)}}" alt="{{$post->title}}" data-image="{{asset($post->image)}}" data-description="{{$post->title}}">
                        @foreach($post->images as $image)
                        <img src="{{asset($image->thumbnail)}}" alt="{{$post->title}}" data-image="{{asset($image->path)}}" data-description="{{$post->title}}">
                        @endforeach
                    </div>
                    <div class="caption detail">
                        <h3 class="title">
                            <i class="fa fa-map-marker"></i> {{$post->location}}
                        </h3>

                        {!!$post->content!!}

                        @foreach($post->documents as $document)
                        <p><a href="{{asset($document->path)}}" class="red" target="_blank"><i class="icon-download"></i> {{$document->name}}</a></p> 
                        @endforeach

                        <div class="row clearfix t-s">
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                                <div class="social-media clearfix blog-share">
                                    <h2>{!!trans('references.share')!!}</h2>
                                    <ul class="social-list">
                                        <li><a target="_blank" href="https://www.facebook.com/sharer.php?u={{route('public.post', $post)}}" class="facebook-bg"><i class="fa fa-facebook"></i></a></li>
                                        <li><a target="_blank" href="https://twitter.com/intent/tweet?url={{route('public.post', $post)}}&text={{$post->title}}" class="twitter-bg"><i class="fa fa-twitter"></i></a></li>
                                        <li><a target="_blank" href="https://www.linkedin.com/shareArticle?url={{route('public.post', $post)}}&title={{$post->title}}" class="linkedin-bg"><i class="fa fa-linkedin"></i></a></li>
                                        <li><a target="_blank" href="https://pinterest.com/pin/create/bookmarklet/?media={{asset($post->thumbnail)}}&url={{route('public.post', $post)}}&description={{$post->title}}" class="rss-bg"><i class="fa fa-rss"></i></a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-lg-4 col-md-4 col-xs-12">
                <div class="sidebar">
                    <div class="sidebar-widget popular-posts">
                        <div class="main-title-2">
                            <h1>{!!trans('references.page.title')!!}</h1>
                        </div>
                        @foreach($posts as $post)
                        <div class="media">
                            <div class="media-left">
                                <a href="{{route('public.post', $post)}}"><img class="media-object" src="{{asset($post->thumbnail)}}" width="90" alt="{{$post->title}}"></a>
                            </div>
                            <div class="media-body">
                                <h3 class="media-heading">
                                    <a href="{{route('public.post', $post)}}">{{$post->title}}</a>
                                </h3>
                                <p><i class="fa fa-map-marker"></i> {{$post->location}}</p>
                            </div>
                        </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('styles')
<link rel='stylesheet' href='/unitegallery/css/unite-gallery.css?v=2' type='text/css' />
<style type="text/css">
    .ug-gallery-wrapper .ug-slider-wrapper, .ug-gallery-wrapper .ug-strip-panel {
        background-color: white;
    }
</style>
@endsection

@section('scripts')
<script type='text/javascript' src='/unitegallery/js/unitegallery.min.js'></script>  
<script type='text/javascript' src='/unitegallery/themes/compact/ug-theme-compact.js'></script>
<script type="text/javascript">

    jQuery(document).ready(function(){

        jQuery("#gallery").unitegallery({
            gallery_theme: "compact",
            gallery_height: 600, 
            slider_scale_mode: "fit",
            slider_control_zoom: false,
            slider_fullscreen_button_align_hor: "right",
            slider_enable_play_button: false,
            slider_enable_zoom_panel: false,
            strippanel_enable_handle: false
        });

    });

</script>
@endsection