<?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>
	(function ($) {
		"use strict";
		$(document).on('change', '.custom-file-input', function () {
			var fileName = $(this).val().split('\\').pop();
			$(this).siblings('.custom-file-label').addClass('selected').html(fileName);
		});
	})(jQuery);
	</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-6">
																<label><?php _e("Username");?></label>
																  <input required class="form-control" type="username" name="username" value="<?php echo $username;?>">
																</div>
															 	<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>
(function ($) {
	"use strict";
	var profileDebounce;
	$(document).on('click', "#profile_option input[name='profile_save']", function (event) {
		event.preventDefault();
		var trigger = $(this);
		clearTimeout(profileDebounce);
		profileDebounce = setTimeout(function () {
			var context = trigger.closest('#profile_option');
			var countrySelect = $("select[id='country']");
			var localeSelect = $("select[id='locale']");
			var payload = {
				fname: context.find("input[name='first_name']").val(),
				lname: context.find("input[name='last_name']").val(),
				email: context.find("input[name='email']").val(),
				username: context.find("input[name='username']").val(),
				addline1: context.find("input[name='addline1']").val(),
				addline2: context.find("input[name='addline2']").val(),
				city: context.find("input[name='city']").val(),
				postalcode: context.find("input[name='postalcode']").val(),
				state: countrySelect.select2('data')[0]['id'],
				country: countrySelect.select2('data')[0]['text'],
				locale: localeSelect.select2('data')[0]['id'],
				response: ''
			};

			$.ajax({
				url: "../functions/settings_functions.php",
				type: 'POST',
				data: payload,
				dataType: 'json',
				beforeSend: function () {
					$('.submission_status').html('Saving...').fadeIn();
				}
			}).done(function (data) {
				var isSuccess = !!data.success;
				var message = isSuccess ? data.success : data.error;
				var statusBox = $('.submission_status').html(message);
				if (!isSuccess && !statusBox.hasClass('alert alert-danger')) {
					statusBox.addClass('alert alert-danger');
				}
				if (isSuccess) {
					context.find("input[name='first_name']").val(data.fname);
					context.find("input[name='last_name']").val(data.lname);
					context.find("input[name='email']").val(data.email);
					context.find("input[name='username']").val(data.username);
					context.find("input[name='addline1']").val(data.addline1);
					context.find("input[name='addline2']").val(data.addline2);
					context.find("input[name='city']").val(data.city);
					context.find("input[name='postalcode']").val(data.postalcode);
					context.find("select[name='state']").val(data.state);
					context.find("select[name='country']").val(data.country);
					context.find("select[name='locale']").val(data.locale);
					sessionStorage.setItem('locale', data.locale);
				}
				setTimeout(function () {
					statusBox.fadeOut(function () {
						$(this).removeClass('alert alert-danger');
					});
				}, 3000);
				location.reload();
			});
		}, 1000);
	});

	$(document).on('click', '.api_up', function (event) {
		event.preventDefault();
		var apiValue = $('.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>" + apiValue + '</p>',
			icon: 'info',
			type: 'info',
			showCancelButton: true,
			confirmButtonText: 'Yes!',
			showLoaderOnConfirm: true,
			preConfirm: function () {
				return new Promise(function (resolve) {
					$.ajax({
						url: "../functions/settings_functions.php",
						method: 'POST',
						data: {
							apitoken: apiValue
						},
						dataType: 'json'
					}).done(function (response) {
						if (response.status === 'success') {
							Swal.fire({
								title: 'Completed',
								showConfirmButton: true,
								icon: 'success',
								type: 'success',
								html: response.message
							}).then(function () {
								location.reload();
							});
						} else if (response.status === 'error') {
							Swal.fire({
								title: 'Connection Error',
								showConfirmButton: true,
								icon: 'error',
								type: 'error',
								html: response.message
							});
						}
					});
				});
			}
		});
	});

})(jQuery);
</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>
(function ($) {
	"use strict";
	var passDebounce;
	$(document).on('click', "#pass_update input[name='pass_btn']", function (event) {
		event.preventDefault();
		var trigger = $(this);
		clearTimeout(passDebounce);
		passDebounce = setTimeout(function () {
			var context = trigger.closest('#pass_update');
			var payload = {
				currpass: context.find("input[name='current_pass']").val(),
				newpass: context.find("input[name='new_pass']").val(),
				conpass: context.find("input[name='con_pass']").val()
			};

			$.ajax({
				url: "../functions/settings_functions.php",
				type: 'POST',
				data: payload,
				dataType: 'json',
				beforeSend: function () {
					$('.submission_status').html('Saving...').fadeIn();
				}
			}).done(function (data) {
				var isSuccess = !!data.success;
				var message = isSuccess ? data.success : data.error;
				var statusBox = $('.submission_status').html(message);
				if (!isSuccess && !statusBox.hasClass('alert alert-danger')) {
					statusBox.addClass('alert alert-danger');
				}
				setTimeout(function () {
					statusBox.fadeOut(function () {
						$(this).removeClass('alert alert-danger');
					});
				}, 10000);
			});
		}, 1000);
	});

	$(document).on('click', '#image-change-btn', function () {
		$('.change-sec').css('display', 'none');
		$('.user-data').css('display', 'block');
		$('#change-image').css('display', 'flex');
		$('.input-sec').val('');
	});

	$(document).on('click', '#image-change-cancel', function () {
		$('#change-image').css('display', 'none');
		$('.input-sec').val('');
	});

})(jQuery);
</script>

</div>
<!-- Pass Change Modal /-->





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