@extends('frontend.layouts.app')
<style>
    .category-description > p{
        margin: 5px 0px !important;
    }
</style>
@php
    $show_prices = false;
    $banner = null;
    $video_tag = '';
    if(isset($data['category']))
    {
        if(isset($data['category']->meta_title))
            $title = $data['category']->meta_title;
        else
            $title = $data['category']->name . ' - ' . app_name();

        if($data['category']->do_index == 'N' || $data['category']->status == 'N')
            $no_index = 'NOINDEX';

        if($data['category']->show_prices == 'Y')
            $show_prices = true;

        if($show_prices && $data['category']->banner_id > 0)
        {
            $banner = \App\Models\Banner::getBanner($data['category']->banner_id);
        }

        if(trim($data['category']->video_link) != null)
        {
            if($data['category']->video_site == 'YouTube')
            {
                $video_tag = '<div class="video-section"><iframe loading="lazy" style="width: -webkit-fill-available; height: -webkit-fill-available; position: relative;" src="https://www.youtube.com/embed/'. $data['category']->video_link .'" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>';
            }
            else
            {
                $video_tag = '<div class="video-section"><iframe loading="lazy" class="mb-5" style="width: -webkit-fill-available; height: -webkit-fill-available; position: relative;" src="https://player.vimeo.com/video/'. $data['category']->video_link .'" frameborder="0"  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>';
            }
        }
    }
    else
    {
        $title = '';
    }
@endphp

@if(isset($no_index))
    @push('head-area')
        <META NAME="ROBOTS" CONTENT="{{ $no_index }}">
    @endpush
@endif

@if($data['listing_type'] == 'products_search')
    @section('title', 'Search Results for '.request()->input('s'))
@elseif(isset($data['category']))

    @php
        $title = trim($data['category']->meta_title);
        if($title != null && $title != 'NULL')
            $title = $data['category']->meta_title;
        else
            $title = $data['category']->name . ' - ' . app_name();


        $data['category_products'] = $data['category']->products()->where('status', 'Y')->where('type', '!=', 'child')->take(5)->get();

        foreach($data['category_products'] as $category_products){
            if($category_products->type == 'variation'){
                $range = \App\Models\Product::getVariationDiscoutedPriceRange($category_products->id);
                $category_products->max = $range['max'];
                $category_products->min = $range['min'];
                $category_products->avg = $range['avg'];
            }
        }
    @endphp

    @section('title', $title)

    @if(isset($data['category']->meta_description) && trim($data['category']->meta_description) != null && $data['category']->meta_description != 'NULL')
        @section('meta_description', $data['category']->meta_description)
        @section('meta_keywords', $data['category']->meta_keywords)
    @endif

    @section('meta_url', URL::Current())
    @section('page_title', $title)
    @section('product_description',$data['category']->meta_description)
    @php
        if($data['category']->image != '' || $data['category']->image != null)
            $image = '/up_data/categories/large/'.$data['category']->image;
        else
            $image = 'https://www.germedusa.com/design/assets/images/og_imag_logo.png';
    @endphp
@section('image',$image)
    {{-- @section('image',URL::to('/').'/up_data/categories/large/'.$data['category']->image) --}}
    @section('image:width', "300")
@section('image:height', "200")
@endif
@push('schema')
    @component('frontend.layouts.schema')
        @if($data['listing_type'] == 'products_search')
            {{-- {
                "@context": "https://schema.org",
                "@type": "CollectionPage",
                "name": "{{ $data['category']->name }}",
                "url": "https://www.germedusa.com/{{ $data['category']->slug }}",
                "description": "Description of Main Category",
                "keywords": "{{ $data['category']->meta_keywords }}",
                "mainEntity": {
                    "@type": "BreadcrumbList",
                    "itemListElement": [
                        @foreach ( $data['category_products'] as $key => $data['category_product'])
                        {
                            "@type": "Product",
                            "@id": "https://www.germedusa.com/{{ $data['category_product']->slug }}/#Product",
                            "name": "{{ $data['category_product']->name }}",
                            "url": "https://www.germedusa.com/{{ $data['category_product']->slug }}",
                            "keywords": "{{ $data['category_product']->meta_keywords }}",
                            "image": "https://www.germedusa.com/up_data/products/images/large/{{ $data['category_product']->image }}",
                            "description": "{{ $data['category_product']->short_description }}",
                            "brand": {
                                "@type": "Brand",
                                "name": "GerMedUSA"
                            },
                            "offers": {
                                "@type": "AggregateOffer",
                                "priceCurrency": "USD",
                                @if($data['category_product']->type == 'variation')
                                    "highPrice": "{{ $data['category_product']->max }}",
                                    "lowPrice": "{{ $data['category_product']->min }}",
                                @else
                                    highPrice": "{{ $data['category_product']->price_catalog }}",
                                    "lowPrice": "{{ $data['category_product']->price_discounted }}",
                                @endif
                                "sku": "{{ $data['category_product']->sku }}",
                                "availability": "http://schema.org/InStock",
                                "seller": {
                                    "@type": "Organization",
                                    "name": "Germed USA"
                                }
                            }
                        }
                            @if($key < count($data['category_products'])-1)
                                ,
                            @endif

                        @endforeach
                    ]
                }
            } --}}

            {{-- {
                "@context": "https://schema.org/",
                "@type": "WebSite",
                "name": "GerMedUSA lnc.",
                "url": "https://www.germedusa.com/",
                "potentialAction": {
                  "@type": "SearchAction",
                  "target": "https://www.germedusa.com/search-results?s={{ request()->input('s') }}",
                  "query-input": "required name={{ request()->input('s') }}"
                }
            } --}}
        @else
        {
            "@context": "https://schema.org/", 
            "@type": "BreadcrumbList", 
            "itemListElement": [{
                "@type": "ListItem", 
                "position": 1, 
                "name": "Home",
                "item": "https://www.germedusa.com/"  
            },
            @if(count($data['category']->subcategories) > 0),@endif
            @php    
                $counter = 2;
            @endphp
            @foreach ($data['schema_breadcrumbs'] as $key => $schema_breadcrumbs)
                {
                    "@type": "ListItem", 
                    "position": {{ $counter }}, 
                    "name": "{{ @$schema_breadcrumbs[0]['name'] }}",
                    "item": "{{ @$schema_breadcrumbs[0]['url'] }}"  
                }
                @if($key < count($data['schema_breadcrumbs']) -1)
                    ,
                @endif
                @php    
                    $counter++;
                @endphp
            @endforeach
            ]
        }
          
        @endif
    @endcomponent
@endpush
@if(isset($data['category']) && $data['category']->is_canonical == 'Y')
    @php
        if($data['category']->canonical_url != '')
            $url = $data['category']->canonical_url;
        else
            $url = URL::to( '/' . $data['category']->slug);
    @endphp
    @push('head-area')
        <link rel="canonical" href="{{ $url }}" />
    @endpush
@endif
@push('head-area')
<link rel="preload" href="static/assets/css/bootstrap.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<style>
    .tooltip-inner{
    height: auto;
    line-height: 22px;
    font-size: 11px;
    background-color:#f4f4f4;
    color: #333;
}
</style>
@endpush

@section('content')
<!-- add banner here -->
    <div class="row">
        <div class="col-md-12 mb-2">
            <div id="main-banner-after-header-category"  class="align-items-center d-flex @if(strlen(@$data['category']->name) > 25)banner-category-2 @else banner-category-1 @endif"
                @if(isset($data['category']) && $data['category']->banner_image != '') style="background-image: url('{{ $data['category']->banner_image ? asset('up_data/categories/banner-image/' . $data['category']->banner_image) : asset('design/assets/images/banner/Operating-Room-Surgical-Instruments-19.jpg') }}'); background-repeat: no-repeat; background-position: right; background-size: cover;" @endif>
                <div class="col-6">
                    <h1 class="title category_detail_heading mx-3" style="line-height: 1.2; width: 764px; font-size: 2.2rem;">
                        {{ $data['category']->name ?? ""}}
                    </h1>
                </div>
            </div>
        </div>
    </div>


@include('includes.partials.bread-crumbs')

<div class="container-fluid mb-4">
        <div class="row">
            <div class="col-lg-10">

                <div class="row">
                    <div class="col-md-8">
                        <h2 class="title h5 listing-page-heading">
                            @if($data['listing_type'] == 'products_search')
                                Search Results for "{{ request()->input('s') }}"
                            @elseif(isset($data['category']))
                                {{-- {{ $data['category']->name }} --}}
                            @endif
                        </h2>
                    </div>
                    <div class="col-md-3 pt-2 text-right show_list_of_product">
                        <p>Showing {{ $data['products']->firstItem() }} to {{ $data['products']->lastItem() }}
                            of total {{ $data['products']->total() }} results</p></div>
                    <div class="col-md-1 text-right">
                        {!! Form::open(array('route' => 'frontend.set-listing-limit', 'method' => 'POST', 'class' => 'mb-0')) !!}
                        {!! Form::select('listing_limit',
                                ['15' => '15', '30' => '30', '45' => '45', '60' => '60', '999' => 'All']
                                ,$data['listing_limit']
                                ,['class'=>'listing-limit', 'onchange' => 'this.form.submit();']) !!}
                        {!! Form::close() !!}
                    </div>

                    @if(isset($data['category']))
                        <div class="col-md-12 mb-2">
                            <div class="category-description pt-2 dynamic-data" id="div-category-description">{!! $data['category']->short_description ? $data['category']->short_description : $data['category']->description !!}</div>
                            <div class="text-right d-md-none"><a href="javascript:;" id="show-category-description">Read more ...</a></div>
                        </div>
                    @endif

                    {!! $video_tag !!}

                </div>


                <div class="product-intro row row-sm bg-ivory pt-3">

                    @if($banner)
                        <div class="col-sm-12 d-flex gap-4 left-details mb-4 product-default product-list">
                            {!! $banner !!}
                        </div>
                    @endif
                    @if(isset($data['products']))
                        @foreach($data['products'] as $product)
                            {!! \App\Models\Product::productBlock($product, 'product-list', true, $show_prices) !!}
                        @endforeach
                    @else
                        <p class="p-3">Sorry!, no products found.</p>
                    @endif



                </div>
                <nav class="toolbox toolbox-pagination">
                    <div class="toolbox-item toolbox-show">
                        <p class="pt-2">Showing {{ $data['products']->firstItem() }} to {{ $data['products']->lastItem() }}
                            of total {{ $data['products']->total() }} results</p>
                        </div><!-- End .toolbox-item -->
                    </nav>
                    @if($data['products'])
                    <div class="pagination">
                        <div class="site-pagination">
                            {!! $data['products']->appends( request()->except('page') )->links() !!}
                        </div>
                    </div>
                    @endif
                    @if(isset($data['category']) && $data['category']->short_description !== null)
                        @if (strlen($data['category']->description) > 1200)
                            <div class="category-description pt-2 dynamic-data" id="div-category-full-description" style="position: relative;
                            left: -15px !important;">
                                {!! implode(' ', array_slice(explode(' ', $data['category']->description), 0, 170)) !!}
                                <button type="button" id="load_more_description"
                                class="mt-4 quicky-btn-2 transition-none rounded" onclick="return false;">Show
                                More</button>
                            </div>
                        @else
                            <div class="category-description pt-2 dynamic-data" id="div-category-full-description" style="position: relative;
                            left: -15px !important;">
                                {!! $data['category']->description !!}
                            </div>
                        @endif
    
                    @endif
                </div><!-- End .col-lg-9 -->

            <aside class="sidebar-shop col-lg-1 order-lg-first">
                <div class="sidebar-wrapper">
                    @include('includes.partials.filters')
                    <div class="shop_sidebar_banner" style="visibility: hidden;">
                        {!! \App\Models\Banner::showBanner(5) !!}
                    </div>
                </div><!-- End .sidebar-wrapper -->
            </aside><!-- End .col-lg-3 -->
        </div><!-- End .row -->
    </div><!-- End .container -->

    @push('before-scripts')
        <input type="hidden" value="shop" id="page_id">
    @endpush
    @push('after-scripts')
        <script src="static/assets/js/jquery.min.js"></script>
        <script>
            let more_info = null;
            document.getElementById('load_more_description').addEventListener("click", function() {
                document.getElementById("div-category-full-description").innerHTML = more_info;
                document.getElementById('load_more_description').style.display = 'none';
            });
        </script>
    @endpush

@endsection