@extends('layouts.app')

@section('styles')
    <link rel="stylesheet" href="{{ asset('assets/css/products/venue.css') }}">
@endsection

@section('title', unserialize($product->meta_title)['meta_title_'.app()->getLocale()])
@section('description', unserialize($product->meta_description)['meta_description_'.app()->getLocale()])
@section('keywords', unserialize($product->meta_keyword)['meta_keyword_'.app()->getLocale()])

@section('content')

<section class="works-single" style="background: #242526;">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <h6 class="text-white">SMOOTH INTERFACE INTERACTION</h6>
                <h2 class="text-white mb-4">{{ unserialize($product->title)['title_'.app()->getLocale()] }}</h2>
            </div>

            <div class="col-lg-9 wow fadeIn d-flex align-items-center">
                <h4 class="text-white">{{ unserialize($product->address)['address_'.app()->getLocale()] }}</h4>
            </div>

            <div class="col-lg-3">
                <div class="book-now-top d-flex">
                    <a href="{{ route('products.get.venue.book', $product->slug) }}" class="custom-button mb-4">Book Now</a>
                </div>
            </div>

            {{-- <div class="col-lg-6 wow fadeIn d-flex align-items-center justify-content-end">
                <h5 class="text-white">{{ $product->price }} GEL</h5>
            </div> --}}

            <div class="col-lg-12 mb-4">
                @if(count($product->productImages) > 0)
                    <div id="carousel-indicators-controlls" class="carousel slide" data-bs-ride="carousel">
                        <ol class="carousel-indicators">
                            <li data-bs-target="#carousel-indicators-controlls" data-bs-slide-to="0" class="active"></li>

                            @foreach($product->productImages as $imageKey => $image)
                                <li data-bs-target="#carousel-indicators-controlls" data-bs-slide-to="{{ $imageKey + 1 }}"></li>
                            @endforeach
                        </ol>
                        <div class="carousel-inner">
                            <div class="carousel-item active">
                                <figure>
                                    <a href="{{ asset('assets/images/products/'.$product->image) }}" data-fancybox="gallery">
                                        <img src="{{ asset('assets/images/products/'.$product->image) }}" alt="Image">
                                    </a>
                                </figure>
                            </div>

                            @foreach($product->productImages as $image)
                                <div class="carousel-item">
                                    <figure>
                                        <a href="{{ asset('assets/images/products/multi/'.$product->id.'/'.$image->image) }}" data-fancybox="gallery">
                                            <img src="{{ asset('assets/images/products/multi/'.$product->id.'/'.$image->image) }}" alt="Image">
                                        </a>
                                    </figure>
                                </div>
                            @endforeach
                        </div>

                        <a class="carousel-control-prev" href="#carousel-indicators-controlls" role="button" data-bs-slide="prev">
                            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                            <span class="sr-only">Previous</span>
                        </a>
                        <a class="carousel-control-next" href="#carousel-indicators-controlls" role="button" data-bs-slide="next">
                            <span class="carousel-control-next-icon" aria-hidden="true"></span>
                            <span class="sr-only">Next</span>
                        </a>
                    </div>
                @else
                    <figure>
                        <a href="{{ asset('assets/images/products/default_venue.jpg') }}">
                            <img src="{{ asset('assets/images/products/default_venue.jpg') }}" alt="Image">
                        </a>
                    </figure>
                @endif
            </div>

            <div class="col-lg-6 wow fadeIn" data-wow-delay="0.10s">
                <div class="card productdesc">
                    <div class="card-header p-0">
                        <div class=" tab-menu-heading border-0">
                            <div class="tabs-menu">
                                <!-- Tabs -->
                                <ul class="nav panel-tabs py-3">
                                    <li><a href="#tab5" class="active m-3" data-bs-toggle="tab">Details</a></li>
                                    <li><a href="#tab7" class="m-3" data-bs-toggle="tab">Description</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="panel panel-primary">
                            <div class="tabs-menu-body">
                                <div class="tab-content">
                                    <div class="tab-pane active" id="tab5">
                                        <div class="table-responsive">
                                            <table class="table table-bordered">
                                                @if(count($product->productAttributes) > 0)
                                                    @foreach($product->productAttributes as $productAttribute)
                                                        <tr>
                                                            <td class="fw-bold border-0">{{ unserialize($productAttribute->attribute->title)['title_'.app()->getLocale()] }} :</td>

                                                            <td class="border-0">
                                                                @if($productAttribute->attribute->type == 'custom')
                                                                    {{ $productAttribute->value }}
                                                                @elseif($productAttribute->attribute->type == 'select')
                                                                    @php
                                                                        $valueArray = explode(',', $productAttribute->value);
                                                                    @endphp 

                                                                    @if(app()->getLocale() == 'ge')
                                                                        {{ isset($valueArray[0]) ? $valueArray[0] : '' }}
                                                                    @elseif(app()->getLocale() == 'en')
                                                                        {{ isset($valueArray[1]) ? $valueArray[1] : '' }}
                                                                    @endif
                                                                @elseif($productAttribute->attribute->type == 'checkbox')
                                                                    @if($productAttribute->value == 'on')
                                                                        <i class="fa fa-check" style="color: #55F39E; font-size: 18px;line-height: 18px;"></i>
                                                                    @else
                                                                        <i class="fa fa-close" style="color: #F35555; font-size: 18px;line-height: 18px;"></i>
                                                                    @endif
                                                                @endif
                                                            </td>
                                                        </tr>
                                                    @endforeach
                                                @else   
                                                    <div class="text-center">
                                                        Currently no details
                                                    </div>
                                                @endif
                                            </table>
                                        </div>
                                    </div>

                                    <div class="tab-pane" id="tab7">
                                        <p>{{ unserialize($product->description)['description_'.app()->getLocale()] }}</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-lg-6 google-map-col mt-4 mt-lg-0">
                <div id="google-map" class=""></div>
            </div>
        </div>
    </div>
</section>
@endsection

@section('scripts')
    @include('pages.products.js.venue')
@endsection