diff --git a/website/public/API/loadChatNotifications.php b/website/public/API/loadChatNotifications.php new file mode 100644 index 0000000..1415a2e --- /dev/null +++ b/website/public/API/loadChatNotifications.php @@ -0,0 +1,8 @@ + \ +
\ + \ + "); + } +} + function loadNotifications() { $.post( - "API/loadNotifications.php" + "API/loadFriendRequestNotifications.php" ).done(function(data) { if (data && data != "[]") { - showNotifications(JSON.parse(data), "friendrequestslist"); + showFriendNotifications(JSON.parse(data)); + } + }); + $.post( + "API/loadChatNotifications.php" + ).done(function(data) { + if (data && data != "[]") { + showChatNotifications(JSON.parse(data)); } }); setTimeout(loadNotifications, 10000); } +$(document).ready(function() { + loadNotifications(); +}); + -loadNotifications(); diff --git a/website/public/settings.php b/website/public/settings.php index 06d17c0..e40f042 100644 --- a/website/public/settings.php +++ b/website/public/settings.php @@ -2,7 +2,7 @@ @@ -12,27 +12,31 @@ getClass(); + $alertMessage = $w->getMessage(); } } +include("../views/main.php"); include("../views/settings-view.php"); diff --git a/website/public/styles/adminpanel.css b/website/public/styles/adminpanel.css index 4c5356f..f9410e1 100644 --- a/website/public/styles/adminpanel.css +++ b/website/public/styles/adminpanel.css @@ -1,71 +1,33 @@ .admin-panel { - margin: auto; min-width: 800px; } -.admin-title { - margin: 10px; - padding-bottom: 5px; - border-bottom: 4px solid #FBC02D; -} - .admin-panel input[type="radio"], input[type="checkbox"] { + vertical-align: middle; height: auto; -} - -.admin-batchactions, .admin-groupbatchactions { - display: inline-block; - padding: 8px; - vertical-align: top; - border-radius: 10px; - border: 4px solid #FBC02D; - box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); + margin: 2px; } .admin-searchform { display: inline-block; + width: 100%; } .admin-searchbar { - display: inline-block; - margin: 10px; - vertical-align: top; -} - -.admin-searchinput { - margin-bottom: 10px; -} - -.admin-filter, .admin-filtertype, .admin-groupfilter { - display: inline-block; - margin: 10px; - vertical-align: top; - 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; +.admin-pageui { + display: inline-block; + width: 100%; +} + +.admin-pageselector { + display: inline-block; +} + +.admin-users { + margin-top: 50px; } .usertable { diff --git a/website/public/styles/chat.css b/website/public/styles/chat.css index f6060dd..6822d21 100644 --- a/website/public/styles/chat.css +++ b/website/public/styles/chat.css @@ -1,39 +1,52 @@ /* Overall chat-screen */ .chat { position: fixed; + top: 80px; left: 256px; - padding: 15px 0; width: calc(100% - 256px); height: calc(100% - 120px); - display: inline-flex; + + padding: 20px 0; + + display: inline-block; } -.chat-left { +#chat-recent-panel { width: 256px; height: calc(100% - 100px); - margin: 0 10px; - overflow-y: auto; -} -.chat-right { - width: calc(100% - 256px - 40px); - height: calc(100% - 80px); - margin-right: 10px; + display: inline-block; + + overflow-y: auto; } /* Chat history. */ -.chat-history { +#chat-history { overflow-y: auto; - height: 100%; + overflow-x: hidden; + + width: calc(100% - 256px - 75px); + height: calc(100% - 80px); + padding: 10px; + + display: inline-block; + + word-wrap: break-word; } /* Chat-message takes the whole width of the chat area */ .chat-message { width: 100%; min-height: 40px; - padding-top: 10px; + padding: 10px 0; + clear: both; +} + +.chat-message::after { + content: ''; + display: table; clear: both; } @@ -46,20 +59,21 @@ .chat-message-self { float: right; margin-right: 10px; - background-color: darkgreen; - color: white; + background-color: #FBC02D; + color: #333; } .chat-message-other { float: left; margin-left: 10px; - background-color: aquamarine; + background-color: #4CAF50; + color: white; } /* Chat reply field */ .chat-field { - width: 100%; + width: calc(100% - 10px); display: table; } @@ -77,7 +91,6 @@ width: 100%; border: none; border-radius: 10px 0 0 10px; - box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); } .chat-field input[type="submit"] { @@ -87,10 +100,9 @@ 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; + background: #4CAF50; + color: white; } \ No newline at end of file diff --git a/website/public/styles/footer.css b/website/public/styles/footer.css index 53e28f1..48c0757 100644 --- a/website/public/styles/footer.css +++ b/website/public/styles/footer.css @@ -1,6 +1,5 @@ footer { - width: calc(100% - 256px); - margin-left: 256px; + width: 100%; background-color: rgba(0,0,0,0.4); } diff --git a/website/public/styles/header.css b/website/public/styles/header.css index e39f204..0b70455 100644 --- a/website/public/styles/header.css +++ b/website/public/styles/header.css @@ -7,7 +7,9 @@ header { height: 80px; width: 100%; - color: white; + color: #FFF; + font-weight: bold; + letter-spacing: 1px; background-color: #FBC02D; box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); } diff --git a/website/public/styles/main.css b/website/public/styles/main.css index 062d5d9..8c50b19 100644 --- a/website/public/styles/main.css +++ b/website/public/styles/main.css @@ -166,6 +166,7 @@ textarea { textarea:hover, input:hover, select:hover { border-radius: 10px; + box-shadow: 0 1px 1px rgba(0,0,0,0.12); } textarea:focus, input:focus, select:focus { @@ -241,3 +242,23 @@ div[data-title]:hover:after { line-height: normal; font-family: Arial, sans-serif; } + +.friend { + +} + + +.friend-item, .group-item { + cursor: pointer; + transition-duration: 250ms; +} + +.friend-item:hover, .group-item:hover { + background: #FBC02D; + box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); +} + +.friend-name { + display: inline-block; + vertical-align: middle; +} diff --git a/website/public/styles/menu.css b/website/public/styles/menu.css index 215b073..ce294da 100644 --- a/website/public/styles/menu.css +++ b/website/public/styles/menu.css @@ -6,15 +6,15 @@ left: 0; top: 80px; height: calc(100% - 80px); - width: 256px; + width: 236px; - background-color: #EEE; - /*box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);*/ + padding: 20px 10px; } .menu section { - margin: 0 5px 10px 5px; - background-color: white; + margin-bottom: 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); } @@ -24,6 +24,7 @@ .nav-list li { padding: 5px 20px; + border-radius: 4px; } .more-item { @@ -33,16 +34,6 @@ 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; @@ -54,7 +45,7 @@ #notification-center { left: auto; - width: 256px; + width: 236px; right: -256px; } @@ -67,4 +58,9 @@ color: #4CAF50; font-size: 42px; padding: 7px; + transition-duration: 250ms; +} + +#quick-links i:hover { + color: #FBC02D; } \ No newline at end of file diff --git a/website/public/styles/profile.css b/website/public/styles/profile.css index 37b0825..fbd8775 100644 --- a/website/public/styles/profile.css +++ b/website/public/styles/profile.css @@ -33,9 +33,6 @@ div.posts div.post { } 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); } diff --git a/website/public/styles/search.css b/website/public/styles/search.css index b54723d..86fd41d 100644 --- a/website/public/styles/search.css +++ b/website/public/styles/search.css @@ -14,4 +14,16 @@ .searchleft, .searchright { display: inline-block; vertical-align: top; +} + +.user-pageselect, .searchleft h4, .group-pageselect, .searchright h4 { + display: inline-block; +} + +.user-pageselect, .group-pageselect { + float: right; +} + +li.search-item:hover{ + background-color: #EEE; } \ No newline at end of file diff --git a/website/queries/friendship.php b/website/queries/friendship.php index 7a3d6f2..d0279c9 100644 --- a/website/queries/friendship.php +++ b/website/queries/friendship.php @@ -7,9 +7,10 @@ function selectAllFriends($userID) { SELECT `userID`, `username`, + LEFT(CONCAT(`user`.`fname`, ' ', `user`.`lname`), 15) as `name`, IFNULL( `profilepicture`, - '../img/notbad.jpg' + '../img/avatar-standard.png' ) AS profilepicture, `onlinestatus`, `role` @@ -23,8 +24,8 @@ function selectAllFriends($userID) { `friendship`.`user2ID` = `user`.`userID` OR `friendship`.`user2ID` = :userID AND `friendship`.`user1ID` = `user`.`userID`) AND - `role` != 'banned' AND - `status` = 'confirmed' + `user`.`role` != 'banned' AND + `friendship`.`status` = 'confirmed' "); $stmt->bindParam(':userID', $userID, PDO::PARAM_INT); @@ -38,9 +39,10 @@ function selectAllFriendRequests() { SELECT `userID`, `username`, + LEFT(CONCAT(`user`.`fname`, ' ', `user`.`lname`), 15) as `name`, IFNULL( `profilepicture`, - '../img/notbad.jpg' + '../img/avatar-standard.png' ) AS profilepicture, `onlinestatus`, `role` @@ -54,8 +56,8 @@ function selectAllFriendRequests() { `friendship`.`user2ID` = `user`.`userID` OR `friendship`.`user2ID` = :userID AND `friendship`.`user1ID` = `user`.`userID`) AND - `role` != 5 AND - `status` = 0 + `user`.`role` != 5 AND + `friendship`.`status` = 'requested' "); $stmt->bindParam(':userID', $_SESSION["userID"], PDO::PARAM_INT); @@ -134,4 +136,34 @@ function acceptFriendship($userID) { $stmt->bindParam(':user1', $userID, PDO::PARAM_INT); $stmt->bindParam(':user2', $_SESSION["userID"], PDO::PARAM_INT); $stmt->execute(); +} + +function setLastVisited($friend) { + $stmt = $GLOBALS["db"]->prepare(" + UPDATE + `friendship` + SET `friendship`.chatLastVisted1=( + CASE `user1ID` = :sessionUser + WHEN TRUE THEN NOW() + WHEN FALSE THEN `chatLastVisted1` + END + ), + `friendship`.`chatLastVisted2`=( + CASE `user2ID` = :sessionUser + WHEN TRUE THEN NOW() + WHEN FALSE THEN `chatLastVisted2` + END + ) + WHERE + `user1ID` = :sessionUser AND + `user2ID` = :friend OR + `user2ID` = :sessionUser AND + `user1ID` = :friend; + "); + + $stmt->bindParam(':sessionUser', $_SESSION["userID"], PDO::PARAM_INT); + $stmt->bindParam(':friend', $friend, PDO::PARAM_INT); + $stmt->execute(); + + return $stmt; } \ No newline at end of file diff --git a/website/queries/group_member.php b/website/queries/group_member.php index f8a9002..59d4dce 100644 --- a/website/queries/group_member.php +++ b/website/queries/group_member.php @@ -1,7 +1,7 @@ query(" + $stmt = $GLOBALS["db"]->prepare(" SELECT `group_page`.`name`, `group_page`.`picture` @@ -10,8 +10,13 @@ function selectAllGroupsFromUser($userID) { INNER JOIN `group_member` WHERE - `group_member`.`userID` = $userID AND + `group_member`.`userID` = :userID AND `group_member`.`groupID` = `group_page`.`groupID` AND - `group_page`.`status` != 0 + `group_page`.`status` != 'hidden' "); + + $stmt->bindParam(':userID', $userID, PDO::PARAM_INT); + $stmt->execute(); + + return $stmt; } diff --git a/website/queries/group_page.php b/website/queries/group_page.php index d704e8c..9a3461d 100644 --- a/website/queries/group_page.php +++ b/website/queries/group_page.php @@ -194,4 +194,22 @@ function searchSomeGroups($n, $m, $search) { $stmt->execute(); return $stmt; } + +function countSomeGroups($search) { + $stmt = $GLOBALS["db"]->prepare(" + SELECT + COUNT(*) + FROM + `group_page` + WHERE + `name` LIKE :keyword + ORDER BY + `name` + "); + + $search = "%$search%"; + $stmt->bindParam(':keyword', $search); + $stmt->execute(); + return $stmt; +} ?> \ No newline at end of file diff --git a/website/queries/header.php b/website/queries/header.php index e6bc8ac..b0dd42c 100644 --- a/website/queries/header.php +++ b/website/queries/header.php @@ -6,7 +6,7 @@ function getHeaderInfo() { `lname`, IFNULL( `profilepicture`, - 'img/notbad.jpg' + 'img/avatar-standard.png' ) AS profilepicture FROM `user` diff --git a/website/queries/private_message.php b/website/queries/private_message.php index 46c21a3..4fbb55d 100644 --- a/website/queries/private_message.php +++ b/website/queries/private_message.php @@ -74,3 +74,38 @@ function getNewChatMessages($lastID, $destination) { return json_encode($stmt->fetchAll()); } + + +function selectAllUnreadChat() { + $stmt = $GLOBALS["db"]->prepare(" + SELECT + LEFT(CONCAT(`user`.`fname`, ' ', `user`.`lname`), 15) as `name`, + IFNULL( + `profilepicture`, + '../img/notbad.jpg' + ) AS profilepicture, + LEFT(`private_message`.`content`, 15) as `content` + FROM + `private_message`, + `friendship`, + `user` + WHERE + (`friendship`.user2ID = `private_message`.`origin` AND + `friendship`.user1ID = `private_message`.`destination` AND + `friendship`.chatLastVisted1 < `private_message`.`creationdate` OR + `friendship`.user1ID = `private_message`.`origin` AND + `friendship`.user2ID = `private_message`.`destination` AND + `friendship`.chatLastVisted2 < `private_message`.`creationdate`) AND + `private_message`.`origin` = `user`.`userID` AND + `private_message`.`destination` = :userID AND + `user`.`role` != 'banned' + + GROUP BY `user`.`userID` + "); + + $stmt->bindParam(':userID', $_SESSION["userID"]); + + $stmt->execute(); + + return json_encode($stmt->fetchAll()); +} \ No newline at end of file diff --git a/website/queries/settings.php b/website/queries/settings.php index 543adb9..965665a 100644 --- a/website/queries/settings.php +++ b/website/queries/settings.php @@ -1,35 +1,33 @@ 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; - } +class HappyAlert extends AlertMessage { + + public function __construct($message = "Gelukt!", $code = 0, Exception $previous = null) + { + parent::__construct($message, $code, $previous); } public function getClass() { - return $this->class; + return "settings-message-happy"; + } +} + +class AngryAlert extends AlertMessage { + public function __construct($message = "Er is iets fout gegaan.", $code = 0, Exception $previous = null) + { + parent::__construct($message, $code, $previous); } - public function getMessage() { - return $this->message; + public function getClass() { + return "settings-message-angry"; } } @@ -94,24 +92,19 @@ function updateSettings() { $stmt->bindValue(":bio", test_input($_POST["bio"])); $stmt->bindValue(":userID", $_SESSION["userID"]); $stmt->execute(); - - return new settingsMessage("happy", "Instellingen zijn opgeslagen."); + throw new HappyAlert("Instellingen zijn opgeslagen."); } 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 (doChangePassword()) { - return new settingsMessage("happy", "Wachtwoord gewijzigd."); - } else { - return new settingsMessage("angry", "Er is iets mis gegaan."); - } + doChangePassword(); } else { - return new settingsMessage("angry", "Wachtwoorden komen niet oveen."); + throw new AngryAlert("Wachtwoorden komen niet overeen."); } } else { - return new settingsMessage("angry", "Oud wachtwoord niet correct."); + throw new AngryAlert("Oud wachtwoord niet correct."); } } @@ -129,7 +122,12 @@ function doChangePassword() { $stmt->bindParam(":new_password", $hashed_password); $stmt->bindParam(":userID", $_SESSION["userID"]); $stmt->execute(); - return $stmt->rowCount(); + + if ($stmt->rowCount()) { + throw new HappyAlert("Wachtwoord gewijzigd."); + } else { + throw new AngryAlert(); + } } function changeEmail() { @@ -138,20 +136,13 @@ function changeEmail() { $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."); - } + emailIsAvailableInDatabase($email); + doChangeEmail($email); } else { - return new settingsMessage("angry", "Geef een geldig emailadres."); + throw new AngryAlert("Geef een geldig emailadres"); } } else { - return new settingsMessage("angry", "Emailadressen komen niet overeen."); + throw new AngryAlert("Emailadressen komen niet overeen."); } } @@ -167,7 +158,9 @@ function emailIsAvailableInDatabase($email) { $stmt->bindParam(":email", $email); $stmt->execute(); - return !$stmt->rowCount(); + if ($stmt->rowCount()) { + throw new AngryAlert("Emailadres wordt al gebruikt."); + } } function doChangeEmail($email) { @@ -182,33 +175,72 @@ function doChangeEmail($email) { $stmt->bindParam(":email", $email); $stmt->bindParam(":userID", $_SESSION["userID"]); $stmt->execute(); - return $stmt->rowCount(); +// return $stmt->rowCount(); + + if ($stmt->rowCount()) { + throw new HappyAlert("Emailadres is veranderd."); + } else { + throw new AngryAlert(); + } } -function updateProfilePicture() { +function updateAvatar() { $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); + $relativePath = "uploads/profilepictures/" . $_SESSION["userID"] . "_avatar.png"; + + checkAvatarSize($_FILES["pp"]["tmp_name"]); + $scaledImg = scaleAvatar($_FILES["pp"]["tmp_name"]); + removeOldAvatar(); + imagepng($scaledImg, $profilePictureDir . $relativePath); + setAvatarToDatabase("../" . $relativePath); + throw new HappyAlert("Profielfoto veranderd."); } -//function removeOldProfilePicture() { -// -// unlink("/var/www/html/public/uploads/profilepictures/" . $_SESSION["userID"] . "_*"); -//} +function removeOldAvatar() { + $stmt = $GLOBALS["db"]->prepare(" + SELECT + `profilepicture` + FROM + `user` + WHERE + `userID` = :userID + "); + $stmt->bindParam(":userID", $_SESSION["userID"]); + $stmt->execute(); + $old_avatar = $stmt->fetch()["profilepicture"]; + if ($old_avatar != NULL) { + unlink("/var/www/html/public/uploads/" . $old_avatar); + } +} -function setProfilePictureToDatabase($url) { +function setAvatarToDatabase(string $url) { $stmt = $GLOBALS["db"]->prepare(" UPDATE `user` SET - `profilepicture` = :profilePicture + `profilepicture` = :avatar WHERE `userID` = :userID "); - $stmt->bindParam(":profilePicture", $url); + $stmt->bindParam(":avatar", $url); $stmt->bindParam(":userID", $_SESSION["userID"]); $stmt->execute(); +} + +function checkAvatarSize(string $img) { + $minResolution = 200; + $imgSize = getimagesize($img); + if ($imgSize[0] < $minResolution or $imgSize[1] < $minResolution) { + throw new AngryAlert("Afbeelding te klein, minimaal 200x200 pixels."); + } +} + +function scaleAvatar(string $imgLink, int $newWidth = 600) { + $img = imagecreatefromstring(file_get_contents($imgLink)); + if ($img) { + return imagescale($img, $newWidth); + } else { + throw new AngryAlert("Afbeelding wordt niet ondersteund."); + } } \ No newline at end of file diff --git a/website/queries/user.php b/website/queries/user.php index 04f379e..15b7fb1 100644 --- a/website/queries/user.php +++ b/website/queries/user.php @@ -299,7 +299,8 @@ function selectRandomNotFriendUser($userID) { return $stmt->fetch(); } -function searchSomeUsers($n, $m, $search) { +function searchSomeUsers($n, $m, $search) +{ $stmt = $GLOBALS["db"]->prepare(" SELECT `username`, @@ -327,3 +328,25 @@ function searchSomeUsers($n, $m, $search) { $stmt->execute(); return $stmt; } + +function countSomeUsers($search) { + $q = $GLOBALS["db"]->prepare(" + SELECT + COUNT(*) + FROM + `user` + WHERE + `username` LIKE :keyword OR + `fname` LIKE :keyword OR + `lname` LIKE :keyword + ORDER BY + `fname`, + `lname`, + `username` + "); + + $search = "%$search%"; + $q->bindParam(':keyword', $search); + $q->execute(); + return $q; +} diff --git a/website/views/adminpanel.php b/website/views/adminpanel.php index e53d679..d97a9e8 100644 --- a/website/views/adminpanel.php +++ b/website/views/adminpanel.php @@ -1,16 +1,8 @@ - - - - -