@extends('mobile.master')

@section('content')

    <div class="mobile-page cart-page">

        <!-- messages -->
        @include('partials.messages')

        <div class="return-button">
            <a href="/{{ $shop->getPageService()->page('brands')->route }}" class="back-btn">
                {{ Lang::get('checkout/cart.continue_shopping') }}
            </a>
        </div>


        <article class="cart-block">

            {{ Form::open([
                'url' => '/' . $shop->getPageService()->page('checkoutLogin')->route,
                'method' => 'get'
            ]); }}

            <header>
                <div class="header-placeholder">
                    <h1 data-ng-click="cart.modify()">{{ Lang::get('checkout/cart.title') }}</h1>
                    <div>
                        <img src="/images/static/paymentMethods/payment_methods_bar_{{ $shop->getShop()->slug }}.png"
                             alt="Betaalmethoden" class="valign-child"/>
                    </div>
                </div>


                <div class="checkout-button" data-ng-hide="cart.getProducts().length == 0">
                    @include('partials.buttons.input_lock',[
                        'text' => Lang::get('checkout/cart.button_order_safely'),
                        'input' => Form::submit('')
                    ])
                </div>
            </header>

            <div class="cart-rows" data-base-url="/{{ $shop->getPageService()->page('cart')->route }}">

                <!-- Show Angular loader -->

                <div class="cart-row cart-loader" data-ng-hide="true">
                    <p>
                        <img src="/images/structure/loader.gif" alt="loading"/>
                        {{ Lang::get('checkout/cart.loading') }} &hellip;
                    </p>
                </div>

                {{--Start of cart row--}}
                @if(Session::has('checkout.products') && count(Session::get('checkout.products')) !=0 )
                    <div class="cart-row" data-ng-cloak data-ng-repeat="product in cart.getProducts()">

                        <!-- Image -->

                        <figure class="product-image">
                            <a href="/@{{ product.getData().route }}"><img ng-src="@{{product.getImage()}}"
                                                                           alt="cart temp"/></a>
                        </figure>

                        <div class="product-details">
                            <!-- Info -->

                            <div class="product-title">

                                <!-- Title -->

                                <a class="product-link" href="/@{{ product.getData().route }}">
                                    <span class="rule-1">@{{ (product.getData().brand_name.toLowerCase() != 'toebehoren'?product.getData().brand_name:'') }} @{{ product.getData().name }}</span>
                                    <span class="rule-2">@{{ product.getData().special_1 }}</span>
                                    <span class="rule-3">@{{ product.getData().product_group }} @{{ product.getData().filter_class }}</span>
                                </a>

                                {{--This is a fix for a weird link problem--}}
                                <div class="between"></div>
                                <!-- Delete -->

                                <a data-ng-click="cart.cartModel.removeByIdWithEvent(product._id, $event)"
                                   href="/{{ $shop->getPageService()->page('cart')->route }}/removeProductById/@{{ product.getId() }}"
                                   class="delete">&nbsp;</a>

                            </div>

                            <!-- Product order details -->

                            <div class="product-order-details">

                                <div class="quantity-holder" ng-class="product.shortGlow">
                                    <input data-ng-model="product._quantity"
                                           ng-change="product.setQuantityOnChange(product._quantity,false)" type="tel"
                                           name="quantity" value=""
                                           autocomplete="off"/>
                                </div>

                                <div class="price-holder">
                                <span class="price"
                                      ng-bind-html="(product.getTotal()/100) | currency:'&euro;' | smallAfterCommaFilter"></span>

                                    <div class="discount" ng-show="product.getDiscount()">
                                        <span class="percentage">-@{{ product.getPercentageDiscountsOnly() }}</span>
                                        <span class="original-price">@{{ (product.getTotalWithoutDiscount() / 100) | currency:'&euro;' }}</span>
                                    </div>
                                    <div class="discount extra"
                                         ng-show="product.getFractionDiscountsOnly()">@{{ product.getFractionDiscountsOnly() }}</div>
                                </div>
                            </div>
                        </div>
                    </div>

                    {{--End of cart row--}}
                @endif

                @if($cart->containsBrand('Brink WTW'))
                    <div class="row">
                        {{ Lang::get('shop.need_brink_air') }}
                    </div>
                @endif

            </div>

            <!-- No products in cart -->

            <div class="cart-row empty-cart" data-ng-cloak data-ng-show="cart.getProducts().length == 0">
                <p>{{ Lang::get('checkout/cart.no_products') }}</p>
                <a class="btn" href="/{{ $shop->getPageService()->page('brands')->route }}">
                    {{ Lang::get('checkout/cart.button_find_product') }}
                </a>
            </div>

            <div class="summary" data-ng-cloak data-ng-hide="cart.getProducts().length == 0">

                <div class="summary-row subtotal-price">
                    <span class="title">{{ Lang::get('partials/pricingOverview.subtotal') }}</span>
                    <span class="price summing-price"
                          ng-bind-html="(cart.cartModel.getSubTotal() / 100) | currency:'&euro;' | smallAfterCommaFilter"></span>
                </div>

                <div class="summary-row shipping-price" ng-show="cart.cartModel.getOrderDiscountPercentage() > 0">
                    <span class="title">{{ Lang::get('partials/pricingOverview.order_discount') }} </span>
                    <span class="price summing-price"
                          ng-bind-html="'<span class=\'check\'></span>'+cart.cartModel.getOrderDiscountPercentage()+'%'"></span>
                </div>

                <div class="summary-row shipping-price">
                    <span class="title">{{ Lang::get('partials/pricingOverview.shipping') }}  {{strtoupper(\Shop::getDomainCountry() )}}</span>
                    <span class="description highlight"
                          ng-show="cart.cartModel.getFreeShipping({{\Shop::getDomainCountry()}})">
                        {{ Lang::get('partials/pricingOverview.free_shipping', ['country'=> Lang::get('countries.'.\Shop::getDomainCountry()) ,'price' => '<span ng-bind-html="(cart.cartModel.getFreeShipping(\''.\Shop::getDomainCountry().'\') / 100) | currency:\'&euro; \' | smallAfterCommaFilter"></span>']) }}
                        *
                        <br/>
                    </span>
                    <span class="price summing-price"
                          ng-bind-html="(cart.cartModel.getShipping('{{\Shop::getDomainCountry()}}') / 100) | currency:'&euro;' | smallAfterCommaFilter"></span>
                </div>

                <div class="summary-row total-price">
                    <span class="title">{{ Lang::get('partials/pricingOverview.total') }}</span>
                    <span class="description">
                        {{ Lang::get('partials/pricingOverview.price_with_vat_message') }}
                    </span>
                    <span class="price summing-price"
                          ng-bind-html="(cart.cartModel.totalCost() / 100) | currency:'&euro;' | smallAfterCommaFilter"></span>
                </div>

                <div class="checkout-button">
                    @include('partials.buttons.input_lock',[
                        'text' => Lang::get('checkout/cart.button_order_safely'),
                        'input' => Form::submit('')
                    ])
                </div>

            </div>

            <div data-ng-hide="cart.getProducts().length == 0">
                @include('partials.coupon')

                @include('mobile.partials.checkout.cart-categories')
            </div>


            {{ Form::close() }}

        </article>
    </div>
@stop