<?php if (Wo_IsAdmin()) {
   header('Location: ' . $wo['config']['site_url'] . '/admincp/verifications_requests');
   exit();
} ?>

<div class="page-margin mt-0">
	<div class="wow_content popular_posts_hdr">
		<h2><svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.51721 12.0498L5.56148 15.8055C5.27453 16.9332 6.48077 17.8703 7.55507 17.3543L9.16574 16.5808C9.69148 16.3283 10.3088 16.3283 10.8346 16.5808L12.4452 17.3543C13.5196 17.8703 14.7258 16.9332 14.4388 15.8055L13.4831 12.0498" class="icon_main" stroke-width="1.5"/><path d="M4.79539 5.96852C5.18749 4.34956 6.49269 3.08545 8.16429 2.70569C9.37149 2.43144 10.6279 2.43144 11.8351 2.70569C13.5067 3.08545 14.8119 4.34956 15.204 5.96853C15.4871 7.13773 15.4871 8.35453 15.204 9.52373C14.8119 11.1427 13.5067 12.4068 11.8351 12.7866C10.6279 13.0608 9.3715 13.0608 8.16429 12.7866C6.49269 12.4068 5.18749 11.1427 4.79539 9.52373C4.51221 8.35453 4.51221 7.13773 4.79539 5.96852Z" stroke="currentColor" stroke-width="1.5"/></svg>&nbsp;<?php echo $wo['lang']['profile_verification']; ?></h2>
	</div>
</div>

<div class="wo_settings_page wow_content">

	<?php if (!empty($wo['available_verified_features'])) { ?>
		<div>
			<h5><?php echo $wo['lang']['after_verified'] ?></h5>
			<ol>
				<?php foreach ($wo['available_verified_features'] as $key => $value) { ?>
					<li><?php echo $wo['lang'][$value];?></li>
				<?php } ?>
			</ol>
		</div>
	<?php } ?>
		

	<?php if (Wo_IsVerificationRequestExists()): ?>
	<div class="verification-status">
		<h4>
			<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-user-check"><path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="8.5" cy="7" r="4"></circle><polyline points="17 11 19 13 23 9"></polyline></svg> &nbsp;
			<?php echo $wo['lang']['verification_sent']; ?> 
		</h4>
	</div>
	<?php elseif($wo['user']['verified'] == 1): ?>
	<div class="verification-status">                                             
		<h4>
			<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" class="verified-color feather feather-check-circle"><path d="M23,12L20.56,9.22L20.9,5.54L17.29,4.72L15.4,1.54L12,3L8.6,1.54L6.71,4.72L3.1,5.53L3.44,9.21L1,12L3.44,14.78L3.1,18.47L6.71,19.29L8.6,22.47L12,21L15.4,22.46L17.29,19.28L20.9,18.46L20.56,14.78L23,12M10,17L6,13L7.41,11.59L10,14.17L16.59,7.58L18,9L10,17Z"></path></svg>
			<?php echo $wo['lang']['verification_complete']; ?> 
		</h4>
	</div>
	<?php else: ?>
	<form action="#" method="post" class="form-horizontal setting-verification-form">
		<div id="verificate-user-alert"></div>
		
		<div class="wow_form_fields">
			<label for="name"><?php echo $wo['lang']['username']; ?></label>  
			<input id="name" name="name" type="text" class="form-control input-md">
		</div>
		<div class="wow_form_fields">
			<label for="text"><?php echo $wo['lang']['message']; ?></label>  
			<textarea name="text" class="form-control" id="text" rows="4"></textarea>
		</div>
		<div class="wow_form_fields mb-0">
			<label for="text"><?php echo $wo['lang']['upload_docs']; ?></label>  
			<span class="help-block"><?php echo $wo['lang']['select_verif_images']; ?></span>
		</div>
		
		<div class="select-user-verification-data">
			<div class="select-user-verification-photos">
				<div class="pull-left text-center" id="verif-id">
					<div class="empty_state">
						<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path d="M14,17H7V15H14M17,13H7V11H17M17,9H7V7H17M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3Z" fill="currentColor"></path></svg> <?php echo $wo['lang']['passport_id']; ?>
					</div>
				</div>
				<div class="pull-right text-center" id="verif-photo">
					<div class="empty_state">
						<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path d="M4,5H7L9,3H15L17,5H20A2,2 0 0,1 22,7V19A2,2 0 0,1 20,21H4A2,2 0 0,1 2,19V7A2,2 0 0,1 4,5M16,17V16C16,14.67 13.33,14 12,14C10.67,14 8,14.67 8,16V17H16M12,9A2,2 0 0,0 10,11A2,2 0 0,0 12,13A2,2 0 0,0 14,11A2,2 0 0,0 12,9Z" fill="currentColor"></path></svg> <?php echo $wo['lang']['personal_pic']; ?>
					</div>
				</div>
			</div>
			<div class="clear"></div> 
		</div>
		
		<div class="text-center">
			<button type="submit" class="btn btn-main btn-mat btn-mat-raised add_wow_loader"><?php echo $wo['lang']['send']; ?></button>
		</div>

		<input type="file" name="passport" class="hidden" id="select-passport-photo" >
		<input type="file" name="photo" class="hidden" id="select-user-photo" >
		<input type="reset" class="hidden" id="reset-verification-request">
	</form>
	<?php endif; ?>
</div>
<script src="<?php echo $wo['config']['theme_url'];?>/javascript/autosize.min.js"></script>
<script>
   jQuery(document).ready(function($) {
      $("#text").autogrow({vertical: true, horizontal: false});

      $("#verif-id").click(function(event) {
         $("#select-passport-photo").trigger('click');
      });

      $("#verif-photo").click(function(event) {
         $("#select-user-photo").trigger('click');
      });

      $("#select-passport-photo").change(function(event) {
         $("#verif-id").html("<img src='" + window.URL.createObjectURL(this.files[0]) + "' alt='Picture' class='responsive-img'>")
      });

      $("#select-user-photo").change(function(event) {
         $("#verif-photo").html("<img src='" + window.URL.createObjectURL(this.files[0]) + "' alt='Picture' class='responsive-img'>")
      });

      
      $(".setting-verification-form").ajaxForm({
         url: Wo_Ajax_Requests_File() + '?f=verificate-user',
         beforeSend: function() {
           $('.wo_settings_page').find('.add_wow_loader').addClass('btn-loading');
         },
         success: function(data) {
           scrollToTop();
           if (data['status'] == 200) {
             $("#verificate-user-alert").html('<div class="alert alert-success">'+ data['message'] +'</div>');
             window.location = data['url'];
           }
           else {
             $("#verificate-user-alert").html('<div class="alert alert-danger">' + data['message'] + '</div>');
           } 
           $('.wo_settings_page').find('.add_wow_loader').removeClass('btn-loading');
      }});
   });
</script>