<div class="settings-header">
    <h3><i class="fa fa-check"></i> {{LANG get_verified}}</h3>
</div>
<?php if ($pt->user->verified == 1): ?>
	<div class="user-setting-panel">
		<h4 class="panel-text-center">{{LANG u_are_verified}}</h4>
	</div>
<?php elseif(pt_vrequest_exists()): ?>
	<div class="user-setting-panel">
		<h4 class="panel-text-center">
			{{LANG verif_request_received}}
		</h4>
	</div>
<?php else: ?>
	<form class="form-horizontal user-setting-panel verifiacation-request-form" id="verifiacation-request-form" method="POST">
	    <div class="setting-delete-alert"></div>
	    <fieldset>
	    	<div class="verifiacation-request-alert">
	    		
	    	</div>
	    	<div class="fluid">
		        <div class="upload-files">
	        		<div class="col-md-5 no-padding-both">
	        			<div class="image-renderer" id="image-renderer">
	        				<div>
	        					<span>
		        					<i class="fa fa-id-card" aria-hidden="true"></i>
		        				</span>
	        				</div>
	        			</div>
	        			<div class="clear"></div>
	        		</div>
	        		<div class="col-md-7">
	        			<h4>{{LANG upload_id}}</h4>
	        			<p>{{LANG select_id}}</p>
		        		<div>
		        			<button class="btn btn-main btn-lg" type="button" onclick="$('#identity').trigger('click');">
			        			<i class="material-icons">file_upload</i>&nbsp; {{LANG choose_file}}
			        		</button>
		        		</div>
	        		</div>
		        </div>
	        </div>
	       	<br>
	        <div class="form-group">
				<div class="col-md-6">
					<input id="first_name" name="first_name" type="text" placeholder="{{LANG first_name}}" class="form-control input-md">
				</div>
				<div class="col-md-6">
					<input id="last_name" name="last_name" type="text" placeholder="{{LANG last_name}}" class="form-control input-md">
				</div>
			</div>
			<div class="form-group">
				<div class="col-md-12">
					<textarea name="message" rows="10" class="form-control" placeholder="{{LANG message}}..."></textarea>
				</div>
			</div>
			<div class="form-group">
	        <div class="col-md-8">
	                <button id="submit" name="submit" class="btn btn-main">
	                	<i class="fa fa-share-square-o progress-icon" data-icon="share-square-o"></i> {{LANG submit_request}}
	                </button>
	            </div>
	        </div>
	        
	        <input type="hidden" name="hash_id" value="<?php echo PT_CreateSession()?>">
	        <input type="hidden" name="user_id" value="{{USER id}}">
	        <input type="file" name="identity" id="identity" class="hidden" accept="image/*">
	        <!-- Button (Double) -->
	        
	        <div class="clear"></div>
	    </fieldset>
	</form>
<?php endif; ?>

<script>
	
	jQuery(document).ready(function($) {
		                                       
		$('#identity').change(function(event) {
			let file_size = $(this).prop('files')[0].size;
		    if (file_size > "{{CONFIG max_upload}}") {
		        swal({
		            title: '{{LANG error}}',
		            text:  "{{LANG file_is_too_big}} <?php echo pt_size_format($pt->config->max_upload); ?>",
		            type: 'error',
		            confirmButtonColor: '#3085d6',
		            cancelButtonColor: '#d33',
		            confirmButtonText: 'OK',
		            buttonsStyling: true,
		            confirmButtonClass: 'btn btn-success',
		        }).then(function(){
		            swal.close();
		            $(this).val('');
		         },
		         function() {
		            swal.close();
		            $(this).val('');
		         });
		         return false;
		    }
		    else{
		    	$("#image-renderer").html("<img src='" + window.URL.createObjectURL(this.files[0]) + "' alt='Picture'>");
		    }	
		});

		$('#verifiacation-request-form').ajaxForm({
		    url: '{{LINK aj/verification/request}}?hash=' + $('.main_session').val(),
	        dataType:'json',
		    beforeSend: function() {
		    	/* pass */
		    },
		    success: function(data) {   
		    	scrollToTop();  
	            if (data.status == 200) {
	            	$('.verifiacation-request-alert').html('<div class="alert alert-success bg-success"><i class="fa fa-check"></i> '+data.message+'</div>');
	            	$('#verifiacation-request-form').resetForm();

	            	PT_Delay(function(){
	            		window.location.href = "{{LINK home}}";
	            	},1500);
	            }
	            else{
	               $('.verifiacation-request-alert').html('<div class="alert alert-danger bg-danger"> <i class="fa fa-info-circle"></i> '+data.message+'</div>');  
	            }
		    }
		});
	});

</script>

