@extends('layouts.master-voyo')

@section('header')
	<link rel="stylesheet" href="{{ URL::asset('voyo/inc/font-awesome/css/font-awesome.min.css') }}">
	<link rel="stylesheet" href="{{ URL::asset('site/css/product.css') }}">
	<link rel="stylesheet" href="{{ URL::asset('site/css/style.css') }}">
	<style type="text/css">
		.select_arow_qty_wrap i {
		    top: -11px;
		}
	</style>
@stop

@section('content')

<!-- Global Wrapper -->

	<!-- Page Header -->
	<header class="titlebar titlebar1">
		<div class="container">
			<div class="row">
				<div class="col-sm-12">
					<h1 class="page-title pull-left page-title1">Cart</h1>
					<ol class="breadcrumb pull-right">
						<li><a href="#">Home</a></li>
						<li class="active">Cart</li>
					</ol>
				</div>
			</div>
		</div>
	</header> <!-- END Page Header -->
	
	
	@include('components.userstatus',[
		'type' 		=>'alert-warning',
		'message'	=>	'You haven\'t activate your account yet. Please active to buy something else.'		
	])

	<section class="shop-section cart section-4">
		<div class="container">
			<div class="row">
				<div class="col-sm-12">
					<div class="table-responsive mb30">
						@if( ! Session::has('cart') || count(Session::get('cart')) <= 0 )
							<div style="height: 220px;">
								<div class="alert alert-2 bg-red-2 alert-dismissable fade in br4">
									<p class="text-center">Your cart is empty!</p>
								</div>
							</div>
						@else
							<table id="shop-cart-table" class="table table-hover">
								<thead>
									<tr>
										<th class="col-md-1"></th>
										<th class="col-md-3">Product Name</th>
										<th class="col-md-1">Quantity</th>
										<th class="col-md-2">
											<span class="pull-right">Price (SGD)</span>
										</th>
										<th class="col-md-2">
											<span class="pull-right">Total Amount (SGD)</span>
										</th>
										<th class="col-md-2"></th>
										<th></th>
									</tr>
								</thead>

								<tbody>
								
									@foreach ( $cart_products as $key => $product )
										<tr>
											<td class="col-md-1">
		                            			<div class="pd_img_border">
			                            			<div class="pd_img_wrap">
			                            				<a href="{{ action('ProductController@Detail', $product['id']) }}">
			                            					<img src="{{ imagePath('products', $product['product']->ProductGallery[0]->gallery) }}" alt="product">
			                            				</a>
			                            			</div>
		                            			</div>
		                            		</td>
		                            		<td class="cart-product-name">
		                            			<p class="cart-title">{{ $product['name']}}</p>
		                            			@foreach( $product['variation'] as $title => $value )
	                            					@if( $value )
	                            						<div class="variation-info">
	                            							<span class="variation-text-title">{{ ucfirst($title) }}:</span> {{ $value }}
	                            						</div>
	                            					@endif
		                            			@endforeach
		                            		</td>
											<td class="">
												<div class="form-group qty_input" id="product-qty">
												    <input type="text" value='{{ $product['quantity']}}' class='qty form-control pd_qty_input' />
												    <input type="hidden" name="id" value='{{ $product['id']}}'/>
												    <div class="select_arow_qty_wrap">
												    	<div class="arw-wrap">
		                                                	<a href="{{ action('CartController@increaseQuatity', $product['id']) }}"><i  class="fa fa-caret-up select_up_arw" data-id="{{ $product['id'] }}"></i></a>
														</div>
														<div class="arw-wrap decrease_product">
		                                                	<a href="{{ action('CartController@decreaseQuatity', $product['id']) }}"><i class="fa fa-caret-down select_down_arw" data-id="{{ $product['id'] }}"></i></a>
		                                                </div>
		                                           </div>
												</div>
		                            		</td>
											<td align="right">
												<span>{{ $currency_code . ' ' . number_format($product['product']->partner_price, 2) }} </span>
											</td>
											<td align="right"> 
												{{ $currency_code . ' ' . number_format($product['product']->partner_price * $product['quantity'], 2) }} 
											</td>
											<td align="right">
												<a href="{{ action('CartController@delete', [$product['id'], $key]) }}" class="btn voyo-btn btn-red" ><i class="fa fa-trash-o"></i>&nbsp;Delete</a>
											</td>
											<td></td>
										</tr>
										
										<!-- if product type is Service , we have to show booking details modal box -->		

										@if($product['product']->product_type=='Service')
											<tr>
												<td colspan="7">
													<a href="#booking-detail-{{ $key }}" data-toggle="modal" class="col-lg-12">
				                        				<i class="fa fa-edit"></i> Booking Detail
				                        			</a>
				                        			@include('payment.partials.booking-modal', ['product' => $product, 'booking' => $product['booking'], 'key'=>$key])
												</td>
											</tr>
										@endif

										<!-- check there is addon item for this product and iterate it -->

										@if(count($product["addons"])>0)
											@foreach($product["addons"] as $key => $addon)
												<tr class="addon-row">
		                                            <td class="text-right">
			                                            <strong style="color: #3d566e;font-size: 13px;font-weight: 600;text-decoration: underline;margin-bottom: 10px;">Add on</strong>
		                                            </td>
		                                            <td>
		                                                <span>{{$addon['addon']->product_name}}</span>
		                                            </td>
		                                            <td class="text-center"> 
		                                                <span>{{ $addon['quantity'] }}</span>
		                                            </td>
		                                            <td>
		                                                <span class="pull-right">
                                                            @if(!$addon['addon']->is_complementary)
                                                                <span>$ {{ number_format($addon['addon']->up_price, 2) }}</span>
                                                            @else
                                                                {{ $currency_code }} 0.00
                                                            @endif
		                                                </span>
		                                            </td>
		                                            <td>
		                                                <span class="pull-right">
		                                                	<span>
                                                                @if(!$addon['addon']->is_complementary)
                                                                    {{ $currency_code . ' ' . number_format(($addon['addon']->up_price * $addon['quantity']), 2) }}
                                                                @else
                                                                    {{ $currency_code . ' ' . number_format( (0 * $addon['addon']->up_price), 2 ) }}
                                                                @endif
		                                                	</span>
		                                                </span>
		                                            </td>
		                                            <td></td>
		                                            <td></td>
		                                        </tr>
		                                    @endforeach
	                                    @endif

									@endforeach						
									<tr>
										<td colspan="5" align="right">
											<span class="color_green"><b>Order Total</b></span>
										</td>
										<td align="right">
											<span class="color_red"><b>{{ $currency_code . ' ' . number_format($total_amount, 2) }} </b></span>
										</td>
										<td>&nbsp;</td>
									</tr>
								</tbody>
							</table>
						@endif
					</div>
				</div>
				<div class="col-sm-12 mb20">
					<div align="right">
						@if( Auth::check() )
							@if( ! Session::has('cart') || count(Session::get('cart')) <= 0 )
								<a href="{{url('shop')}}" class="btn btn-new-o">Continue Shopping</a>
							@else 
								<a href="{{url('shop')}}" class="btn btn-new-o">Continue Shopping</a>
								@if( auth()->check())
									@if(auth()->user()->status !== 'P')
										<a href="{{ url('checkout/process') }}" class="btn btn-default">Checkout</a>
									@endif
								@endif
							@endif
						@else
							<a href="{{ url('login?redirectTo=checkout/process') }}" class="btn btn-default"><i class="fa fa-user"></i> Login to Checkout</a>
						@endif
					</div>
				</div>
			</div>
		</div>
	</section>
	
	<!-- Footer Wrapper -->
	@stop
	@section('footer')
		<script >
			$('.edit').click(function(){
				var id 			= $(this).data("id");
				var qty  		= $('.qty'+id).val();
				var action 		= 'edit';
				var obj			= {"qty":qty,  "id" :id, "action" : action};
				$.ajax({
					type: "GET", 
					url: baseurl+"/cartjs", 
					dataType:'html',
					data: obj ,
					success:function(data){
						location.reload();
					},
					error:function(){ 
						alert("Error!!!!");
					}
				});		

			});
		</script>
		<!-- END Footer -->
	<script type="text/javascript">
	    $(document).ready(function(){
		    $('.decrease_product').on('click', function(e) {
		    	var quantity = $(this).parent().siblings('input.pd_qty_input').val();
		    	if( quantity <= '1' ) {
		    		alert('The minimum quantity is 1');
		    		return false;
		    	} else {
		    		return true;
		    	}
		    });
		});

		$('.addon-row').on('click', function (e) {
		    var $icon = $('.add-lable > span > i')
	        if ($icon.hasClass('fa-plus-circle')){
	          	$icon.removeClass('fa-plus-circle').addClass('fa-minus-circle');
	        }
	        else {
	          	$icon.removeClass('fa-minus-circle').addClass('fa-plus-circle');
	        }
			$(this).closest("tr").nextUntil("tr:not(.addon-data-row)").toggle();
		});

	</script>
	@stop
<!-- END Global Wrapper -->