@extends(config('mio.theme').'.app')

@section('content')
    @php
        $discount = checkDiscount($product);
    @endphp
    <script type="application/ld+json">
{
"@context": "http://schema.org/",
  "@type": "Product",
  "name": "{{@$product->name}}",
  "gtin8": "{{@$product->ean}}",
  "sku": "{{@$product->stock_code}}",
  "image": "{{miomage(@$product,'product')}}",
  "description": "{{$product->meta_description}}",
"brand": {
  "@type": "Thing",
  "name": "{{isset($product->brands->brand_name) ? $product->brands->brand_name : ''}}"
  },
"aggregateRating": {
  "@type": "AggregateRating",
  "ratingValue": "{{$product->rate_avg > 0 ? $product->rate_avg : 5}}",
  "reviewCount": "{{count($product->reviews) > 0 ? $product->reviews : 1}}"
 },
       "offers": {
         "@type": "Offer",
         "priceCurrency": "TRY",
         "availability": @if($product->stock > 0)"InStock"@else"OutOfStock"@endif,
         @if($discount)
            "price": "{{pricemio($product,true,false)['discountedPrice']}}"
         @else
            "price": "{{pricemio($product,false,false)['price']}}"
             @endif
        }
@if(count($product->reviews) > 0)
            @foreach($product->reviews as $prw)
                ,
    "review": {
      "@type": "Review",
      "author": "{{$prw->user->name}}",
  "datePublished": "{{$prw->created_at}}",
  "description": "{{$prw->content}}",
  "name": "Yorum!",
 "reviewRating": {
  "@type": "Rating",
  "bestRating": "5",
  "ratingValue": "{{$prw->stars}}",
  "worstRating": "1"
  }
 }
 @endforeach
        @else
            ,
"review": {
"@type": "Review",
"author": "{{getenv('APP_NAME')}}",
  "datePublished": "{{$product->created_at}}",
  "description": "{{getenv('APP_NAME')}}",
  "name": "Yorum!",
 "reviewRating": {
  "@type": "Rating",
  "bestRating": "5",
  "ratingValue": "5",
  "worstRating": "1"
  }
 }
        @endif

        }


    </script>
    <script>
        gtag('event', 'view_item', {
            "items": [
                {
                    "id": "{{$product->id}}",
                    "name": "{{@$product->name}}",
                    @if(isset($product->brands->brand_name))
                    "brand": "{{$product->brands->brand_name}}",
                    @endif
                            @if($discount)
                    "price": '{{pricemio($product,$discount,false)['discountedPrice']}}'
                    @else
                    "price": '{{pricemio($product,false,false)['price']}}'
                    @endif
                }
            ]
        });
    </script>
    <script>
        fbq('track', 'ViewContent', {
            @if($discount)
            value: '{{pricemio($product,$discount,false)['discountedPrice']}}',
            @else
            value: '{{pricemio($product,false,false)['price']}}',
            @endif
            currency: 'TRY'
        });
    </script>
    <style>
        .pswp img {
            position: absolute;
            left: 0;
            right: 0;
            margin: auto !important;
        }
    </style>
    <div class="page-content">
        <div class="holder breadcrumbs-wrap mt-0">
            <div class="container">
                <ol class="breadcrumbs" itemscope="" itemtype="http://schema.org/BreadcrumbList">
                    <li class="breadcrumb-item" itemprop="itemListElement" itemscope=""
                        itemtype="http://schema.org/ListItem">
                        <a href="/">{{__('general.home')}}</a>

                    </li>

                    @if($product->categories && count($product->categories) > 0)
                        @foreach($product->categories as $pc)
                            <li class="breadcrumb-item" itemprop="itemListElement" itemscope=""
                                itemtype="http://schema.org/ListItem">
                                <a href="{{mioUri($pc,'category')}}" itemprop="item"><span
                                            itemprop="name">{{$pc->name}}</span></a>

                            </li>
                        @endforeach
                    @endif
                    <li class="breadcrumb-item active" aria-current="page">{{$product->name}}</li>
                </ol>
            </div>
        </div>
        <div class="holder">
            <div class="container js-prd-gallery" id="prdGallery">
                <div class="row prd-block prd-block-under prd-block--prv-bottom">
                    <div class="col">
                        <div class="js-prd-d-holder">
                            <div class="prd-block_title-wrap">
                                <div class="prd-block_reviews" data-toggle="tooltip" data-placement="top"
                                     title="{{__('general.write-review')}}">
                                    @for($i = 0;$i<round($product->rate_avg);$i++)
                                        <i class="icon-star-fill fill"></i>
                                    @endfor
                                    @for($i;$i<5;$i++)
                                        <i class="icon-star"></i>
                                    @endfor
                                    <span class="reviews-link"><a href="#"
                                                                  class="js-reviews-link"> ({{count($product->reviews)}} {{__('general.reviews')}})</a></span>
                                </div>
                                <h1 class="prd-block_title">{{$product->name}}</h1>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-auto prd-block-prevnext-wrap">
                        <div class="prd-block-prevnext">
                            @if(!empty($product->images))
                                @foreach($product->images as $image)
                                    <a href="#"><span class="prd-img"><img class="lazyload fade-up"
                                                                           src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
                                                                           data-src="{{miomage($product,'product')}}"
                                                                           alt=""><i class="icon-arrow-left"></i></span></a>
                                @endforeach
                            @endif
                        </div>
                    </div>
                </div>
                <div class="row prd-block prd-block--prv-bottom">
                    <div class="col-md-8 col-lg-8 col-xl-8 aside--sticky js-sticky-collision">
                        <div class="aside-content">
                            <div class="mb-2 js-prd-m-holder"></div>
                            <div class="prd-block_main-image">
                                <div class="prd-block_main-image-holder" id="prdMainImage" style="width: 50%">
                                    <div class="product-main-carousel js-product-main-carousel"
                                         data-zoom-position="inner">
                                        @if(!empty($product->images))
                                            @foreach($product->images as $image)
                                                <div data-value="{{$product->id.$image->id}}"><span class="prd-img"><img
                                                                src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
                                                                data-src="{{miomage($image->image_dest_b)}}"
                                                                class="lazyload fade-up elzoom"
                                                                alt="{{$product->name.'-'.$image->id}}"
                                                                data-zoom-image="{{miomage($image->image_dest_b)}}"/></span>
                                                </div>
                                            @endforeach
                                        @endif
                                    </div>
                                    @if(checkDiscount($product))
                                        <div
                                                class="prd-block_label-sale-squared justify-content-center align-items-center">
                                            <span>%{{checkDiscount($product)}} {{__('general.discount')}}</span></div>
                                    @endif
                                </div>
                            </div>
                            <div class="product-previews-wrapper">
                                <div class="product-previews-carousel js-product-previews-carousel">
                                    @if(!empty($product->images))
                                        @foreach($product->images as $image)
                                            <a href="#" data-value="{{$product->id.$image->id}}"><span
                                                        class="prd-img"><img
                                                            src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
                                                            data-src="{{miomage($image->image_dest_b)}}"
                                                            class="lazyload fade-up"
                                                            alt="{{$product->name.'-'.$image->id}}"/></span></a>
                                        @endforeach
                                    @endif
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-10 col-lg-10 col-xl-10 mt-1 mt-md-0">
                        <div class="prd-block_info prd-block_info--style1"
                             data-prd-handle="/products/copy-of-suede-leather-mini-skirt">

                            <div class="prd-block_info-box prd-block_info_item">
                                <div class="two-column">
                                    <p>{{__('general.status')}}:
                                        <span class="prd-{{$product->stock > 0 ? 'in' : 'out'}}-stock"
                                              data-stock-status="">{{$product->stock > 0 ? __('general.in-stock') : __('general.out-stock')}}</span>
                                    </p>

                                    <p>{{__('general.stock_code')}}: <span data-sku="">{{$product->stock_code}}</span>
                                    </p>
                                    <p>{{__('general.brand')}}: <span><a
                                                    href="{{mioUri($product->brands,'brand')}}">{{@$product->brands->brand_name}}</a></span>
                                    </p>
                                    <p>{{__('general.product_page.ean')}}: <span>{{$product->ean}}</span></p>
                                </div>
                            </div>
                            <div class="order-0 order-md-100">
                                <form id="product_options">
                                    <div class="prd-block_actions prd-block_actions--wishlist">
                                        <div class="btn-wrap">
                                            <div class="btn-group">
                                                <button type="button" class="btn btn--add-to-cart js-trigger-addtocart js-prd-addtocart"
                                                        {{$product->stock <= 0 ? 'disabled' : ''}} data-product='{"name": "{{$product->name}}", "path":"{{miomage($product,'product')}}", "url":"{{mioUri($product,'product')}}", "aspect_ratio":0}'
                                                        onclick="addCart('{{$product->id}}',$('.qty-input').val(),$('#product_options').serialize());">
                                                    {{$product->status == 'active' ? __('general.add-to-cart') : __('general.passive-product-button')}}</button>
                                                @if(config('mio.whatsapp_phone'))
                                                    <a target="_blank" href="https://api.whatsapp.com/send?phone={{config('mio.whatsapp_phone')}}&text=Merhaba, {{$product->name}} isimli ürünü sipariş etmek istiyorum." type="button" class="btn color-green" style="padding-top: 20px"><i class="icon-whatsapp"></i> Whatsapp İle Sipariş</a>
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                            <div class="prd-block_description prd-block_info_item ">
                                <div
                                        class="prd-grid prd-carousel js-prd-carousel slick-arrows-aside-simple slick-arrows-mobile-lg data-to-show-5 data-to-show-md-4 data-to-show-sm-4 data-to-show-xs-3"
                                >
                                    @if(!empty($related))
                                        @foreach($related as $mr)
                                            @php
                                                $checkDiscount = checkDiscount($mr);
                                            @endphp
                                            <div class="prd prd--style2 prd-labels--max prd-labels-shadow ">
                                                <div class="prd-inside">
                                                    <div class="prd-img-area">
                                                        <a href="{{mioUri($mr,'product')}}" class="prd-img image-hover-scale image-container" style="padding-bottom: 128.48%">
                                                            <img src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" data-src="{{miomage($mr,'product')}}" alt="{{$mr->name}}" class="js-prd-img lazyload fade-up">
                                                            <div class="foxic-loader"></div>
                                                            <div class="prd-big-squared-labels">
                                                                @if(config('mio.new_label'))
                                                                    <div class="label-new"><span>Yeni</span></div>
                                                                @endif
                                                                @if($checkDiscount)
                                                                    <div class="label-sale"><span>{{$checkDiscount}}% </span>
                                                                        <!-- <div class="countdown-circle">
                                                                             <div class="countdown js-countdown" data-countdown="2021/07/01"></div>
                                                                         </div>-->
                                                                    </div>
                                                                @endif
                                                            </div>
                                                        </a>
                                                        <div class="prd-circle-labels">
                                                            <a href="#" class="circle-label-compare circle-label-wishlist--add js-add-wishlist mt-0" data-id="{{$mr->id}}" title="{{__('general.add-wishlist')}}"><i class="icon-heart-stroke"></i></a><a data-id="{{$mr->id}}" href="#" class="circle-label-compare circle-label-wishlist--off js-remove-wishlist mt-0" title="{{__('general.remove-wishlist')}}"><i class="icon-heart-hover"></i></a>
                                                            <a href="#" class="circle-label-qview js-prd-quickview prd-hide-mobile" data-src="{{route('product-quickview',[mioUri($mr,'product',false)])}}"><i class="icon-eye"></i><span>{{__('general.quickview')}}</span></a>
                                                        </div>
                                                    </div>
                                                    <div class="prd-info">
                                                        <div class="prd-info-wrap">
                                                            <div class="prd-info-top">
                                                                @for($i = 0;$i<round($mr->rate_avg);$i++)
                                                                    <i class="icon-star-fill fill"></i>
                                                                @endfor
                                                                @for($i;$i<5;$i++)
                                                                    <i class="icon-star"></i>
                                                                @endfor
                                                            </div>
                                                            <div class="prd-rating justify-content-center">     @for($i = 0;$i<round($mr->rate_avg);$i++)
                                                                    <i class="icon-star-fill fill"></i>
                                                                @endfor
                                                                @for($i;$i<5;$i++)
                                                                    <i class="icon-star"></i>
                                                                @endfor</div> <div class="prd-tag"><a href="#">{{@$mr->brand->name}}</a></div>
                                                            <p class="prd-title"><a href="{{mioUri($mr,'product')}}">{{$mr->name}}</a></p>
                                                            <!--
                                                            <div class="prd-description">
                                                            </div>-->

                                                        </div>
                                                        <div class="prd-hovers">
                                                            <div class="prd-circle-labels">
                                                                <div><a href="#" class="circle-label-compare circle-label-wishlist--add js-add-wishlist mt-0" title="{{__('general.add-wishlist')}}"><i class="icon-heart-stroke"></i></a><a href="#" class="circle-label-compare circle-label-wishlist--off js-remove-wishlist mt-0" title="{{__('general.remove-wishlist')}}"><i class="icon-heart-hover"></i></a></div>
                                                                <div class="prd-hide-mobile"><a href="#" class="circle-label-qview js-prd-quickview" data-src="{{route('product-quickview',[mioUri($mr,'product',false)])}}"><i class="icon-eye"></i><span>{{__('general.quickview')}}</span></a></div>
                                                            </div>
                                                            <div class="prd-price">
                                                                @if($checkDiscount)
                                                                    <div class="price-old">{{pricemio($mr,$checkDiscount)['discountedPrice']}}</div>
                                                                    <div class="price-new">{{pricemio($mr)['price']}}</div>
                                                                @else
                                                                    <div class="price-new">{{pricemio($mr)['price']}}</div>
                                                                @endif
                                                            </div>
                                                            <div class="prd-action">
                                                                <div class="prd-action-left" >
                                                                    <button id="product_{{$mr->id}}" onclick="addCart('{{$mr->id}}',1)" {{$mr->stock <= 0 ? 'disabled' : ''}} class="btn js-prd-addtocart" data-product='{"name": "{{$mr->name}}", "path":"{{miomage($mr,'product')}}", "url":"{{mioUri($mr,'product',false)}}", "aspect_ratio":0}'>
                                                                        {{$mr->stock > 0 ? __('general.add-to-cart') : __('general.out-stock')}}</button>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        @endforeach
                                    @endif
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="holder mt-3 mt-md-5">
            <div class="container">
                <!-- Nav tabs -->
                <ul class="nav nav-tabs product-tab">
                    <li class="nav-item"><a href="#Tab1" class="nav-link"
                                            data-toggle="tab">{{__('general.product-description')}}
                            <span class="toggle-arrow"><span></span><span></span></span>
                        </a></li>
                    <li class="nav-item"><a href="#Tab2" class="nav-link"
                                            data-toggle="tab">{{__('general.product-filters')}}
                            <span class="toggle-arrow"><span></span><span></span></span>
                        </a></li>
                    <li class="nav-item"><a href="#Tab4" class="nav-link"
                                            data-toggle="tab">{{__('general.installments')}}
                            <span class="toggle-arrow"><span></span><span></span></span>
                        </a></li>
                    <li class="nav-item"><a href="#Tab5" class="nav-link"
                                            data-toggle="tab">{{__('general.product-reviews')}}
                            <span class="toggle-arrow"><span></span><span></span></span>
                        </a></li>
                </ul>
                <!-- Tab panes -->
                <div class="tab-content">
                    <div role="tabpanel" class="tab-pane fade" id="Tab1">
                        {!! $product->description !!}
                    </div>
                    <div role="tabpanel" class="tab-pane fade" id="Tab2">
                        <table class="table table-striped">
                            @if($product->filters && count($product->filters))
                                @foreach($product->filters as $f)
                                    <tr>
                                        <th scope="row">{{$f->filter_name}}</th>
                                        <td>{{$f->value_name}}</td>
                                    </tr>
                                @endforeach
                            @endif

                        </table>
                    </div>
                    <div role="tabpanel" class="tab-pane fade" id="Tab4">
                        @if(checkDiscount($product))