@extends('templates.'. $template_name .'.layouts.default')

@section('title', trans('message.shipping'))

@section('content')


<!-- crumb-area-start -->
<div class="crumb-area">
    <div class="container">
        <div class="row">
            <div class="col-xs-12">
                <div class="crumb">
                    <ul class="crumb-list">
                        <li><a href="{!! url('/')!!}">{{trans('message.home')}}</a></li>
                        <li class="active"><a href="#">{{trans('message.review_orders')}}</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- crumb-area-end -->

<!-- shipping-area-start -->
<div class="shopping-head-area">
    <div class="container">
        <div class="row">
            <div class="col-xs-12">
                <div class="shopping-head">
                    <div class="clerafix">
                        <div class="sh-menu-item">
                            <p>{{trans('message.shopping_cart')}}</p>
                        </div>
                        <div class="sh-menu-item">
                            <p>{{trans('message.check_out')}}</p>
                        </div>
                        <div class="sh-menu-item active">
                            <p>{{trans('message.review_orders')}}</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- shipping-area-end -->

<!-- checkout-area-start -->
<div class="checkout-area">
    <div class="container">
        <div class="row">
            <div class="col-md-8 col-sm-12 col-xs-12">
                <div class="billing-address">
                    @if(!empty($pickup_info))
                        <div class="checkout-billing-adress-box">
                            <h5 class="main-title">{{trans('message.shipping_method')}}</h5>
                            <div class="info-review">
                                <span class="item">{{strtoupper(trans('message.pickup_in_store'))}}</span>
                                <span class="item">{{trans('message.store_name') . ": " . @$pickup_info['shop_name']}}</span>
                                <!-- <span class="item">{{trans('message.address') . ": #1A, ST. 167, TOUL TOMPOUNG2, CHAMKAMON, PP"}}</span>
                                <span class="item">
                                    {{trans('message.gps_location') . ": "}}
                                    <a href="#">
                                        <i class="fa fa-globe"></i>
                                    </a>
                                </span> -->
                            </div>
                        </div>
                    @else
                        <div class="checkout-billing-adress-box">
                            <h5 class="main-title">{{trans('message.shipping_method')}}</h5>
                            <div class="info-review">
                                <span class="item">{{strtoupper(trans('message.delivery'))}}</span>
                                <span class="item">{{trans('message.name') . ": " . @$delivery_info['name']}}</span>
                                <span class="item">{{trans('message.phone') . ": " . @$delivery_info['phone']}}</span>
                                <span class="item">{{trans('message.address') . ": " . @$delivery_info['address']}}</span>
                                <span class="item">
                                    {{trans('message.gps_location') . ": "}}
                                    <a 
                                        href="#" 
                                        data-lat="{{@$delivery_info['latitude']}}" 
                                        data-lng="{{@$delivery_info['longitude']}}" 
                                        id="view-map">
                                            <i class="fa fa-globe"></i>
                                    </a>
                                </span>
                            </div>
                        </div>
                    @endif
                </div>
                <div class="billing-address">
                    <div class="checkout-billing-adress-box">
                        <h5 class="main-title">{{trans('message.payment_method')}}</h5>
                        <div class="info-review">
                            <span class="item">{{trans('message.cash_on_delivery')}}</span>
                        </div>
                    </div>
                </div>
                @if(!empty($card_info))
                    <div class="billing-address">
                        <div class="checkout-billing-adress-box">
                            <h5 class="main-title">{{trans('message.membership_card')}}</h5>
                            <div class="info-review">
                                <span class="item">
                                    <img src="{{$card_info['picture']}}" width="100" />
                                </span>
                                <span class="item">{{$card_info['card_title']}}</span>
                                <!-- if discount card -->
                                @if($is_discount_card)
                                    <span class="item">{{trans('message.discount') . ": " . $percentage_discount . "%"}}</span>
                                @else
                                    <span class="item">{{trans('message.card_balance') . ": " . $card_info['card_balance']}}</span>
                                @endif
                            </div>
                        </div>
                    </div>
                    @if(!$is_discount_card)
                        <div class="billing-address">
                            <div class="checkout-billing-adress-box">
                                <h5 class="main-title">{{trans('message.redemption')}}</h5>
                                <div class="info-review">
                                    <span class="item">
                                        {{@$redeem_info['str_redemption']}}
                                    </span>
                                </div>
                            </div>
                        </div>
                    @endif
                @endif
                <a href="{!! url('/check-out') !!}" class="checkout-page-button hvr-bs mar-top-30">{{trans('message.back_to_check_out')}}</a>
            </div>
            <div class="col-md-4 col-sm-12 col-xs-12">
                <div class="your-order-box">
                    <h4 class="checkout-box-title">{{trans('message.your_order')}}</h4>
                    {!! Form::open(['url' => url('/post-complete-order'), 'method' => 'POST', 'id' => 'frmCompleteOrder']) !!}
                        <div class="yob-content">
                            <p class="yobc-title">{{strtoupper(trans('message.product'))}} <span>{{strtoupper(trans('message.total'))}}</span></p>
                            <ul>
                                @foreach($shopping_cart as $k => $v)
                                    <li class="clearfix">
                                        {{$v['name'] . " x " . $v['qty']}} 
                                        <span class="text-normal">{{getPriceFormat(($v['price']*$v['qty']), $currency_sign)}}</span>
                                    </li>
                                @endforeach
                                <li class="clearfix">{{trans('message.cart_subtotal')}} 
                                    <span class="text-normal">{{getPriceFormat($amount_info['sub_total'], $currency_sign)}}</span>
                                </li>
                                <li class="clearfix">{{trans('message.vat')}} 
                                    <span class="text-normal">{{getPriceFormat($amount_info['total_tax'], $currency_sign)}}</span>
                                </li>
                                <li class="clearfix">{{trans('message.discount_from_card')}} 
                                    <span>{{getPriceFormat($amount_info['total_discount'], $currency_sign)}}</span>
                                </li>
                                <li class="clearfix">{{trans('message.redeem')}} <span>{{getPriceFormat($amount_info['total_redemption'], $currency_sign)}}</span></li>
                                <li class="order-total clearfix">{{trans('message.order_total')}} 
                                    <span class="text-normal text-bold">{{getPriceFormat($amount_info['total'], $currency_sign)}}</span>
                                </li>
                            </ul>
                            <div class="create-account-checkout-method">
                                <div class="place-order">
                                    <button class="checkout-page-button hvr-bs btn-place-order">{{trans('message.place_order')}}</button>
                                </div>
                            </div>
                        </div>
                    {!! Form::close() !!}
                </div>
            </div>
        </div>
    </div>
</div>
<!-- checkout-area-end -->

<!-- map modal -->
<div id="map-modal" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h5 class="modal-title">
                    {{trans('message.gps_location')}}
                </h5>
            </div>
            <div class="modal-body">
                <div id="map-container" class="map-wrapper" style="border:1px solid #CCC;"></div>
            </div>
        </div>
    </div>
</div>
<!-- end map modal -->

<style type="text/css">
#map-container { height: 400px; }
.text-bold { font-weight: bold; font-size: 18px; }
span.text-normal { color: inherit !important; }
.main-title { margin-bottom: 20px; }
.info-review .item { display: block; }
.pcb-content { padding: 25px 35px 25px; }
.align-right { text-align: right !important; }
a.checkout-page-button { color: #fff; }
</style>

@endsection

@section('script')
<!-- google-map-script -->
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&key={{config('global.google_key')}}"></script>
<script type="text/javascript">
$(function(){
    $('#view-map').click(function(e){
        e.preventDefault();
        var me = $(this),
            lat = parseFloat(me.attr('data-lat')),
            lng = parseFloat(me.attr('data-lng')),
            modal = $('#map-modal');
        modal.on("shown.bs.modal", function () { 
            initializeMap(lat, lng);
        }).modal('show');
    });
});
//  init map
function initializeMap(latitude, longitude) {

    // default lat & lng
    var default_lat_lng = {lat: latitude, lng: longitude};
    // init map
    var map = new google.maps.Map(document.getElementById('map-container'), {
        zoom: 15,
        center: default_lat_lng
    });
    // set marker
    var marker = new google.maps.Marker({
                position: default_lat_lng,
                map: map
            });
}
</script>
@endsection