@extends('front.layout.pages-layout')
@section('pageTitle', isset($pageTitle) ? $pageTitle : 'Document Title')
@section('meta_tags')
    {!! SEO::generate() !!}}
@endsection
@section('structured_data')
    @if (!empty($post->structured_data))
        <script type="application/ld+json">
{!! $post->structured_data !!}
</script>
    @endif
@endsection
@section('content')

    <div class="row">
        <div class="col-lg-8  mb-5 mb-lg-0">
            <article class="row mb-4">
                <div class="col-lg-12 mb-2">
                    <h2 class="mb-3">{{ $post->title }}</h2>
                    <ul class="list-inline post-meta">
                        <li class="list-inline-item"><i class="ti-user mr-2"></i><a
                                href="{{ route('author_posts', $post->author->username) }}">{{ $post->author->name }}</a>
                        </li>
                        <li class="list-inline-item">Datum : {{ date_formatter($post->created_at) }}</li>
                        <li class="list-inline-item">Kategorie : <a
                                href="{{ route('category_posts', $post->post_category->slug) }}"
                                class="ml-1">{{ $post->post_category->name }}</a>
                        </li>
                        <li class="list-inline-item"><i class="ti-timer mr-1"></i>
                            {{ readDuration($post->title, $post->content) }} @choice('min|mins', readDuration($post->title, $post->content))
                        </li>
                    </ul>
                </div>
                <div class="col-12 mb-3">
                    <img alt="single-image" src="/images/posts/{{ $post->featured_image }}" class="img-fluid rounded-lg">
                </div>
                <!-- SHARE BUTTONS -->
                <div class="share-buttons">
                    <span class="title-color">Share: </span>
                    <a href="https://www.facebook.com/sharer/sharer.php?u={{ urlencode(route('read_post', $post->slug)) }}"
                        target="_blank" class="btn-facebook">
                        <i class="ti-facebook"></i>
                    </a>
                    <a href="https://twitter.com/intent/tweet?url={{ urlencode(route('read_post', $post->slug)) }}&text={{ urlencode($post->title) }}"
                        target="_blank" class="btn-twitter">
                        <i class="ti-twitter-alt"></i>
                    </a>
                    <a href="https://www.pinterest.com/pin/create/button?url={{ urlencode(route('read_post', $post->slug)) }}&description={{ urlencode($post->title) }}"
                        target="_blank" class="btn-pinterest">
                        <i class="ti-pinterest"></i>
                    </a>
                    <a href="mailto:?subject={{ urlencode('Schau dir das an: ' . $post->title) }}&body={{ urlencode('Schau dir diesen Post an: ' . route('read_post', $post->slug)) }}"
                        target="_blank" class="btn-email">
                        <i class="ti-email"></i>
                    </a>
                </div>
                <!-- SHARE BUTTONS -->
                <div class="col-lg-12">
                    <div class="content">
                        <p>
                            {!! $post->content !!}
                        </p>
                    </div>
                </div>
            </article>
            <div class="prev-next-posts mt-3 mb-3">
                <div class="row justify-content-between p-4">
                    <div class="col-md-6 mb-2">
                        @if ($prevPost)
                            <div>
                                <h6>&laquo; Vorige</h6>
                                <a href="{{ route('read_post', $prevPost->slug) }}">{{ $prevPost->title }}</a>
                            </div>
                        @endif
                    </div>
                    <div class="col-md-6 mb-2 text-md-right">
                        @if ($nextPost)
                            <div>
                                <h6>Nächste &raquo;</h6>
                                <a href="{{ route('read_post', $nextPost->slug) }}">{{ $nextPost->title }}</a>
                            </div>
                        @endif
                    </div>
                </div>
            </div>

            @if ($relatedPosts)
                <section>
                    <h4>Relevante Posts</h4>
                    <hr>
                    @foreach ($relatedPosts as $related)
                        <article class="row mb-5 mt-4">
                            <div class="col-md-4 mb-4 mb-md-0">
                                <div class="post-img-box">
                                    <img src="/images/posts/resized/thumb_{{ $related->featured_image }}"
                                        class="img-fluid rounded-lg" alt="post-thumb">
                                </div>
                            </div>
                            <div class="col-md-8">
                                <h4>
                                    <a class="post-title" href="{{ route('read_post', $related->slug) }}">
                                        {{ $related->title }}
                                    </a>
                                </h4>
                                <ul class="list-inline post-meta mb-2">
                                    <li class="list-inline-item">
                                        <i class="ti-user mr-1"></i><a
                                            href="{{ route('author_posts', $post->author->username) }}">{{ $related->author->name }}</a>
                                    </li>
                                    <li class="list-inline-item">
                                        <i class="ti-calendar mr-1"></i>{{ date_formatter($related->created_at) }}
                                    </li>
                                    <li class="list-inline-item">
                                        Kategorie : <a href="{{ route('category_posts', $related->post_category->slug) }}"
                                            class="ml-1">{{ $related->post_category->name }}</a>
                                    </li>
                                    <li class="list-inline-item"><i class="ti-timer mr-1"></i>
                                        {{ readDuration($post->title, $post->content) }} @choice('min|mins', readDuration($related->title, $related->content))
                                    </li>
                                </ul>
                                {!! Str::ucfirst(words($related->content, 28)) !!}
                                <a href="{{ route('read_post', $related->slug) }}" class="btn btn-outline-primary">Mehr
                                    lesen...</a>
                            </div>
                        </article>
                    @endforeach
                </section>
            @endif

        </div>
        <aside class="col-lg-4">
            <!-- Search -->
            <x-sidebar-search></x-sidebar-search>
            <!-- categories -->
            <x-sidebar-categories></x-sidebar-categories>
            <!-- tags -->
            <x-sidebar-tags></x-sidebar-tags>
            <!-- latest post -->
            <div class="widget">
                <h5 class="widget-title"><span>Letzte Post</span></h5>
                <!-- post-item -->
                @foreach (sidebar_latest_posts(4, $post->id) as $item)
                    <ul class="list-unstyled widget-list">
                        <li class="media widget-post align-items-center">
                            <a href="{{ route('read_post', $item->slug) }}">
                                <img loading="lazy" class="mr-3" alt="post-thumb"
                                    src="/images/posts/resized/thumb_{{ $item->featured_image }}">
                            </a>
                            <div class="media-body">
                                <h6 class="mb-0">
                                    <a href="{{ route('read_post', $item->slug) }}">{{ $item->title }}</a>
                                </h6>
                                <small>{{ date_formatter($item->created_at) }}</small>
                            </div>
                        </li>
                    </ul>
                @endforeach

            </div>
        </aside>
    </div>
@endsection
@push('scripts')
    <script>
        $(document).on('click', '.share-buttons > a', function(e) {
            e.preventDefault();
            window.open($(this).attr('href'), '', 'height=450,width=450,top=' + ($(window).height() / 2 - 275) +
                ', left=' + ($(window).width() / 2 - 225) +
                ', toolbar=0, location=0, menubar=0, directories=0, scrollbars=0');
            return false;
        });
    </script>
@endpush