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>

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]

website/public/API/loadMessages.php

@@ -1,13 +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"]));
-    echo getNewChatMessages($_POST["lastID"], $_POST["destination"]);
-
 } else {
-    echo getOldChatMessages($_POST["destination"]);
+    echo getOldChatMessages(test_input($_POST["destination"]));
 }

website/public/API/loadNotifications.php

@@ -0,0 +1,8 @@
+<?php
+
+session_start();
+
+require_once ("../../queries/connect.php");
+require_once ("../../queries/friendship.php");
+
+echo selectAllFriendRequests();

website/public/API/sendMessage.php

@@ -3,16 +3,15 @@
 session_start();
 require_once("../../queries/connect.php");
 require_once("../../queries/private_message.php");
+require_once("../../queries/checkInput.php");
 
-if (isset($_POST["destination"]) &&
+if (!empty(test_input($_POST["destination"])) &&
-    isset($_POST["content"])) {
+    !empty(test_input($_POST["content"]))) {
-
+    if (sendMessage(test_input($_POST["destination"]), test_input($_POST["content"]))) {
-    if (sendMessage($_POST["destination"], $_POST["content"])) {
+        echo 1;
-        echo $_POST["content"] . " is naar " . $_POST["destination"] . " gestuurd";
     } else {
-        echo "YOU FAILED!!!";
+        echo 0;
     }
-
 } else {
-    echo "maybe dont try to hax the system?";
+    echo 0;
 }

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';
+    }
+}

website/public/js/chat.js

@@ -10,7 +10,6 @@ function loadMessages() {
         $("#lastIDForm").serialize()
     ).done(function(data) {
         if (data && data != "[]") {
-            console.log(data);
             messages = JSON.parse(data);
             addMessages(messages);
             $("#lastID").val(messages[messages.length - 1].messageID);
@@ -23,13 +22,10 @@ function loadMessages() {
 
 
 function sendMessage() {
-    console.log($("#sendMessageForm").serialize());
     $.post(
         "API/sendMessage.php",
         $("#sendMessageForm").serialize()
-    ).done(function( data ) {
+    );
-        console.log(data);
-    });
 
     $("#newContent").val("");
 }

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();
+        if($("#notification-center").css('right') == "-256px") {
-        $("#profile-hello-popup").toggle();
+            $(".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);
+        }
     });
 });

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();
+

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;
+}

website/public/login.php

@@ -4,27 +4,34 @@
     include("../views/login_head.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 ="";
 
     // Trying to login
     if ($_SERVER["REQUEST_METHOD"] == "POST") {
-        $uname=strtolower($_POST["uname"]);
         // Empty username or password field
         if (empty($_POST["uname"]) || empty($_POST["psw"])) {
             $loginErr = "Gebruikersnaam of wachtwoord is niet ingevuld";
 
         }
         else {
-            $psw=$_POST["psw"];
+            $uname = strtolower(test_input($_POST["uname"]));
-            $hash=getUser()["password"];
+            $psw = test_input($_POST["psw"]);
-            $userid=getUser()["userID"];
+            $hash = getUser()["password"];
+            $userid = getUser()["userID"];
 
             // If there's an account, go to the profile page
             if(password_verify($psw, $hash)) {

website/public/profile.php

@@ -1,70 +1,29 @@
-<?php
-include("../queries/user.php");
-include("../queries/friendship.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";
-}
-
-if(empty($_GET["username"])) {
-    echo "User does not exist!";
-    return;
-}
-
-$userID = getUserID($_GET["username"]);
-
-$user = selectUser($userID);
-$friends = selectAllFriends($userID);
-$groups = selectAllUserGroups($userID);
-$posts = selectAllUserPosts($userID);
-
-?>
-
 <!DOCTYPE html>
 <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.

website/public/register.php

@@ -4,12 +4,14 @@
     include("../views/login_head.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 = "";
@@ -17,127 +19,25 @@
 
     // Trying to register an account
     if ($_SERVER["REQUEST_METHOD"] == "POST") {
-        if (empty($_POST["name"])) {
+        checkInputChoice("name", "lettersAndSpace");
-            $nameErr = "Naam is verplicht!";
+        checkInputChoice("surname", "lettersAndSpace");
-            $correct = false;
 
-        } else {
-            $name = test_input($_POST["name"]);
-            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 {
-            $surname = test_input($_POST["surname"]);
-            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 {
-            $username = test_input($_POST["username"]);
+          $bday = test_input($_POST["bday"]);
-            if (strlen($username) < 6) {
-                $usernameErr = "Gebruikersnaam moet minstens 6 karakters bevatten";
-                $correct = false;
-
-            } else if (getExistingUsername() == 1){
-                $usernameErr = "Gebruikersnaam bestaat al";
-                $correct = false;
-
-            }
         }
 
-        if (empty($_POST["password"])) {
+        checkInputChoice("username", "username");
-            $passwordErr = "Wachtwoord is verplicht!";
+        checkInputChoice("password", "longerEight");
-            $correct = false;
+        checkInputChoice("confirmpassword", "");
-
+        matchPassword();
-        } else {
+        checkInputChoice("location", "lettersAndSpace");
-            $password = test_input($_POST["password"]);
+        checkInputChoice("email", "email");
-            if (strlen($password) < 8) {
+        registerCheck();
-                $passwordErr = "Wachtwoord moet minstens 8 karakters bevatten";
-                $correct = false;
-
-            }
-        }
-
-        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 {
-            $location = test_input($_POST["location"]);
-            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 {
-            $email = test_input($_POST["email"]);
-            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");
-
-        }
     }
-
-    function test_input($data) {
-        $data = trim($data);
-        $data = stripslashes($data);
-        $data = htmlspecialchars($data);
-        return $data;
-    }
-
 /* This view adds register view */
 include("../views/register-view.php");
 ?>

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>

website/public/settings.php

@@ -2,7 +2,7 @@
 <html>
 <head>
     <?php
-    include("../views/head.php");
+    include_once("../views/head.php");
     include_once("../queries/connect.php");
     include_once("../queries/settings.php");
     ?>
@@ -12,8 +12,6 @@
 </head>
 <body>
 <?php
-
-include("../views/main.php");
 $notImplemented = new settingsMessage("angry", "Deze functie werkt nog niet :(");
 
 if ($_SERVER["REQUEST_METHOD"] == "POST") {
@@ -22,16 +20,18 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") {
             $result = updateSettings();
             break;
         case "password":
-            $result = updatePassword();
+            $result = changePassword();
             break;
         case "email":
             $result = changeEmail();
             break;
         case "picture":
-            $result = $notImplemented;
+            updateProfilePicture();
+            $result = new settingsMessage("happy", "Deze melding doet nog niks nuttigs.");
             break;
     }
 }
+include("../views/main.php");
 
 include("../views/settings-view.php");
 

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;
@@ -44,18 +48,20 @@
     width: 120px;
 }
 
-.admin-groupfilter {
-    display: none;
-}
-
 .admin-users {
     margin: 10px;
 }
 
-.admin-userpage {
+.admin-userheading {
-    width: 170px;
+    width: auto;
-    margin-bottom: 20px;
+    float: left;
+}
+
+.admin-pageui {
+    text-align: right;
     float: right;
+    width: auto;
+    margin-bottom: 20px;
 }
 
 .usertitle {

website/public/styles/chat.css

@@ -83,7 +83,7 @@
 .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;

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;
-}

website/public/styles/index.css

@@ -1,7 +1,7 @@
 a.button {
-    background-color: #405550;
+    background-color: #C8CABD;
     border-radius: 10px;
-    color: white;
+    color: black;
     cursor: pointer;
     height: 50%;
     margin: 8px 0;
@@ -13,13 +13,13 @@ a.button {
 
 /* Body */
 body {
-    height: 900px;
+    height: 100%;
     background-color: #C8CABD;
     /*background-image: url(http://play.pokemonshowdown.com/fx/client-bg-shaymin.jpg);
     background-size: cover;
     background-attachment: fixed;*/
 
-    /*background-color: #B78996;*/
+    /*background-color: #EEE;*/
     color: #333;
     font-family: Arial, sans-serif;
 }
@@ -46,8 +46,8 @@ body {
 form {
     /*background-color: #a87a87;*/
     border-radius: 12px;
-    height: 75%;
+    height: 70%;
-    margin: 10px auto;
+    margin: auto;
     width: 70%;
     overflow-y:auto;
 }
@@ -66,14 +66,15 @@ h2 {
     font-size: 2.0em;
 }
 
+
 input[type=text], input[type=password], input[type=email], input[type="date"] {
     box-sizing: border-box;
     border-color: #C8CABD;
     display: inline-block;
-    height: 50%;
+    height: 60%;
     padding: 8px 20px;
     margin: 4px 0;
-    width: 50%;
+    width: 70%;
 }
 /*
 input[type=text], input[type=password], input[type=email], input[type="date"] {
@@ -101,6 +102,31 @@ 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;
@@ -109,7 +135,7 @@ label {
 
 /* padding voor login_containers */
 .login_containerlogin {
-    padding: 16px;
+    padding:25px;
     text-align: center;
 }
 
@@ -133,11 +159,11 @@ label {
     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: 53%;
+    height: 500px;
     margin: 34px auto;
     overflow-y: auto;
     padding: 20px;
-    width: 35%;
+    width: 50%;
 }
 
 /*.platform {

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: 5px;
-    border-radius: 7px;
+    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%;
+    top: 150%;
-    z-index: 20;
+    z-index: 200;
     white-space: nowrap;
-    -moz-border-radius: 5px;
+    -moz-border-radius: 3px;
-    -webkit-border-radius: 5px;
+    -webkit-border-radius: 3px;
-    border-radius: 5px;
+    border-radius: 3px;
-    -moz-box-shadow: 0 0 4px #222;
+    box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
-    -webkit-box-shadow: 0 0 4px #222;
-    box-shadow: 0 0 4px #222;
     background-color: #333;
     font-size: 15px;
     line-height: normal;

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);
 }
@@ -26,12 +33,13 @@
     cursor: pointer;
 }
 
-.friend-item {
+.friend-item, .group-item {
     cursor: pointer;
+    transition-duration: 250ms;
 }
 
-.friend-item:hover {
+.friend-item:hover, .group-item:hover {
-    background: #845663;
+    background: #FBC02D;
     color: white;
 }
 
@@ -43,3 +51,20 @@
     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;
+}

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 {*/
+div.posts .post form input, div.posts .post form textarea {
-    /*z-index: -1;*/
+    width: calc(100% - 15px);
-    /*margin-right: 0;*/
+}
-    /*width: calc(100% + 15px);*/
-/*}*/
 
-/*.post-box {*/
+div.posts .post form input[type="submit"] {
-    /*display: inline-flex;*/
+    width: 100%;
-    /*margin: 20px 15px 0 0;*/
+}
-    /*padding: 25px;*/
-    /*background-color: #FFFFFF;*/
-/*}*/
 
-/*!* fullscreen *!*/
+div.posts .post form textarea.newpost {
-/*.post-box {*/
+    margin: 15px 0 15px 0;
-    /*width: calc(25% - 69px);*/
+    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);
 }

website/public/styles/search.css

@@ -10,3 +10,8 @@
 #search-friends-output {
     margin-right: 10px;
 }
+
+.searchleft, .searchright {
+    display: inline-block;
+    vertical-align: top;
+}

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;
+}
+?>

website/queries/friendship.php

@@ -7,7 +7,7 @@ function selectAllFriends($userID) {
             `username`,
             IFNULL(
                 `profilepicture`,
-                'img/notbad.jpg'
+                '../img/notbad.jpg'
             ) AS profilepicture,
             `onlinestatus`,
             `role`
@@ -15,6 +15,7 @@ function selectAllFriends($userID) {
             `user`
         INNER JOIN
             `friendship`
+            
         WHERE
             (`friendship`.`user1ID` = :userID AND
             `friendship`.`user2ID` = `user`.`userID` OR 
@@ -29,3 +30,34 @@ function selectAllFriends($userID) {
 
     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());
+}

website/queries/group_page.php

@@ -1,7 +1,7 @@
 <?php
 
 function selectGroupById($groupID) {
-    return $GLOBALS["db"]->query("
+    $q = $GLOBALS["db"]->prepare("
     SELECT
         `group_page`.`name`,
         `group_page`.`picture`,
@@ -11,12 +11,16 @@ function selectGroupById($groupID) {
     FROM
         `group_page`
     WHERE
-        `group_page`.`groupID` = $groupID
+        `group_page`.`groupID` = :groupID
     ");
+
+    $q->bindParam(':groupID', $groupID);
+    $q->execute();
+    return $q;
 }
 
 function select20GroupsFromN($n) {
-    return $GLOBALS["db"]->query("
+    $q = $GLOBALS["db"]->prepare("
     SELECT
         `group_page`.`groupID`,
         `group_page`.`name`,
@@ -29,12 +33,16 @@ function select20GroupsFromN($n) {
     ORDER BY
         `group_page`.`name` ASC
     LIMIT
-        $n, 20
+        :n, 20
     ");
+
+    $q->bindParam(':n', $n);
+    $q->execute();
+    return $q;
 }
 
 function select20GroupsByStatusFromN($n, $status) {
-    return $GLOBALS["db"]->query("
+    $q = $GLOBALS["db"]->prepare("
     SELECT
         `group_page`.`groupID`,
         `group_page`.`name`,
@@ -45,12 +53,17 @@ function select20GroupsByStatusFromN($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) {
@@ -80,6 +93,55 @@ function search20GroupsFromNByStatus($n, $keyword, $status) {
     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
@@ -92,3 +154,44 @@ function changeGroupStatusByID($id, $status) {
 
     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;
+}
+?>

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";
+}

website/queries/settings.php

@@ -87,23 +87,22 @@ function updateSettings() {
       `userID` = :userID
     ");
 
-    $stmt->bindParam(":fname", $_POST["fname"]);
+    $stmt->bindValue(":fname", test_input($_POST["fname"]));
-    $stmt->bindParam(":lname", $_POST["lname"]);
+    $stmt->bindValue(":lname", test_input($_POST["lname"]));
-    $stmt->bindParam(":location", $_POST["location"]);
+    $stmt->bindValue(":location", test_input($_POST["location"]));
-    $stmt->bindParam(":bday", $_POST["bday"]);
+    $stmt->bindValue(":bday", test_input($_POST["bday"]));
-    $stmt->bindParam(":bio", $_POST["bio"]);
+    $stmt->bindValue(":bio", test_input($_POST["bio"]));
-    $stmt->bindParam(":userID", $_SESSION["userID"]);
+    $stmt->bindValue(":userID", $_SESSION["userID"]);
-
     $stmt->execute();
 
     return new settingsMessage("happy", "Instellingen zijn opgeslagen.");
 }
 
-function updatePassword() {
+function changePassword() {
     $user = getPasswordHash();
     if (password_verify($_POST["password-old"], $user["password"])) {
         if ($_POST["password-new"] == $_POST["password-confirm"] && (strlen($_POST["password-new"]) >= 8)) {
-            if (changePassword()) {
+            if (doChangePassword()) {
                 return new settingsMessage("happy", "Wachtwoord gewijzigd.");
             } else {
                 return new settingsMessage("angry", "Er is iets mis gegaan.");
@@ -116,7 +115,7 @@ function updatePassword() {
     }
 }
 
-function changePassword() {
+function doChangePassword() {
     $stmt = $GLOBALS["db"]->prepare("
     UPDATE
       `user`
@@ -185,3 +184,41 @@ function doChangeEmail($email) {
     $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() {
+    $stmt = $GLOBALS["db"]->prepare("
+    SELECT
+        `profilepicture`
+     FROM 
+        `user`
+    WHERE 
+        `userID` = :userID
+    ");
+    $stmt->bindParam(":userID", $_SESSION["userID"]);
+    $stmt->execute();
+    $old_avatar = $stmt->fetch()["profilepicture"];
+    unlink("/var/www/html/public/uploads/" . $old_avatar);
+}
+
+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();
+}

website/queries/user.php

@@ -1,4 +1,5 @@
 <?php
+
 require("connect.php");
 
 function getUserID($username) {
@@ -22,7 +23,7 @@ function selectUser($userID) {
             `username`,
             IFNULL(
                 `profilepicture`,
-                'img/notbad.png'
+                '../img/notbad.jpg'
             ) AS profilepicture,
             `bio`,
             `role`,
@@ -87,7 +88,7 @@ function selectAllUserPosts($userID) {
 }
 
 function select20UsersFromN($n) {
-    return $GLOBALS["db"]->query("
+    $q = $GLOBALS["db"]->prepare("
     SELECT
         `userID`,
         `username`,
@@ -99,8 +100,12 @@ function select20UsersFromN($n) {
         `role`,
         `username`
     LIMIT
-        $n, 20
+        :n, 20
     ");
+
+    $q->bindParam(':n', $n);
+    $q->execute();
+    return $q;
 }
 
 function search20UsersFromN($n, $keyword) {
@@ -155,18 +160,144 @@ function search20UsersFromNByStatus($n, $keyword, $status) {
     return $q;
 }
 
-function changeUserStatusByID($id, $status) {
+function searchSomeUsersByStatus($n, $m, $keyword, $status) {
-    $q = $GLOBALS["db"]->query("
+    $q = $GLOBALS["db"]->prepare("
-    UPDATE
+    SELECT
+        `userID`,
+        `username`,
+        `role`,
+        `bancomment`
+    FROM
         `user`
-    SET
-        `role` = $status
     WHERE
-        `userID` = $id
+        `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;
+}

website/views/adminpanel.php

@@ -3,32 +3,7 @@
 <head>
     <meta charset="utf-8">
     <title>Admin Panel</title>
-    <script type="text/javascript">
+    <script src="/js/admin.js" charset="utf-8"></script>
-    window.onload = function() {
-        changeFilter();
-    };
-
-    function checkAll(allbox) {
-        var checkboxes = document.getElementsByName('checkbox-user[]');
-
-        for (var i = 0; i < checkboxes.length; i++) {
-            if (checkboxes[i].type == 'checkbox') {
-                checkboxes[i].checked = allbox.checked;
-            }
-        }
-    }
-
-    function changeFilter() {
-        if (document.getElementById('group').checked) {
-            document.getElementById('admin-filter').style.display = 'none';
-            document.getElementById('admin-groupfilter').style.display = 'inline-block';
-        } else {
-            document.getElementById('admin-filter').style.display = 'inline-block';
-            document.getElementById('admin-groupfilter').style.display = 'none';
-        }
-    }
-
-    </script>
     <?php
         include_once("../queries/user.php");
         include_once("../queries/group_page.php");
@@ -39,41 +14,54 @@
 <!-- function test_input taken from http://www.w3schools.com/php/php_form_validation.asp -->
 <?php
 $search = "";
-$listnr = 0; // TODO: add page functionality
+$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 (!empty($_POST["search"])) {
+    if (isset($_POST["actions"]) && isset($_POST["userID"])) {
-        $search = test_input($_POST["search"]);
-    }
-
-    if (!empty($_POST["pagetype"])) {
-        $pagetype = test_input($_POST["pagetype"]);
-    }
-
-    if (!empty($_POST["status"])) {
-        $status = $_POST["status"];
-    }
-
-    if (!empty($_POST["groupstatus"])) {
-        $groupstatus = $_POST["groupstatus"];
-    }
-
-    if (!empty($_POST["actions"]) && !empty($_POST["userID"])) {
         changeUserStatusByID($_POST["userID"], $_POST["actions"]);
-    } elseif (!empty($_POST["actions"]) && !empty($_POST["groupID"])) {
+    }
+
+    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"];
+    }
+
 }
 
-function test_input($data) {
+$listn = ($currentpage-1) * $perpage;
-  $data = trim($data);
+$listm = $currentpage * $perpage;
-  $data = stripslashes($data);
+
-  $data = htmlspecialchars($data);
-  return $data;
-}
 ?>
 
 <div class="content">
@@ -81,13 +69,10 @@ function test_input($data) {
         <div class="admin-title">
             <h1>User Management Panel</h1>
         </div> <br>
-        <form class="admin-actionform"
-              action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"
-              method="post">
         <div class="admin-options">
             <form class="admin-searchform"
                   action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"
-                  method="post">
+                  method="get">
                 <div class="admin-searchbar">
                     <h2>Search</h2>
                     <input type="text"
@@ -147,32 +132,86 @@ function test_input($data) {
                 </div>
             </form>
 
-                <div class="admin-actions">
+                <div class="admin-batchactions" id="admin-batchactions">
                     <h2>Batch Actions: </h2>
-                    <input type="radio" name="actions" id="freeze" value="freeze">
+                    <form class="admin-batchform"
-                    <label for="freeze">Freeze</label><br>
+                          id="admin-batchform"
-                    <input type="radio" name="actions" id="ban" value="ban">
+                          action="<?php htmlspecialchars(basename($_SERVER['REQUEST_URI'])) ?>"
-                    <label for="ban">Ban</label><br>
+                          method="post">
-                    <input type="radio" name="actions" id="restore" value="restore">
+                        <input type="radio" name="batchactions" id="freeze" value="2">
-                    <label for="restore">Restore</label><br><br>
+                        <label for="freeze">Freeze</label><br>
-                    <input type="submit" value="Confirm">
+                        <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">
-                <h2 class="usertitle">Users:</h2>
+                <div class="admin-usertitle">
-
+                    <div class="admin-userheading">
-                <div class="admin-userpage">
+                        <h2>Users:</h2>
-                    <input type="submit" name="prev" value="prev">
+                    </div>
-                    1 / 1
+                    <div class="admin-pageui">
-                    <input type="submit" name="next" value="next">
+                        <?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>
@@ -182,21 +221,28 @@ function test_input($data) {
 
                     <!-- Table construction via php PDO. -->
                     <?php
+                    $listn = ($currentpage-1) * $perpage;
+                    $listm = $currentpage * $perpage;
+
                     if ($pagetype == 'user') {
-                        $q = search20UsersFromNByStatus($listnr, $search, $status);
+                        $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($_SERVER['PHP_SELF']);
+                            $thispage = htmlspecialchars(basename($_SERVER['REQUEST_URI']));
+                            $function = "checkCheckAll(document.getElementById('checkall'))";
 
                             echo("
                             <tr>
                             <td><input type='checkbox'
                             name='checkbox-user[]'
-                            value='$userID'>
+                            class='checkbox-list'
+                            value='$userID'
+                            form='admin-batchform'
+                            onchange=" . "$function" . ">
                             </td>
                             <td>$username</td>
                             <td>$role</td>
@@ -218,20 +264,24 @@ function test_input($data) {
                             ");
                         }
                     } else {
-                        $q = search20GroupsFromNByStatus($listnr, $search, $groupstatus);
+                        $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($_SERVER['PHP_SELF']);
+                            $thispage = htmlspecialchars(basename($_SERVER['REQUEST_URI']));
+                            $function = "checkCheckAll(document.getElementById('checkall'))";
 
                             echo("
                             <tr>
                             <td><input type='checkbox'
                             name='checkbox-group[]'
-                            value='$groupID'>
+                            class='checkbox-list'
+                            value='$groupID'
+                            form='admin-groupbatchform'
+                            onchange=" . "$function" . ">
                             </td>
                             <td>$name</td>
                             <td>$role</td>
@@ -243,7 +293,7 @@ function test_input($data) {
                             <select class='action' name='actions'>
                             <option value='0'>Hide</option>
                             <option value='1'>Public</option>
-                            <option value='2'>Members-only</option>
+                            <option value='2'>Members</option>
                             </select>
                             <input type='hidden' name='groupID' value='$groupID'>
                             <input type='submit' value='Confirm'>
@@ -256,10 +306,6 @@ function test_input($data) {
                     ?>
                 </table>
             </div>
-        </form>
-        <pre>
-            <?php print_r($_POST); ?>
-        </pre>
     </div>
 </div>
 </body>

website/views/chat-view.php

@@ -36,7 +36,7 @@
                 ?>
             </ul>
         </nav>
-        <div class="chat-right right">
+        <div class="chat-right">
             <div id="chat-history" class="chat-history platform">
             </div>
             <form id="lastIDForm">

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,7 +15,8 @@
 </style>
 <?php
 
-include_once("../queries/connect.php");
+require_once ("../queries/checkInput.php");
+require_once ("../queries/connect.php");
 
 session_start();
 

website/views/header.php

@@ -5,7 +5,7 @@ $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">
@@ -29,3 +29,5 @@ $userinfo = getHeaderInfo();
         <img id="own-profile-picture" class="profile-picture" src="<?=$userinfo["profilepicture"]?>"/>
     </div>
 </header>
+<?php include("notification-center.php"); ?>
+

website/views/login-view.php

@@ -1,6 +1,6 @@
 <div>
     <img style="width:50%;margin-left:25%"
-         src="img/top-logo.png"
+         src="/img/top-logo.png"
          alt="MyHyvesbook+">
 </div>
 <div class="platform">
@@ -46,6 +46,6 @@
     </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>

website/views/login_head.php

@@ -3,9 +3,10 @@
     <title>MyHyvesbook+</title>
     <link rel="stylesheet"
           type="text/css"
-          href="styles/main.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="/js/jqeury.js"></script>
+    <script src="/js/registerAndLogin.js"></script>
 </head>

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,7 +7,8 @@
             <?php
 
             // Load file.
-            include_once("../queries/friendship.php");
+            require_once("../queries/friendship.php");
+            require_once("../queries/user.php");
 
             // Get all the friends of a user.
             $friends = selectAllFriends($_SESSION["userID"]);
@@ -26,7 +27,7 @@
                 if (!empty($friend["profilepicture"]))
                     $pf = $friend["profilepicture"];
 
-                if ($i > 1)
+                if ($i > 5)
                     $extraItem = "extra-menu-items";
 
                 // Echo the friend.
@@ -45,13 +46,31 @@
                     </li>
                 ";
             }
-            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'>
+                    <li class='more-item' id='more-friends-click'>
-                En nog $i anderen...
+                        En nog $i anderen...
-            </li>";
+                    </li>
+                ";
             }
+
             ?>
         </ul>
     </section>
@@ -87,17 +106,28 @@
 
                 // Echo the friend.
                 echo "
-                    <a href='#' class='$extraItem'>
+                    <li class='group-item'>
-                        <li class='group-item'>
+                        <form action='group.php' method='get'>
-                            <div class='group'>
+                            <button type='submit'
-                                <img alt='PF' class='group-picture' src='$picture'/>
+                                    name='groupname'
-                                $name
+                                    value='$name'>
-                            </div>
+                                <div class='group'>
-                        </li>
+                                    <img alt='PF' class='group-picture' src='$picture'/>
-                    </a>
+                                    $name
+                                </div>
+                            </button>
+                        </form>
+                    </li>
                 ";
             }
-            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'>

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>

website/views/profile.php

@@ -2,21 +2,23 @@
     <div class="profile-box platform">
         <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"><?php echo $user["username"] ?></h1>
+        <h1 class="profile-username"><?=$user["username"]?></h1>
-        <p><?php echo $user["bio"] ?></p>
+        <h5 class="profile-username"><?= $user["fname"]?> <?=$user["lname"]?></h5>
+        <p><?=$user["bio"]?></p>
     </div>
 
     <div class="item-box left platform">
         <h2>Vrienden</h2>
         <p>
             <?php
-                while($friend = $friends->fetch()) {
+                while($friend = $profile_friends->fetch()) {
-                    echo "<a href='#' data-title='" . $friend["username"] . "'><img class='profile-picture' src='" . $friend["profilepicture"] . "' alt='" . $friend["username"] . "'s profielfoto></a>";
+                    echo "<a href='/profile/${friend["username"]}/' data-title='${friend["username"]}'><img class='profile-picture' src='${friend["profilepicture"]}' alt='${friend["username"]}'s profielfoto></a>";
                 }
 
-                if($friends->rowCount() === 0) {
+
+                if($profile_friends->rowCount() === 0) {
                     echo "<p>Deze gebruiker heeft nog geen vrienden gemaakt.</p>";
                 }
             ?>
@@ -27,11 +29,11 @@
         <h2>Groepen</h2>
         <p>
             <?php
-                while($group = $groups->fetch()) {
+                while($group = $profile_groups->fetch()) {
-                    echo "<a href='#' data-title='${group["name"]}'><img class='group-picture' src='${group["picture"]}' alt='${group["name"]}s logo'></a>";
+                    echo "<a href='/group/${group["name"]}/' data-title='${group["name"]}'><img class='group-picture' src='${group["picture"]}' alt='${group["name"]}s logo'></a>";
                 }
 
-                if($groups->rowCount() === 0) {
+                if($profile_groups->rowCount() === 0) {
                     echo "<p>Deze gebruiker is nog geen lid van een groep.</p>";
                 }
             ?>
@@ -40,6 +42,18 @@
 
     <div class="posts">
         <?php
+            if ($_SESSION["userID"] === $userID) {
+         ?>
+                <div class="post platform">
+                    <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 "
@@ -51,4 +65,5 @@
                 ";
             }
         ?>
+    </div>
 </div>

website/views/register-view.php

@@ -1,6 +1,6 @@
 <div>
     <img style="width:50%;margin-left:25%"
-         src="img/top-logo.png"
+         src="/img/top-logo.png"
          alt="MyHyvesbook+">
 </div>
 
@@ -108,7 +108,7 @@
         <!-- 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 ?>"
@@ -123,13 +123,12 @@
                    value="Registreer uw account"
                    name="Submit"
                    id="frm1_submit">
-            Registreer uw account
+            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>

website/views/settings-view.php

@@ -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>