@extends('layouts.front')

@section('meta')
<title>{{ $post->title_bn ?? '' }}</title>
<meta property="og:url" content="{{ Request::fullUrl() }}" />
<meta property="og:type" content="website" />
<meta property="og:title" content="{{ $post->title_bn ?? '' }}" />
<meta property="og:image" content="{{ URL::to($post->image ?? '') }}" />
@endsection

@section('content')
@php
    $firstsectionbig = DB::table('posts')->where('first_section_thumbnail', 1)->orderBy('id', 'DESC')->first();
    $firstsectionsmall = DB::table('posts')->where('first_section', 1)->orderBy('id', 'DESC')->limit(5)->get();
    $firstsectionheding = DB::table('posts')->where('headline', 1)->orderBy('id', 'DESC')->limit(5)->get();
    $user = DB::table('users')->first();
    $setting = DB::table('settings')->first();
    $seo = DB::table('seos')->first();

    $headline = DB::table('posts')
        ->join('categories', 'posts.cat_id', 'categories.id')
        ->join('subcategories', 'posts.subcat_id', 'subcategories.id')
        ->select('posts.*', 'categories.category_bn', 'subcategories.subcategory_bn')
        ->where('posts.headline', 1)
        ->orderBy('id', 'DESC')
        ->limit(5)
        ->get();
@endphp

<section class="singlepage-section py-3">
    <div class="container-fluid">
        <div class="row g-4">
            <div class="col-lg-8 col-md-8">
                
                <div class="mb-3">
                    {!! $seo->horizontalbig2 ?? '' !!}
                </div>

                <nav aria-label="breadcrumb" class="single-cat-info mb-3 d-flex align-items-center bg-light p-2 rounded">
                    <div class="single-cat-home me-3">
                        <a href="{{ URL::to('/') }}" class="text-decoration-none text-dark"><i class="fa fa-home"></i> প্রচ্ছদ </a>
                    </div>
                    <div class="single-cat-cate border-start ps-3">
                        <i class="fa fa-bars"></i> 
                        <a href="#" class="text-decoration-none text-danger">{{ $post->category_bn ?? '' }}</a>, 
                        <a href="#" class="text-decoration-none text-muted">অর্থনীতি</a>
                    </div>
                </nav>

                <div class="single-title mb-4">
                    <h1 class="h2 fw-bold">{{ $post->title_bn ?? '' }}</h1>
                </div>

                <div class="view-section mb-4 border-bottom pb-3">
                    <div class="row align-items-center">
                        <div class="col-2 col-md-1">
                            <img src="{{ asset('public/avatar.png') }}" class="img-fluid rounded-circle" alt="Reporter" />
                        </div>
                        <div class="col-10 col-md-11">
                            <div class="reportar-sec">
                                <div class="fw-bold mb-1">রিপোর্টারের নামঃ {{ $post->name ?? '' }}</div>
                                <div class="text-muted small">
                                    <ul class="list-inline mb-0">
                                        <li class="list-inline-item"><i class="fa fa-clock-o"></i> পোষ্ট টাইম : {{ $post->created_at ?? '' }}</li>
                                        <li class="list-inline-item border-start ps-2">আপডেট টাইম : {{ $post->updated_at ?? '' }}</li>
                                        <li class="list-inline-item border-start ps-2 text-danger"><i class="fa fa-eye"></i> {{ $post->views ?? '' }} বার পঠিত</li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="single-media mb-4">
                    @if(!empty($post->videolink))
                        <div class="ratio ratio-16x9">
                            @include('frontend.video', ['post' => $post])
                        </div>
                    @else
                        <img class="lazyload img-fluid rounded w-100" 
                             src="{{ asset($setting->lazybaner ?? '') }}" 
                             data-src="{{ asset($post->image ?? '') }}" 
                             alt="{{ $post->title_bn ?? '' }}" />
                        
                        @if(!empty($post->tags_bn))
                            <div class="caption mt-2 text-muted fst-italic small bg-light p-2 border-start border-4 border-danger">
                                ছবির ক্যাপশন: {!! $post->tags_bn !!}
                            </div>
                        @endif
                    @endif
                </div>

           <div class="single-dtls mb-5 lh-lg fs-5 text-dark" style="text-align: justify;">
    {!! $post->details_bn ?? '' !!}
</div>
                <div class="mb-4">
                    {!! $seo->horizontalbig3 ?? '' !!}
                </div>

                <div class="sgl-page-social-title mb-3">
                    <h4 class="h5 border-bottom pb-2">নিউজটি শেয়ার করুন</h4>
                </div>

                @php
                    $currentUrl = urlencode(url()->current());
                    $title = urlencode($post->title_bn ?? '');
                    $image = urlencode(asset($post->image ?? ''));
                @endphp

                <div class="sgl-page-social mb-5">
                    <div class="d-flex flex-wrap gap-2">
                        <a href="https://www.facebook.com/sharer/sharer.php?u={{ $currentUrl }}" class="btn btn-primary btn-sm" target="_blank"><i class="fa fa-facebook"></i> Facebook</a>
                        <a href="https://x.com/intent/tweet?url={{ $currentUrl }}&text={{ $title }}" class="btn btn-dark btn-sm" target="_blank"><i class="fa fa-twitter"></i> Twitter</a>
                        <a href="https://www.linkedin.com/sharing/share-offsite/?url={{ $currentUrl }}" class="btn btn-info btn-sm text-white" target="_blank"><i class="fa fa-linkedin"></i> Linkedin</a>
                        <a href="https://www.reddit.com/submit?url={{ $currentUrl }}&title={{ $title }}" class="btn btn-warning btn-sm" target="_blank"><i class="fa fa-reddit"></i> Reddit</a>
                        <button onclick="window.print()" class="btn btn-secondary btn-sm"><i class="fa fa-print"></i> প্রিন্ট</button>
                    </div>
                </div>

                <div class="sgl-cat-tittle bg-dark text-white p-2 mb-4">এ জাতীয় আরো খবর..</div>
                
                <div class="row g-3 mb-5">
                    @php
                        $favourite = DB::table('posts')->inRandomOrder()->limit(6)->get();
                    @endphp
                    @foreach($favourite as $row)
                        @php $slug = preg_replace('/\s+/u', '-', trim($row->title_bn ?? '')); @endphp
                        <div class="col-md-4 col-sm-6">
                            <div class="card h-100 shadow-sm border-0">
                                <a href="{{ URL::to('view-post/'.$row->id.'/'.$slug) }}">
                                    <img class="lazyload card-img-top" src="{{ asset($setting->lazybaner ?? '') }}" data-src="{{ asset($row->image ?? '') }}" alt="{{ $row->title_bn ?? '' }}" />
                                </a>
                                <div class="card-body p-2">
                                    <h5 class="h6 card-title fw-bold">
                                        <a href="{{ URL::to('view-post/'.$row->id.'/'.$slug) }}" class="text-dark text-decoration-none">{{ $row->title_bn ?? '' }}</a>
                                    </h5>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>

                <div class="mb-4 text-center">
                    {!! $seo->horizontal5 ?? '' !!}
                </div>
            </div>

            <div class="col-lg-4 col-md-4">
                <div class="tab-header border p-2 mb-4 rounded bg-light shadow-sm">
                    <ul class="nav nav-tabs nav-justified mb-3" id="newsTab" role="tablist">
                        <li class="nav-item" role="presentation">
                            <button class="nav-link bg-success active" id="latest-tab" data-bs-toggle="tab" data-bs-target="#tab21" type="button" role="tab">সর্বশেষ</button>
                        </li>
                        <li class="nav-item" role="presentation">
                            <button class="nav-link bg-warning" id="popular-tab" data-bs-toggle="tab" data-bs-target="#tab22" type="button" role="tab">জনপ্রিয়</button>
                        </li>
                    </ul>

                    <div class="tab-content" id="newsTabContent">
                        <div class="tab-pane fade show active" id="tab21" role="tabpanel">
                            @php $latest_side = DB::table('posts')->orderBy('id', 'DESC')->limit(6)->get(); @endphp
                            @foreach($latest_side as $row)
                                @php $slug = preg_replace('/\s+/u', '-', trim($row->title_bn ?? '')); @endphp
                                <div class="d-flex mb-3 border-bottom pb-2">
                                    <div class="flex-shrink-0">
                                        <img class="lazyload rounded" width="80" src="{{ asset($setting->lazybaner ?? '') }}" data-src="{{ asset($row->image ?? '') }}" />
                                    </div>
                                    <div class="flex-grow-1 ms-2">
                                        <h6 class="mb-0 fw-bold small"><a href="{{ URL::to('view-post/'.$row->id.'/'.$slug) }}" class="text-decoration-none text-dark">{{ $row->title_bn ?? '' }}</a></h6>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                        <div class="tab-pane fade" id="tab22" role="tabpanel">
                            @php $popular_side = DB::table('posts')->inRandomOrder()->limit(6)->get(); @endphp
                            @foreach($popular_side as $row)
                                @php $slug = preg_replace('/\s+/u', '-', trim($row->title_bn ?? '')); @endphp
                                <div class="d-flex mb-3 border-bottom pb-2">
                                    <div class="flex-shrink-0">
                                        <img class="lazyload rounded" width="80" src="{{ asset($setting->lazybaner ?? '') }}" data-src="{{ asset($row->image ?? '') }}" />
                                    </div>
                                    <div class="flex-grow-1 ms-2">
                                        <h6 class="mb-0 fw-bold small"><a href="{{ URL::to('view-post/'.$row->id.'/'.$slug) }}" class="text-decoration-none text-dark">{{ $row->title_bn ?? '' }}</a></h6>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>

                <div class="mb-4 text-center">
                    {!! $seo->vertical ?? '' !!}
                </div>

               
			<div class="facebook_title bg-primary text-white p-2 mb-2"><a href="#" class="text-white text-decoration-none">ফেসবুকে আমরা...</a></div>
			<div id='fb-root'></div>
			<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v12.0"></script>
			<div class="fb-page w-100" data-href="https://www.facebook.com/{{$setting->facebookpage ?? ''}}" data-width="500" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"></div>

                <div class="sgl-cat-tittle bg-danger text-white p-2 mb-3 rounded-top">নামাজের সময়সূচী</div>
                @php $prayer = DB::table('namaz')->first(); @endphp
                <div class="table-responsive bg-light p-2 border rounded mb-4">
                    <table class="table table-sm table-striped mb-0">
                        <tr><td>{{ session()->get('lang') == 'english' ? 'Fajr' : 'ফজর' }}</td><td class="text-end fw-bold">{{ $prayer->fajr ?? '' }} ভোর</td></tr>
                        <tr><td>{{ session()->get('lang') == 'english' ? 'Johr' : 'যোহর' }}</td><td class="text-end fw-bold">{{ $prayer->johr ?? '' }} দুপুর</td></tr>
                        <tr><td>{{ session()->get('lang') == 'english' ? 'Asor' : 'আছর' }}</td><td class="text-end fw-bold">{{ $prayer->asor ?? '' }} বিকাল</td></tr>
                        <tr><td>{{ session()->get('lang') == 'english' ? 'Magrib' : 'মাগরিব' }}</td><td class="text-end fw-bold">{{ $prayer->magrib ?? '' }} সন্ধ্যা</td></tr>
                        <tr><td>{{ session()->get('lang') == 'english' ? 'Esha' : 'এশা' }}</td><td class="text-end fw-bold">{{ $prayer->esha ?? '' }} রাত</td></tr>
                        <tr><td>{{ session()->get('lang') == 'english' ? 'Jummah' : 'Jummah' }}</td><td class="text-end fw-bold">{{ $prayer->jummah ?? '' }} দুপুর</td></tr>
                    </table>
                </div>

                <div class="sgl-cat-tittle bg-success text-white p-2 mb-3 rounded-top">জাতীয় সঙ্গীত</div>
                <div class="p-2 border rounded bg-light">
                    <audio controls class="w-100">
                        <source src="{{ URL::to('/bd_national_anthem.mp3') }}" type="audio/mp3">
                    </audio>
                </div>
            </div>
        </div>
    </div>
</section>
@endsection