@extends('mobile.master')

@section('content')

    @include('google/product-snipped')

    <div class="product-detail-page mobile-page">

        <div class="return-button">

            @if(isset($brand))
                <a href="/{{$brand->route}}">
                    {{$brand->name}}
                </a>
            @else
                <a href="/{{$shop->getPageService()->page('brands')->route}}">
                    @lang('mobile.back_to_brands_overview')
                </a>
            @endif

        </div>

        <article class="product-detail product-block" ng-controller="productOverviewItemController">

            <figure class="komma-image-changer image-holder product-detail-image column fluid-50">
                @if( $product->images && is_file($_SERVER['DOCUMENT_ROOT'] . $product->images[0]->medium_image_url ))
                    <img src="{{ $product->images[0]->medium_image_url }}"
                         alt="{{ $product->brand_name }} {{ $product->name }}" class="main-image"/>
                @else
                    <img src="/images/structure/noImageLarge.jpg" alt="No image found" class="main-image"/>
                @endif
                @if( count($product->images) > 1 )
                    <div class="clear"></div>
                    <ul class="thumbs">
                        @foreach($product->images as $image)
                            <li>
                                <a href="{{ $image->medium_image_url }}">
                                    <img src="{{ $image->thumb_image_url }}"
                                         alt="{{ $product->brand_name }} {{ $product->name }}"/>
                                </a>
                            </li>
                        @endforeach
                    </ul>
                @endif
            </figure>

            <div class="product-info">

                {{--The Json of the product Discounts--}}
                <script type="application/json" json-data ng-model="discountData">
                    {{ $product->discounts }}
                </script>

                {{--Product Title--}}
                <h2 class="product-title">
                    @include('mobile.partials.products.title')
                </h2>

                {{--Article number--}}
                <p class="article-number">
                    <strong>{{ Lang::get('pages/products.article_number') }}</strong>

                    @if($product->article_number and $product->article_number != '-')
                        <span>{{ $product->supplier_name }}
                            :</span> {{ str_replace('+', '+<wbr>', $product->article_number) }}<br/>
                    @endif

                    <span>TOPS:</span> {{ $product->internal_article_number }}
                </p>

                {{--Pricing Detail page--}}
                @include('partials.products.pricesBlock')

                {{--In Stock--}}
                <div class="stock">
                    <span></span> {{ Lang::get('pages/products.shippable_from_stock')}}
                </div>
            </div>


            {{-- Specifications holder --}}
            @if(is_array($product->composition) && count($product->composition) || $product->special_2)
                <div class="specs-holder">
                    @if(is_array($product->composition) && count($product->composition))
                        <h3>{{ Lang::get('pages/products.you_will_receive') }}</h3>
                        @include('mobile.partials.composition',['composition' => $product->composition])
                    @endif
                    @if($product->special_2)
                        @include('partials.products.warning')
                    @endif
                </div>
            @endif


            {{-- Order bar --}}
            <div class="mobile-order">
                <form action="/{{ $shop->getPageService()->page('cart')->route }}/addProductById/{{ $product->id }}"
                      method="get">
                    <div class="quantity-holder">
                        <input type="number" name="quantity" ng-value="1" ng-model="quantity"/>

                        {{--<div class="quantity-btns">--}}
                        {{--<div class="quantity-btn add" ng-click="addToQuantity(1)"></div>--}}
                        {{--<div class="quantity-btn remove" ng-click="addToQuantity(-1)"></div>--}}
                        {{--</div>--}}
                    </div>
                    <div class="btn-holder">
                        @include('partials.buttons.input',[
                                    'input' => Form::submit(''),
                                    'text' => Lang::get('pages/products.add_to_cart'),
                                    'class' => 'green-btn'
                                ])
                    </div>
                </form>
                @include('partials/products/discountBar')
            </div>

            <div class="selling-points-mobile">
                @include('mobile.partials.benefits')
            </div>


            @if (empty($products))
                <div class="text-block">
                    <h2>@lang('pages/products.description')</h2>
                    <p>
                        {{ $product->description }}
                    </p>
                </div>
            @endif

            <div class="quick-order">

                <h3>@lang('mobile.yesThisProduct')</h3>

                <figure class="komma-image-changer image-holder product-detail-image column fluid-50">
                    @if( $product->images && is_file($_SERVER['DOCUMENT_ROOT'] . $product->images[0]->medium_image_url ))
                        <img src="{{ $product->images[0]->medium_image_url }}"
                             alt="{{ $product->brand_name }} {{ $product->name }}" class="main-image"/>
                    @else
                        <img src="/images/structure/noImageLarge.jpg" alt="No image found" class="main-image"/>
                    @endif
                    @if( count($product->images) > 1 )
                        <div class="clear"></div>
                        <ul class="thumbs">
                            @foreach($product->images as $image)
                                <li>
                                    <a href="{{ $image->medium_image_url }}">
                                        <img src="{{ $image->thumb_image_url }}"
                                             alt="{{ $product->brand_name }} {{ $product->name }}"/>
                                    </a>
                                </li>
                            @endforeach
                        </ul>
                    @endif
                </figure>

                <div class="product-info">

                    {{--The Json of the product Discounts--}}
                    <script type="application/json" json-data ng-model="discountData">
                        {{ $product->discounts }}
                    </script>

                    {{--Product Title--}}
                    <h2 class="product-title">
                        @include('mobile.partials.products.title')
                    </h2>

                    {{--Pricing Detail page--}}
                    @include('partials.products.pricesBlock')

                    {{--In Stock--}}
                    <div class="stock">
                        <span></span> {{ Lang::get('pages/products.shippable_from_stock')}}
                    </div>
                </div>

                {{-- Order bar --}}
                <div class="mobile-order">
                    <form action="/{{ $shop->getPageService()->page('cart')->route }}/addProductById/{{ $product->id }}"
                          method="get">
                        <div class="quantity-holder">
                            <input type="number" name="quantity" ng-value="1" ng-model="quantity"/>
                        </div>
                        <div class="btn-holder">
                            @include('partials.buttons.input',[
                                        'input' => Form::submit(''),
                                        'text' => Lang::get('pages/products.add_to_cart'),
                                        'class' => 'green-btn'
                                    ])
                        </div>
                    </form>
                </div>

            </div>


        </article>


    </div>
@stop