<?php 
	require_once('Connections/conn_ama.php');

	if(!isset($_SESSION)){
        session_start();
    } 

 ?>

<!-- <div class="col-md-9 data-area"> -->
	<div class="data-area-wrap">
		<div class="form-wrapper">
			<form id="new-beneficiary" method="post">
			<fieldset>
						<legend>Add Beneficiary</legend> 
						                                          
						<div class="form-row">
							<div class="form-group col-4">
								<label for="fname">First Name</label>
								<input type="text" name="fname" class="form-control" id="fname" placeholder="First Name">
							</div>
							
							<div class="form-group col-4">
								<label for="mname">Middle Name</label>
								<input type="text" name="mname" class="form-control" id="mname" placeholder="Middle Name">
							</div>
							
							<div class="form-group col-4">
								<label for="lname">Last Name</label>
								<input type="text" name="lname" class="form-control" id="lname" placeholder="Last Name">
							</div>
						</div>

						<div class="form-row">
							<div class="form-group col-12">
								<label for="programme">Programme</label>
								<input type="text" name="programme" class="form-control" id="programme" placeholder="Programme">
							</div>
							<div class="form-group col-6">
								<label for="indexno">Student ID</label>
								<input type="text" name="indexno" class="form-control" id="indexno" placeholder="Student ID">
							</div>
						</div>
					
					<div class="form-row">
						<div class="form-group col-6">
							<label for="email">Email</label>
							<input type="text" name="email" class="form-control" id="email" placeholder="Email">
						</div>
					</div>								

					</fieldset>
				<hr> <input type="hidden" name="MM_insert" value="add-beneficiary" />
				<button type="submit" name="add_new_beneficiary" id="add-new-beneficiary" class="btn btn-default">Submit</button>  
			 
			  <div class="error_msg"></div>
			</form>
		</div><!-- End .form-wrapper-->
	</div><!-- End .data-area-wrap-->	
<!-- </div>End .data-area -->


<!-- TinyMCE -->
        
<script type="text/javascript" src="_/js/tinymce/tinymce.min.js"></script>
		<script type="text/javascript" src="_/js/tinymce/jquery.tinymce.min.js"></script>
		<script type="text/javascript">
              
						$('textarea.tinymce').tinymce({
									selector: 'textarea',
									height: 300,
									theme: 'modern',
									plugins: [
										'advlist autolink lists link image charmap print preview hr anchor pagebreak',
										'searchreplace wordcount visualblocks visualchars code fullscreen',
										'insertdatetime media nonbreaking save table contextmenu directionality',
										'emoticons template paste textcolor colorpicker textpattern imagetools codesample toc'
									],
									toolbar1: 'undo redo | insert | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image',
									toolbar2: 'print preview media | forecolor backcolor emoticons | codesample',
									image_advtab: true,
									templates: [
										{ indexno: 'Test template 1', content: 'Test 1' },
										{ indexno: 'Test template 2', content: 'Test 2' }
									],
									content_css: [
										'//fonts.googleapis.com/css?family=Lato:300,300i,400,400i',
										'//www.tinymce.com/css/codepen.min.css'
									]

						});

		</script>
<!-- /TinyMCE -->

<script>
	$(document).on('click','.delete-btn',function(e){
		e.preventDefault();
				
		//alert("form");
		$(this).parent('div').fadeOut();
				
	});

	$(".fileUpload").on('change', function () {
		//alert("askfljsd");
		//Get count of selected files
		var countFiles = $(this)[0].files.length;

		var imgPath = $(this)[0].value;
		var extn = imgPath.substring(imgPath.lastIndexOf('.') + 1).toLowerCase();
		var image_holder = $("#image-holder");
		image_holder.empty();

		if (extn == "gif" || extn == "png" || extn == "jpg" || extn == "jpeg") {
			if (typeof (FileReader) != "undefined") {

				//loop for each file selected for uploaded.
				for (var i = 0; i < countFiles; i++) {

					var reader = new FileReader();
					reader.onload = function (e) {
						$("<img />", {
							"src": e.target.result,
								"class": "thumb-image img-fluid"
						}).appendTo(image_holder);
					}

					image_holder.show();
					reader.readAsDataURL($(this)[0].files[i]);
				}

			} else {
				alert("This browser does not support FileReader.");
			}
		} else {
			alert("Pls select only images");
		}
	});	
</script> 
