KARELL

<?php session_start();

if ( isset($_POST['afzender']) )
{
	$_SESSION['afzender'] = $_POST['afzender'];
}else{
		}

?>

<html>
	<div class="header"> <h1>
		Chatbox
		</h1></div>
	<nav class="navbar navbar-inverse">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="home.php">Chatbox</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li class="active"><a href="jdopperen.informatica.bc-enschede.nl/d/Chatbox/home.php">Chatbox <span class="sr-only">(current)</span></a></li>
        <li><a href="http://jdopperen.informatica.bc-enschede.nl/home/index.php">Home</a></li>
				<li><a href="http://jdopperen.informatica.bc-enschede.nl/d/Chatbox/">Verander Naam</a></li>
        </li>
      </ul>
        </li>
      </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>
	<script type="text/javascript"
    src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<head>
	    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../../favicon.ico">

    <title>Chatbox</title>

    <!-- Bootstrap core CSS -->
    <link href="bootstrap.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="style.css" rel="stylesheet">

    <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
    <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
    <script src="../../assets/js/ie-emulation-modes-warning.js"></script>

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
	</head>

	<body>

	<?php

$servername = "localhost";
$username = "jdopperen";
$password = "ve4usWes";
$dbname = "jdopperen";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}
if (isset ($_POST['bericht'])) {
	$sql = "INSERT INTO `chatbox_berichten`
	(`id`, `afzender`, `chatbox_id`, `bericht`, `timestamp`)
	VALUES (NULL, '".$_SESSION['afzender']."', '', '".$_POST['bericht']."', CURRENT_TIMESTAMP);";
	if ($conn->query($sql) === TRUE) {
	} else {
		echo $conn->connect_error;
	}

}
echo "<div class='yolo'>";
echo "<div class='main'>";
$sql = "SELECT * FROM (
    SELECT * FROM chatbox_berichten ORDER BY id DESC LIMIT 20
) sub
ORDER BY id ASC";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
    echo "<table>";
    // output data of each row
    while($row = $result->fetch_assoc()) {
		echo "<tr><td class='tabel'>" . $row["afzender"]. "<td class='bericht'>" . $row["bericht"]. "  <td class='timestamp'>" . $row["timestamp"]. "</td></tr>";
    }
    echo "</table>";
} else {
    echo "0 results";
}


?>
	<form action="home.php" method="post" enctype="multipart/form-data">
    Select image to upload:
    <input type="file" name="fileToUpload" id="fileToUpload">
    <input type="submit" value="Upload Image" name="submit">
</form>

</body>
</html>
 <div id="file upload">
    <?php
$target_dir = "uploads/";
$target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]);
$uploadOk = 1;
$imageFileType = pathinfo($target_file,PATHINFO_EXTENSION);
// Check if image file is a actual image or fake image
if(isset($_POST["submit"])) {
    $check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
    if($check !== false) {
        echo "";
        $uploadOk = 1;
    } else {
        echo "File is not an image.";
        $uploadOk = 0;
    }
}
// Check if file already exists
if (file_exists($target_file)) {
    $uploadOk = 0;
}
// Check file size
if ($_FILES["fileToUpload"]["size"] > 500000) {
    echo "Sorry, your file is too large.";
    $uploadOk = 0;
}
// Allow certain file formats
if($imageFileType != "jpg" && $imageFileType != "png" && $imageFileType != "jpeg"
&& $imageFileType != "gif" ) {
    echo "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";
    $uploadOk = 0;
}
// Check if $uploadOk is set to 0 by an error
if ($uploadOk == 0) {
// if everything is ok, try to upload file
} else {
    if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
        echo "";
    } else {
        echo "Sorry, there was an error uploading your file.";
    }
}
$image = basename( $_FILES["fileToUpload"]["name"]);
	 $afzender = $_SESSION['afzender'];
if ($uploadOk == 1) {
    $sql = "INSERT INTO chatbox_berichten (afzender, bericht) VALUES ('$afzender', '<img src=http://jdopperen.informatica.bc-enschede.nl/d/Chatbox/uploads/".$image.">')";
  if (!mysqli_query($conn, $sql)) {
      die('ER is eemn Error: ' . mysqli_error());
  }

}
   $conn->close();
?>
		<div class="zender">
			<div class="zender2">
					<form class="form1" action="home.php" method="post">
		<?php echo $_SESSION['afzender']; ?> <input type="text" name="bericht" required><br>
						<button>
							Verzend
						</button>
				</div>

	</form>
		</div>
</div>

	</body>

</html>