<div class="mobile-banner-wrap relative">
	<div class="layer"></div>
	<img class="mobile-banner" src="<?= base_url('assets/images/top_bg.jpg') ?>" style="height:200px; object-fit: cover;">
</div>
<div id="parallax-wrap" class="parallax-search" data-parallax="scroll" data-position="center" data-bleed="10" data-image-src="/assets/images/top_bg.jpg">
	<div class="search-wraps">
		<?php if ($deliveryData) { ?>
			<h1>Payment Option</h1>
			<p>choose your payment</p>
		<?php } else { ?>
			<h1>oops something went wrong</h1>
		<?php } ?>
	</div> <!--search-wraps-->
</div> <!--parallax-container-->
<div class="order-progress-bar payment-progress-bar">
	<div class="container">
		<div class="row">

			<div class="col-md-2 col-xs-2">
				<a class="active " href="menu">Create your order</a>
			</div>
			<div class="col-md-2 col-xs-2 ">
				<a class="active current " href="order/payment_option">Payment information</a>
			</div>
			<div class="col-md-2 col-xs-2 " style="display:none">
				<a class="inactive " href="javascript:;">Confirm Order</a>
			</div>
			<div class="col-md-2 col-xs-2 ">
				<a class="inactive " href="javascript:;">Receipt</a>
			</div>
		</div><!-- row-->
	</div> <!--container-->
	<div class="border progress-dot mytable">
		<a href="menu" class="mycol selected"><i class="ion-record"></i></a>
		<a href="javascript:;" class="mycol selected"><i class="ion-record"></i></a>
		<a href="javascript:;" class="mycol selected"><i class="ion-record"></i></a>
		<a href="javascript:;" class="mycol selected"><i class="ion-record"></i></a>
	</div> <!--end progress-dot-->
</div> <!--order-progress-bar-->
<input type="hidden" value="PH" name="mobile_country_code" id="mobile_country_code">
<input type="hidden" value="<?= $_SESSION['settings']['currency_symbol'] ?>" name="admin_currency_set" id="admin_currency_set">
<input type="hidden" value="left" name="admin_currency_position" id="admin_currency_position">
<div class="modal fade" id="menumodel" role="dialog">
</div>
<div class="sections section-grey2 section-payment-option">
	<?php if ($this->session->flashdata('error')) { ?>
		<div class="alert alert-danger">
			<?php 
			echo $this->session->flashdata('error');
			?>.
		</div>
	<?php unset($_SESSION['error']); 
	}
	if ($deliveryData) {  ?>
		<form action="order/place_order" id="frm-delivery" class="frm-delivery has-validation-callback" method="POST">
			<input type="hidden" name="lat" id="map_accurate_address_lat" value="<?= @$address['lat'];?>">
			<input type="hidden" name="lng" id="map_accurate_address_lng" value="<?= @$address['lng'];?>">
			<input type="hidden" name="country" id="country" value="<?= @$address['country'];?>">
			<div class="container">
			<?php if($deliveryData['transaction_type'] == 'delivery') { ?>
				<div class="col-md-7 border">
					<div class="box-grey rounded">
						<div class="section-label">
							<a class="section-label-a">
								<span class="bold customhead-del">Delivery information</span>
								<b></b>
							</a>
						</div>
						<!--<p><?= $_SESSION['merchantInfo']['restaurant_name']; ?>-->
						<p><b><u>You have selected below information</u></b></p></br>
						<p><b>Delivery Date:</b><?= $_SESSION['deliveryData']['delivery_date']; ?></p>
						<?= $_SESSION['deliveryData']['delivery_asap']; ?>
						
                        <span class="doption">
                           <?php if ($deliveryData['delivery_asap'] == '0') :?>
                				<span class="delivery-time">
                	                <p><b>Delivery Time:</b><?= $_SESSION['deliveryData']['delivery_time']; ?></p>
                	            </span>
	                        <?php endif ?>
	                        
	                        <?php if ($deliveryData['delivery_asap'] == '1') :?>
                				<span class="delivery-time">
                	                <p><b>Delivery Time:</b> ASAP </p>
                	            </span>
	                        <?php endif ?>
	                        
	                        <?php if ($deliveryData['delivery_asap'] == null) :?>
                				<span class="delivery-time">
                	                <p><b>Delivery Time:</b><?= $_SESSION['deliveryData']['delivery_time']; ?></p>
                	            </span>
	                        <?php endif ?>
	                        <span class="delivery-address">
                	                <p><b>Delivery Address:</b><?= (isset($_SESSION['address']['address']) && $_SESSION['address']['address'])?$_SESSION['address']['address']:'not available' ?></p>
                	       </span>
                	       <?php
                	       // Extract the city from the address
                                $fulladdress = $_SESSION["address"];
                                $address_full = $fulladdress["address"];
                                $city = "";
                                $addressParts = explode(",", $address_full);
                                if (count($addressParts) > 1) {
                                    $city = trim($addressParts[1]);
                                    // Remove any numeric characters from the city
                                    $city = preg_replace('/\d/', '', $city);
                                    
                                    // Trim any leading or trailing whitespace
                                    $city = trim($city);
                                }
                                $addressArray["city"] = $city;
                                // print_r($city);
                                // print_r ($address);
                                // print_r($deliveryData);
                                ?>
	                        
	                       </span>
	                        
	                        
                         	<!--<span class="doption">Delivery<?= (!isset($deliveryData['delivery_asap']))?$deliveryData['delivery_date'] . ' at ' . $deliveryData['delivery_time'] . ' To ':''?></span>-->

						</p>
						<div class="top10" id="forms-payment">
							<div class="section-label">
								<a class="section-label-a">
									<span class="bold">Address</span>
									<b></b>
								</a>
							</div>
							<?php if(isset($addressbooklist['data'])){ ?>
							<div class="address_book_wrap">
								<div class="row top10">
									<div class="col-md-10" style="width: 100%;">
										<select class="grey-fields full-width" onchange="getaddress()" name="address_book_id" id="address_book_id">
										<option value="0">Choose Delivery Address </option>
											<?php foreach ($addressbooklist['data'] as $key=>$row) { ?>
												<option  value="<?= $row['id']; ?>"><?= $row['address']; ?></option>
											<?php } ?>
										</select>
										<a href="javascript:;" class="edit_address_book block top10">
											<i class="ion-compose"></i> Edit </a>
									</div>
								</div>
							</div>
							<?php } ?>
							<div class="address-block" >
							    <?php 
							  
							    if(isset($guestcheckout) && $guestcheckout){
							    ?>
							    	<div class="row top10">
									<div class="col-md-10">
										<input class="grey-fields full-width" placeholder="First Name" type="text" value="" name="first_name" id="first_name" required>
									</div>
								</div>
								
									<div class="row top10">
									<div class="col-md-10">
										<input class="grey-fields full-width" placeholder="Email" type="text" value="" name="email_address" id="email_address" required>
									</div>
								</div>
								<input type="hidden" value="1" name="is_guest" id="is_guest">
							    <?php } ?>
								<div class="row top10">
									<div class="col-md-10">
										<input class="grey-fields full-width" placeholder="Street" type="text" value="<?= @$address['street']; ?>" name="street" id="street" required>
									</div>
								</div>
								<div class="row top10">
									<div class="col-md-10">
										<input class="grey-fields full-width" placeholder="City" type="text" value="<?= $addressArray["city"]?>" name="city" id="city" required>
									</div>
								</div>
								<div class="row top10">
									<div class="col-md-10">
										<input class="grey-fields full-width" placeholder="State" type="text" value="<?= @$address['state']; ?>" name="state" id="state" required>
									</div>
								</div>
								<div class="row top10">
									<div class="col-md-10">
										<input class="grey-fields full-width" placeholder="Zip code" type="text" value="<?= @$address['zipcode']; ?>" name="zipcode" id="zipcode" required>
									</div>
								</div>

								<div class="row top10">
									<div class="col-md-10">
										<select class="grey-fields full-width" data-validation="required" name="country_code" id="country_code" onchange="$('#country').val($('#country_code option:selected').text())">
											<option>Select Country</option>
											<?php

                                            foreach ($countrylist as $c_code) { ?>
												<option value="<?= $c_code['country_code']; ?>" <?= $address['country'] == $c_code['name'] ? 'selected' : ''; ?>><?= $c_code['name']; ?></option>
											<?php } ?>
										</select>
									</div>
								</div>
								<div class="row top10">
									<div class="col-md-10">
										<input class="grey-fields full-width" placeholder="Apartment suite, unit number, or company name" type="text" value="" name="location_name" id="location_name">
									</div>
								</div>
							</div> <!--address-block-->
						<?php if(isset($guestcheckout) && $guestcheckout){
							    ?>
							    <div class="row top10">
								<div class="col-md-10">
									<div class="intl-tel-input">
                                        <span class="label-input100">Mobile Number</span>
                                        <input class="grey-fields mobile_inputs full-width" placeholder="Mobile Number" required maxlength="15" type="text" value="" name="contact_phone" id="contact_phone" autocomplete="off">
									</div>
								</div>
							</div>
							    <?php
							} else { ?>
							<div class="row top10">
								<div class="col-md-10">
									<div class="intl-tel-input">
                                        <span class="label-input100">Mobile Number</span>
                                        <input class="grey-fields mobile_inputs full-width" placeholder="Mobile Number" required maxlength="15" type="text" value="<?= @$user['contact_phone']?>" name="contact_phone" id="contact_phone" autocomplete="off">
									</div>
								</div>
							</div> <?php } ?>
							<div class="row top10">
								<div class="col-md-10">
                                    <span class="label-input100">Delivery instructions</span>
                                    <input class="grey-fields full-width" placeholder="Delivery instructions" type="text" value="" name="delivery_instruction" id="delivery_instruction">
								</div>
							</div>
							<div class="row top10 saved_address_block">
								<div class="col-md-10">
									<div class="icheckbox_minimal" style="position: relative;">
										<input class="icheck" value="2" type="checkbox" name="saved_address" id="saved_address" onclick="save_address()">
										<ins class="iCheck-helper"></ins>
										Save to my address book
									</div>
								</div>
							</div>
						</div> <!--top10-->
						<!--<div class="top25">-->
						<!--	<div class="section-label">-->
						<!--		<a class="section-label-a">-->
						<!--			<span class="bold">Point your address in the map</span>-->
						<!--			<b></b>-->
						<!--		</a>-->
						<!--	</div>-->
						<!--	<p>The marker you set in the map, it will use to get the distance between you and merchant address, so please put the map pin correctly.</p>-->
						<!--</div>-->
						<!--<div id="delivery_map_accuracy" class="delivery_map_accuracy" style="position: relative; overflow: hidden;">-->
						<!--</div>-->
						<div class="top25 paymentlist">
							<div class="section-label">
								<a class="section-label-a">
									<span class="bold">Payment Information</span>
									<b></b>
								</a>
							</div>
							<input type="hidden" value="2" name="cod_change_required" id="cod_change_required" required>
							<?php
							
							//p($_SESSION['merchantInfo']['']);
							if(!empty($loadPaymentList)){
							    foreach($loadPaymentList as $row){
							?>
							<div class="row top10">
								<div class="col-md-9">
									<div class="iradio_flat" style="position: relative;">
										<input  class="icheck payment_option"  value="<?= $row['payment_code']?>" type="radio" name="payment_opt" id="payment_opt" required>
										<ins class="iCheck-helper"></ins>
										<?= $row['payment_name']?>
									</div>
								</div>
							</div>
							
							<?php
					
							if($row['payment_code'] == 'cod'){  ?>
							<div class="row top10 indent20 change_wrap1">
								<input placeholder="change? For how much?" style="width:200px;display:none" class="grey-fields rounded numeric_only" type="text" value="" name="order_change" id="order_change">
							</div>
							<?php } if($row['payment_code'] == 'pyr'){ foreach ($provider_list as $val_provider_list) {
							    	?>
							    	<div class="row top10 payment_option_provider" style="display:none;">
								<div class="col-md-9">
									<div class="checki" style="position: relative;">
										<input  class="icheck"  value="<?= $val_provider_list['payment_name']?>" type="radio" name="payment_provider_name" id="payment_provider_name" >
										<ins class="iCheck-helper"></ins>
										<img class="logo-small" src="<?php echo $val_provider_list['payment_logo']?>">
									</div>
								</div>
							</div>
							<?php } } } } ?>
							

						</div>
					</div> <!--box rounded-->
					<a href="menu"><i class="ion-ios-arrow-thin-left"></i> Back </a>
				</div>
											<?php } elseif($deliveryData['transaction_type'] == 'pickup'){?>
												<div class="col-md-7 border">
					<div class="box-grey rounded">
						<div class="section-label">
							<a class="section-label-a">
								<span class="bold customhead-del">Pickup Information</span>
								<b></b>
							</a>
						</div>
						<p><?= $_SESSION['merchantInfo']['restaurant_name']; ?>
						<span class="doption"><?= @$_SESSION['merchantInfo']['complete_address']; ?>
							</span>
						</p>
						<input class="grey-fields full-width" placeholder="Street" type="hidden" value="<?= @$address['street']; ?>" name="street" id="street" >
						<input class="grey-fields full-width" placeholder="City" type="hidden" value="<?= @$address['city']; ?>" name="city" id="city" >
						<input class="grey-fields full-width" placeholder="State" type="hidden" value="<?= @$address['state']; ?>" name="state" id="state" >
						<input class="grey-fields full-width" placeholder="Zip code" type="hidden" value="<?= @$address['zipcode']; ?>" name="zipcode" id="zipcode" >
						<?php 
							    if(isset($guestcheckout) && $guestcheckout){
							    ?>
							    	<div class="top10" id="forms-payment">
							    	<div class="row top10">
									<div class="col-md-10">
									    	<div class="intl-tel-input">
									    	    <span class="label-input100">First Name</span>
										<input class="grey-fields full-width" placeholder="First Name" type="text" value="" name="first_name" id="first_name" required>
										</div>
									</div>
								</div></div>
								
									<div class="top10" id="forms-payment">
									<div class="row top10">
									<div class="col-md-10">
									    <div class="intl-tel-input">
									    	<span class="label-input100">Email Address</span>
										  <input class="grey-fields full-width" placeholder="Email Address" type="text" value="" name="email_address" id="email_address" required>
										</div>
										
									</div>
								</div>
								</div>
								<input type="hidden" value="1" name="is_guest" id="is_guest">
							    <?php } ?>
						<div class="top10" id="forms-payment">
						<div class="row top10">
						        <div class="col-md-10">
									<div class="intl-tel-input">
                                        <span class="label-input100">Mobile Number</span>
                                        <input class="grey-fields mobile_inputs full-width" placeholder="Mobile Number" required maxlength="15" type="text" value="<?= @$user['contact_phone']?>" name="contact_phone" id="contact_phone" autocomplete="off">
									</div>
								</div>
							</div>
						</div>
						
						<div class="top25 paymentlist">
							<div class="section-label">
								<a class="section-label-a">
									<span class="bold">Payment Information</span>
									<b></b>
								</a>
							</div>
							<input type="hidden" value="2" name="cod_change_required" id="cod_change_required" required>
							<?php
							if(!empty($loadPaymentList)){
								foreach($loadPaymentList as $row){
							?>
							<div class="row top10">
								<div class="col-md-9">
									<div class="iradio_flat" style="position: relative;">
										<input  class="icheck payment_option"  value="<?= $row['payment_code']?>" type="radio" name="payment_opt" id="payment_opt" required>
										<ins class="iCheck-helper"></ins>
										<?= $row['payment_name']?>
									</div>
								</div>
							</div>
							<?php
							if($row['payment_code'] == 'cod'){ ?>
							<div class="row top10 indent20 change_wrap1">
								<input placeholder="change? For how much?" style="width:200px;display:none" class="grey-fields rounded numeric_only" type="text" value="" name="order_change" id="order_change">
							</div>
							<?php } 
							if($row['payment_code'] == 'pyr'){ foreach ($provider_list as $val_provider_list) {
							    	?>
							    	<div class="row top10 payment_option_provider" style="display:none;">
								<div class="col-md-9">
									<div class="checki" style="position: relative;">
										<input  class="icheck"  value="<?= $val_provider_list['payment_name']?>" type="radio" name="payment_provider_name" id="payment_provider_name" >
										<ins class="iCheck-helper"></ins>
										<img class="logo-small" src="<?php echo $val_provider_list['payment_logo']?>">
									</div>
								</div>
							</div>
							<?php } } } } ?>

						</div>
					</div> <!--box rounded-->
					<a href="menu"><i class="ion-ios-arrow-thin-left"></i> Back </a>
				</div>
											<?php }  ?><!--left content-->
				<div class="col-md-5 border sticky-div" style="position: relative; overflow: visible; box-sizing: border-box; min-height: 1px;">
					<div id="cart-container" class="theiaStickySidebar cartDetails" style="padding-top: 1px; padding-bottom: 1px; position: static; top: 8px; left: 785.5px;">

					</div>
				</div> <!--right content-->
		</form>
	<?php } else { ?>
		<h3 class="text-danger">merchant is not available</h3>
	<?php } ?>
</div>
</div>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=<?= $_SESSION['settings']['google_geo_api_key']; ?>&libraries=places"></script>
<script type="text/javascript" src="assets/js/gmaps.js"></script>

<script>
	var temporary_address_lat=<?= $address['lat']?>;
	var temporary_address_lng=<?= $address['lng']?>;
</script>
<script>
	$(document).ready(function () {
		menu.initPaymentOption();
	});

	$(document).on("click", ".qty-plus", function () {
		qty = parseFloat($("#qty").val()) + 1;
		////console.debug(qty);
		if (isNaN(qty)) {
			qty = 1;
		}
		$("#qty").val(qty);
	});
	
	$(document).on("click", ".qty-minus", function () {
		var qty = $("#qty").val() - 1;
		if (qty <= 0) {
			qty = 1;
		}
		$("#qty").val(qty);
	});
	
	$(document).on("click", ".special-instruction", function () {
		$(".notes-wrap").slideToggle("fast");
	});
	
	


</script>
