2017-01-23 13:25:08 +01:00
52 changed files with 2206 additions and 925 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -8,7 +8,7 @@
 # Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839


-
+.idea/*
 # User-specific stuff:
 .idea/workspace.xml
 .idea/tasks.xml
--- a/website/mysql_config.xml
+++ b/website/mysql_config.xml
@@ -1,7 +0,0 @@
-<?xml version='1.0'?>
-<MySQL_INIT>
-    <mysql_host>localhost</mysql_host>
-    <mysql_database>myhyvesbookplus</mysql_database>
-    <mysql_username>mhbp</mysql_username>
-    <mysql_password>qdtboXhCHJyL2szC</mysql_password>
-</MySQL_INIT>
--- a/website/public/.htaccess
+++ b/website/public/.htaccess
@@ -0,0 +1,12 @@
+Options +FollowSymLinks
+RewriteEngine On
+
+ErrorDocument 404 /error404.jpg
+
+RewriteCond %{SCRIPT_FILENAME} !-d
+RewriteCond %{SCRIPT_FILENAME} !-f
+
+# Resolve .php file for extensionless php urls
+RewriteRule ^([^/.]+)$ $1.php [L]
+
+RewriteRule ^profile/([A-z0-9]+)$ profile.php?username=$1 [NC]
--- a/website/public/API/loadMessages.php
+++ b/website/public/API/loadMessages.php
@@ -0,0 +1,13 @@
+<?php
+
+session_start();
+
+require_once("../../queries/connect.php");
+require_once("../../queries/private_message.php");
+require_once("../../queries/checkInput.php");
+
+if (isset($_POST["lastID"]) && $_POST["lastID"] != "") {
+    echo getNewChatMessages(test_input($_POST["lastID"]), test_input($_POST["destination"]));
+} else {
+    echo getOldChatMessages(test_input($_POST["destination"]));
+}
--- a/website/public/API/loadNotifications.php
+++ b/website/public/API/loadNotifications.php
@@ -0,0 +1,8 @@
+<?php
+
+session_start();
+
+require_once ("../../queries/connect.php");
+require_once ("../../queries/friendship.php");
+
+echo selectAllFriendRequests();
--- a/website/public/API/sendMessage.php
+++ b/website/public/API/sendMessage.php
@@ -0,0 +1,17 @@
+<?php
+
+session_start();
+require_once("../../queries/connect.php");
+require_once("../../queries/private_message.php");
+require_once("../../queries/checkInput.php");
+
+if (!empty(test_input($_POST["destination"])) &&
+    !empty(test_input($_POST["content"]))) {
+    if (sendMessage(test_input($_POST["destination"]), test_input($_POST["content"]))) {
+        echo 1;
+    } else {
+        echo 0;
+    }
+} else {
+    echo 0;
+}
--- a/website/public/chat.php
+++ b/website/public/chat.php
@@ -5,6 +5,7 @@
    <style>
        @import url("styles/chat.css");
    </style>
+    <script src="js/chat.js"></script>
 </head>
 <body>
 <?php
--- a/website/public/img/error404.jpg
+++ b/website/public/img/error404.jpg
--- a/website/public/js/admin.js
+++ b/website/public/js/admin.js
@@ -0,0 +1,44 @@
+window.onload = function() {
+    changeFilter();
+};
+
+function checkAll(allbox) {
+    var checkboxes = document.getElementsByClassName('checkbox-list');
+
+    for (var i = 0; i < checkboxes.length; i++) {
+        if (checkboxes[i].type == 'checkbox') {
+            checkboxes[i].checked = allbox.checked;
+        }
+    }
+}
+
+function checkCheckAll(allbox) {
+    var checkboxes = document.getElementsByClassName('checkbox-list');
+    var checked = true;
+
+    for (var i = 0; i < checkboxes.length; i++) {
+        if (checkboxes[i].type == 'checkbox') {
+            if (checkboxes[i].checked == false) {
+                checked = false;
+                break;
+            }
+        }
+    }
+    allbox.checked = checked;
+}
+
+function changeFilter() {
+    if (document.getElementById('group').checked) {
+        document.getElementById('admin-filter').style.display = 'none';
+        document.getElementById('admin-groupfilter').style.display = 'inline-block';
+
+        document.getElementById('admin-batchactions').style.display = 'none';
+        document.getElementById('admin-groupbatchactions').style.display = 'inline-block';
+    } else {
+        document.getElementById('admin-filter').style.display = 'inline-block';
+        document.getElementById('admin-groupfilter').style.display = 'none';
+
+        document.getElementById('admin-batchactions').style.display = 'inline-block';
+        document.getElementById('admin-groupbatchactions').style.display = 'none';
+    }
+}
--- a/website/public/js/chat.js
+++ b/website/public/js/chat.js
@@ -0,0 +1,62 @@
+$(document).ready(function() {
+    loadMessages();
+    sayEmpty();
+    $(".chat-field").hide();
+});
+
+function loadMessages() {
+    $.post(
+        "API/loadMessages.php",
+        $("#lastIDForm").serialize()
+    ).done(function(data) {
+        if (data && data != "[]") {
+            messages = JSON.parse(data);
+            addMessages(messages);
+            $("#lastID").val(messages[messages.length - 1].messageID);
+            $("#chat-history").scrollTop($("#chat-history")[0].scrollHeight);
+        }
+    });
+
+    setTimeout(loadMessages, 1000);
+}
+
+
+function sendMessage() {
+    $.post(
+        "API/sendMessage.php",
+        $("#sendMessageForm").serialize()
+    );
+
+    $("#newContent").val("");
+}
+
+function addMessages(messages) {
+    for(i in messages) {
+        if (messages[i].destination == $(".destinationID").val()) {
+            type = "chat-message-self";
+        } else {
+            type = "chat-message-other";
+        }
+
+        $("#chat-history").append('\
+            <div class="chat-message"> \
+                <div class="' + type + '">\
+                ' + messages[i].content + '\
+                </div> \
+            </div>\
+        ');
+    }
+}
+
+function switchUser(userID) {
+    $(".chat-field").show();
+    $(".destinationID").val(userID);
+    $("#chat-history").html("");
+    $("#lastID").val("");
+    $(".chat-left .friend-item").removeClass("active-friend-chat");
+    $(".chat-left #friend-item-" + userID).addClass("active-friend-chat");
+}
+
+function sayEmpty() {
+    $("#chat-history").html("Begin nu met chatten!");
+}
--- a/website/public/js/header.js
+++ b/website/public/js/header.js
@@ -1,7 +1,33 @@
 $(document).ready(function() {
+    // Hide notification center.
    $("#profile-menu-popup").hide();
+
+    // $("#own-profile-picture").click(function() {
+    //     $("#profile-menu-popup").toggle();
+    //     $("#profile-hello-popup").toggle();
+    // });
+
    $("#own-profile-picture").click(function() {
-        $("#profile-menu-popup").toggle();
-        $("#profile-hello-popup").toggle();
+        if($("#notification-center").css('right') == "-256px") {
+            $(".content").animate({
+                marginRight: "256px"
+            }, 500);
+            $(".chat-right").animate({
+                width: "100%"
+            }, 500);
+            $("#notification-center").animate({
+                right: "0px"
+            }, 500);
+        } else {
+            $(".chat-right").animate({
+                width: "100%"
+            }, 500);
+            $(".content").animate({
+                marginRight: "0px"
+            }, 500);
+            $("#notification-center").animate({
+                right: "-256px"
+            }, 500);
+        }
    });
 });
--- a/website/public/js/menu.js
+++ b/website/public/js/menu.js
@@ -6,7 +6,7 @@ $(document).ready(function() {
    $("#more-friends-click").click(function() {
        // Show only friends
        $("#groups-menu-section").slideUp();
-        $("#friends-menu-section a").show();
+        $("#friends-menu-section li").show();

        // Change buttons
        $("#more-friends-click").hide();
@@ -17,7 +17,7 @@ $(document).ready(function() {
    $("#more-groups-click").click(function() {
        // Show only groups
        $("#friends-menu-section").slideUp();
-        $("#groups-menu-section a").show();
+        $("#groups-menu-section li").show();

        // Change buttons
        $("#more-groups-click").hide();
--- a/website/public/js/notifications.js
+++ b/website/public/js/notifications.js
@@ -0,0 +1,34 @@
+function showNotifications(notifications, id) {
+    $("#friendrequestslist").html("");
+    for (i in notifications) {
+        $("#friendrequestslist").append(" \
+            <li class='friend-item $extraItem'> \
+                <form action='profile.php' method='get'> \
+                    <button type='submit' \
+                            name='username' \
+                            value='"+ notifications[i].username +"'> \
+                        <div class='friend'> \
+                            <img alt='PF' class='profile-picture' src='"+ notifications[i].profilepicture +"'/> \
+                            "+ notifications[i].username +" \
+                        </div> \
+                    </button> \
+                </form> \
+            </li> \
+        ");
+    }
+}
+
+function loadNotifications() {
+    $.post(
+        "API/loadNotifications.php"
+    ).done(function(data) {
+        if (data && data != "[]") {
+            showNotifications(JSON.parse(data), "friendrequestslist");
+        }
+    });
+
+    setTimeout(loadNotifications, 10000);
+}
+
+loadNotifications();
+
--- a/website/public/js/registerAndLogin.js
+++ b/website/public/js/registerAndLogin.js
@@ -0,0 +1,8 @@
+function checkLoggedIn() {
+    if (confirm("You are already logged in!\nDo you want to logout?\nPress ok to logout.") == true) {
+        window.location.href = "logout.php";
+    } else {
+        window.location.href = "profile.php";
+    }
+    document.getElementById("demo").innerHTML = x;
+}
--- a/website/public/login.php
+++ b/website/public/login.php
@@ -2,13 +2,20 @@
 <html>
 <?php
    include("../views/login_head.php");
-    include_once("../queries/connect.php");
+    require_once("../queries/connect.php");
    include_once("../queries/login.php");
+    include_once("../queries/checkInput.php");
 ?>
 <body>
 <?php
    session_start();

+    if(isset($_SESSION["userID"])){
+      echo "<script>
+                window.onload=checkLoggedIn();
+            </script>";
+    }
+
    // Define variables and set to empty values
    $uname = $psw ="";
    $loginErr ="";
@@ -21,15 +28,15 @@

        }
        else {
-            $uname=strtolower($_POST["uname"]);
-            $psw=$_POST["psw"];
-            $hash=hashPassword()["password"];
-            $userid=hashPassword()["userID"];
+            $uname = strtolower(test_input($_POST["uname"]));
+            $psw = test_input($_POST["psw"]);
+            $hash = getUser()["password"];
+            $userid = getUser()["userID"];

            // If there's an account, go to the profile page
-            if(password_verify($psw.$uname, $hash)) {
+            if(password_verify($psw, $hash)) {
               $_SESSION["userID"] = $userid;
-               header("location: /profile.php");
+               header("location: profile.php");

            } else {
               $loginErr = "Inloggegevens zijn niet correct";
--- a/website/public/logout.php
+++ b/website/public/logout.php
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+<?php
+    include("../views/login_head.php");
+    require_once("../queries/connect.php");
+    include_once("../queries/login.php");
+?>
+<body>
+<?php
+    session_start();
+    unset($_SESSION["userID"]);
+    header("Location: login.php");
+?>
+</body>
+</html>
--- a/website/public/profile.php
+++ b/website/public/profile.php
@@ -2,12 +2,28 @@
 <html>
 <head>
    <?php include("../views/head.php"); ?>
+    <script src="/js/masonry.js"></script>
    <style>
        @import url("styles/profile.css");
    </style>
 </head>
 <body>
 <?php
+include("../queries/user.php");
+include("../queries/friendship.php");
+include("../queries/nicetime.php");
+
+if(empty($_GET["username"])) {
+    $userID = $_SESSION["userID"];
+} else {
+    $userID = getUserID($_GET["username"]);
+}
+
+$user = selectUser($userID);
+$profile_friends = selectAllFriends($userID);
+$profile_groups = selectAllUserGroups($userID);
+$posts = selectAllUserPosts($userID);
+
 /*
 * This view adds the main layout over the screen.
 * Header, menu, footer.
--- a/website/public/register.php
+++ b/website/public/register.php
@@ -2,162 +2,42 @@
 <html>
 <?php
    include("../views/login_head.php");
-    include_once("../queries/connect.php");
+    require_once("../queries/connect.php");
    include_once("../queries/register.php");
-
+    include_once("../queries/checkInput.php");
 ?>
 <body>
 <?php
    session_start();
-
+    if(isset($_SESSION["userID"])){
+        header("location: profile.php");
+    }
    // define variables and set to empty values
    $name = $surname = $bday = $username = $password = $confirmpassword = $location = $housenumber = $email = "";
    $genericErr = $nameErr = $surnameErr = $bdayErr = $usernameErr = $passwordErr = $confirmpasswordErr = $locationErr = $housenumberErr = $emailErr = "";
    $correct = true;

-    // Saves information of filling in the form
-    if (isset($_POST["name"])) {
-        $name = $_POST["name"];
-    }
-
-    if (isset($_POST["surname"])) {
-        $surname = $_POST["surname"];
-    }
-
-    if (isset($_POST["bday"])) {
-        $bday = $_POST["bday"];
-    }
-
-    if (isset($_POST["username"])) {
-        $username = $_POST["username"];
-    }
-
-    if (isset($_POST["password"])) {
-        $password = $_POST["password"];
-    }
-
-    if (isset($_POST["location"])) {
-        $location = $_POST["location"];
-    }
-
-    if (isset($_POST["housenumber"])) {
-        $housenumber = $_POST["housenumber"];
-    }
-
-    if (isset($_POST["email"])) {
-        $email = $_POST["email"];
-    }
-
    // Trying to register an account
    if ($_SERVER["REQUEST_METHOD"] == "POST") {
-        if (empty($_POST["name"])) {
-            $nameErr = "Naam is verplicht!";
-            $correct = false;
+        checkInputChoice("name", "lettersAndSpace");
+        checkInputChoice("surname", "lettersAndSpace");

-        } else {
-            if (!preg_match("/^[a-zA-Z ]*$/",$name)) {
-                $nameErr = "Alleen letters en spaties zijn toegestaan!";
-                $correct = false;
-
-            }
-        }
-
-        if (empty($_POST["surname"])) {
-            $surnameErr = "Achternaam is verplicht!";
-            $correct = false;
-
-        } else {
-            if (!preg_match("/^[a-zA-Z ]*$/",$surname)) {
-                $surnameErr = "Alleen letters en spaties zijn toegestaan!";
-                $correct = false;
-
-            }
-        }
        if (empty($_POST["bday"])) {
            $bdayErr = "Geboortedatum is verplicht!";
            $correct = false;

-        }
-
-        if (empty($_POST["username"])) {
-            $usernameErr = "Gebruikersnaam is verplicht!";
-            $correct = false;
-
        } else {
-            if (strlen($username) < 6) {
-                $usernameErr = "Gebruikersnaam moet minstens 6 karakters bevatten";
-                $correct = false;
-
-            } else if (getExistingUsername() == 1){
-                $usernameErr = "Gebruikersnaam bestaat al";
-                $correct = false; 
-
-            }
+          $bday = test_input($_POST["bday"]);
        }

-        if (empty($_POST["password"])) {
-            $passwordErr = "Wachtwoord is verplicht!";
-            $correct = false;
-
-        } else {
-            if (strlen($password) < 8) {
-                $passwordErr = "Wachtwoord moet minstens 8 karakters bevatten";
-                $correct = false;
-
+        checkInputChoice("username", "username");
+        checkInputChoice("password", "longerEight");
+        checkInputChoice("confirmpassword", "");
+        matchPassword();
+        checkInputChoice("location", "lettersAndSpace");
+        checkInputChoice("email", "email");
+        registerCheck();
    }
-        }
-
-        if (empty($_POST["confirmpassword"])) {
-            $confirmpasswordErr = "Herhaal wachtwoord!";
-            $correct = false;
-
-        }
-
-        if ($_POST["password"] != $_POST["confirmpassword"]) {
-            $confirmpasswordErr = "Wachtwoorden matchen niet";
-            $correct = false;
-
-        }
-
-        if (empty($_POST["location"])) {
-            $locationErr = "Straatnaam is verplicht!";
-            $correct = false;
-
-        } else {
-            if (!preg_match("/^[a-zA-Z ]*$/",$location)) {
-                $locationErr = "Alleen letters en spaties zijn toegestaan!";
-                $correct = false;
-
-            }
-        }
-
-        if (empty($_POST["email"])) {
-            $emailErr = "Email is verplicht!";
-            $correct = false;
-
-        } else {
-            if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
-                $emailErr = "Geldige email invullen!";
-                $correct = false;
-
-            } else if (getExistingEmail() == 1){
-                $emailErr = "Email bestaat al";
-                $correct = false;
-
-            }
-        }
-
-        // Checks if everything is filled in correctly
-        if ($correct == false){
-            $genericErr = "Bepaalde velden zijn verkeerd of niet ingevuld!";
-
-        } else {
-            registerAccount();
-            header("location: login.php");
-
-        }
-    }
-
 /* This view adds register view */
 include("../views/register-view.php");
 ?>
--- a/website/public/search.php
+++ b/website/public/search.php
@@ -1,7 +1,11 @@
 <!DOCTYPE html>
 <html>
 <head>
-    <?php include("../views/head.php"); ?>
+    <?php
+    include_once("../queries/user.php");
+    include_once("../queries/group_page.php");
+    include("../views/head.php");
+    ?>
    <style>
        @import url("styles/search.css");
    </style>
--- a/website/public/settings.php
+++ b/website/public/settings.php
@@ -14,6 +14,7 @@
 <?php

 include("../views/main.php");
+$notImplemented = new settingsMessage("angry", "Deze functie werkt nog niet :(");

 if ($_SERVER["REQUEST_METHOD"] == "POST") {
    switch ($_POST["form"]) {
@@ -21,19 +22,14 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") {
            $result = updateSettings();
            break;
        case "password":
-            $result = updatePassword();
+            $result = changePassword();
            break;
        case "email":
-            $result = array (
-                "type" => "settings-message-angry",
-                "message" => "Deze functie werkt nog niet :("
-            );
+            $result = changeEmail();
            break;
        case "picture":
-            $result = array (
-                "type" => "settings-message-angry",
-                "message" => "Deze functie werkt nog niet :("
-            );
+            updateProfilePicture();
+            $result = new settingsMessage("happy", "Deze melding doet nog niks nuttigs.");
            break;
    }
 }
--- a/website/public/styles/adminpanel.css
+++ b/website/public/styles/adminpanel.css
@@ -6,22 +6,26 @@
 .admin-title {
    margin: 10px;
    padding-bottom: 5px;
-    border-bottom: 4px solid #845663;
+    border-bottom: 4px solid #FBC02D;
 }

 .admin-panel input[type="radio"], input[type="checkbox"] {
    height: auto;
 }

-.admin-actions {
+.admin-batchactions, .admin-groupbatchactions {
    display: inline-block;
    padding: 8px;
    vertical-align: top;
    border-radius: 10px;
-    border: 4px solid #845663;
+    border: 4px solid #FBC02D;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
 }

+.admin-searchform {
+    display: inline-block;
+}
+
 .admin-searchbar {
    display: inline-block;
    margin: 10px;
@@ -32,17 +36,38 @@
    margin-bottom: 10px;
 }

-.admin-filter {
+.admin-filter, .admin-filtertype, .admin-groupfilter {
    display: inline-block;
    margin: 10px;
    vertical-align: top;
-    margin-right: 100px;
+    margin-right: 50px;
+    margin-left: 50px;
+}
+
+.admin-filter, .admin-groupfilter {
+    width: 120px;
 }

 .admin-users {
    margin: 10px;
 }

+.admin-userheading {
+    width: auto;
+    float: left;
+}
+
+.admin-pageui {
+    text-align: right;
+    float: right;
+    width: auto;
+    margin-bottom: 20px;
+}
+
+.usertitle {
+    width: 150px;
+}
+
 .usertable {
    width: 100%;
 }
--- a/website/public/styles/chat.css
+++ b/website/public/styles/chat.css
@@ -83,9 +83,14 @@
 .chat-field input[type="submit"] {
    width: auto;
    float: right;
-    background-color: #845663;
+    background-color: #FBC02D;
    color: white;
    padding: 5px 10px;
    border-radius: 0 10px 10px 0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
 }
+
+.active-friend-chat {
+    background: aquamarine;
+    color: #333;
+}
--- a/website/public/styles/header.css
+++ b/website/public/styles/header.css
@@ -8,21 +8,23 @@ header {
    width: 100%;

    color: white;
-    background-color: rgba(132,86,99, 0.98);
+    background-color: #FBC02D;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
 }

+#header-logo {
+    padding-left: 42px;
+}

 #header-logo, #header-logo img {
    height: 80px;

    vertical-align: middle;
    line-height: 80px;
-    padding-left: 5px;
 }

 #header-search {
-    padding-left: 48px;
+    padding-left: 42px;
 }


@@ -33,32 +35,12 @@ header {
 header div {
    display: inline-block;
 }
-
-#open-chat {
-    font-size: 32px;
-    line-height: 80px;
-    margin-right: 50px;
-}
-
-.profile-menu {
-    font-size: 21px;
-}
-
 .profile-menu img {
    padding: 8px;
    height: 64px;
    width: 64px;
 }

-#own-profile-picture, #profile-menu-popup span {
+#own-profile-picture {
    cursor: pointer;
 }
-
-#profile-menu-popup {
-    padding: 5px;
-
-    background: white;
-    color: #666;
-
-    border-radius: 3px;
-}
--- a/website/public/styles/index.css
+++ b/website/public/styles/index.css
@@ -1,23 +1,7 @@
-::selection {
-    background: #845663;
-    color: white;
-}
-
-::-moz-selection {
-    background: #845663;
-    color: white;
-}
-
-a, a:link, a:visited, a:hover, a:active {
-    color: inherit;
-    text-decoration: none;
-}
-
 a.button {
-    background-color: #845663;
-    border: 2px solid black;
-    border-radius: 12px;
-    color: white;
+    background-color: #C8CABD;
+    border-radius: 10px;
+    color: black;
    cursor: pointer;
    height: 50%;
    margin: 8px 0;
@@ -27,64 +11,19 @@ a.button {
    font-size: 16px;
 }

-a[data-title]:hover:after, img[data-title]:hover:after, span[data-title]:hover:after,
-div[data-title]:hover:after{
-    content: attr(data-title);
-    padding: 4px 4px;
-    color: #FFFFFF;
-    position: absolute;
-    left: 0;
-    top: 100%;
-    z-index: 20;
-    white-space: nowrap;
-    -moz-border-radius: 5px;
-    -webkit-border-radius: 5px;
-    border-radius: 5px;
-    -moz-box-shadow: 0px 0px 4px #222;
-    -webkit-box-shadow: 0px 0px 4px #222;
-    box-shadow: 0px 0px 4px #222;
-    background-color: #333;
-    font-size: 15px;
-    line-height: normal;
-    font-family: Arial, sans-serif;
-}
-
-/* Add Zoom Animation */
-.animate {
-    animation: animatezoom 0.6s
-    -webkit-animation: animatezoom 0.6s;
-}
-
 /* Body */
 body {
    height: 900px;
+    background-color: #C8CABD;
+    /*background-image: url(http://play.pokemonshowdown.com/fx/client-bg-shaymin.jpg);
+    background-size: cover;
+    background-attachment: fixed;*/

-    background-image: url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTEnqKdVtLbxjKuNsCSCxFRhTOpp3Gm0gsU8bMgA_MeUYyzrUFy);
-    background-size: contain;
-    background-repeat: repeat-x;
-    background-attachment: fixed;
-
-    /*background-color: #B78996;*/
+    /*background-color: #EEE;*/
    color: #333;
-
    font-family: Arial, sans-serif;
 }

-/* stijl voor alle buttons */
-button {
-    background-color: #845663;
-    border: 2px solid black;
-    border-radius: 12px;
-    color: white;
-    cursor: pointer;
-    height: 50%;
-    margin: 8px 0;
-    padding: 14px 20px;
-    width: 25%;
-    font-family: Arial;
-    font-size: 16px;
-}
-
 /* The Close Button */
 .close {
  /* Position it in the top right corner outside of the modal */
@@ -106,20 +45,18 @@ button {
 /* inlogform */
 form {
    /*background-color: #a87a87;*/
-    border: 5px solid #325da3;
-    background-color: #a87a87;
    border-radius: 12px;
-    height: 57%;
-    margin: 8px auto;
-    width: 45%;
-    overflow: auto;
+    height: 80%;
+    margin: auto;
+    width: 70%;
+    overflow-y:auto;
 }

 /* inlog titel */
 h1 {
-    padding: 16px;
+    padding: 8px;
    text-align: center;
-    font-size: 2.2em;
+    font-size: 1.5em;
 }

 /* registreer titel*/
@@ -129,37 +66,67 @@ h2 {
    font-size: 2.0em;
 }

+
 input[type=text], input[type=password], input[type=email], input[type="date"] {
-    border-radius: 12px;
-    border: 5px solid #ccc;
    box-sizing: border-box;
+    border-color: #C8CABD;
    display: inline-block;
-    height: 50%;
-    padding: 12px 20px;
-    margin: 8px 0;
-    width: 50%;
+    height: 60%;
+    padding: 8px 20px;
+    margin: 4px 0;
+    width: 70%;
+}
+/*
+input[type=text], input[type=password], input[type=email], input[type="date"] {
+    border: 0px;
+    border-bottom: 4px solid lightgray;
+    border-radius: 0px;
+}*/
+
+button[type=submit] {
+    background-color: #C8CABD;
+    color: black  ;
+    cursor: pointer;
    font-family: Arial;
    font-size: 16px;
+    width: 50%;
 }

-input[type=submit] {
-    background-color: #845663;
-    border: 2px solid black;
-    border-radius: 12px;
-    color: white;
-    cursor: pointer;
-    height: 50%;
-    margin: 8px 0;
-    padding: 14px 20px;
-    width: 50%;
+.error {
    font-family: Arial;
-    font-size: 16px;
+    font-size: 15px;
+    color: red;
 }

 label {
    display: block;
 }

+.left-arrow {
+    display: inline-block;
+    position: relative;
+    background-color: #C8CABD;
+    height: 30px;
+    width: 90px;
+    padding: 3px 3px 3px 0px;
+    text-align: center;
+    border-radius: 0px 10px 10px 0px;
+    font-size: 24px;
+
+}
+.left-arrow:after {
+    content: '';
+    display: block;
+    position: absolute;
+    right: 100%;
+    top: 0;
+    bottom: 0;
+    border-top: 15px solid transparent;
+    border-right: 20px solid #C8CABD;
+    border-bottom: 15px solid transparent;
+    border-left: 0px solid transparent;
+}
+
 /* padding voor registreer container */
 .login_containerregister {
    padding: 16px;
@@ -168,7 +135,7 @@ label {

 /* padding voor login_containers */
 .login_containerlogin {
-    padding: 16px;
+    padding:25px;
    text-align: center;
 }

@@ -179,52 +146,31 @@ label {
    color: red;
 }

-/* The Modal (background) */
-.modal {
-    background-color: rgb(0,0,0); /* Fallback color */
-    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
-    display: none; /* Hidden by default */
-    height: 100%;
-    left: 0;
-    margin: auto;
-    overflow: auto; /* Enable scroll if needed */
-    padding-top: 60px;
-    position: fixed; /* Stay in place */
-    top: 0;
-    width: 100%; /* Full width */
-    z-index: 1; /* Sit on top */
-}
-
-/* Modal Content/Box */
-.modal-content {
-    background-color: #B78996;
-    border: 5px solid #325da3;
-    margin: 5px auto; /* 15% from the top and centered */
-    overflow-y: auto;
-    width: 40%; /* Could be more or less, depending on screen size */
-    height: 60%;
-
-}
-
@keyframes animatezoom {
    from {transform: scale(0)}
    to {transform: scale(1)}
 }

-/* datepicker */
-select {
-    border-radius: 12px;
-    border: 5px solid #ccc;
-    box-sizing: border-box;
-    display: inline-block;
-    height: 50%;
-    padding: 12px 20px;
-    margin: 8px 0;
-    width: 18%;
-    font-family: Arial;
-    font-size: 16px;
+/* White boxes (squares) */
+.platform {
+    background-color: #FFFFFF;
+    /*background-image: url(http://www.planwallpaper.com/static/images/518071-background-hd_xO1TwRc.jpg);
+    background-size: cover;
+    background-repeat: repeat-x;
+    background-attachment: fixed;*/
+    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
+    height: 550px;
+    margin: 34px auto;
+    overflow-y: auto;
+    padding: 20px;
+    width: 50%;
 }

+/*.platform {
+  width: 40%;
+  margin: 34px auto;
+}*/
+
@-webkit-keyframes animatezoom {
    from {-webkit-transform: scale(0)}
    to {-webkit-transform: scale(1)}
--- a/website/public/styles/main.css
+++ b/website/public/styles/main.css
@@ -18,7 +18,7 @@ html {

 body {
    height: 100%;
-    background-color: #B78996;
+    background-color: #EEE;
    color: #333;
    font-family: Arial, sans-serif;
 }
@@ -37,11 +37,12 @@ h3 {
 }

 h4 {
-    font-size: 1.6em;
+    font-size: 1.2em;
 }

 h5 {
-    font-size: 1.4em;
+    font-size: 1.0em;
+    color: #666;
 }

 ul {
@@ -54,12 +55,12 @@ p {

 /* Selection colors */
 ::selection {
-    background: #845663;
+    background: #FBC02D;
    color: white;
 }

 ::-moz-selection {
-    background: #845663;
+    background: #FBC02D;
    color: white;
 }

@@ -75,7 +76,7 @@ p {
 .platform {
    padding: 20px;
    margin-bottom: 10px;
-    border-radius: 10px;
+    border-radius: 5px;
    background-color: #FFFFFF;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
 }
@@ -143,7 +144,7 @@ button, input, select {
    cursor: pointer;
    border: none;
    font-size: 16px;
-    border-radius: 7px;
+    transition-duration: 250ms;
 }

 /* All textinput and sections */
@@ -151,19 +152,53 @@ textarea, input, select {
    padding: 0 5px;
    background: white;
    color: #333333;
-    border: 1px solid #845663;
-    border-radius: 7px;
+    border-radius: 5px;
+    border-bottom: 1px solid #4CAF50;
    font-size: 16px;
+    outline: none;
+    transition-duration: 250ms;
+}
+
+textarea {
+    padding: 5px;
+    resize: none;
+}
+
+textarea:hover, input:hover, select:hover {
+    border-radius: 10px;
+}
+
+textarea:focus, input:focus, select:focus {
+    border-radius: 10px;
+    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
 }

 /* All buttons */
 button,
 input[type="submit"],
 input[type="reset"] {
-    background-color: #845663;
+    background-color: #FBC02D;
    color: white;
    padding: 0 10px;
    border: none;
+    border-radius: 5px;
+}
+
+button:focus,
+input[type="submit"]:focus,
+input[type="reset"]:focus {
+    outline: none;
+}
+
+button:active,
+input[type="submit"]:active,
+input[type="reset"]:active {
+    outline: none;
+    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24)
+}
+
+input[type="radio"] {
+    border-radius: 100%;
 }

 /* Tables */
@@ -190,19 +225,17 @@ img[data-title]:hover:after,
 span[data-title]:hover:after,
 div[data-title]:hover:after {
    content: attr(data-title);
-    padding: 4px 4px;
+    padding: 7px 7px;
    color: #FFFFFF;
    position: absolute;
    left: 0;
-    top: 100%;
-    z-index: 20;
+    top: 150%;
+    z-index: 200;
    white-space: nowrap;
-    -moz-border-radius: 5px;
-    -webkit-border-radius: 5px;
-    border-radius: 5px;
-    -moz-box-shadow: 0 0 4px #222;
-    -webkit-box-shadow: 0 0 4px #222;
-    box-shadow: 0 0 4px #222;
+    -moz-border-radius: 3px;
+    -webkit-border-radius: 3px;
+    border-radius: 3px;
+    box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
    background-color: #333;
    font-size: 15px;
    line-height: normal;
--- a/website/public/styles/menu.css
+++ b/website/public/styles/menu.css
@@ -1,12 +1,19 @@
 .menu {
    position: fixed;
    z-index: 50;
+    overflow-y: auto;

    left: 0;
    top: 80px;
    height: calc(100% - 80px);
    width: 256px;

+    background-color: #EEE;
+    /*box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);*/
+}
+
+.menu section {
+    margin: 0 5px 10px 5px;
    background-color: white;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
 }
@@ -25,3 +32,39 @@
    font-size: 14px;
    cursor: pointer;
 }
+
+.friend-item, .group-item {
+    cursor: pointer;
+    transition-duration: 250ms;
+}
+
+.friend-item:hover, .group-item:hover {
+    background: #FBC02D;
+    color: white;
+}
+
+.menu button {
+    background: none;
+    color: inherit;
+    width: 100%;
+    height: 100%;
+    padding: 0;
+    text-align: left;
+}
+
+#notification-center {
+    left: auto;
+    width: 256px;
+    right: -256px;
+}
+
+#quick-links {
+    text-align: center;
+    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
+}
+
+#quick-links i {
+    color: #4CAF50;
+    font-size: 42px;
+    padding: 7px;
+}
--- a/website/public/styles/profile.css
+++ b/website/public/styles/profile.css
@@ -10,9 +10,12 @@
    margin: 0 20px 20px 0;
 }

-.profile-box .profile-username {
+.profile-box h1.profile-username {
    padding-top: 50px;
 }
+.profile-box h5.profile-username {
+    padding: 0 0 10px 0;
+}

 div.posts {
    padding-top: 20px;
@@ -25,6 +28,15 @@ div.posts div.post {
    margin: 20px 0 0 0;
    padding: 10px;
    width: calc(100% - 40px);
+    cursor: pointer;
+    transition-duration: 250ms;
+}
+
+div.posts div.post:hover {
+    /*margin: 15px 0 0 -5px;*/
+    /*padding: 15px;*/
+    /*z-index: 20;*/
+    box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
 }

 div.posts div.post img {
@@ -37,23 +49,18 @@ div.posts .post p.subscript {
    font-size: 8pt;
 }

-/*.posts {*/
-    /*z-index: -1;*/
-    /*margin-right: 0;*/
-    /*width: calc(100% + 15px);*/
-/*}*/
+div.posts .post form input, div.posts .post form textarea {
+    width: calc(100% - 15px);
+}

-/*.post-box {*/
-    /*display: inline-flex;*/
-    /*margin: 20px 15px 0 0;*/
-    /*padding: 25px;*/
-    /*background-color: #FFFFFF;*/
-/*}*/
+div.posts .post form input[type="submit"] {
+    width: 100%;
+}

-/*!* fullscreen *!*/
-/*.post-box {*/
-    /*width: calc(25% - 69px);*/
-/*}*/
+div.posts .post form textarea.newpost {
+    margin: 15px 0 15px 0;
+    height: 100px;
+}

@media only screen and (max-width: 1500px) {
    .post-box {
@@ -68,14 +75,6 @@ div.posts .post p.subscript {
    }
 }

-.post {
-    width: 100%;
-}
-
-.post img {
-    width: 100%;
-}
-
 .post .post-date {
    float: right;
    color: #aaaaaa;
@@ -86,11 +85,12 @@ div.posts .post p.subscript {
    float: right;
    padding: 10px;
    border-radius: 5px;
-    background-color: #845663;
+    background-color: #4CAF50;
    color: #FFFFFF;
    transition-duration: 250ms;
+    cursor: pointer;
 }

 .profile-button:hover {
-    background-color: #B78996;
+    box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
 }
--- a/website/public/styles/search.css
+++ b/website/public/styles/search.css
@@ -10,3 +10,8 @@
 #search-friends-output {
    margin-right: 10px;
 }
+
+.searchleft, .searchright {
+    display: inline-block;
+    vertical-align: top;
+}
--- a/website/public/template_sql.php
+++ b/website/public/template_sql.php
@@ -7,7 +7,7 @@
 include_once("../queries/connect.php");
 include_once("../queries/friendship.php");

-$friends = selectAllFriends($db, 666);
+$friends = selectAllFriends(666);
 while($friend = $friends->fetch(PDO::FETCH_ASSOC)) {
    echo $friend['username'].' '.$friend['onlinestatus'] . "<br />";
 }
--- a/website/queries/checkInput.php
+++ b/website/queries/checkInput.php
@@ -0,0 +1,105 @@
+<?php
+/**
+ * Function for checking inputfields
+ * @param variable $variable Give name of the inputfield.
+ * @param string $option Give the name of the option.
+ * @return sets correct to false and gives value to error message if it doesn't pass the checks.
+ */
+function checkInputChoice($variable, $option){
+    if (empty($_POST[$variable])) {
+        $GLOBALS[$variable . "Err"] = "Verplicht!";
+        $GLOBALS["correct"] = false;
+
+    } else {
+        $GLOBALS[$variable] = test_input($_POST[$variable]);
+        switch ($option) {
+          case "lettersAndSpace":
+            checkonly($variable);
+            break;
+
+          case "username";
+            username($variable);
+            break;
+
+          case "longerEight";
+            longerEight($variable);
+            break;
+
+          case "email";
+            validateEmail($variable);
+            break;
+
+          default:
+            break;
+        }
+    }
+}
+
+/* Checks for only letters and spaces. */
+function checkOnly($variable){
+    if (!preg_match("/^[a-zA-Z ]*$/",$GLOBALS[$variable])) {
+        $GLOBALS[$variable . "Err"] = "Alleen letters en spaties zijn toegestaan!";
+        $correct = false;
+    }
+}
+/* checks if username exist and if its longer than 6 characters. */
+function username($variable){
+    if (strlen($GLOBALS[$variable]) < 6) {
+        $GLOBALS[$variable . "Err"] = "Gebruikersnaam moet minstens 6 karakters bevatten";
+        $correct = false;
+    } else if (getExistingUsername() == 1) {
+        $GLOBALS[$variable . "Err"] = "Gebruikersnaam bestaat al";
+        $correct = false;
+    }
+}
+
+/* checks if an input is longer that 8 characters. */
+function longerEight($variable){
+    if (strlen($GLOBALS[$variable]) < 8) {
+        $GLOBALS[$variable . "Err"] = "Moet minstens 8 karakters bevatten";
+        $correct = false;
+    }
+}
+
+/* checks if an input is a valid email. */
+function validateEmail($variable){
+    if (!filter_var($GLOBALS[$variable], FILTER_VALIDATE_EMAIL)) {
+        $GLOBALS[$variable . "Err"] = "Geldige email invullen!";
+        $correct = false;
+
+    } else if (getExistingEmail() == 1){
+        $GLOBALS[$variable . "Err"] = "Email bestaat al";
+        $correct = false;
+
+    }
+}
+
+/* checks if two passwords matches. */
+function matchPassword(){
+    if ($_POST["password"] != $_POST["confirmpassword"]) {
+        $GLOBALS["confirmpasswordErr"] = "Wachtwoorden matchen niet";
+        $GLOBALS["correct"]  = false;
+
+    }
+}
+
+// Checks if everything is filled in correctly
+function registerCheck(){
+    if ($GLOBALS["correct"] == false){
+        $GLOBALS["genericErr"] = "Bepaalde velden zijn verkeerd of niet ingevuld!";
+
+    } else {
+        registerAccount();
+        header("location: login.php");
+
+    }
+}
+
+/* removes weird characters of an input. */
+function test_input($data) {
+    $data = trim($data);
+    $data = stripslashes($data);
+    $data = htmlspecialchars($data);
+    return $data;
+}
+?>
--- a/website/queries/friendship.php
+++ b/website/queries/friendship.php
@@ -1,25 +1,63 @@
 <?php

-function selectAllFriends($db, $userID) {
-    return $db->query("
+function selectAllFriends($userID) {
+    $stmt = $GLOBALS["db"]->prepare("
        SELECT
-        `user`.`username`,
-        `user`.`profilepicture`,
-        `user`.`onlinestatus`,
-        `user`.`role`
+            `userID`,
+            `username`,
+            IFNULL(
+                `profilepicture`,
+                '../img/notbad.jpg'
+            ) AS profilepicture,
+            `onlinestatus`,
+            `role`
        FROM
            `user`
        INNER JOIN
            `friendship`
+            
        WHERE
-        `friendship`.`user1ID` = $userID AND
+            (`friendship`.`user1ID` = :userID AND
            `friendship`.`user2ID` = `user`.`userID` OR 
-        `friendship`.`user2ID` = $userID AND
-        `friendship`.`user1ID` = `user`.`userID` AND
-        `user`.`role` != 3
+            `friendship`.`user2ID` = :userID AND
+            `friendship`.`user1ID` = `user`.`userID`) AND
+            `role` != 5 AND
+            `status` = 1
    ");
+
+    $stmt->bindParam(':userID', $userID, PDO::PARAM_INT);
+    $stmt->execute();
+
+    return $stmt;
 }

+function selectAllFriendRequests() {
+    $stmt = $GLOBALS["db"]->prepare("
+        SELECT
+            `userID`,
+            `username`,
+            IFNULL(
+                `profilepicture`,
+                '../img/notbad.jpg'
+            ) AS profilepicture,
+            `onlinestatus`,
+            `role`
+        FROM
+            `user`
+        INNER JOIN
+            `friendship`
            
+        WHERE
+            (`friendship`.`user1ID` = :userID AND
+            `friendship`.`user2ID` = `user`.`userID` OR 
+            `friendship`.`user2ID` = :userID AND
+            `friendship`.`user1ID` = `user`.`userID`) AND
+            `role` != 5 AND
+            `status` = 0
+    ");

-?>
+    $stmt->bindParam(':userID', $_SESSION["userID"], PDO::PARAM_INT);
+    $stmt->execute();
+
+    return json_encode($stmt->fetchAll());
+}
--- a/website/queries/group_member.php
+++ b/website/queries/group_member.php
@@ -1,7 +1,7 @@
 <?php

-function selectAllGroupsFromUser($db, $userID) {
-    return $db->query("
+function selectAllGroupsFromUser($userID) {
+    return $GLOBALS["db"]->query("
    SELECT
        `group_page`.`name`,
        `group_page`.`picture`
@@ -15,7 +15,3 @@ function selectAllGroupsFromUser($db, $userID) {
        `group_page`.`status` != 0
    ");
 }
-
-
-
-?>
--- a/website/queries/group_page.php
+++ b/website/queries/group_page.php
@@ -1,7 +1,7 @@
 <?php

-function selectGroupById($db, $groupID) {
-    return $db->query("
+function selectGroupById($groupID) {
+    $q = $GLOBALS["db"]->prepare("
    SELECT
        `group_page`.`name`,
        `group_page`.`picture`,
@@ -11,12 +11,16 @@ function selectGroupById($db, $groupID) {
    FROM
        `group_page`
    WHERE
-        `group_page`.`groupID` = $groupID
+        `group_page`.`groupID` = :groupID
    ");
+
+    $q->bindParam(':groupID', $groupID);
+    $q->execute();
+    return $q;
 }

-function select20GroupsFromN($db, $n) {
-    return $db->query("
+function select20GroupsFromN($n) {
+    $q = $GLOBALS["db"]->prepare("
    SELECT
        `group_page`.`groupID`,
        `group_page`.`name`,
@@ -29,12 +33,16 @@ function select20GroupsFromN($db, $n) {
    ORDER BY
        `group_page`.`name` ASC
    LIMIT
-        $n, 20
+        :n, 20
    ");
+
+    $q->bindParam(':n', $n);
+    $q->execute();
+    return $q;
 }

-function select20GroupsByStatusFromN($db, $n, $status) {
-    return $db->query("
+function select20GroupsByStatusFromN($n, $status) {
+    $q = $GLOBALS["db"]->prepare("
    SELECT
        `group_page`.`groupID`,
        `group_page`.`name`,
@@ -45,12 +53,145 @@ function select20GroupsByStatusFromN($db, $n, $status) {
    FROM
        `group_page`
    WHERE
-    	`group_page`.`status` = $status
+    	`group_page`.`status` = :status
    ORDER BY
        `group_page`.`name` ASC
    LIMIT
-        $n, 20
+        :n, 20
    ");
+
+    $q->bindParam(':status', $status);
+    $q->bindParam(':n', $n);
+    $q->execute();
+    return $q;
 }

+function search20GroupsFromNByStatus($n, $keyword, $status) {
+    $q = $GLOBALS["db"]->prepare("
+    SELECT
+        `groupID`,
+        `name`,
+        `status`,
+        `description`
+    FROM
+        `group_page`
+    WHERE
+        `name` LIKE :keyword AND
+        FIND_IN_SET (`status`, :statuses)
+    ORDER BY
+        `name`
+    LIMIT
+        :n, 20
+    ");
+
+    $keyword = "%$keyword%";
+    $q->bindParam(':keyword', $keyword);
+    $q->bindParam(':n', $n, PDO::PARAM_INT);
+    $statuses = implode(',', $status);
+    $q->bindParam(':statuses', $statuses);
+    $q->execute();
+    return $q;
+}
+
+function searchSomeGroupsByStatus($n, $m, $keyword, $status) {
+    $q = $GLOBALS['db']->prepare("
+    SELECT
+        `groupID`,
+        `name`,
+        `status`,
+        `description`
+    FROM
+        `group_page`
+    WHERE
+        `name` LIKE :keyword AND
+        FIND_IN_SET (`status`, :statuses)
+    ORDER BY
+        `name`
+    LIMIT
+        :n, :m
+    ");
+
+    $keyword = "%$keyword%";
+    $q->bindParam(':keyword', $keyword);
+    $q->bindParam(':n', $n, PDO::PARAM_INT);
+    $q->bindParam(':m', $m, PDO::PARAM_INT);
+    $statuses = implode(',', $status);
+    $q->bindParam(':statuses', $statuses);
+    $q->execute();
+    return $q;
+}
+
+function countSomeGroupsByStatus($keyword, $status) {
+    $q = $GLOBALS['db']->prepare("
+    SELECT
+        COUNT(*)
+    FROM
+        `group_page`
+    WHERE
+        `name` LIKE :keyword AND
+        FIND_IN_SET (`status`, :statuses)
+    ORDER BY
+        `name`
+    ");
+
+    $keyword = "%$keyword%";
+    $q->bindParam(':keyword', $keyword);
+    $statuses = implode(',', $status);
+    $q->bindParam(':statuses', $statuses);
+    $q->execute();
+    return $q;
+}
+
+function changeGroupStatusByID($id, $status) {
+    $q = $GLOBALS["db"]->query("
+    UPDATE
+        `group_page`
+    SET
+        `status` = $status
+    WHERE
+        `groupID` = $id
+    ");
+
+    return $q;
+}
+
+function changeMultipleGroupStatusByID($ids, $status) {
+    $q = $GLOBALS['db']->prepare("
+    UPDATE
+        `group_page`
+    SET
+        `status` = :status
+    WHERE
+        FIND_IN_SET (`groupID`, :ids)
+    ");
+
+    $ids = implode(',', $ids);
+    $q->bindParam(':ids', $ids);
+    $q->bindParam(':status', $status);
+    $q->execute();
+    return $q;
+}
+
+function searchSomeGroups($n, $m, $search) {
+    $stmt = $GLOBALS["db"]->prepare("
+    SELECT
+        `name`,
+        `picture`
+    FROM
+        `group_page`
+    WHERE
+        `name` LIKE :keyword
+    ORDER BY 
+        `name`
+    LIMIT 
+        :n, :m
+    ");
+
+    $search = "%$search%";
+    $stmt->bindParam(':keyword', $search);
+    $stmt->bindParam(':n', $n, PDO::PARAM_INT);
+    $stmt->bindParam(':m', $m, PDO::PARAM_INT);
+    $stmt->execute();
+    return $stmt;
+}
 ?>
--- a/website/queries/header.php
+++ b/website/queries/header.php
@@ -0,0 +1,21 @@
+<?php
+function getHeaderInfo() {
+    $stmt = $GLOBALS["db"]->prepare("
+    SELECT
+        `fname`,
+        `lname`,
+        IFNULL(
+            `profilepicture`,
+            'img/notbad.jpg'
+        ) AS profilepicture
+    FROM
+        `user`
+    WHERE
+        `userID` = :userID
+    ");
+
+    $stmt->bindParam(":userID", $_SESSION["userID"]);
+    $stmt->execute();
+
+    return $stmt->fetch();
+}
--- a/website/queries/login.php
+++ b/website/queries/login.php
@@ -1,6 +1,6 @@
 <?php

-function hashPassword() {
+function getUser() {
    $stmt = $GLOBALS["db"]->prepare("
    SELECT
      `password`,
@@ -15,5 +15,3 @@ function hashPassword() {
    $stmt->execute();
    return $stmt->fetch(PDO::FETCH_ASSOC);
 }
-
-?>
--- a/website/queries/nicetime.php
+++ b/website/queries/nicetime.php
@@ -0,0 +1,39 @@
+<?php
+function nicetime($date) {
+if(empty($date)) {
+return "No date provided";
+}
+
+$single_periods = array("seconde", "minuut", "uur", "dag", "week", "maand", "jaar", "decennium");
+$multiple_periods = array("seconden", "minuten", "uur", "dagen", "weken", "maanden", "jaar", "decennia");
+$lengths = array("60", "60", "24", "7", "4.35", "12", "10", "0");
+
+$now = time();
+$unix_date = strtotime($date);
+
+if(empty($unix_date)) {
+return "Bad date";
+}
+
+if($now > $unix_date) {
+$difference = $now - $unix_date;
+$tense = "geleden";
+} else {
+$difference = $unix_date - $now;
+$tense = "vanaf nu";
+}
+
+for($i = 0; $difference >= $lengths[$i] && $i < count($lengths) - 1; $i++) {
+$difference /= $lengths[$i];
+}
+
+$difference = round($difference);
+
+if($difference != 1) {
+$period = $multiple_periods[$i];
+} else {
+$period = $single_periods[$i];
+}
+
+return "$difference $period $tense";
+}
--- a/website/queries/private_message.php
+++ b/website/queries/private_message.php
@@ -0,0 +1,76 @@
+<?php
+
+function getOldChatMessages($user2ID) {
+    $user1ID = $_SESSION["userID"];
+
+    $stmt = $GLOBALS["db"]->prepare("
+    SELECT
+        *
+    FROM
+        `private_message`
+    WHERE
+        `origin` = :user1 AND 
+        `destination` = :user2 OR 
+        `origin` = :user2 AND
+        `destination` = :user1
+    ORDER BY
+        `messageID` ASC
+    ");
+
+    $stmt->bindParam(":user1", $user1ID);
+    $stmt->bindParam(":user2", $user2ID);
+
+    $stmt->execute();
+
+    return json_encode($stmt->fetchAll());
+}
+
+function sendMessage($destination, $content) {
+    $stmt = $GLOBALS["db"]->prepare("
+    INSERT INTO
+        `private_message`
+    (
+        `origin`,
+        `destination`,
+        `content`
+    )
+    VALUES
+    (
+        :origin,
+        :destination,
+        :content
+    )
+    ");
+
+    return $stmt->execute(array(
+        "origin" => $_SESSION["userID"],
+        "destination" => $destination,
+        "content" => $content
+    ));
+}
+
+function getNewChatMessages($lastID, $destination) {
+    $stmt = $GLOBALS["db"]->prepare("
+    SELECT
+        *
+    FROM
+        `private_message`
+    WHERE
+        (
+        `origin` = :user1 AND 
+        `destination` = :user2 OR 
+        `origin` = :user2 AND
+        `destination` = :user1) AND
+        `messageID` > :lastID
+    ORDER BY
+        `messageID` ASC
+    ");
+
+    $stmt->bindParam(':user1', $_SESSION["userID"]);
+    $stmt->bindParam(':user2', $destination);
+    $stmt->bindParam(':lastID', $lastID);
+
+    $stmt->execute();
+
+    return json_encode($stmt->fetchAll());
+}
--- a/website/queries/register.php
+++ b/website/queries/register.php
@@ -18,12 +18,18 @@ function getExistingUsername() {

 function getExistingEmail() {
    $stmt = $GLOBALS["db"]->prepare("
-    SELECT * FROM `user` WHERE `email` = :email
+    SELECT
+      `email`
+    FROM
+      `user`
+    WHERE
+      `email` LIKE :email
    ");

    $stmt->bindParam(":email", $_POST["email"]);
    $stmt->execute();
    return $stmt->rowCount();
+
 }

 function registerAccount() {
@@ -46,7 +52,7 @@ function registerAccount() {
      :email
    )");

-    $hash=password_hash($_POST["password"].(strtolower($_POST["username"])), PASSWORD_DEFAULT);
+    $hash=password_hash($_POST["password"], PASSWORD_DEFAULT);

    $stmt->bindParam(":fname", $_POST["name"]);
    $stmt->bindParam(":lname", $_POST["surname"]);
@@ -54,7 +60,7 @@ function registerAccount() {
    $stmt->bindParam(":username", $_POST["username"]);
    $stmt->bindParam(":password", $hash);
    $stmt->bindParam(":location", $_POST["location"]);
-    $stmt->bindParam(":email", $_POST["email"]);
+    $stmt->bindParam(":email", (strtolower($_POST["email"])));

    $stmt->execute();
    $stmt->rowCount();
--- a/website/queries/settings.php
+++ b/website/queries/settings.php
@@ -1,5 +1,42 @@
 <?php

+class settingsMessage {
+    private $class;
+    private $message;
+
+    /**
+     * settingsMessage constructor.
+     * @param string $type Happy or angry
+     * @param string $message The message to display
+     */
+    public function __construct($type, $message) {
+        $this->message = $message;
+        switch ($type) {
+            case "happy":
+                $this->class = "settings-message-happy";
+                break;
+            case "angry":
+                $this->class = "settings-message-angry";
+                break;
+            default:
+                $this->class = "settings-message";
+                break;
+        }
+    }
+
+    public function getClass() {
+        return $this->class;
+    }
+
+    public function getMessage() {
+        return $this->message;
+    }
+}
+
+/**
+ * Gets the settings form the database.
+ * @return mixed Setting as an array.
+ */
 function getSettings() {
    $stmt = $GLOBALS["db"]->prepare("
    SELECT
@@ -50,48 +87,35 @@ function updateSettings() {
      `userID` = :userID
    ");

-    $stmt->bindParam(":fname", $_POST["fname"]);
-    $stmt->bindParam(":lname", $_POST["lname"]);
-    $stmt->bindParam(":location", $_POST["location"]);
-    $stmt->bindParam(":bday", $_POST["bday"]);
-    $stmt->bindParam(":bio", $_POST["bio"]);
-    $stmt->bindParam(":userID", $_SESSION["userID"]);
-
+    $stmt->bindValue(":fname", test_input($_POST["fname"]));
+    $stmt->bindValue(":lname", test_input($_POST["lname"]));
+    $stmt->bindValue(":location", test_input($_POST["location"]));
+    $stmt->bindValue(":bday", test_input($_POST["bday"]));
+    $stmt->bindValue(":bio", test_input($_POST["bio"]));
+    $stmt->bindValue(":userID", $_SESSION["userID"]);
    $stmt->execute();

-    return array (
-        "type" => "settings-message-happy",
-        "message" => "Instellingen zijn opgeslagen."
-        );
+    return new settingsMessage("happy", "Instellingen zijn opgeslagen.");
 }

-function updatePassword() {
+function changePassword() {
    $user = getPasswordHash();
-    if (password_verify($_POST["password-old"].strtolower($user["username"]), $user["password"])) {
+    if (password_verify($_POST["password-old"], $user["password"])) {
        if ($_POST["password-new"] == $_POST["password-confirm"] && (strlen($_POST["password-new"]) >= 8)) {
-            if (changePassword($user)) {
-                return array ("type" => "settings-message-happy",
-                    "message" => "Wachtwoord gewijzigd.");
+            if (doChangePassword()) {
+                return new settingsMessage("happy", "Wachtwoord gewijzigd.");
            } else {
-                return array (
-                "type" => "settings-message-angry",
-                "message" => "Er is iets mis gegaan.");
+                return new settingsMessage("angry", "Er is iets mis gegaan.");
            }
        } else {
-            return array (
-                "type" => "settings-message-angry",
-                "message" => "Wachtwoorden komen niet oveeen."
-            );
+            return new settingsMessage("angry", "Wachtwoorden komen niet oveen.");
        }
    } else {
-        return array(
-            "type" => "settings-message-angry",
-            "message" => "Oud wachtwoord niet correct."
-        );
+        return new settingsMessage("angry", "Oud wachtwoord niet correct.");
    }
 }

-function changePassword($user) {
+function doChangePassword() {
    $stmt = $GLOBALS["db"]->prepare("
    UPDATE
      `user`
@@ -101,9 +125,90 @@ function changePassword($user) {
      `userID` = :userID
    ");

-    $hashed_password = password_hash($_POST["password-new"].strtolower($user["username"]), PASSWORD_DEFAULT);
+    $hashed_password = password_hash($_POST["password-new"], PASSWORD_DEFAULT);
    $stmt->bindParam(":new_password", $hashed_password);
    $stmt->bindParam(":userID", $_SESSION["userID"]);
    $stmt->execute();
    return $stmt->rowCount();
 }
+
+function changeEmail() {
+
+    if ($_POST["email"] == $_POST["email-confirm"]) {
+        $email = strtolower($_POST["email"]);
+        if (filter_var($email, FILTER_VALIDATE_EMAIL)) {
+            //check if email exists
+            if (emailIsAvailableInDatabase($email)) {
+                if (doChangeEmail($email)) {
+                    return new settingsMessage("happy", "Emailadres is veranderd.");
+                } else {
+                    return new settingsMessage("angry", "Er is iets mis gegaan.");
+                }
+            } else {
+                return new settingsMessage("angry", "Emailadres bestaat al.");
+            }
+        } else {
+            return new settingsMessage("angry", "Geef een geldig emailadres.");
+        }
+    } else {
+        return new settingsMessage("angry", "Emailadressen komen niet overeen.");
+    }
+}
+
+function emailIsAvailableInDatabase($email) {
+    $stmt = $GLOBALS["db"]->prepare("
+    SELECT
+        `email`
+    FROM
+        `user`
+    WHERE 
+      `email` = :email
+    ");
+
+    $stmt->bindParam(":email", $email);
+    $stmt->execute();
+    return !$stmt->rowCount();
+}
+
+function doChangeEmail($email) {
+    $stmt = $GLOBALS["db"]->prepare("
+    UPDATE
+        `user`
+    SET
+      `email` = :email
+    WHERE
+      `userID` = :userID
+    ");
+    $stmt->bindParam(":email", $email);
+    $stmt->bindParam(":userID", $_SESSION["userID"]);
+    $stmt->execute();
+    return $stmt->rowCount();
+}
+
+function updateProfilePicture() {
+    $profilePictureDir = "/var/www/html/public/";
+    $relativePath = "uploads/profilepictures/" . $_SESSION["userID"] . "_" . basename($_FILES["pp"]["name"]);
+//    removeOldProfilePicture();
+    move_uploaded_file($_FILES['pp']['tmp_name'], $profilePictureDir . $relativePath);
+    setProfilePictureToDatabase("../" . $relativePath);
+}
+
+//function removeOldProfilePicture() {
+//
+//    unlink("/var/www/html/public/uploads/profilepictures/" . $_SESSION["userID"] . "_*");
+//}
+
+function setProfilePictureToDatabase($url) {
+    $stmt = $GLOBALS["db"]->prepare("
+    UPDATE
+        `user`
+    SET
+        `profilepicture` = :profilePicture
+    WHERE
+        `userID` = :userID
+    ");
+
+    $stmt->bindParam(":profilePicture", $url);
+    $stmt->bindParam(":userID", $_SESSION["userID"]);
+    $stmt->execute();
+}
--- a/website/queries/user.php
+++ b/website/queries/user.php
@@ -0,0 +1,303 @@
+<?php
+
+require("connect.php");
+
+function getUserID($username) {
+    $stmt = $GLOBALS["db"]->prepare("
+        SELECT
+            `userID`
+        FROM
+            `user`
+        WHERE
+            LOWER(`username`) = LOWER(:username)
+    ");
+
+    $stmt->bindParam(':username', $username, PDO::PARAM_STR);
+    $stmt->execute();
+    return $stmt->fetch()["userID"];
+}
+
+function selectUser($userID) {
+    $stmt = $GLOBALS["db"]->prepare("
+        SELECT
+            `username`,
+            IFNULL(
+                `profilepicture`,
+                '../img/notbad.jpg'
+            ) AS profilepicture,
+            `bio`,
+            `role`,
+            `onlinestatus`,
+            `loggedin`,
+            `fname`,
+            `lname`
+        FROM
+            `user`
+        WHERE
+            `userID` = :userID
+    ");
+
+    $stmt->bindParam(':userID', $userID, PDO::PARAM_INT);
+    $stmt->execute();
+    return $stmt->fetch();
+}
+
+function selectAllUserGroups($userID) {
+    $stmt = $GLOBALS["db"]->prepare("
+        SELECT
+            `group_page`.`groupID`,
+            `name`,
+            `picture`,
+            `userID`
+        FROM
+            `group_page`
+        INNER JOIN
+            `group_member`
+        ON
+            `group_page`.`groupID` = `group_member`.`groupID`
+        WHERE
+            `userID` = :userID AND
+            `role` = 1
+    ");
+
+    $stmt->bindParam(':userID', $userID, PDO::PARAM_INT);
+    $stmt->execute();
+    return $stmt;
+}
+
+function selectAllUserPosts($userID) {
+    $stmt = $GLOBALS["db"]->prepare("
+        SELECT
+            `postID`,
+            `author`,
+            `title`,
+            `content`,
+            `creationdate`
+        FROM
+             `post`
+        WHERE
+            `author` = :userID AND
+            `groupID` IS NULL
+        ORDER BY
+            `creationdate` DESC
+    ");
+
+    $stmt->bindParam(':userID', $userID, PDO::PARAM_INT);
+    $stmt->execute();
+    return $stmt;
+}
+
+function select20UsersFromN($n) {
+    $q = $GLOBALS["db"]->prepare("
+    SELECT
+        `userID`,
+        `username`,
+        `role`,
+        `bancomment`
+    FROM
+        `user`
+    ORDER BY
+        `role`,
+        `username`
+    LIMIT
+        :n, 20
+    ");
+
+    $q->bindParam(':n', $n);
+    $q->execute();
+    return $q;
+}
+
+function search20UsersFromN($n, $keyword) {
+    $q = $GLOBALS["db"]->prepare("
+    SELECT
+        `userID`,
+        `username`,
+        `role`,
+        `bancomment`
+    FROM
+        `user`
+    WHERE
+        `username` LIKE :keyword
+    ORDER BY
+        `username`
+    LIMIT
+        :n, 20
+    ");
+
+    $keyword = "%$keyword%";
+    $q->bindParam(':keyword', $keyword);
+    $q->bindParam(':n', $n, PDO::PARAM_INT);
+    $q->execute();
+    return $q;
+}
+
+function search20UsersFromNByStatus($n, $keyword, $status) {
+    $q = $GLOBALS["db"]->prepare("
+    SELECT
+        `userID`,
+        `username`,
+        `role`,
+        `bancomment`
+    FROM
+        `user`
+    WHERE
+        `username` LIKE :keyword AND
+        FIND_IN_SET (`role`, :statuses)
+    ORDER BY
+        `role`,
+        `username`
+    LIMIT
+        :n, 20
+    ");
+
+    $keyword = "%$keyword%";
+    $q->bindParam(':keyword', $keyword);
+    $q->bindParam(':n', $n, PDO::PARAM_INT);
+    $statuses = implode(',', $status);
+    $q->bindParam(':statuses', $statuses);
+    $q->execute();
+    return $q;
+}
+
+function searchSomeUsersByStatus($n, $m, $keyword, $status) {
+    $q = $GLOBALS["db"]->prepare("
+    SELECT
+        `userID`,
+        `username`,
+        `role`,
+        `bancomment`
+    FROM
+        `user`
+    WHERE
+        `username` LIKE :keyword AND
+        FIND_IN_SET (`role`, :statuses)
+    ORDER BY
+        `role`,
+        `username`
+    LIMIT
+        :n, :m
+    ");
+
+    $keyword = "%$keyword%";
+    $q->bindParam(':keyword', $keyword);
+    $q->bindParam(':n', $n, PDO::PARAM_INT);
+    $q->bindParam(':m', $m, PDO::PARAM_INT);
+    $statuses = implode(',', $status);
+    $q->bindParam(':statuses', $statuses);
+    $q->execute();
+    return $q;
+}
+
+function countSomeUsersByStatus($keyword, $status) {
+    $q = $GLOBALS["db"]->prepare("
+    SELECT
+        COUNT(*)
+    FROM
+        `user`
+    WHERE
+        `username` LIKE :keyword AND
+        FIND_IN_SET (`role`, :statuses)
+    ORDER BY
+        `role`,
+        `username`
+    ");
+
+    $keyword = "%$keyword%";
+    $q->bindParam(':keyword', $keyword);
+    $statuses = implode(',', $status);
+    $q->bindParam(':statuses', $statuses);
+    $q->execute();
+    return $q;
+}
+
+
+function changeUserStatusByID($id, $status) {
+    $q = $GLOBALS["db"]->prepare("
+    UPDATE
+        `user`
+    SET
+        `role` = :status
+    WHERE
+        `userID` = :id
+    ");
+
+    $q->bindParam(':status', $status);
+    $q->bindParam(':id', $id);
+    $q->execute();
+    return $q;
+}
+
+function changeMultipleUserStatusByID($ids, $status) {
+    $q = $GLOBALS["db"]->prepare("
+    UPDATE
+        `user`
+    SET
+        `role` = :status
+    WHERE
+        FIND_IN_SET (`userID`, :ids)
+    ");
+
+    $ids = implode(',', $ids);
+    $q->bindParam(':ids', $ids);
+    $q->bindParam(':status', $status);
+    $q->execute();
+    return $q;
+}
+
+function selectRandomNotFriendUser($userID) {
+    $stmt = $GLOBALS["db"]->prepare("
+    SELECT
+        `user`.`username`
+    FROM
+        `user`
+    WHERE
+        `userID` NOT IN (SELECT
+                            `user1ID`
+                         FROM
+                            `friendship`
+                         WHERE `user1ID` = :userID) OR
+        `userID` NOT IN (SELECT
+                            `user2ID`
+                         FROM
+                            `friendship`
+                         WHERE `user2ID` = :userID)
+    ORDER BY
+        RAND()
+    LIMIT
+        1
+    ");
+
+    $stmt->bindParam(':userID', $userID, PDO::PARAM_INT);
+    $stmt->execute();
+    return $stmt->fetch();
+}
+
+function searchSomeUsers($n, $m, $search) {
+    $stmt = $GLOBALS["db"]->prepare("
+    SELECT
+        `username`,
+        `profilepicture`,
+        `fname`,
+        `lname`
+    FROM
+      `user`
+    WHERE
+        `username` LIKE :keyword OR 
+        `fname` LIKE :keyword OR 
+        `lname` LIKE :keyword
+    ORDER BY 
+        `fname`, 
+        `lname`, 
+        `username`
+    LIMIT 
+        :n, :m
+    ");
+
+    $search = "%$search%";
+    $stmt->bindParam(':keyword', $search);
+    $stmt->bindParam(':n', $n, PDO::PARAM_INT);
+    $stmt->bindParam(':m', $m, PDO::PARAM_INT);
+    $stmt->execute();
+    return $stmt;
+}
--- a/website/views/adminpanel.php
+++ b/website/views/adminpanel.php
@@ -3,95 +3,309 @@
 <head>
    <meta charset="utf-8">
    <title>Admin Panel</title>
-        <script type="text/javascript">
-        function checkAll(allbox) {
-            var checkboxes = document.getElementsByName('check1');
-
-            for (var i = 0; i < checkboxes.length; i++) {
-                if (checkboxes[i].type == 'checkbox') {
-                    checkboxes[i].checked = allbox.checked;
-                }
-            }
-        }
-        </script>
+    <script src="/js/admin.js" charset="utf-8"></script>
+    <?php
+        include_once("../queries/user.php");
+        include_once("../queries/group_page.php");
+    ?>
 </head>
 <body>
+
+<!-- function test_input taken from http://www.w3schools.com/php/php_form_validation.asp -->
+<?php
+$search = "";
+$currentpage = 1;
+$perpage = 20;
+$status = $groupstatus = array();
+$pagetype = "user";
+
+if (isset($_GET["search"])) {
+    $search = test_input($_GET["search"]);
+}
+
+if (isset($_GET["pagetype"])) {
+    $pagetype = test_input($_GET["pagetype"]);
+}
+
+if (isset($_GET["status"])) {
+    $status = $_GET["status"];
+}
+
+if (isset($_GET["groupstatus"])) {
+    $groupstatus = $_GET["groupstatus"];
+}
+
+
+if ($_SERVER["REQUEST_METHOD"] == "POST") {
+    if (isset($_POST["actions"]) && isset($_POST["userID"])) {
+        changeUserStatusByID($_POST["userID"], $_POST["actions"]);
+    }
+
+    if (isset($_POST["actions"]) && isset($_POST["groupID"])) {
+        changeGroupStatusByID($_POST["groupID"], $_POST["actions"]);
+    }
+
+    if (isset($_POST["batchactions"]) && isset($_POST["checkbox-user"])) {
+        changeMultipleUserStatusByID($_POST["checkbox-user"], $_POST["batchactions"]);
+    }
+
+    if (isset($_POST["groupbatchactions"]) && isset($_POST["checkbox-group"])) {
+        changeMultipleGroupStatusByID($_POST["checkbox-group"], $_POST["groupbatchactions"]);
+    }
+
+    if (isset($_POST["pageselect"])) {
+        $currentpage = $_POST["pageselect"];
+    }
+
+}
+
+$listn = ($currentpage-1) * $perpage;
+$listm = $currentpage * $perpage;
+
+?>
+
 <div class="content">
    <div class="platform admin-panel">
        <div class="admin-title">
            <h1>User Management Panel</h1>
        </div> <br>
-                <form action="admin.php" method="post">
        <div class="admin-options">
-                    <form action="admin.php" method="post">
+            <form class="admin-searchform"
+                  action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"
+                  method="get">
                <div class="admin-searchbar">
                    <h2>Search</h2>
-                            <input type="text" name="search" class="admin-searchinput"> <br>
+                    <input type="text"
+                           name="search"
+                           class="admin-searchinput"
+                           value="<?php echo $search;?>"> <br>
                    <input type="submit" value="Search">
                </div>
-                        <div class="admin-filter">
-                            <h2>Show users:</h2>
-                            <input type="checkbox" name="status" value="Active"> Active <br>
-                            <input type="checkbox" name="status" value="Muted"> Muted <br>
-                            <input type="checkbox" name="status" value="Banned"> Banned
+
+                <div class="admin-filter" id="admin-filter">
+                    <h2>Show:</h2>
+
+                    <input type="checkbox" name="status[]" id="normal" value="1"
+                           <?php if (in_array("1", $status)) echo "checked";?>>
+                    <label for="normal">Normal</label><br>
+                    <input type="checkbox" name="status[]" id="frozen" value="2"
+                           <?php if (in_array("2", $status)) echo "checked";?>>
+                    <label for="frozen">Frozen</label><br>
+                    <input type="checkbox" name="status[]" id="banned" value="3"
+                           <?php if (in_array("3", $status)) echo "checked";?>>
+                    <label for="banned">Banned</label><br>
+                    <input type="checkbox" name="status[]" id="admin" value="5"
+                           <?php if (in_array("5", $status)) echo "checked";?>>
+                    <label for="admin">Admin</label><br>
+                    <input type="checkbox" name="status[]" id="unvalidated" value="0"
+                           <?php if (in_array("0", $status)) echo "checked";?>>
+                    <label for="unvalidated">Unvalidated</label><br>
+                    <input type="checkbox" name="status[]" id="owner" value="42"
+                           <?php if (in_array("42", $status)) echo "checked";?>>
+                    <label for="owner">Owner</label>
+                </div>
+
+                <div class="admin-groupfilter" id="admin-groupfilter">
+                    <h2>Show:</h2>
+
+                    <input type="checkbox" name="groupstatus[]" id="hidden" value="0"
+                           <?php if (in_array("0", $groupstatus)) echo "checked";?>>
+                    <label for="hidden">Hidden</label><br>
+                    <input type="checkbox" name="groupstatus[]" id="public" value="1"
+                           <?php if (in_array("1", $groupstatus)) echo "checked";?>>
+                    <label for="public">Public</label><br>
+                    <input type="checkbox" name="groupstatus[]" id="membersonly" value="2"
+                           <?php if (in_array("2", $groupstatus)) echo "checked";?>>
+                    <label for="membersonly">Members-only</label><br>
+                </div>
+
+                <div class="admin-filtertype">
+                    <h2>Page Type:</h2>
+                    <input type="radio" name="pagetype" id="user" value="user"
+                           <?php if (isset($pagetype) && $pagetype=="user") echo "checked";?>
+                           onchange="changeFilter()">
+                    <label for="user">Users</label><br>
+                    <input type="radio" name="pagetype" id="group" value="group"
+                           <?php if (isset($pagetype) && $pagetype=="group") echo "checked";?>
+                           onchange="changeFilter()">
+                    <label for="group">Groups</label>
                </div>
            </form>
-                        <div class="admin-actions">
+
+                <div class="admin-batchactions" id="admin-batchactions">
                    <h2>Batch Actions: </h2>
-                            <input type="radio" name="actions" value="mute"> Mute <br>
-                            <input type="radio" name="actions" value="ban"> Ban <br>
-                            <input type="radio" name="actions" value="unban"> Unban <br> <br>
+                    <form class="admin-batchform"
+                          id="admin-batchform"
+                          action="<?php htmlspecialchars(basename($_SERVER['REQUEST_URI'])) ?>"
+                          method="post">
+                        <input type="radio" name="batchactions" id="freeze" value="2">
+                        <label for="freeze">Freeze</label><br>
+                        <input type="radio" name="batchactions" id="ban" value="3">
+                        <label for="ban">Ban</label><br>
+                        <input type="radio" name="batchactions" id="restore" value="1">
+                        <label for="restore">Restore</label><br><br>
                        <input type="submit" value="Confirm">
+                    </form>
+                </div>
+
+                <div class="admin-groupbatchactions" id="admin-groupbatchactions">
+                    <h2>Batch Actions: </h2>
+                    <form class="admin-groupbatchform"
+                          id="admin-groupbatchform"
+                          action="<?php htmlspecialchars(basename($_SERVER['REQUEST_URI'])) ?>"
+                          method="post">
+                        <input type="radio" name="groupbatchactions" id="hide" value="0">
+                        <label for="hide">Hide</label><br>
+                        <input type="radio" name="groupbatchactions" id="public" value="1">
+                        <label for="public">Public</label><br>
+                        <input type="radio" name="groupbatchactions" id="membersonly" value="2">
+                        <label for="membersonly">Member</label><br><br>
+                        <input type="submit" value="Confirm">
+                    </form>
                </div>
            </div>
            <br>
+
            <div class="admin-users">
+                <div class="admin-usertitle">
+                    <div class="admin-userheading">
                        <h2>Users:</h2>
+                    </div>
+                    <div class="admin-pageui">
+                        <?php
+                        if ($pagetype == "user") {
+                            $pages = countSomeUsersByStatus($search, $status);
+                        } else {
+                            $pages = countSomeGroupsByStatus($search, $groupstatus);
+                        }
+                        $countresults = $pages->fetchColumn();
+                        $mincount = min($listm, $countresults);
+                        $minlist = min($listn + 1, $countresults);
+                        ?>
+                        <p class="pagenumber">Current page:</p>
+                        <form class="admin-pageselector"
+                              action="<?php htmlspecialchars(basename($_SERVER['REQUEST_URI'])) ?>"
+                              method="post">
+                              <select class="admin-pageselect"
+                                      name="pageselect"
+                                      onchange="this.form.submit()"
+                                      value="">
+                                  <?php
+                                  for ($i=1; $i <= ceil($countresults / $perpage); $i++) {
+                                      if ($currentpage == $i) {
+                                          echo "<option value='$i' selected>$i</option>";
+                                      } else {
+                                          echo "<option value='$i'>$i</option>";
+                                      }
+                                  }
+                                  ?>
+                              </select>
+                        </form>
+                        <p class="entriesshown">
+                        <?php
+                        echo "Showing results $minlist to $mincount out of $countresults";
+                        ?>
+                    </div>
+                </div> <br>
+
                <table class="usertable">
                    <tr>
                        <th class="table-checkbox">
-                                    <input type="checkbox" name="checkall" onchange="checkAll(this)">
+                            <input type="checkbox" id="checkall" name="checkall" onchange="checkAll(this)">
                        </th>
                        <th class="table-username">User</th>
                        <th class="table-status">Status</th>
                        <th class="table-comment">Comment</th>
                        <th class="table-action">Action</th>
                    </tr>
+
+                    <!-- Table construction via php PDO. -->
+                    <?php
+                    $listn = ($currentpage-1) * $perpage;
+                    $listm = $currentpage * $perpage;
+
+                    if ($pagetype == 'user') {
+                        $q = searchSomeUsersByStatus($listn, $listm, $search, $status);
+
+                        while($user = $q->fetch(PDO::FETCH_ASSOC)) {
+                            $userID = $user['userID'];
+                            $username = $user['username'];
+                            $role = $user['role'];
+                            $bancomment = $user['bancomment'];
+                            $thispage = htmlspecialchars(basename($_SERVER['REQUEST_URI']));
+                            $function = "checkCheckAll(document.getElementById('checkall'))";
+
+                            echo("
                            <tr>
-                                <td><input type="checkbox" name="check1"></td>
-                                <td>John Smith</td>
-                                <td>Banned</td>
-                                <td>unregulated time travel</td>
+                            <td><input type='checkbox'
+                            name='checkbox-user[]'
+                            class='checkbox-list'
+                            value='$userID'
+                            form='admin-batchform'
+                            onchange=" . "$function" . ">
+                            </td>
+                            <td>$username</td>
+                            <td>$role</td>
+                            <td>$bancomment</td>
                            <td>
-                                    <form class="admin-useraction" action="index.html" method="post">
-                                        <select class="action" name="actions">
-                                            <option value="mute">Mute</option>
-                                            <option value="ban">Ban</option>
-                                            <option value="unban">Unban</option>
+                            <form class='admin-useraction'
+                            action='$thispage'
+                            method='post'>
+                            <select class='action' name='actions'>
+                            <option value='2'>Freeze</option>
+                            <option value='3'>Ban</option>
+                            <option value='1'>Restore</option>
                            </select>
-                                        <input type="submit" value="Confirm">
+                            <input type='hidden' name='userID' value='$userID'>
+                            <input type='submit' value='Confirm'>
                            </form>
                            </td>
                            </tr>
+                            ");
+                        }
+                    } else {
+                        $q = searchSomeGroupsByStatus($listn, $listm, $search, $groupstatus);
+
+                        while ($group = $q->fetch(PDO::FETCH_ASSOC)) {
+                            $groupID = $group['groupID'];
+                            $name = $group['name'];
+                            $role = $group['status'];
+                            $description = $group['description'];
+                            $thispage = htmlspecialchars(basename($_SERVER['REQUEST_URI']));
+                            $function = "checkCheckAll(document.getElementById('checkall'))";
+
+                            echo("
                            <tr>
-                                <td><input type="checkbox" name="check1"></td>
-                                <td>poey jokeaim</td>
-                                <td>Banned</td>
-                                <td>l33t h4xx</td>
+                            <td><input type='checkbox'
+                            name='checkbox-group[]'
+                            class='checkbox-list'
+                            value='$groupID'
+                            form='admin-groupbatchform'
+                            onchange=" . "$function" . ">
+                            </td>
+                            <td>$name</td>
+                            <td>$role</td>
+                            <td>$description</td>
                            <td>
-                                    <form class="admin-useraction" action="index.html" method="post">
-                                        <select class="action" name="actions">
-                                            <option value="mute">Mute</option>
-                                            <option value="ban">Ban</option>
-                                            <option value="unban">Unban</option>
+                            <form class='admin-groupaction'
+                            action='$thispage'
+                            method='post'>
+                            <select class='action' name='actions'>
+                            <option value='0'>Hide</option>
+                            <option value='1'>Public</option>
+                            <option value='2'>Members</option>
                            </select>
-                                        <input type="submit" value="Confirm">
+                            <input type='hidden' name='groupID' value='$groupID'>
+                            <input type='submit' value='Confirm'>
                            </form>
                            </td>
                            </tr>
+                            ");
+                        }
+                    }
+                    ?>
                </table>
            </div>
-                </form>
    </div>
 </div>
 </body>
--- a/website/views/chat-view.php
+++ b/website/views/chat-view.php
@@ -1,52 +1,74 @@
 <div class="content">
    <div class="chat">
-        <nav class="chat-left left platform chat-recent">
+        <nav class="nav-list chat-left left platform chat-recent">
            <h5>Chats</h5>
-            <a href="#">
-                <div class="chat-conversation">
-                    <img class="profile-picture" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTDnuRSeeyPve7KwDvJJ6OBzj3gyghwLcE2z9kZeYBOyZavh3mw">
-                    Rudolf Leslo
+            <ul>
+                <?php
+                include_once("../queries/friendship.php");
+
+                // Get all the friends of a user.
+                $friends = selectAllFriends($_SESSION["userID"]);
+                $i = 0;
+
+                // Print all the users.
+                while($friend = $friends->fetch(PDO::FETCH_ASSOC)) {
+                    $i ++;
+
+                    // Set default values of a friend.
+                    $username = $friend["username"];
+                    $userID = $friend["userID"];
+                    $pf = "img/notbad.jpg";
+
+                    // Change values if needed.
+                    if (!empty($friend["profilepicture"]))
+                        $pf = $friend["profilepicture"];
+
+                    // Echo the friend.
+                    echo "
+                        <li class='friend-item' id='friend-item-$userID' onclick='switchUser(\"$userID\")'>
+                            <div class='friend'>
+                                <img alt='PF' class='profile-picture' src='$pf'/>
+                                $username
                            </div>
-            </a>
+                        </li>
+                ";
+                }
+                ?>
+            </ul>
        </nav>
-        <div class="chat-right right">
-            <div class="chat-history platform">
-                <div class="chat-message">
-                    <div class="chat-message-self">Hi!</div>
-                </div>
-                <div class="chat-message">
-                    <div class="chat-message-other">Hi!</div>
-                </div>
-                <div class="chat-message">
-                    <div class="chat-message-self">How it's going?</div>
-                </div>
-                <div class="chat-message">
-                    <div class="chat-message-self">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
-                </div>
-                <div class="chat-message">
-                    <div class="chat-message-other">Hi!</div>
-                </div>
-                <div class="chat-message">
-                    <div class="chat-message-other">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
-                </div>
-                <div class="chat-message">
-                    <div class="chat-message-other">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
-                </div>
-                <div class="chat-message">
-                    <div class="chat-message-self">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
-                </div>
+        <div class="chat-right">
+            <div id="chat-history" class="chat-history platform">
            </div>
+            <form id="lastIDForm">
+                <input type="hidden"
+                       id="lastID"
+                       name="lastID"
+                       value=""
+                />
+                <input type="hidden"
+                       name="destination"
+                       class="destinationID"
+                       value=""
+                />
+            </form>
            <div class="chat-field">
-                <form  method="post">
+                <form id="sendMessageForm" action="javascript:sendMessage();">
+                    <input type="hidden"
+                           name="destination"
+                           class="destinationID"
+                           value=""
+                    />
                    <input type="submit"
                           value="Verstuur"
-                    >
+                    />
                    <span>
                        <input type="text"
-                               name="message"
-                               placeholder="Reageer..."
+                               name="content"
+                               id="newContent"
+                               placeholder="Schrijf een bericht..."
+                               autofocus
                               required
-                        >
+                        />
                    </span>
                </form>
            </div>
--- a/website/views/head.php
+++ b/website/views/head.php
@@ -4,7 +4,7 @@
 <script src="js/jquery.js"></script>
 <script src="js/header.js"></script>
 <script src="js/menu.js"></script>
-<script src="js/masonry.js"></script>
+<script src="js/notifications.js"></script>
 <style>
    /* Add your css files here. */
    @import url("styles/main.css");
@@ -15,6 +15,11 @@
 </style>
 <?php

-include_once("../queries/connect.php");
+require_once ("../queries/checkInput.php");
+require_once ("../queries/connect.php");

-?>
+session_start();
+
+if(!isset($_SESSION["userID"])){
+    header("location:login.php");
+}
--- a/website/views/header.php
+++ b/website/views/header.php
@@ -1,6 +1,11 @@
+<?php
+include_once ("../queries/header.php");
+
+$userinfo = getHeaderInfo();
+?>
 <header>
    <div id="header-logo">
-        <a href="profile.php"><img src="img/top-logo.png" alt="MyHyvesbook+" /></a>
+        <a href="profile.php"><img src="/img/top-logo.png" alt="MyHyvesbook+" /></a>
    </div>
    <div id="header-search">
        <form action="search.php" method="get">
@@ -14,18 +19,14 @@
        </form>
    </div>
    <div class="right profile-menu">
-        <div id="profile-menu-popup">
-            <a href="index.php"><span style="color: red;" class="fa fa-sign-out" data-title="Uitloggen"></span></a> |
-            <a href="settings.php"><span style="color: blue;" class="fa fa-cog" data-title="Instellingen"></span></a> |
-            <a href="profile.php"><span style="color: green;" class="fa fa-user" data-title="Profiel"></span></a>
-        </div>
        <div id="profile-hello-popup">
            <div id="hello-loop">
                Hallo
            </div>
-            Bart
+            <?=$userinfo["fname"]?>
        </div>
-        <img id="own-profile-picture" class="profile-picture" src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3N//AABEIAHkAeQMBIgACEQEDEQH/xAAcAAABBQEBAQAAAAAAAAAAAAACAQMEBQYHAAj/xAA/EAABAwMBBAcFBwIEBwAAAAABAAIDBAURIQYSMVETMkFhcYGRFCJyobEHFTNCUsHRQ5IkgrLhNDVEU1RidP/EABkBAAIDAQAAAAAAAAAAAAAAAAABAgQFA//EACYRAAMAAQMEAQQDAAAAAAAAAAABAgMRIUEEEhMxUSIygaEUYdH/2gAMAwEAAhEDEQA/AOn4RAJAjASA8Bqi3e1KAjAQAAaiDUTi1jS5xDWtGSScABck2++1QtkktmysjS4ZbLXYzryj5/F6c0N6DS1OrTTQ0zOkqZooWdrpHho9Sob75Z46f2h91oWw53ekNQzdzyzlfLNzqK6tkMtfUVFQ4nrTyF5PqVAG43rMJ88IT1G5PsVm69jXsIc1wy1wOQRzXiF8pWbau92R7DbLnVwsb/SMm9H/AGnRdz+y7bg7UUslLc5ovvSIbwa1m50rP1DXXB4oFobghCQniEJCBDJCFOkISEAN5Xt5KQkwgBWhOAJGhG0IAUBGAvBQNo7qyx2Ktub273s8Rc1p/M7gB6kIA499s+11dNdTs/RyOhoogDMGnBncef8A6jl2+i53aqKouVYIKGF0kp4uAzher5Kq83OarqX79RUSlzjz8Pp4Bdz2F2borLbIhGzNQ9gdI88SVwy5O1bey3gw9z39HN5diLm1g6aAgY6wKp7js2aPO80E8sld/udPPPCegDSR1Wk4HmqWHZTdPT1D2yz8RkaDwCqeXImXfBjaOKjZqq6EySNMenutxqom5WbP1tPWUsz4aiF4kje06tP+/Lku4ybPue8mbG73cSs7thshS1dG50Y3JwPcOTjxwpR1Nd31EMnST2/SbT7Ndsm7W2d7qoxMuVM7dnij0BH5Xgcjr6LWkr5l+zi8ybMbYwTTkime/wBmqfhcePkcH1X0zoRkHIPAhaBltaHigKIjCQoENlJhGUiYChONCFqcakAQWa+04xs2Cu7pGF+IhutA/MXDC04wol7ohcrVVUZxmaJzGkjgSND6oGj5f2OAqNraGNwBaXk48ASuy1l3r4ZHU9piidIzAe+cHcauQ7M2utoNtaGKaItMNd7O88NRkFdou9kmr48U9QYjnJIGqp5/aNLpdXLTM5FtLtVS1zRcn210B7IWu+R4Lcm4b1u9rHU3c5WZodlBS1U8wY55ldkuleXbgzn3Tx9VfPia2yyxN6oaQAFXptvYtTOxg5LntLX15dT3qGjpydGmAOz68VLNTc27orauOtaX7u+xu7u+XYrKfZqG5U0AlgidHG7fYeGvfz4DQo6PZptAyRz5Xua4l26ToO4d3ck62H2aN/6cUvTvZ77cGsOCJCWkdhAyvqykJdSQlxJcY25JGMnC+cKrZioum3hpGEtjqKvdL8ZAaQCT819JNG6AB2DC0oacrQxsqap6ikaICnDqgcpnIEhJhEQhTANqcCBqcakAYXjwXmpSgaMDtNaGUVTW3GNoL3zNqeGo3d3eA/t+ZV7bSySna7PFW9ZStqmbriAcEajI1WUsM7m04jkwHRvdGR3tcWn6KnljtbZpYciqUuUW1WS2CTo25cGnA5rKPv8AdhRyxx2qLOoYOk4jv00+auq6rnjdkUs87OUQHocqN7XVbmRa4W4zgPmHzwq73LsTqg9lameood6phEOujAcjy7lNu0jGU5x4YVRSTVstS1gt/QgdaRkoLAPDiiu8wDB0h97U4JUf6Fa0ZG2Ko+lvMtXJFloc58b3DhoG6LfjiqjZ6iZRW+Bg1fuAvceJKtmcVpYo7J0MjqMnfWoedEJRISuhXE7EmERQpgE1G1NtTjUgHAiCEJQgATxWJvbhQXd7I27rJCHjA7eJHrr5rcEZWW2loWV75o3jVpBaeRwuOb7S1033DMFb0p3dNRk68E3U25lS9kgIO7rw492Vk6mS5WuXOHVEYOoA1QO21mZ7ggcABjUbpB81ScmisnaausqG0LHYdu40wdMrPy1or7pT0ziSHyNZgHsJ1Koqy8Vt2kw1m40k5x/HNXFgoTTVcM0hJeJGnJ5ZCSSl7kabo6ZCN0cE+zgm+1OjgtQx2LlCcpSUmUxClAiJQoAUJxpTQRtSAeaUuVWV15obeP8AETt3/wBDdT6BVNXtZER/g4nSO5v91qhV6bJEklyaqPEhOOqBqqapjd7XMJeJcfTs+Sp7XtJUxXASVjs07/dcxowGjmFsXxQVkTZGkPaRlr28lG4qpOmLLM0ZOuoyfejAyOfaqWooqV3vS0sWeTmLbz26ZudwCQdyqamldnEkLwfhVSpa9mjFzXpmYpbbDJI3oomRtHENGFNqaZsMZLAQR3q5p6GTBLInnPYGqworK50jZaxuGjUMP5lzWOqexK8sQtyTSU8vscJkJMgYC7PgiY9rtOB5FNbRV4t9qlfnE0oLImjv7fJYCivNwoWlrJS9p/LL72FoN0vRkNrk6MV4LIW/a8gbtwh3tdJItNO8FaShr6Wuj36WZsnMDiPELomRJRSLyRMCFcLpS24N9ocd93VjY0lzvJZ24Xa6V+WU0LqaE6dYBx8Sru/0u9FBMxpLgd3TjqoMNtrJBllO/wDzDH1Ve8lKtEjR6fpcN4++6KCK0zuJMjmAnicklTIrPggul4cmq+jtFcRgta3xcFIjslUevJEPMn9lHuys6PF0c86/kpordTtxvtc/4yrWhq5KEBsOOj/R2KfFYh/VqCfhapcdoo28Wuf8Tj+yam29RVn6aVol+gYLzSyYEuY3eoUoVtKRpUx/3LzKGkbwp4/NuU62GFvVjYPBoXZKuSjbxa/SmMOrqVo1qGnubqoVTeo2AiCGR7v1OGArb3RwACQkIafyKbxp7zr+TGVdRLVS9JO455dgUR9PC/jEwnnurdSRxyDD2NcO8ZUR1BRvPvU8fkMLg8Ne9S/PXY9NHBiXUFN/2Gc+CbFFBE8SQB0Ug4OjeQVuPuyiGvszPPJTMlroX6dAB8JIS8V/JL+X0z9x+kUluu8rZWwVpDgdGyYwQe/+VeZKq67Z+IxOdTyuaQCQH6hRPvRn/kx/3LtDtLSir1CwNp4noUuxe185q4LXcnCRjxuQzHrBw4AntGO3iuiZxknQDtK4VY/+e0H/ANLfqtRtd+NU/F+6vZcSd7GXGRqdzf1F+tVNkTV8G8Dq1rt4jyChy7Y2aLO7LNIR2MiP74XNIuLfJTIusPEqS6eeSDz1wbaTbmmH4VBUu+Itb/KYdtxO78K3RjHHemzj0Cycv4zkQ/L4qfhhcEfLb5NFJtdd36sbTRjmGE/UqNJtJenf9bujh7sTB9Qq8fuo0nVHmmon4E7r5LB1+uxA3q+o4a6gfQIPve6k733jVAZ4dKobvyfEPqik/Cb8X8JuZXBFU3ySJL3d86XCoGuMF6Sm2iu8Lzivkec9V4DgfVR5uu/wH0Kqv6p+MfQoUy+AdNcmlm2qvUjSG1EcfwRNz88r1LtncKaTcq446lvYT7jvUafJUY6zPP8AdNu/4iXwCj44+BrJXvU2jdtKOpYYpqaaF7mkA5Dm8OYXIfaz+oepWgHXb4P/ANJVAkscz6OiyU1uf//Z" />
+        <img id="own-profile-picture" class="profile-picture" src="<?=$userinfo["profilepicture"]?>"/>
    </div>
-    <a href="chat.php"><div class="right fa fa-comments-o" id="open-chat" data-title="Prive chats"></div></a>
 </header>
+<?php include("notification-center.php"); ?>
+
--- a/website/views/login-view.php
+++ b/website/views/login-view.php
@@ -1,14 +1,14 @@
 <div>
    <img style="width:50%;margin-left:25%"
-         src="img/top-logo.png"
+         src="/img/top-logo.png"
         alt="MyHyvesbook+">
 </div>
-
+<div class="platform">
+    <h1>Welkom bij MyHyvesbook+</h1>
    <!-- Login content  -->
    <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"
          return= $correct
          method="post">
-    <h1>Welkom bij MyHyvesbook+</h1>

        <!-- Login name -->
        <div class="login_containerlogin">
@@ -27,7 +27,7 @@
            <input type="password"
                   placeholder="Voer uw wachtwoord in"
                   name="psw"
-               title="Moet minimaal 1 cijfer, hoofdletter en kleine letter bevatten en minstens 8 karakters lang zijn"
+                   title="Moet minstens 8 karakters lang zijn"
                   >
        </div>

@@ -36,14 +36,16 @@

        <!-- Button for logging in -->
        <div class="login_containerlogin">
-        <input type="submit"
+            <button type="submit"
                   value="Login"
                   name="submit"
-               id="frm1_submit" />
+                   id="frm1_submit">
+            Login
+            </button>
        </div>
    </form>
-
    <!-- Button for going to the register screen -->
    <div class="login_containerlogin">
-    <a href="https://myhyvesbookplus.nl/~joey/public/register.php" class="button">Registreer een account</a>
+      <a href="https://myhyvesbookplus.nl/register" class="button">Registreer een account</a>
+    </div>
 </div>
--- a/website/views/login_head.php
+++ b/website/views/login_head.php
@@ -1,8 +1,12 @@
 <head>
    <meta charset="utf-8">
    <title>MyHyvesbook+</title>
+    <link rel="stylesheet"
+          type="text/css"
+          href="/styles/main.css">
    <link rel="stylesheet"
          type="text/css"
          href="styles/index.css">
-    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
+    <script src="jqeury.js"></script>
+    <script src="registerAndLogin.js"></script>
 </head>
--- a/website/views/menu.php
+++ b/website/views/menu.php
@@ -1,5 +1,5 @@
 <nav class="menu">
-    <section id="friends-menu-section">
+    <section id="friends-menu-section platform">
        <h4>
            Vrienden
        </h4>
@@ -7,13 +7,11 @@
            <?php

            // Load file.
-            include_once("../queries/friendship.php");
-
-            if (empty($_SESSION["userID"]))
-                $_SESSION["userID"] = 2;
+            require_once("../queries/friendship.php");
+            require_once("../queries/user.php");

            // Get all the friends of a user.
-            $friends = selectAllFriends($db, $_SESSION["userID"]);
+            $friends = selectAllFriends($_SESSION["userID"]);
            $i = 0;

            // Print all the users.
@@ -29,28 +27,50 @@
                if (!empty($friend["profilepicture"]))
                    $pf = $friend["profilepicture"];

-                if ($i > 1)
+                if ($i > 5)
                    $extraItem = "extra-menu-items";

                // Echo the friend.
                echo "
-                    <a href='#' class='$extraItem'>
-                        <li class='friend-item'>
+                    <li class='friend-item $extraItem'>
+                        <form action='profile.php' method='get'>
+                            <button type='submit'
+                                    name='username'
+                                    value='$username'>
                                <div class='friend'>
                                    <img alt='PF' class='profile-picture' src='$pf'/>
                                    $username
                                </div>
+                            </button>
+                        </form>
                    </li>
-                    </a>
                ";
            }
-            if ($i > 1) {
-                $i -= 1;
+
+            $randomUser = selectRandomNotFriendUser($_SESSION["userID"])["username"];
+
+            echo "
+                <li class='friend-item'>
+                    <form action='/profile' method='get'>
+                        <button type='submit'
+                                name='username'
+                                value='$randomUser'>
+                            <div class='friend'>
+                                Klik hier voor een nieuw vriendje :)
+                            </div>
+                        </button>
+                    </form>
+                </li>
+            ";
+            if ($i > 5) {
+                $i -= 5;
                echo "
                    <li class='more-item' id='more-friends-click'>
                        En nog $i anderen...
-            </li>";
+                    </li>
+                ";
            }
+
            ?>
        </ul>
    </section>
@@ -65,7 +85,7 @@
            include_once("../queries/group_member.php");

            // Get all the friends of a user.
-            $groups = selectAllGroupsFromUser($db, $_SESSION["userID"]);
+            $groups = selectAllGroupsFromUser($_SESSION["userID"]);
            $i = 0;

            // Print all the users.
@@ -86,17 +106,28 @@

                // Echo the friend.
                echo "
-                    <a href='#' class='$extraItem'>
                    <li class='group-item'>
+                        <form action='group.php' method='get'>
+                            <button type='submit'
+                                    name='groupname'
+                                    value='$name'>
                                <div class='group'>
                                    <img alt='PF' class='group-picture' src='$picture'/>
                                    $name
                                </div>
+                            </button>
+                        </form>
                    </li>
-                    </a>
                ";
            }
-            if ($i > 3) {
+
+            if ($i == 0) {
+                echo "<li class='group-item'>
+                            <div class='group'>
+                                Je hoort nergens bij.
+                            </div>
+                        </li>";
+            } else if ($i > 3) {
                $i -= 3;
                echo "
                    <li class='more-item' id='more-groups-click'>
--- a/website/views/notification-center.php
+++ b/website/views/notification-center.php
@@ -0,0 +1,16 @@
+<nav class="menu" id="notification-center">
+    <section id="quick-links">
+        <a href="chat.php"><i class="fa fa-comments-o" data-title="Prive chats"></i></a>
+        <a href="settings.php"><i class="fa fa-cog" data-title="Instellingen"></i></a>
+        <a href="profile.php"><i class="fa fa-user" data-title="Profiel"></i></a>
+        <a href="logout.php"><i class="fa fa-sign-out" data-title="Uitloggen"></i></a>
+    </section>
+    <section id="notifocationCenter">
+        <h4>
+            Vriendchapsverzoeken
+        </h4>
+        <ul class="nav-list" id="friendrequestslist">
+
+        </ul>
+    </section>
+</nav>
--- a/website/views/profile.php
+++ b/website/views/profile.php
@@ -1,113 +1,69 @@
 <div class="content">
    <div class="profile-box platform">
-        <img class="left profile-picture" src="http://i.imgur.com/afjEUx2.jpg">
+        <img class="left profile-picture" src="<?php echo $user["profilepicture"] ?>">
        <div class="profile-button">
-            <p><img src="img/add-friend.png"> Als vriend toevoegen</p>
+            <p><img src="/img/add-friend.png"> Als vriend toevoegen</p>
        </div>
-        <h1 class="profile-username">[gebruikersnaam]</h1>
-        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec dictum turpis quam, eu ultrices sapien hendrerit tincidunt. Nunc aliquam neque turpis, id porta quam iaculis id. Sed suscipit, nisl a fermentum congue, nunc augue finibus lectus, id varius nunc purus nec dolor. Integer laoreet tellus sit amet sapien auctor congue. Mauris laoreet eu elit vel rhoncus. Nam et tortor arcu. Maecenas sit amet leo quis tellus varius gravida. Sed quis fermentum odio, sed dictum nulla. Donec aliquam rutrum orci cursus tempus. Quisque sit amet ipsum eget velit aliquam facilisis ultricies quis ligula. Nunc nisi lacus, luctus non bibendum quis, sagittis sit amet odio.</p>
+        <h1 class="profile-username"><?=$user["username"]?></h1>
+        <h5 class="profile-username"><?= $user["fname"]?> <?=$user["lname"]?></h5>
+        <p><?=$user["bio"]?></p>
    </div>

    <div class="item-box left platform">
        <h2>Vrienden</h2>
        <p>
-            <a href="#" data-title="[gebruikersnaam]"><img class="profile-picture" src="http://i.imgur.com/afjEUx2.jpg" alt="[gebruikersnaam]'s profielfoto"></a>
-            <a href="#" data-title="[gebruikersnaam]"><img class="profile-picture" src="http://i.imgur.com/afjEUx2.jpg" alt="[gebruikersnaam]'s profielfoto"></a>
-            <a href="#" data-title="[gebruikersnaam]"><img class="profile-picture" src="http://i.imgur.com/afjEUx2.jpg" alt="[gebruikersnaam]'s profielfoto"></a>
-            <a href="#" data-title="[gebruikersnaam]"><img class="profile-picture" src="http://i.imgur.com/afjEUx2.jpg" alt="[gebruikersnaam]'s profielfoto"></a>
-            <a href="#" data-title="[gebruikersnaam]"><img class="profile-picture" src="http://i.imgur.com/afjEUx2.jpg" alt="[gebruikersnaam]'s profielfoto"></a>
-            <a href="#vrienden">...en nog 25 anderen!</a>
+            <?php
+                while($friend = $profile_friends->fetch()) {
+                    echo "<a href='/profile/${friend["username"]}/' data-title='${friend["username"]}'><img class='profile-picture' src='${friend["profilepicture"]}' alt='${friend["username"]}'s profielfoto></a>";
+                }
+
+
+                if($profile_friends->rowCount() === 0) {
+                    echo "<p>Deze gebruiker heeft nog geen vrienden gemaakt.</p>";
+                }
+            ?>
        </p>
    </div>

    <div class="item-box right platform">
        <h2>Groepen</h2>
        <p>
-            <a href="#" data-title="[groepsnaam]"><img class="group-picture" src="http://i.imgur.com/ztYhYro.png" alt="[groepsnaam]'s logo"></a>
-            <a href="#" data-title="[groepsnaam]"><img class="group-picture" src="http://i.imgur.com/ztYhYro.png" alt="[groepsnaam]'s logo"></a>
-            <a href="#" data-title="[groepsnaam]"><img class="group-picture" src="http://i.imgur.com/ztYhYro.png" alt="[groepsnaam]'s logo"></a>
-            <a href="#" data-title="[groepsnaam]"><img class="group-picture" src="http://i.imgur.com/ztYhYro.png" alt="[groepsnaam]'s logo"></a>
-            <a href="#" data-title="[groepsnaam]"><img class="group-picture" src="http://i.imgur.com/ztYhYro.png" alt="[groepsnaam]'s logo"></a>
-            <a href="#groepen">...en nog 6 anderen!</a>
+            <?php
+                while($group = $profile_groups->fetch()) {
+                    echo "<a href='/group/${group["name"]}/' data-title='${group["name"]}'><img class='group-picture' src='${group["picture"]}' alt='${group["name"]}s logo'></a>";
+                }
+
+                if($profile_groups->rowCount() === 0) {
+                    echo "<p>Deze gebruiker is nog geen lid van een groep.</p>";
+                }
+            ?>
        </p>
    </div>

    <div class="posts">
+        <?php
+            if ($_SESSION["userID"] === $userID) {
+         ?>
                <div class="post platform">
-            <h2>Lorem</h2>
-            <p>Lorem ipsum dolor sit amet, consectetur.</p>
-            <p class="subscript">Enkele minuten geleden geplaatst</p>
-        </div>
-        <div class="post platform">
-            <h2>Image</h2>
-            <img src="http://i.imgur.com/ypIQKjE.jpg" alt="Olympic Mountains, Washington">
-            <p class="subscript">Gisteren geplaatst</p>
-        </div>
-        <div class="post platform">
-            <h2>Ipsum</h2>
-            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Rem nihil alias amet dolores fuga totam sequi a cupiditate ipsa voluptas id facilis nobis.</p>
-            <p class="subscript">Maandag geplaatst</p>
-        </div>
-        <div class="post platform">
-            <h2>Dolor</h2>
-            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
-            <p class="subscript">4 Januari geplaatst</p>
-        </div>
-        <div class="post platform">
-            <h2>Sit</h2>
-            <p>Lorem ipsum dolor sit.</p>
-            <p class="subscript">4 Januari geplaatst</p>
-        </div>
-        <div class="post platform">
-            <h2>Image</h2>
-            <img src="https://i.redditmedia.com/EBWWiEojgkRrdn89R7qF7tBZjJszJaIqgkWUH23s11A.jpg?w=576&s=ba4fe1f02485cb2327305924ef869a66" alt="Nunobiki Falls, Kobe Japan">
-            <p class="subscript">4 Januari geplaatst</p>
-        </div>
-        <div class="post platform">
-            <h2>Amet</h2>
-            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima asperiores eveniet vero velit eligendi aliquid in.</p>
-            <p class="subscript">4 Januari geplaatst</p>
-        </div>
-        <div class="post platform">
-            <h2>Consectetur</h2>
-            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Error aliquid reprehenderit expedita odio beatae est.</p>
-            <p class="subscript">4 Januari geplaatst</p>
-        </div>
-        <div class="post platform">
-            <h2>Adipisicing</h2>
-            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quaerat architecto quis tenetur fugiat veniam iste molestiae fuga labore!</p>
-            <p class="subscript">4 Januari geplaatst</p>
-        </div>
-        <div class="post platform">
-            <h2>Elit</h2>
-            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Rem ut debitis dolorum earum expedita eveniet voluptatem quibusdam facere eos numquam commodi ad iusto laboriosam rerum aliquam.</p>
-            <p class="subscript">4 Januari geplaatst</p>
-        </div>
-        <div class="post platform">
-            <h2>Geen error</h2>
-            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloribus dolorem maxime minima animi cum.</p>
-            <p class="subscript">4 Januari geplaatst</p>
-        </div>
-        <div class="post platform">
-            <h2>Image</h2>
-            <img src="https://i.reddituploads.com/82c1c4dd0cfb4a4aa1cfa16f93f5dbfa?fit=max&h=1536&w=1536&s=dd629d407f3646ee6e3adb4da78c93f2" alt="Oregon cliffs are no joke.">
-            <p class="subscript">4 Januari geplaatst</p>
-        </div>
-        <div class="post platform">
-            <h2>Aliquid</h2>
-            <p>Lorem ipsum dolor sit amet, consectetur.</p>
-            <p class="subscript">4 Januari geplaatst</p>
-        </div>
-        <div class="post platform">
-            <h2>Odit</h2>
-            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odit accusamus tempore at porro officia rerum est impedit ea ipsa tenetur. Labore libero hic error sunt laborum expedita.</p>
-            <p class="subscript">4 Januari geplaatst</p>
-        </div>
-        <div class="post platform">
-            <h2>Accusamus</h2>
-            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis quaerat suscipit ad.</p>
-            <p class="subscript">4 Januari geplaatst</p>
-        </div>
+                    <form>
+                        <input type="text" class="newpost" placeholder="Titel">
+                        <textarea class="newpost">Schrijf een berichtje...</textarea>
+                        <input type="submit" value="Plaats!">
+                    </form>
                </div>
+        <?php
+            }

+            while($post = $posts->fetch()) {
+                $nicetime = nicetime($post["creationdate"]);
+                echo "
+                    <div class='post platform'>
+                        <h2>${post["title"]}</h2>
+                        <p>${post["content"]}</p>
+                        <p class=\"subscript\">${nicetime} geplaatst.</p>
+                    </div>
+                ";
+            }
+        ?>
+    </div>
 </div>
--- a/website/views/register-view.php
+++ b/website/views/register-view.php
@@ -1,14 +1,15 @@
 <div>
    <img style="width:50%;margin-left:25%"
-         src="img/top-logo.png"
+         src="/img/top-logo.png"
         alt="MyHyvesbook+">
 </div>

+<div class="platform">
+  <h1>Registreer uw account</h1>
    <!-- Register Content -->
    <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"
          return= $correct
          method="post">
-    <h2>Registreer uw account</h2>

        <!-- Error message -->
        <div class="login_containerfault"><?php echo $genericErr;?></span></div>
@@ -22,7 +23,7 @@
                   value="<?php echo $name ?>"
                   title="Mag alleen letters bevatten"
                   >
-        <span class="error">* <?php echo $nameErr;?></span>
+            *<span class="error"><?php echo $nameErr;?></span>
        </div>

        <!-- Register surname -->
@@ -34,7 +35,7 @@
                   value="<?php echo $surname ?>"
                   title="Mag alleen letters bevatten"
                   >
-        <span class="error">* <?php echo $surnameErr;?></span>
+            *<span class="error"> <?php echo $surnameErr;?></span>
        </div>

        <!-- Register birthday -->
@@ -46,7 +47,7 @@
                   id="bday"
                   placeholder="01/01/1900"
                   >
-        <span class="error">* <?php echo $bdayErr;?></span>
+            *<span class="error"> <?php echo $bdayErr;?></span>
        </div>

        <!-- Register username -->
@@ -58,12 +59,12 @@
                   value="<?php echo $username ?>"
                   title="Moet minimaal 6 karakters bevatten"
                   >
-        <span class="error">* <?php echo $usernameErr;?></span>
-    </div>
-
+            *<span class="error"> <?php echo $usernameErr;?></span>
            <ul>
                <li>Minstens 6 karakters</li>
            </ul>
+          </div>
+

        <!-- Register password -->
        <div class="login_containerregister">
@@ -74,13 +75,11 @@
                   value="<?php echo $password ?>"
                   id="password"
                   >
-        <span class="error">* <?php echo $passwordErr;?></span>
-    </div>
-
+            *<span class="error"> <?php echo $passwordErr;?></span>
        <ul>
          <li>Minstens 8 karakters</li>
        </ul>
-
+        </div>
        <!-- Repeat password -->
        <div class="login_containerregister">
            <label><b>Herhaal wachtwoord</b></label>
@@ -91,7 +90,7 @@
                   id="confirmpassword"
                   title="Herhaal wachtwoord"
                  >
-        <span class="error">* <?php echo $confirmpasswordErr;?></span>
+            *<span class="error"> <?php echo $confirmpasswordErr;?></span>
        </div>

        <!-- Register location -->
@@ -103,31 +102,33 @@
                   value="<?php echo $location ?>"
                   pattern="[A-Za-z]{1,}"
                   title="Mag alleen letters bevatten">
-        <span class="error">* <?php echo $locationErr;?></span>
+            *<span class="error"> <?php echo $locationErr;?></span>
        </div>

        <!-- Register email -->
        <div class="login_containerregister">
            <label><b>Email</b></label>
-        <input type="email"
+            <input type="text"
                   placeholder="Voer uw email in"
                   name="email"
                   value="<?php echo $email ?>"
                   id="email"
                   title="Voer een geldige email in">
-        <span class="error">* <?php echo $emailErr;?></span>
+            *<span class="error"> <?php echo $emailErr;?></span>
        </div>

        <!-- Button for registering -->
        <div class="login_containerregister">
-        <input type="submit"
+            <button type="submit"
                   value="Registreer uw account"
                   name="Submit"
-               id="frm1_submit" />
+                   id="frm1_submit">
+            Registreer
+            </button>
        </div>
    </form>
-
-<!-- Button for going back to login screen -->
    <div class="login_containerlogin">
-    <a href="https://myhyvesbookplus.nl/~joey/public/login.php" class="button">Login met een account</a>
+    <!-- Button for going back to login screen -->
+        <a href="https://myhyvesbookplus.nl/login.php" class="left-arrow">Login</a>
+    </div>
 </div>
--- a/website/views/search-view.php
+++ b/website/views/search-view.php
--- a/website/views/settings-view.php
+++ b/website/views/settings-view.php
@@ -6,9 +6,9 @@ $settings = getSettings();
    <div class="settings">
        <?php
        if ($_SERVER["REQUEST_METHOD"] == "POST") {
-            echo "<div class='platform settings-message ${result["type"]}'>
-            ${result["message"]}
-        </div>";
+            echo "<div class='platform settings-message ". $result->getClass()."'>".
+            $result->getMessage().
+        "</div>";
        }
        ?>
        <form class="settings-profile platform" method="post">
@@ -68,7 +68,7 @@ $settings = getSettings();
                </li>
            </ul>
        </form>
-        <form class="settings-profilepictue platform" method="post">
+        <form class="settings-profilepictue platform" method="post" enctype="multipart/form-data">
            <h5>Verander profielfoto</h5>
            <ul>
                <li>