template-order-details.php

<?php
/**
* Template Name: Order Details Template
*/
get_header();
global $woocommerce;  
if(count(WC()->cart->get_cart())>0){
foreach( WC()->cart->get_cart() as $cart_item ){ 
    $product_id = $cart_item['product_id'];
	$variationId = $cart_item['variation_id']; 
}
if($variationId==''){
	$variationId = $_SESSION['vid'];
}
$product = new WC_Product_Variable( $product_id );
$variations = $product->get_available_variations();
$var_data = array();
$selected = array();
$variation_id = array(); 
foreach ($variations as $variation) { 
if($variation['variation_id'] == $variationId){ 
	  $selected[] = 'selected'; 	  
  }else{
	  $selected[] = '';
}	  
 
$var_data[] = $variation['attributes']; 
$variation_id[] = $variation['variation_id'];

}   
?> 
<div class="loading" style="display:none">Loading…</div>
<section class="payments-section">
  <div class="container">
    <div class="row justify-content-center">
      <div class="col-md-12">
        <div class="order-list">
          <div class="payment-nav">
            <div class="payment-item">
              <span class="active">1</span>
              <p class="active">Order details</p>
            </div>
            <div class="payment-item">
              <span class="">2</span>
              <p>Personal details</p>
            </div>
            <div class="payment-item">
              <span class="">3</span>
              <p>Payment</p>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="row justify-content-center">
      <div class="col-md-7">
        <div class="book-form">
          <h2>Tour Details</h2>
          <form id="orderdetail" name="orderdetail" method="post">
            <div class="form-group">
              <label>Choose date*</label>
              <input type="text" class="form-control" name="date" id="date" placeholder="Select Date" readonly>
              <div class="valid_error" id="date_mess"></div>
            </div>

            <div class="form-group">
              <label>Where are you staying?*</label>
              <input type="text" class="form-control captilize-css" name="location" id="location" placeholder="Enter a location">
              <div class="valid_error" id="location_mess"></div>
            </div>
            <div class="form-group"> 
              <label>Pickup point*</label>
			  <select class="form-control" name="pickuppoint" id="pickuppoint" placeholder="Select Pickup Point">
			  <option value="">Select Pickup Point</option>
				  <?php
				  for($i=0; $i<=count($var_data); $i++){
				  foreach ($var_data[$i] as $attrName => $var_name) {  
					  ?>
			<option value="<?php echo $variation_id[$i]; ?>" <?php echo $selected[$i]; ?> > <?php echo urldecode(ucwords(str_replace('-',' ',$var_name))); ?></option>
				  <?php } }?> 
				</select> 
              <div class="valid_error" id="pickuppoint_mess"></div>
            </div>

          <div class="c-data">
		  </div>
		   <button type="submit" class="btn btn-primary">Continue Booking</button>
		   <div class="valid_error" id="msg_mess"></div>
        </form>
        </div>

      </div>
      <div class="col-md-5">
        <div class="booking-right">
          <div class="orderSummary">
            <h3>ORDER SUMMARY:</h3>
            <div class="tour-smmry">
			<div>
              <p><b><?php echo $product->get_name(); ?></b></p>
			  <div class="vd"><?php echo $variation_description; ?></div>
			  </div>
			  <?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $product_id ), 'thumbnail' );?>
               <img src="<?php  echo $image[0]; ?>"> 
            </div>
            <p class="date-sidebar"></p>
            <div class="summary-item adult-history"></div>
            <div class="summary-item student-history"> 
            </div>
            <div class="summary-item child-history"> 
            </div>
			<div class="summary-item dropoff-history"> 
            </div>
            <div class="summry-totel">
              <h4>Total charge</h4>
              <h4 class="t-mount"><?php echo get_woocommerce_currency_symbol(); ?>0.00</h4> 
            </div>
          </div>
          <div class="pamntsmry-bottom">
		  <?php dynamic_sidebar('sidebar-booking-text'); ?> 
        </div>
      </div>
    </div>
  </div>
</div>
</section>
<link href="https://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css" rel="Stylesheet" type="text/css" /> 
<script type="text/javascript" src="https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script type="text/javascript">
var j = jQuery;
var currencySymbol = '<?php echo get_woocommerce_currency_symbol(); ?>'; 
j(document).ready(function() {
	
	var pickup_point = j("#pickuppoint option:selected").val(); 
	j('.c-data').html();
	j('.adult-history').html('');
	j('.student-history').html('');
	j('.child-history').html('');
	j('.dropoff-history').html('');
	j('.t-mount').html(''+currencySymbol+'0.00');
	
   j.ajax({
           type: 'post',
           url: "<?php bloginfo('template_url');?>/pickup-ajax.php",
           data:{pickup_point:pickup_point}, 
           success: function(data){  
             j('.c-data').html(data); 
			 j('.vd').html(j('#vdi').val());
			 cal();
			 caladult(); 
           }
       });
  j('#orderdetail').submit(function(e) {
    e.preventDefault();
    var date_value = j("#date").val();
    var location_value = j("#location").val();
    var pickuppoint_value = j("#pickuppoint").val();
	
	var adult_value = j(".adult").html();
	var student_value = j(".student").html();
	var child_value = j(".child").html();
    
    var flagcheck = 0;

    if(date_value == '') {
      var msg = "Please enter your Date.";
      j('#date_mess').html(msg);
      j('#date_mess').fadeIn();
      j('#date_mess').delay(3000).fadeOut();
      flagcheck = 1;
      return false;
    }

    if(location_value == '') {
      var msg = "Please enter your Location.";
      j('#location_mess').html(msg);
      j('#location_mess').fadeIn();
      j('#location_mess').delay(3000).fadeOut();
      flagcheck = 1;
      return false;
    }

    if(pickuppoint_value == ''){
		var msg = "Please select your Pickup Point.";
		j('#pickuppoint_mess').html(msg);
		j('#pickuppoint_mess').fadeIn();
		j('#pickuppoint_mess').delay(3000).fadeOut();
		j("#pickuppoint").focus();
		flagcheck = 1;
		return false;
    	}
		
	if((adult_value=='0' || adult_value=='') && (student_value=='0' || student_value=='') && (child_value=='0' || child_value=='')){
		var msg = "You must select at least one person";
		j('#all_mess').html(msg);
		j('#all_mess').fadeIn();
		j('#all_mess').delay(3000).fadeOut();
		flagcheck = 1;
		return false;
	}

	/*if(adult_value=='' || adult_value=='0'){
		var msg = "You must select at least one person";
		j('#adult_mess').html(msg);
		j('#adult_mess').fadeIn();
		j('#adult_mess').delay(3000).fadeOut(); 
		flagcheck = 1;
		return false;
	}
	
	if(student_value=='' || student_value=='0'){
		var msg = "You must select at least one person";
		j('#student_mess').html(msg);
		j('#student_mess').fadeIn();
		j('#student_mess').delay(3000).fadeOut(); 
		flagcheck = 1;
		return false;
	}	
	
	if(child_value=='' || child_value=='0'){
		var msg = "You must select at least one person";
		j('#child_mess').html(msg);
		j('#child_mess').fadeIn();
		j('#child_mess').delay(3000).fadeOut(); 
		flagcheck = 1;
		return false;
	}*/	
  if(flagcheck == 0) {
	  var dataName = j('#numberofpeople').attr("data-name");
	  var a_qty = jQuery("input[name='adult_qty']").val();
	  var a_amt = jQuery("input[name='adult_amt']").val();
	  var s_qty = jQuery("input[name='student_qty']").val();
	  var s_amt = jQuery("input[name='student_amt']").val();
	  var c_qty = jQuery("input[name='child_qty']").val();
	  var c_amt = jQuery("input[name='child_amt']").val();
	  var add_ones = jQuery("input[name='transportation_qty']").val();
	  var add_amt = jQuery("input[name='transportation_amt']").val();
	  var total_amt = jQuery("input[name='tamt']").val();
	  j.ajax({
           type: 'post',
           url: "<?php bloginfo('template_url'); ?>/booking-order-details.php",
           data:{date_value:date_value,
			   location_value:location_value,
			   pickuppoint_value:pickuppoint_value,
			   pickuppoint_name:dataName,
			   adult_qty:a_qty,
			   adult_price:a_amt,
			   student_qty:s_qty,
			   student_price:s_amt,
			   child_qty:c_qty,
			   child_price:c_amt,
			   addones_qty:add_ones,
			   addones_price:add_amt,
			   total_price:total_amt
			   },
			   beforeSend: function() { 
			j('.loading').css("display","block");
		   },
           success: function(data){
			   j('.loading').css("display","none");
			   if(data == 1)
			   {
				   window.location='<?php echo the_permalink(323); ?>';
			   }else{ 
					j('#msg_mess').html('Error: please try again after sometime.');
					j('#msg_mess').fadeIn();
					j('#msg_mess').delay(3000).fadeOut();
			   } 
           }
       });
   }
  });

 

j('#pickuppoint').on('change', function() {
	var pickup_point = j("#pickuppoint").val();
	j('.c-data').html();
	j('.adult-history').html('');
	j('.student-history').html('');
	j('.child-history').html('');
	j('.dropoff-history').html('');
	j('.t-mount').html(''+currencySymbol+'0.00');
	
   j.ajax({
           type: 'post',
           url: "<?php bloginfo('template_url');?>/pickup-ajax.php",
           data:{pickup_point:pickup_point},
		   beforeSend: function() { 
			j('.loading').css("display","block");
		   },
           success: function(data){
             j('.c-data').html(data);
			 j('.vd').html(j('#vdi').val());
			 cal();
			 caladult();
			 j('.loading').css("display","none");
           }
       });
});
  
 
j("#date").datepicker({
	minDate: 0,
	dateFormat: 'dd MM yy, DD',
	onSelect: function (selectedDate) {
             j('.date-sidebar').html(selectedDate);
       }
});
    
   
  
  function caladult(){
	  var adult = '.adult';
	  var a = 1;
	  j(adult).html(a);
	  var dataName = j('#numberofpeople').attr("data-name");
      var adultId = j(adult).attr("data-id");
	  var apri = (a*adultId).toFixed(2);
	  j('.adult-history').html('<p>Adult from '+dataName+' x '+a+'</p><p>'+currencySymbol+apri+'</p>'+ 
								'<input type="hidden" name="adult_qty" value="'+a+'">'+
								'<input type="hidden" name="adult_amt" value="'+apri+'">');
	  
	  var total = (a*adultId).toFixed(2);
	  j('.t-mount').html(''+currencySymbol+total+'<input type="hidden" name="tamt" value="'+total+'">');
  }
  
  function cal(){
  var adult = '.adult'; 
  var student = '.student';
  var child = '.child'; 
  
  var transportation = '.transportation'; 
  var c = 0;
  var a = 1;   
  var s = 0;
  var t = 0; 
  
  j(adult).html(a);
  j(student).html(s);
  j(child).html(c); 
  j(transportation).html(t);
  
  var dataName = j('#numberofpeople').attr("data-name");
  var adultId = j(adult).attr("data-id");
  var studentId = j(student).attr("data-id");
  var childId = j(child).attr("data-id");
  var transportationId = j(transportation).attr("data-id");

  j('.adult-plus').on('click', function(){
    j(adult).html(++a); 
	  if(a>1){
		  var perPersion = '/ person';
	  }else{
		  var perPersion = '';
	  }
	  if(a>0){
	  var adultHtml = ''+currencySymbol+adultId+' '+perPersion;
	  j('#adult-span').html(adultHtml);
	  }else{
		  j('#adult-span').html('');
	  }   
	  var apri = (a*adultId).toFixed(2);
	  j('.adult-history').html('<p>Adult from '+dataName+' x '+a+'</p><p>'+currencySymbol+apri+'</p>'+ 
								'<input type="hidden" name="adult_qty" value="'+a+'">'+
								'<input type="hidden" name="adult_amt" value="'+apri+'">');
	  
	  var total = ((a*adultId)+(s*studentId)+(c*childId)+(t*transportationId)).toFixed(2);
	  j('.t-mount').html(''+currencySymbol+total+
							'<input type="hidden" name="tamt" value="'+total+'">');
	  
  })

  j('.adult-mins').on('click', function(){ 
    if (a >= 1) {
      j(adult).html(--a); 
	  if(a>1){
		  var perPersion = '/ person';
	  }else{
		  var perPersion = '';
	  }
	  if(a>0){
	  var adultHtml = ''+currencySymbol+adultId+' '+perPersion;
	  j('#adult-span').html(adultHtml);
	  var apri = (a*adultId).toFixed(2); 
	  j('.adult-history').html('<p>Adult from '+dataName+' x '+a+'</p><p>'+currencySymbol+apri+'</p>'+ 
								'<input type="hidden" name="adult_qty" value="'+a+'">'+
								'<input type="hidden" name="adult_amt" value="'+apri+'">');
	  }else{
		  j('#adult-span').html('');
		  j('.adult-history').html('');
	  }
	  var total = ((a*adultId)+(s*studentId)+(c*childId)+(t*transportationId)).toFixed(2);
	  j('.t-mount').html(''+currencySymbol+total+
							'<input type="hidden" name="tamt" value="'+total+'">');
    } else {  
	    
    }
  });
  
    
 
  j('.student-plus').on('click', function(){
    j(student).html(++s); 
	  if(s>1){
		  var perPersion = '/ person';
	  }else{
		  var perPersion = '';
	  }
	  if(s>0){
	  var studentHtml = ''+currencySymbol+studentId+' '+perPersion;
	  j('#student-span').html(studentHtml);
	  }else{
		  j('#student-span').html('');
	  }
	  var spri = (s*studentId).toFixed(2);
	  j('.student-history').html('<p>Student from '+dataName+' x '+s+'</p><p>'+currencySymbol+spri+'</p>'+ 
								'<input type="hidden" name="student_qty" value="'+s+'">'+
								'<input type="hidden" name="student_amt" value="'+spri+'">');
	  var total = ((a*adultId)+(s*studentId)+(c*childId)+(t*transportationId)).toFixed(2); 
	  j('.t-mount').html(''+currencySymbol+total+
						'<input type="hidden" name="tamt" value="'+total+'">');
  })

  j('.student-mins').on('click', function(){ 
    if (s >= 1) {
      j(student).html(--s); 
	  if(s>1){
		  var perPersion = '/ person';
	  }else{
		  var perPersion = '';
	  }
	  if(s>0){
	  var studentHtml = ''+currencySymbol+studentId+' '+perPersion;
	  j('#student-span').html(studentHtml);
	  var spri = (s*studentId).toFixed(2); 
	  j('.student-history').html('<p>Student from '+dataName+' x '+s+'</p><p>'+currencySymbol+spri+'</p>'+ 
								'<input type="hidden" name="student_qty" value="'+s+'">'+
								'<input type="hidden" name="student_amt" value="'+spri+'">');
	  }else{
		  j('#student-span').html('');
		  j('.student-history').html('');
	  } 
	  var total = ((a*adultId)+(s*studentId)+(c*childId)+(t*transportationId)).toFixed(2); 
	  j('.t-mount').html(''+currencySymbol+total+
						'<input type="hidden" name="tamt" value="'+total+'">');
    } else { 
    }
  });
  
      
  j('.child-plus').on('click', function(){
    j(child).html(++c); 
	  if(c>1){
		  var perPersion = '/ person';
	  }else{
		  var perPersion = '';
	  }
	  if(c>0){
	  var childHtml = ''+currencySymbol+childId+' '+perPersion;
	  j('#child-span').html(childHtml);
	  }else{
		  j('#child-span').html('');
	  }
	  var cpri = (c*childId).toFixed(2); 
	  j('.child-history').html('<p>Child from '+dataName+' x '+c+'</p><p>'+currencySymbol+cpri+'</p>'+ 
								'<input type="hidden" name="child_qty" value="'+c+'">'+
								'<input type="hidden" name="child_amt" value="'+cpri+'">');
	  var total = ((a*adultId)+(s*studentId)+(c*childId)+(t*transportationId)).toFixed(2);
	  j('.t-mount').html(''+currencySymbol+total+
						'<input type="hidden" name="tamt" value="'+total+'">');
  })

  j('.child-mins').on('click', function(){ 
    if (c >= 1) {
      j(child).html(--c); 
	  if(c>1){
		  var perPersion = '/ person';
	  }else{
		  var perPersion = '';
	  }
	  if(c>0){
	  var childHtml = ''+currencySymbol+childId+' '+perPersion;
	  j('#child-span').html(childHtml);
	  var cpri = (c*childId).toFixed(2); 
	  j('.child-history').html('<p>Child from '+dataName+' x '+c+'</p><p>'+currencySymbol+cpri+'</p>'+ 
								'<input type="hidden" name="child_qty" value="'+c+'">'+
								'<input type="hidden" name="child_amt" value="'+cpri+'">');
	  }else{
		  j('#child-span').html(''); 
	      j('.child-history').html('');
	  }
	  var total = ((a*adultId)+(s*studentId)+(c*childId)+(t*transportationId)).toFixed(2);
	  j('.t-mount').html(''+currencySymbol+total+
						'<input type="hidden" name="tamt" value="'+total+'">');
    } else { 
    }
  }); 
  
     
  j('.transportation-plus').on('click', function(){
    j(transportation).html(++t);
	  var perPersion = '/ person';
	  if(t>0){
	  var transportationHtml = ''+currencySymbol+transportationId+' '+perPersion;
	  j('#transportation-span').html(transportationHtml);
	  }else{
		  j('#transportation-span').html('');
	  }
	  var tpri = (t*transportationId).toFixed(2);  
	  j('.dropoff-history').html('<p>Dropoff</p><p>'+currencySymbol+tpri+'</p>'+ 
								'<input type="hidden" name="transportation_qty" value="'+t+'">'+
								'<input type="hidden" name="transportation_amt" value="'+tpri+'">');
	  var total = ((a*adultId)+(s*studentId)+(c*childId)+(t*transportationId)).toFixed(2); 
	  j('.t-mount').html(''+currencySymbol+total+
						'<input type="hidden" name="tamt" value="'+total+'">');
  })

  j('.transportation-mins').on('click', function(){ 
    if (t >= 1) {
      j(transportation).html(--t); 
		  var perPersion = '/ person'; 
	  if(t>0){
	  var transportationHtml = ''+currencySymbol+transportationId+' '+perPersion;
	  j('#transportation-span').html(transportationHtml);
	  var tpri = (t*transportationId).toFixed(2);  
	  j('.dropoff-history').html('<p>Dropoff in '+dataName+' x '+t+'</p><p>'+currencySymbol+tpri+'</p>'+ 
								'<input type="hidden" name="transportation_qty" value="'+t+'">'+
								'<input type="hidden" name="transportation_amt" value="'+tpri+'">');
	  }else{
		  j('#transportation-span').html('');
		  j('.dropoff-history').html('');
	  }
	  var total = ((a*adultId)+(s*studentId)+(c*childId)+(t*transportationId)).toFixed(2); 
	  j('.t-mount').html(''+currencySymbol+total+
						'<input type="hidden" name="tamt" value="'+total+'">');
    } else { 
    }
  }); 
  }
  });
</script>
<?php 
}else{
	echo "<script type='text/javascript'>window.location='".site_url()."'</script>";exit;
}
get_footer();?>