@extends('website.layouts.master')
{{--@section('title') {{__('website.special_offers')}} @stop--}}
@section('css')
    <link rel="stylesheet" href="{{asset('website/css/subpages.css')}}">
    <link rel="stylesheet" href="{{asset('website/css/style.css')}}">
    <link rel="stylesheet" href="{{asset('website/css/plugins.css')}}">
    <script src="{{asset('js/jquery-3.6.0.min.js')}}"></script>
    <script src="{{asset('website/js/wow.js')}}"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
          integrity="sha512-9usAa10IRO0HhonpyAIVpjrylPvoDwiPUiKdWk5t3PyolY1cOd4DSE0Ga+ri4AuTroPR5aQvXU9xC6qOPnzFeg=="
          crossorigin="anonymous" referrerpolicy="no-referrer" />

@stop
@section('head')

@stop
@section('content')
<style>
    #add_price{

        border-radius: 5px;
    }
</style>
@php
    $auction_translation = $auction->translations->where('language_id',getLocaleId())->first();
    if($auction->category)
    {$category_translation = $auction->category->translations->where('language_id',getLocaleId())->first();}

@endphp
<nav class="breadcrumb-area">
    <div class="container">
        <ol class="breadcrumb-list">
            <li class="breadcrumb-item"><a href="{{ url('/') }}">{{ trans('theme.nav.home') }}</a></li>
            <li class="breadcrumb-item"><a href="{{ route('auction.index') }}">@lang('theme.auctions')</a></li>
            <li class="breadcrumb-item active">{{$auction_translation->title ?? $auction->title}}</li>
        </ol>
    </div>
</nav>

<section class="sub-page product-page">
    <div class="container">
        <div class="card">
            <div class="card-body">
                <div class="product_details_wrapper mb-55">
                    <!--product details start-->
                    <div class="product_details">
                        <div class="row">
                            <div class="col-lg-5 col-md-6">
                                @if($auction->images->count() != null)
                                <div class="product-details-tab">
                                    <div class="clearfix">
                                        @php
                                            $pImg = get_product_img_src($auction, 'large');
                                        @endphp
                                        <a href="{{ $pImg }}" id="{{ $zoomID ?? 'jqzoom' }}" data-rel="gal-1">
                                            <img class="product-img" data-name="product_image" src="{{ $pImg }}" alt="{{ $auction->title }}" title="{{ $auction->title }}" />
                                        </a>
                                    </div>
                                    <ul class="jqzoom-thumbs mt-2" style="display: flex;">
                                        @php
                                            $item_images = $auction->images->count() ? $auction->images : $auction->images;

                                            if (isset($variants)) {
                                                // Remove images of current items from the variants imgs
                                                $other_images = $variants
                                                    ->pluck('images')
                                                    ->flatten(1)
                                                    ->filter(function ($value, $key) use ($auction) {
                                                        return $value->imageable_id != $auction->id;
                                                    });
                                                $item_images = $item_images->concat($other_images);
                                            }
                                        @endphp

                                        @foreach ($item_images as $img)
                                            @continue(!$img->path)

                                            @php
                                                $fImg = get_storage_file_url($img->path, 'full');
                                            @endphp

                                            <li style="margin-left: 5px;margin-right: 5px;">
                                                <a class="d-flex flex-wrap align-items-center {{ $img->path == optional($auction->image)->path ? 'zoomThumbActive' : '' }}" href="javascript:void(0)" data-rel="{gallery:'gal-1', smallimage: '{{ $fImg }}', largeimage: '{{ $fImg }}'}">
                                                    <img src="{{ get_storage_file_url($img->path, 'thumbnail') }}" alt="Thumb" title="{{ $auction->title }}" />
                                                </a>
                                            </li>
                                        @endforeach
                                    </ul> <!-- /.jqzoom-thumbs -->
                                </div>
                                    @else
                                    <div class="product-details-tab">
                                        <div id="img-1" class="zoomWrapper single-zoom">
                                            <a>
                                                <img id="zoom1" src="{{ get_storage_file_url(optional($auction->featureImage)->path, 'full') }}" data-zoom-image="{{ get_storage_file_url(optional($auction->featureImage)->path, 'full') }}" alt="{{$auction_translation->title ?? $auction->title}}">
                                            </a>
                                        </div>
                                    </div>
                                    @endif
                            </div>
                            <div class="col-lg-7 col-md-6">
                                <div class="product_d_right">

                                        <h3><a href="#">{{$auction_translation->title ?? $auction->title}}</a></h3>
                                        <div class="price_box">
                                            @if($auction->bids()->count() > 0 )
                                            @php
                                                $amount_paid = $auction->bids()->max('price');
                                            @endphp
                                            <span>{{__('theme.amount_paid')}}: <span class="current_price">{{get_formated_currency($amount_paid, 2)}}</span></span>
                                            @else
                                            <span>{{__('theme.start_price')}}: <span class="current_price">{{get_formated_currency($auction->start_price, 2)}}</span></span>
                                            @endif

                                        </div>
                                        <div class="product_desc">
                                            <p>{!! Str::limit(($auction_translation->description ?? $auction->description),200) !!}</p>
                                        </div>

                                        <div class="product_variant quantity">
                                            <a href="javascript:void(0);" data-toggle="modal" data-target="{{ Auth::guard('customer')->check() ? '#add_price_auction' : '#loginModal' }}">
                                                <button class="button">{{__('theme.add_price')}}</button>
                                            </a>
                                        </div>
                                        @if($auction->cateory)
                                        <div class="product_meta">
                                            <span>{{__('theme.category')}}: <a href="{{route('category.auctions',$auction->category->slug)}}">{{$category_translation->name ?? $auction->category->name}}</a></span>
                                        </div>
                                        @endif

                                    <div class="priduct_social">
                                        <ul>
                                            <li><a class="facebook" href="https://www.facebook.com/sharer/sharer.php?u={{ urlencode(Request::fullUrl()) }}" target="_blank" data-toggle="tooltip" data-placement="top" title="facebook"><i class="fab fa-facebook-f"></i></a></li>
                                            <li><a class="twitter" href="https://twitter.com/intent/tweet?url={{ urlencode(Request::fullUrl()) }}"  target="_blank" data-toggle="tooltip" data-placement="top" title="twitter"><i class="fab fa-twitter"></i></a></li>
                                            <li><a class="pinterest" href="https://pinterest.com/pin/create/button/?{{ http_build_query(['url' => Request::fullUrl(),'media' => get_storage_file_url($auction, 'medium'),'description' => $auction->title]) }}" target="_blank" data-toggle="tooltip" data-placement="top" title="pinterest"><i class="fab fa-pinterest"></i></a></li>
                                            <li><a class="linkedin" href="http://www.linkedin.com/shareArticle?{{ http_build_query(['url' => Request::fullUrl(), 'title' => $auction->title, 'mini' => true]) }}" target="_blank" data-toggle="tooltip" data-placement="top" title="linkedin"><i class="fab fa-linkedin-in"></i></a></li>
                                        </ul>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                    <!--product details end-->

                    <!--product info start-->
                    <div class="product_d_info">
                        <div class="row">
                            <div class="col-12">
                                <div class="product_d_inner">
                                    <div class="product_info_button">
                                        <ul class="nav" role="tablist">
                                            <li>
                                                <a class="active" data-toggle="tab" href="#info" role="tab" aria-controls="info" aria-selected="false">{{__('theme.description')}}</a>
                                            </li>
                                            <li>
                                                <a data-toggle="tab" href="#details" role="tab" aria-controls="details" aria-selected="false">{{__('theme.auction_details')}}</a>
                                            </li>
                                            <li>
                                                <a data-toggle="tab" href="#time" role="tab" aria-controls="time" aria-selected="false">{{__('theme.remaining_time')}}</a>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="tab-content">
                                        <div class="tab-pane fade show active" id="info" role="tabpanel">
                                            <div class="product_info_content">
                                                <p>{!! $auction_translation->description ?? $auction->description !!}</p>
                                            </div>
                                        </div>
                                        <div class="tab-pane fade" id="details" role="tabpanel">
                                            <div class="product_d_table">
                                                    <table>
                                                        <tbody>
                                                        <tr>
                                                            <td class="first_child">{{__('theme.title')}}</td>
                                                            <td>{{$auction_translation->title ?? $auction->title}}</td>
                                                        </tr>
                                                        <tr>
                                                            <td class="first_child">{{__('theme.store')}}</td>
                                                            <td>{{$auction->shop->name}}</td>
                                                        </tr>
                                                        @if($auction->cateory)
                                                        <tr>
                                                            <td class="first_child">{{__('theme.category')}}</td>
                                                            <td>{{$category_translation->name ?? $auction->category->name}}</td>
                                                        </tr>
                                                        @endif
                                                        <tr>
                                                            <td class="first_child">{{__('theme.quantity')}}</td>
                                                            <td>{{$auction->quantity}}</td>
                                                        </tr>

                                                        <tr>
                                                            <td class="first_child">{{__('theme.start_price')}}</td>
                                                            <td>{{get_formated_currency($auction->start_price, 2)}}</td>
                                                        </tr>

                                                        <tr>
                                                            <td class="first_child">{{__('theme.start_date')}}</td>
                                                            <td>{{$auction->start_date}}</td>
                                                        </tr>

                                                        <tr>
                                                            <td class="first_child">{{__('theme.end_date')}}</td>
                                                            <td>{{$auction->end_date}}</td>
                                                        </tr>
                                                        </tbody>
                                                    </table>
                                            </div>
                                        </div>

                                        <div class="tab-pane fade" id="time" role="tabpanel">
                                            <div class="product_d_table">
                                                @php
                                                    $seconds = strtotime($auction->end_date) - time();
                                                    $days = floor($seconds / 86400);
                                                    $seconds %= 86400;
                                                    $hours = floor($seconds / 3600);
                                                    $seconds %= 3600;
                                                    $minutes = floor($seconds / 60);
                                                    $seconds %= 60;
                                                @endphp
                                                <table>
                                                    <tbody>
                                                    <tr>
                                                        <td class="first_child">{{__('theme.Days')}}</td>
                                                        <td>{{$days}}</td>
                                                    </tr>
                                                    <tr>
                                                        <td class="first_child">{{__('theme.Hours')}}</td>
                                                        <td>{{$hours}}</td>
                                                    </tr>
                                                    <tr>
                                                        <td class="first_child">{{__('theme.Minutes')}}</td>
                                                        <td>{{$minutes}}</td>
                                                    </tr>


                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--product info end-->
                </div>
            </div>
        </div>
    </div>
</section>
@if (Auth::guard('customer')->check())
    @include('website.modals.add_price_auction')
@endif

@stop

@section('script')
    <script src="{{asset('website/js/plugins.js')}}"></script>
    <!-- Main JS -->
    <script src="{{asset('website/js/main.js')}}"></script>
@stop