<?php
$title = 'User Profile';
include '../templates/backend/members/header.php';
include '../functions/cc_lists.php';

$email_request = false;

$user_id = $_SESSION['id'];
		
// get evp options	
$evp_options_sql = "SELECT option_name, option_value FROM evp_options";	
$evp_options_read = $db->select($evp_options_sql);	
if ($evp_options_read) {	
    $evp_options_check = mysqli_num_rows($evp_options_read);	
    if ($evp_options_check > 0) {	
		 while($row = $evp_options_read->fetch_assoc()) {	
			$option_name[$row['option_name']] = $row['option_value'];	
    }	
	$evp_options_read->free();	
        $s_url =  $option_name['script_url'];			
		$s_path =  $option_name['script_path'];	
		$site_title =  $option_name['site_title'];	
		$get_resettoken =  $option_name['verify_email_token'];	
		$get_email =  $option_name['email'];	
		$get_password =  $option_name['password'];	
		$get_user_id =  $option_name['user_id'];	
		$user_fname =  $option_name['fname'];	
		$user_lname =  $option_name['lname'];
                $username =     $option_name['username'];	
		$user_email =  $option_name['email'];	
		$user_image =  $option_name['image'];
		$addline1 = 	$option_name['addline1'];
		$addline2 = 	$option_name['addline2'];
		$city = 	$option_name['city'];
		$postalcode = 	$option_name['postalcode'];
		$state = 	$option_name['state'];
		$country = 	$option_name['country'];
		$locale = 	$option_name['locale'];
		$api_token = $option_name['api_token'];
		$email_change_to =  $option_name['email_change_to'];	
		$user_join_date =  $option_name['join_date'];	
		if($option_name['email_change_token'] !== null){	
			$email_request = true;	
			$request_email = $email_change_to;	
		}	
	}	
}
?>

<!-- Page Heading -->
<div class="page-header">
<div class="row">
	<div class="col-md-6 col-sm-12">
		<div class="title">
			<h4><?php _e("$title");?></h4>
		</div>
		<nav aria-label="breadcrumb" role="navigation">
			<ol class="breadcrumb">
				<li class="breadcrumb-item"><a href="index.php"><?php _e("Dashboard");?></a></li>
				<li class="breadcrumb-item active" aria-current="page"><?php _e("$title");?></li>
			</ol>
		</nav>
	</div>
</div>
</div>


<div class="submission_status" style="margin-bottom:15px;"></div>

<div class="row">
					<div class="col-xl-4 col-lg-4 col-md-4 col-sm-12 mb-30">
						<div class="pd-20 card-box height-100-p">
							<div class="profile-photo">
								<a href="modal" data-toggle="modal" data-target="#modal" class="edit-avatar"><i class="fa fa-pencil"></i></a>
								<img id="image" src="../uploads/<?php echo ((!empty($user_image) && $user_image != '0' ) ? $user_image : 'thumb.png'); ?>" alt="..."  class="avatar-photo">
								<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">
									<div class="modal-dialog modal-dialog-centered" role="document">
										<div class="modal-content">
											<div class="modal-body pd-5">
												<div class="img-container">
													<img id="image" src="../uploads/<?php echo ((!empty($user_image) && $user_image != '0' ) ? $user_image : 'thumb.png'); ?>" alt="..." class="img-thumbnail">
												</div>
											</div>
											<div class="modal-footer">
												<div id="change-image" class="change-sec">
													<form class="form-inline" action="../functions/<?php echo $profile_func;?>" method="post" enctype="multipart/form-data">
													<input type="number" hidden name="user_id" value="<?php echo $user_id;?>">
														<div class="input-group input-group-sm">
														<div class="custom-file">
														<input required type="file" name="img_url" class="custom-file-input input-sec" id="inputGroupFile14" aria-describedby="inputGroupFileAddon04">
														<label class="custom-file-label" for="inputGroupFile14"><?php _e("Choose file");?></label>
														</div>
															<div class="input-group-append pl-2">
																<div class="btn-group">
																  <button type="submit" name="profile_img_btn" class="btn btn-success">
																	<i class="icon-copy dw dw-checked"></i>
																  </button>
																</div>
															</div>
														</div>
													</form>
												</div>
												<input id="image-change-btn" type="submit" value="Update" class="btn btn-primary">
												<button type="button" class="btn btn-dark" data-dismiss="modal"><?php _e("Close");?></button>
											</div>
										</div>
									</div>
	<script>
    // Add the following code if you want the name of the file appear on select
    $(".custom-file-input").on("change", function() {
      var fileName = $(this).val().split("\\").pop();
      $(this).siblings(".custom-file-label").addClass("selected").html(fileName);
    });
  </script>
								</div>
							</div>
							<h5 class="text-center h5 mb-0"><?php echo $user_fname.' '.$user_lname?></h5>
							<div class="profile-info">
								<h5 class="mb-20 h5 text-blue"><?php _e("User Info");?></h5>
								<ul>
									<li>
										<span><?php _e("Username");?>:</span>
										<?php echo $username ;?>
									</li>									<li>
										<span><?php _e("Email Address");?>:</span>
										<?php echo $user_email ;?>
									</li>
									<li>
										<span><?php _e("Join Date");?>:</span>
										<?php echo $user_join_date ;?>
									</li>
									<li class="api_up">
										<span><?php _e("API Token");?>:</span>
										<small class="k_val"><?php echo $api_token ;?> <i class="icon-copy ion-android-refresh"></i></small> 
									</li>
								</ul>
							</div>
						</div>
					</div>
					<div class="col-xl-8 col-lg-8 col-md-8 col-sm-12 mb-30">
						<div class="card-box height-100-p overflow-hidden">
							<div class="profile-tab height-100-p">
								<div class="tab height-100-p">
									<ul class="nav nav-tabs customtab" role="tablist">
										<li class="nav-item">
											<a class="nav-link active" data-toggle="tab" href="#setting" role="tab"><?php _e("Settings");?></a>
										</li>
									</ul>
									<div class="tab-content">

										<!-- Setting Tab start -->
										<div class="tab-pane fade height-100-p  show active" id="setting" role="tabpanel">
											<div class="profile-setting">
												<form id="profile_option" action="#" method="post">
													<ul class="profile-edit-list row">
														<li class="weight-500 col-md-12">
															<h4 class="text-blue h5 mb-20"><?php _e("Personal Data");?></h4>
															<div class="form-group">
															 <div class="form-row">
																<div class="col-md-6">
																<label><?php _e("First Name");?></label>
																  <input required class="form-control" type="text" name="first_name" value="<?php echo $user_fname;?>">
																</div>
																<div class="col-md-6">
																<label><?php _e("Last Name");?></label>
																  <input required class="form-control" type="text" name="last_name" value="<?php echo $user_lname;?>">
																</div>
															  </div>
														    </div>
															<div class="form-group">
																<div class="form-row">
																	<div class="col-md-12">
																		<label><?php _e("Email");?></label>
																<input required class="form-control form-control-lg" type="email" name="email" value="<?php echo $user_email ;?>">
															</div>
																</div>
															</div>
															
															<div class="form-group">
															 <div class="form-row">
															 	<div class="col-md-4">
																<label><?php _e("Site Language");?></label>
																	<select id="locale" class="custom-select2 form-control" name="locale" style="width: 100%; height: 38px">
																		<optgroup label="Selected Language: <?php echo $locale; ?>">
																				<?php
																					if($locale != null) {
																						echo '<option value="'.$locale.'">'.strtoupper($locale).'</option>'; 
																					} else {
																				?>
																					<option value="">-----------------</option>
																				<?php } ?>
																					<option value="nl"><?php _e("Dutch (NL)");?></option>
																					<option value="en"><?php _e("English (EN)");?></option>
																					<option value="es"><?php _e("Esnpanol (ES)");?></option>
																					<option value="fr"><?php _e("French (FR)");?></option>
																					<option value="de"><?php _e("German (DE)");?></option>
																					<option value="id"><?php _e("Indonesian (ID)");?></option>
																					<option value="it"><?php _e("Italy (IT)");?></option>
																					<option value="pt"><?php _e("Portuguese (PT)");?></option>
																					<option value="ru"><?php _e("Russian (RU)");?></option>
																					<option value="ro"><?php _e("Romanian (RO)");?></option>
																					<option value="th"><?php _e("Thai (TH)");?></option>
																					<option value="vn"><?php _e("Vietnam (VN)");?></option>
																		</optgroup>
																	</select>
																</div>
															  </div>
														    </div>
															
															
															<!--
															<div class="form-group">
																<div class="custom-control custom-checkbox mb-5">
																	<input type="checkbox" class="custom-control-input" id="customCheck1-1">
																	<label class="custom-control-label weight-400" for="customCheck1-1">I agree to receive notification emails</label>
																</div>
															</div>
															-->
															<h4 class="text-blue h5 mt-5 mb-4"><?php _e("Billing Address");?></h4>
															<div class="form-group">
															 <div class="form-row">
																<div class="col-md-12 mb-3">
																<label><?php _e("Address Line 1");?></label>
																  <input required class="form-control" type="text" name="addline1" value="<?php echo $addline1;?>" placeholder="your address">
																</div>
																<div class="col-md-12">
																<label><?php _e("Address Line 2");?></label>
																  <input class="form-control" type="text" name="addline2" value="<?php echo $addline2;?>" placeholder="optional">
																</div>
															  </div>
														    </div>
															<div class="form-group">
															 <div class="form-row">
															 	<div class="col-md-4">
																<label><?php _e("Country/Region");?></label>
																	<select id="country" class="custom-select2 form-control" name="country" style="width: 100%; height: 38px">
																		<optgroup label="Select Your Country">
																			<?php
																				if($country != null) {
																					    echo '<option value="'.$state.'">'.$country.'</option>'; 
																				} else {
																					echo '<option value="">-----------------</option>';
																				}
																				foreach($countryCodes as $key => $value):
																				echo '<option value="'.$value.'">'.$key.'</option>';
																				endforeach; 
																			?>
																		</optgroup>
																	</select>
																</div>
																<div class="col-md-4">
																<label><?php _e("City/Town");?></label>
																  <input required class="form-control" type="text" name="city" value="<?php echo $city;?>" placeholder="eg: Dhaka">
																</div>
																<div class="col-md-4">
																<label><?php _e("Postal/Zip code");?></label>
																  <input required class="form-control" type="text" name="postalcode" value="<?php echo $postalcode;?>" placeholder="eg: 1000">
																</div>
															  </div>
														    </div>
														<!--	<div class="form-group">
															 <div class="form-row">
																<div class="col-md-6">
																<label>State/County</label>
																  <input hidden class="form-control" type="text" name="state" value="<?php // echo $state;?>" placeholder="eg: BD" readonly>
																</div>
															  </div>
														    </div> -->
															<div class="form-group mb-0">
																<div class="form-row">
																		<input type="submit" name="profile_save" class="btn btn-primary mr-3" value="<?php _e("Update Information");?>">
																		<input class="btn btn-info" data-toggle="modal" data-target="#editprofile" value="<?php _e("Change Password");?>">
																</div>
															</div>
														</li>
													</ul>
												</form>
											</div>
											
											
<script>
/**
* Personal Data and Billing Address Update
**/
$(document).ready(function() {
	$("#profile_option input[name='profile_save']").on('click', function() {
		event.preventDefault();
		var timeoutId;
		var get_fname = $(this).closest('#profile_option').find("input[name='first_name']").val();
		var get_lname = $(this).closest('#profile_option').find("input[name='last_name']").val();
		var get_email = $(this).closest('#profile_option').find("input[name='email']").val();
		var get_addline1 = $(this).closest('#profile_option').find("input[name='addline1']").val();
		var get_addline2 = $(this).closest('#profile_option').find("input[name='addline2']").val();
		var get_city = $(this).closest('#profile_option').find("input[name='city']").val();
		var get_postalcode = $(this).closest('#profile_option').find("input[name='postalcode']").val();
		var $country = $("select[id='country']");
		var get_state = $country.select2('data')[0]['id'];
		// $(this).closest('#profile_option').find("input[name='state']").val();
		var get_country = $country.select2('data')[0]['text'];
		
		var $locale = $("select[id='locale']");
		var get_lang_val = $locale.select2('data')[0]['id'];
		// $(this).closest('#profile_option').find("input[name='state']").val();
		var get_lang_label = $locale.select2('data')[0]['text']; 
		// $(this).closest('#profile_option').find("select[name='country']").text();

		console.log(get_state);
		console.log(get_country);
		console.log(get_lang_val);
		
		clearTimeout(timeoutId);
		timeoutId = setTimeout(function() {
		$.ajax({
			url: "../functions/settings_functions.php",
			type: "POST",
			data: {
				fname: get_fname,
				lname: get_lname,
				email: get_email,
				addline1: get_addline1,
				addline2: get_addline2,
				city: get_city,
				postalcode: get_postalcode,
				state: get_state,
				country: get_country,
				locale: get_lang_val,
				response: ''
				
            },
			dataType: "json",
			beforeSend: function(xhr) {
				$('.submission_status').html('Saving...').fadeIn();
			},
			success: function(data) {
				var reSuccess = data.success;
				var reError = data.error;
				console.log(reSuccess);		
				if (reSuccess) {
						var fname = data.fname;
						var lname = data.lname;
						var email = data.email;
						var addline1 = data.addline1;
						var addline2 = data.addline2;
						var city = data.city;
						var postalcode = data.postalcode;
						var state = data.state;
						var country = data.country;
						var locale = data.locale;
						$("#profile_option input[name='profile_save']").closest('#profile_option').find("input[name='first_name']").val(fname);
						$("#profile_option input[name='profile_save']").closest('#profile_option').find("input[name='last_name']").val(lname);
						$("#profile_option input[name='profile_save']").closest('#profile_option').find("input[name='email']").val(email);
						$("#profile_option input[name='profile_save']").closest('#profile_option').find("input[name='addline1']").val(addline1);
						$("#profile_option input[name='profile_save']").closest('#profile_option').find("input[name='addline2']").val(addline2);
						$("#profile_option input[name='profile_save']").closest('#profile_option').find("input[name='city']").val(city);
						$("#profile_option input[name='profile_save']").closest('#profile_option').find("input[name='postalcode']").val(postalcode);
						$("#profile_option input[name='profile_save']").closest('#profile_option').find("select[name='state']").val(state);
						$("#profile_option input[name='profile_save']").closest('#profile_option').find("select[name='country']").val(country);
						$("#profile_option input[name='profile_save']").closest('#profile_option').find("select[name='locale']").val(locale);
						sessionStorage.setItem("locale", locale);
						var saved = $(".submission_status").html(reSuccess);
					} else {
						var saved = $(".submission_status").html(reError);
						if(!$(".submission_status").hasClass("alert alert-danger")) {
							$(".submission_status").toggleClass("alert alert-danger");
						}					
					}
				saved;
				setTimeout(function() {
					  saved.fadeOut(function() {
						  $(this).removeClass("alert alert-danger");
						});
				}, 3000); 
				location.reload();
			}
		});
		}, 1000);
	});
	
	$(".api_up").click(function(e) {
	var get_api = $('.profile-info').find(".api_up .k_val").text().trim();
    Swal.fire({
        title: "API Token",
        html: "<p style='color: #009c5d;text-transform: uppercase;font-size: 16px;font-weight: bold;'>Would you like to update existing API Token?</p> <p>"+get_api+"</p>",
		icon: 'info',
		type: "info",
        showCancelButton: true,
        confirmButtonText: 'Yes!',
        showLoaderOnConfirm: true,
        preConfirm: function(text) {
            return new Promise(function(resolve) {
                    $.ajax({
                        url: "../functions/settings_functions.php",
                        method: 'POST',
                        data: {
							apitoken : get_api
                        },
						dataType: "json"
					}).done(function (response) {
						console.log(response);
						if(response['status'] === 'success') {
							swal.fire({
							title: "Completed",
							showConfirmButton: true,
							icon: 'success',
							type: "success",
							html: response['message'],
							}).then((result) => {
							  // Reload the Page
							  location.reload();
							});
						} else if(response['status'] === 'error'){
							swal.fire({
							title: "Connection Error",
							showConfirmButton: true,
							icon: 'error',
							type: "error",
							html: response['message'],
							})
							}
						})
				})
			},
		})
		e.preventDefault();
	});
	
});
</script>


										</div>
										<!-- Setting Tab End -->
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				
			

<!-- Pass Change Modal-->
<div class="modal fade" id="editprofile" tabindex="-1" role="dialog" aria-labelledby="ModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="ModalLabel"><?php _e("Change Password");?></h5>
        <button class="close" type="button" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">×</span>
        </button>
      </div>
      <form id="pass_update" action="#" method="post">
        <input type="number" hidden name="user_id" value="<?php echo $user_id;?>">
      <div class="modal-body p-4">
          <div class="" id="pass-change">
            <div class="form-group">
              <label for="InputePassword"><?php _e("Current Password");?></label>
              <input required type="password" name="current_pass" class="form-control form-control-sm" id="InputePassword">
            </div>
            <div class="form-group">
              <label for="InputePassword"><?php _e("New Password");?></label>
              <input required type="password" name="new_pass" class="form-control form-control-sm" id="InputePassword">
            </div>
            <div class="form-group">
              <label for="InputePassword"><?php _e("Confirm New Password");?></label>
              <input required type="password" name="con_pass" class="form-control form-control-sm" id="InputePassword">
            </div>
          </div>
      </div>
      <div class="modal-footer">
        <span class="btn btn-secondary cursor-pointer" data-dismiss="modal"><?php _e("Cancel");?></span>
        <input type="submit" name="pass_btn" class="btn btn-info">
      </div>
    </form>
    </div>
  </div>
  
<script>
/**
* Password Update
**/
$(document).ready(function() {
	$("#pass_update input[name='pass_btn']").on('click', function() {
		event.preventDefault();
		var timeoutId;
		var get_currpass = $(this).closest('#pass_update').find("input[name='current_pass']").val();
		var get_newpass = $(this).closest('#pass_update').find("input[name='new_pass']").val();
		var get_conpass = $(this).closest('#pass_update').find("input[name='con_pass']").val();
		
		clearTimeout(timeoutId);
		timeoutId = setTimeout(function() {
		$.ajax({
			url: "../functions/settings_functions.php",
			type: "POST",
			data: {
				currpass: get_currpass,
				newpass: get_newpass,
				conpass: get_conpass
            },
			dataType: "json",
			beforeSend: function(xhr) {
				// Saving Data
				$('.submission_status').html('Saving...').fadeIn();
			},
			success: function(data) {
				var reSuccess = data.success;
				var reError = data.error;
				// console.log(reError);	
					if (reSuccess) {
					/*
					var currpass = data.currpass; // Get return data
					var newpass = data.newpass; // Get return data
					var conpass = data.conpass; // Get return data
					$("#pass_update input[name='pass_btn']").closest('#pass_update').find("input[name='current_pass']").val(currpass); // update data on field
					$("#pass_update input[name='pass_btn']").closest('#pass_update').find("input[name='new_pass']").val(newpass); // update data on field
					$("#pass_update input[name='pass_btn']").closest('#pass_update').find("input[name='con_pass']").val(conpass); // update data on field
					*/
					var saved = $(".submission_status").html(reSuccess);
					
					} else {
						var saved = $(".submission_status").html(reError);
						if(!$(".submission_status").hasClass("alert alert-danger")) {
							$(".submission_status").toggleClass("alert alert-danger");
						}					
					}
				saved;
				setTimeout(function() {
					  saved.fadeOut(function() {
						  $(this).removeClass("alert alert-danger");
						});
				}, 10000); 
			//	location.reload();
			},
		});
		}, 1000);
	//	event.preventDefault();
	});
});
</script>

</div>
<!-- Pass Change Modal /-->
<script>
$('#image-change-btn').click(function(){
  $('.change-sec').css('display','none');
  $('.user-data').css('display','block');
  $('#change-image').css('display','flex');
  $('.input-sec').val('');
})
$('#image-change-cancel').click(function(){
  $('#change-image').css('display','none');
  $('.input-sec').val('');
});
</script>





<?php include "../templates/backend/members/footer.php";?>
<?php unset($_SESSION['action'])?>
<?php unset($_SESSION['action_message'])?>
<?php unset($_SESSION['action_cat'])?>