@extends('layouts.frontend.app')

@section('title')
	{{$product->title}}
@endsection

@section('meta')
   <meta name='subject' content='ecommerce's subject'>
   <meta name='title' content='@if (isset($product->title)) {{$product->title}} @endif || {{ config('app.name') }}'>
    <meta name='description' content='@if (isset($product->meta_description)) {{$product->meta_description}} @endif'>
    <meta name='keywords' content='@if (isset($product->meta_keyword)) {{$product->meta_keyword}} @endif'>

    <meta property="og:image:url" content="{{ Storage::disk('public')->url('product/'.$product->cover_photo) }}">
    <meta property="og:title"  content="@if (isset($product->title)) {{$product->title}} @endif || {{ config('app.name') }}" />

    <meta name='copyright' content='websolutionbd24.com'>
    <meta name='author' content='yousuf1648|websolutionbd24.com'>
@endsection

@push('css')
	<!-- owl.carousel CSS -->
  <link rel="stylesheet" type="text/css" href="{{ asset('css/owl.carousel.css') }}">
  <link rel="stylesheet" type="text/css" href="{{ asset('css/owl.theme.css') }}">

  <!-- flexslider CSS -->
  <link rel="stylesheet" type="text/css" href="{{ asset('css/flexslider.css') }}" >
  <link rel="stylesheet" href="{{ asset('css/review.css') }}">

  <script type='text/javascript' src='https://platform-api.sharethis.com/js/sharethis.js#property=60160fca925b0d0018b91d03&product=sop' async='async'></script>
@endpush

@section('content')

<div class="breadcrumbs">
    <div class="container">
        <div class="row">
            <div class="col-xs-12">
                <ul>
                    <li class="home"><a title="Go to Home Page" href="{{ route('home') }}">Home</a><span>&raquo;</span></li>
                    <li class=""><a href="{{ route('category',$product->Category->slug) }}">{{ $product->Category->name }}</a><span>&raquo;</span></li>
                    <li><strong>{{$product->title}}</strong></li>
                </ul>
            </div>
        </div>
    </div>
</div>

<!-- product_details start -->
@include('layouts.frontend.partial.product_details')

<!-- Related Product Slider -->

<div class="container">
    <div class="row">
        <div class="col-xs-12">
            <div class="related-product-area">
                <div class="page-header">
                    <h2>Related Products</h2>
                </div>
                <div class="related-products-pro">
                    <div class="slider-items-products">
                        <div id="related-product-slider" class="product-flexslider hidden-buttons">
                            <div class="slider-items slider-width-col4 fadeInUp">
                              @foreach ($related_product as $key=>$product)
                                <div class="product-item">
                                    <div class="item-inner fadeInUp">
                                        <div class="product-thumbnail">
                                          @if ($product->availability=="Out of stock")
                                            <div class="stock_out">Stock Out</div>
                                          @else
                                            @if ($product->discount>0)
                                              <div class="discount">{{ number_format($product->discount) }}% off</div>
                                            @endif
                                          @endif

                                          @if ($product->new==1)
                                              <div class="new" @if ($product->discount>0)
                                                style="top: 33px;" 
                                              @endif>New</div>
                                          @endif
                                          
                                          
                                          <div class="pr-img-area"> <a title="Ipsums Dolors Untra" href="{{ route('product_details',$product->slug) }}">
                                            <figure> 
                                              <img class="first-img" src="{{ Storage::disk('public')->url('product/xxsmall-'.$product->cover_photo) }}" alt="">
                                              @php
                                                $post_image = explode("|",$product->others_photo);
                                              @endphp
                                              @if ($post_image[0])
                                                  <img class="hover-img" src="{{ Storage::disk('public')->url('product/xxsmall-'.$post_image[0]) }}" alt="product">
                                              @endif 

                                            </figure>
                                            </a>

                                            @if ($product->availability!="Out of stock")
                                              @if ($product->size_id || $product->colour_id)
                                                  <button type="button" data-tooltip="Add to cart" data-toggle="modal" data-target="#create_{{$key}}_{{$product->id}}" title="Add to Cart" class="add-to-cart-mt"> <i class="fa fa-shopping-cart"></i><span> Add to Cart</span> </button>
                                              @else
                                                  <a data-tooltip="Add to cart" href="{{ route('add_to_cart',$product->id) }}" title="Add to Cart" class="add-to-cart-mt"> <i class="fa fa-shopping-cart"></i><span> Add to Cart</span></a>
                                              @endif
                                            @endif
                                                                                        
                                          </div>
                                          <div class="pr-info-area">
                                            <div class="pr-button">
                                              @auth
                                                  <div class="mt-button add_to_wishlist"> <a href="javascript:void()" onclick="wishlist_form_submit({{$product->id}})"> <i class="fa fa-heart"></i> </a> </div>
                                                  <form id="wishlist_form_{{$product->id}}" action="{{ route('user.wishlist.store') }}" method="POST" >
                                                      @csrf
                                                    <input type="hidden" name="product_id" value="{{$product->id}}">
                                                  </form>  
                                              @endauth 
                                              
                                              <div class="mt-button quick-view"> <a href="{{ route('product_details',$product->slug) }}"> <i class="fa fa-search"></i> </a> </div>
                                            </div>
                                          </div>
                                        </div>
                                        <div class="item-info">
                                          <div class="info-inner">
                                            <div class="item-title"> <a title="{{$product->title}}" href="{{ route('product_details',$product->slug) }}">{{ $product->title }} </a> </div>
                                            <div class="item-content">
                                              <div class="rating">
                                                  @for ($i = 0; $i < $product->star ; $i++)
                                                      <i class="fa fa-star"></i>
                                                  @endfor
                                                  
                                                  @for ($i = 0; $i < 5-$product->star ; $i++)
                                                      <i class="fa fa-star-o"></i>
                                                  @endfor
                                              </div>
                                              <div class="price-box">
                                                <p class="special-price"> <span class="price-label">Special Price</span> <span class="price"> ৳ {{ number_format($product->sell_price) }} </span> </p>
                                                @if ($product->discount>0)
                                                  <p class="old-price"> <span class="price-label">Regular Price:</span> <span class="price"> ৳ {{ number_format($product->regular_price) }} </span> </p>
                                                @endif
                                                
                                              </div>
                                            </div>
                                          </div>
                                        </div>
                                    </div>
                                </div>
                              @endforeach

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Related Product Slider End -->

        
<!--=====  End of Related product slider  ======-->	
@foreach ($related_product as $key=>$product)
    <!-- Create Modal -->
    <div class="modal fade" id="create_{{$key}}_{{$product->id}}" role="dialog" >
      <div class="modal-dialog">
      
        <!--Edit Modal content-->
        <div class="modal-content">
         <form action="{{ route('add_to_cart_with_size_color') }}" method="POST" >
             @csrf

          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4>{{$product->title}}</h4>
          </div>
          <div class="modal-body">
            <input type="hidden" name="product_id" value="{{$product->id}}">
            @if ($product->size_id)
                <div class="form-group row">
                  <label class="col-sm-3">Size <i class="text-danger">*</i></label>
                  <div class="col-xs-9">
                      <div class="form-check">
                                                    @foreach($product_size as $key=>$product_size)
                          @php
                            $size = App\Size::find($product_size);
                          @endphp
                              <label class="radio-inline">
                              <input type="radio" required name="size_id" value="{{$size->id}}" > {{$size->name}}</label>
                          @endforeach
                      </div>
                  </div>
                </div>
            @endif

            @if ($product->colour_id)
                <div class="form-group row">
                  <label class="col-sm-3">Colour <i class="text-danger">*</i></label>
                  <div class="col-xs-9">
                      <div class="form-check">
                                                  @foreach($product_colour as $key=>$product_colour)
                         @php
                            $colour = App\Colour::find($product_colour);
                         @endphp
                             <label class="radio-inline">
                             <input type="radio" required name="colour_id" value="{{$colour->id}}" > {{$colour->name}}</label>
                         @endforeach
                      </div>
                  </div>
                </div>
            @endif
            

          </div>
          <div class="modal-footer">
              <button type="submit" class="btn btn-primary">Add to Cart</button>
                                                                          
          </div>
        </form>
        </div>
        
      </div>
    </div> {{-- model end --}}

@endforeach

@endsection

@push('js')
<!-- flexslider js --> 
<script src="{{ asset('js/jquery.flexslider.js') }}"></script> 
<!--cloud-zoom js --> 
<script src="{{ asset('js/cloud-zoom.js') }}"></script> 
<script src="{{ asset('js/buy-now.js') }}"></script> 
@endpush