<!DOCTYPE html>
<html>
<head>
	<title>Manage Users</title>
<link rel="stylesheet" type="text/css" href="css/userprofile.css">
<script>
  $(window).on("load resize ", function() {
    var scrollWidth = $('.tbl-content').width() - $('.tbl-content table').width();
    $('.tbl-header').css({'padding-right':scrollWidth});
}).resize();
</script>
<!-- <script src="js/jquery-3.3.1.js"
        integrity="sha1256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
        crossorigin="anonymous">
</script> -->
<script src="js/jquery-2.2.3.min.js"></script>
<script src="js/manage_users.js"></script>
</head>
<body>

<?php 
	require_once('header.php');
	require_once("connectDB.php");

	$query = $conn->query("SELECT * FROM users WHERE id = '$user_id'");
	$data = $query->fetch_assoc();

	if (isset($action) == isset($_GET['update'])) {
		if (isset($_POST['name']) && isset($_POST['number']) && isset($_POST['class']) && isset($_POST['gender'])) {
			$Name = $_POST['name'];
			$Number = $_POST['number'];
			$Class = $_POST['class'];
			$Gender = $_POST['gender'];

			$query = $conn->query("UPDATE users SET username = '$Name', studentnumber = '$Number', class = '$Class', gender = '$Gender' WHERE id = '$user_id'");

			$ekstensi_diperbolehkan	= array('png','jpg');
			$Photo = $_FILES['file']['name'];
			$x = explode('.', $Photo);
			$ekstensi = strtolower(end($x));
			$ukuran	= $_FILES['file']['size'];
			$file_tmp = $_FILES['file']['tmp_name'];	
 
			if(in_array($ekstensi, $ekstensi_diperbolehkan) === true){
				if($ukuran < 1044070){			
					move_uploaded_file($file_tmp, 'user_images/'.$Photo);
					$query = $conn->query("UPDATE users SET photo = '$Photo' WHERE id = '$user_id'");
					if($query){
						echo 'FILE BERHASIL DI UPLOAD';
					}else{
						echo 'GAGAL MENGUPLOAD GAMBAR';
					}
				}else{
					echo 'UKURAN FILE TERLALU BESAR';
				}
			}else{
				echo 'EKSTENSI FILE YANG DI UPLOAD TIDAK DI PERBOLEHKAN';
			}

			header('Location: userProfile.php');

		}
	}
	
?>

<main>
	<h1 class="slideInDown animated">Profile Info</h1>
	<div class="form-style-5 slideInDown animated">
		<form action="userProfile.php?action=update" method="POST" enctype="multipart/form-data">
			<fieldset>
				<input type="text" name="name" id="name" placeholder="User Name..." value="<?=$data['username']; ?>">
				<input type="text" name="number" id="number" placeholder="Student Number..."  value="<?=$data['studentnumber']; ?>">
				<input type="text" name="class" id="class" placeholder="User Class..."  value="<?=$data['class']; ?>">
			  	<label>
					Gender :
					<input type="radio" name="gender" class="gender" value="Female" <?php if($data['gender'] == 'Female') { echo 'checked="checked"'; } ?>>Female
					<input type="radio" name="gender" class="gender" value="Male" <?php if($data['gender'] == 'Male') { echo 'checked="checked"'; } ?>>Male
			  	</label >
			  	
			</fieldset>
			<fieldset>
				<label>
					Photo <span style="font-size:10px">(max 1 MB, .jpg/.png)</span>:
					<input type="file" name="file">
				</label>
			</fieldset>
			<button type="submit" name="user_pro_upd" class="user_pro_upd">Save</button>
		</form>
	</div>

	<div class="section">
	<!--User table-->
		<div class="tbl-header slideInRight animated">
		    <table cellpadding="0" cellspacing="0" border="0">
		      <thead>
		        <tr>
	        	  <th>Photo Profile</th>
		        </tr>
		      </thead>
		    </table>
		</div>
		<div class="tbl-content slideInRight animated">
			<br>
			<img src="user_images/<?=$data['photo']; ?>" height="300px">
		</div>
	</div>
	
</main>
</body>
</html>