@extends('layouts.app')

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


@section('content')

    <!--Breadcrumb-->
    <div class="headerImage">
        <div class="page-heading-back">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="page-heading heading-blue p-tb80">
                            <ul>
                                <li>{!! Html::link('/', 'Home') !!}</li>
                                <li>{!! Html::link('products/'.$product->pCat->title, $product->pCat->title) !!}</li>
                                <li>{!! $product->title !!}</li>
                            </ul>
                            <h2>{!! $product->title !!}</h2>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <!--Content-->
    <div id="page-wrapper">
        <div class="container">
            <div class="row">

                <div class="col-xs-12 col-sm-4">
                    <section id="default">
                        <img class="xzoom"
                             src="{!! URL::to('images/products/'.$proFirstImg->image) !!}"
                             xoriginal="{!! URL::to('images/products/'.$proFirstImg->image) !!} "/>


                        <div class="xzoom-thumbs">
                            @foreach($product->proImg as $proImg)
                                <a href="{!! URL::to('images/products/'.$proImg->image) !!}">
                                    <img class="xzoom-gallery" width="80"
                                         src="{!! URL::to('images/products/'.$proImg->image) !!}"
                                         xpreview="{!! URL::to('images/products/'.$proImg->image) !!}">
                                </a>
                            @endforeach
                        </div>
                    </section>
                </div>


                <div class="col-xs-12 col-sm-8 proDet">
                    <h1>{!! $product->title !!}</h1>
                    {!! $product->details !!}
                    @if($product->price > 0)
                        <div class="pull-left clearfix width-100-per">
                            <h2>Price <span>{!! $product->price !!} L.E</span></h2>
                        </div>
                    @endif
                    <div class="clearfix pull-left margintop-35px">
                        {{--<img src="../images/share.jpg" width="212" height="32" alt=""/>--}}
                    </div>
                </div>
            </div>


            {{--<div class="row margintop-35px">
                <div class="col-xs-12">
                    <h2 class="page-heading">
                        We found other products you might like!
                    </h2>
                    <div class="text-center header-pro-ind proDetItem">
                        <div class="owl-carousel owl-theme">
                            @foreach($product->pCat->id as $pros)
                                <div class="item">
                                    <img src="../images/products/w01Large.jpg" alt=""/>
                                    <h4>Technogas Deep Freezer 4 Drawer 195 Liter ...</h4>
                                    <h5>4500 LE</h5>
                                    <a href="#" class="btn btn-primary">More Details</a>
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>--}}


        </div>
    </div>

@endsection

@section('js')
    <!-- XZOOM JQUERY PLUGIN  -->
    {!! Html::script('siteroot/plugins/zoom/xzoom.min.js') !!}
    {!! Html::script('siteroot/plugins/zoom/setup.js') !!}
@endsection