Merge branch 'master' into lars

2017-01-25 16:21:34 +01:00
parent 9046b397a1 09dac78eb4
commit 2ece9e1c63
29 changed files with 830 additions and 93 deletions
--- a/website/public/API/editFriendship.php
+++ b/website/public/API/editFriendship.php
@@ -0,0 +1,27 @@
+<?php
+
+session_start();
+
+require_once ("../../queries/friendship.php");
+
+if(empty($_POST["usr"]) OR empty($_POST["action"]) OR !in_array($_POST["action"], array("request", "accept", "delete"))) {
+    header('HTTP/1.1 500 Non enough arguments');
+}
+
+$friendship_status = getFriendshipStatus($_POST["usr"]);
+
+if($_POST["action"] == "request" AND $friendship_status == 0) {
+    if (!requestFriendship($_POST["usr"])) {
+        header('HTTP/1.1 500 Query (request) failed');
+    }
+} else if($_POST["action"] == "delete" AND in_array($friendship_status, array(1, 2, 3))) {
+    if (!removeFriendship($_POST["usr"])) {
+        header('HTTP/1.1 500 Query (delete) failed');
+    }
+} else if ($_POST["action"] == "accept" AND $friendship_status == 3) {
+    if (!acceptFriendship($_POST["usr"])) {
+        header('HTTP/1.1 500 Query (accept) failed');
+    }
+} else {
+    header('HTTP/1.1 500 Not the right friendship status');
+}
--- a/website/public/API/getFriendshipStatus.php
+++ b/website/public/API/getFriendshipStatus.php
@@ -0,0 +1,24 @@
+<?php
+
+# -2: Query failed.
+# -1: user1 and 2 are the same user
+# 0 : no record found
+# 1 : confirmed
+# 2 : user1 sent request (you)
+# 3 : user2 sent request (other)
+
+session_start();
+
+require_once ("../../queries/friendship.php");
+
+if(empty($_POST["usr"])) {
+    header('HTTP/1.1 500 Non enough arguments');
+}
+
+$friendship_status = getFriendshipStatus($_POST["usr"]);
+
+if($friendship_status == -2) {
+    header('HTTP/1.1 500 Query failed');
+}
+
+echo $friendship_status;
--- a/website/public/API/loadPost.php
+++ b/website/public/API/loadPost.php
@@ -0,0 +1,12 @@
+<?php
+
+require_once("../../queries/connect.php");
+require_once("../../queries/post.php");
+require_once("../../queries/checkInput.php");
+require_once("../../queries/nicetime.php");
+
+if(isset($_GET['postID'])) {
+    include("../../views/post-view.php");
+} else {
+    echo "Failed to load";
+}
--- a/website/public/js/friendButtons.js
+++ b/website/public/js/friendButtons.js
@@ -0,0 +1,27 @@
+function placeFriendButtons() {
+    $.post("API/getFriendshipStatus.php", { usr: userID })
+        .done(function(data) {
+            friendshipStatus = data;
+            $buttonContainer = $("div.friend-button-container");
+            $buttonContainer.children().remove();
+            if (friendshipStatus == -1) {
+                return;
+            } else if(friendshipStatus == 0) {
+                $buttonContainer.append($("<button class=\"green friend-button\" value=\"request\"><i class=\"fa fa-handshake-o\"></i> Bevriend</button>"));
+            } else if(friendshipStatus == 1) {
+                $buttonContainer.append($("<button class=\"red friend-button\" value=\"delete\"><i class=\"fa fa-times\"></i> Verwijder</button>"));
+            } else if(friendshipStatus == 2) {
+                $buttonContainer.append($("<button class=\"red friend-button\" value=\"delete\"><i class=\"fa fa-times\"></i> Trek verzoek in</button>"));
+            } else if(friendshipStatus == 3) {
+                $buttonContainer.append($("<button class=\"red friend-button\" value=\"delete\"><i class=\"fa fa-times\"></i> Weiger</button>"));
+                $buttonContainer.append($("<button class=\"green friend-button\" value=\"accept\"><i class=\"fa fa-check\"></i> Accepteer</button>"));
+            }
+
+            $buttonContainer.children().click(function() {
+                $.post("API/editFriendship.php", { usr: userID, action: this.value })
+                    .done(function() {
+                        placeFriendButtons();
+                    });
+            });
+        });
+}
--- a/website/public/js/masonry.js
+++ b/website/public/js/masonry.js
@@ -1,5 +1,30 @@
 margin = 20;

+// scrolling modal taken from http://stackoverflow.com/questions/10476632/how-to-scroll-the-page-when-a-modal-dialog-is-longer-than-the-screen
+function scrollbarMargin(width, overflow) {
+    $('body').css({
+        marginRight: width,
+        overflow: overflow
+    });
+    $('.profile-menu').css({
+        marginRight: width
+    });
+}
+
+function requestPost(post) {
+    $(".modal").show();
+    $.get(
+        "API/loadPost.php",
+        $(post).children("form").serialize()
+    ).done(function (data) {
+        $('.modal-default').hide();
+        var scrollBarWidth = window.innerWidth - document.body.offsetWidth;
+        scrollbarMargin(scrollBarWidth, 'hidden');
+        $('#modal-response').show();
+        $('#modal-response').html(data);
+    });
+}
+
 $(window).on("load", function() {
    console.log("LOADED");
    container = $("div.posts");
@@ -69,8 +94,14 @@ function mansonry() {
        column = $('<div class="column"></div>').append(columns[i][1]);
        console.log(column);
        container.append(column);
-
    }

    $("div.posts div.column").width(100/columnCount + "%");
+
+    $(".modal-close").click(function () {
+        $(".modal").hide();
+        scrollbarMargin(0, 'auto');
+        $('#modal-response').hide();
+        $('.modal-default').show();
+    });
 }
--- a/website/public/js/profile.js
+++ b/website/public/js/profile.js
@@ -0,0 +1,8 @@
+function loadPost(postID) {
+    $.get(
+        "API/loadPost.php",
+        $(postID).serialize()
+    ).done(function (data) {
+        $('#modal-response').innerHTML= JSON.parse(data);
+    });
+}
--- a/website/public/js/registerAndLogin.js
+++ b/website/public/js/registerAndLogin.js
@@ -12,4 +12,4 @@ function bannedAlert(){

 function emailNotConfirmed(){
    alert("Your account has not been verified yet!\nAnother email has been sent to you")
-}
+}
--- a/website/public/login.php
+++ b/website/public/login.php
@@ -6,6 +6,8 @@
    include_once("../queries/login.php");
    include_once("../queries/checkInput.php");
    include_once("../queries/emailconfirm.php");
+    include_once("../queries/requestpassword.php");
+    include_once("../queries/register.php");
 ?>
 <body>
 <?php
@@ -19,17 +21,43 @@

    // Define variables and set to empty values
    $uname = $psw ="";
-    $loginErr ="";
+    $loginErr = $resetErr ="";

-    // Trying to login
    if ($_SERVER["REQUEST_METHOD"] == "POST") {
-        try{
-            $uname = ($_POST["uname"]);
-            validateLogin($_POST["uname"], $_POST["psw"]);
-        } catch(loginException $e) {
-            $loginErr = $e->getMessage();
+        switch ($_POST["submit"]) {
+            case "login":
+                try {
+                    $uname = ($_POST["uname"]);
+                    validateLogin($_POST["uname"], $_POST["psw"]);
+                } catch(loginException $e) {
+                    $loginErr = $e->getMessage();
+                }
+                break;
+            case "reset":
+                try {
+                    resetEmail($_POST["forgotEmail"]);
+                    sendPasswordRecovery($_POST["forgotEmail"]);
+                } catch (emailException $e){
+                    $resetErr = $e->getMessage();
+                    echo "<script>
+                            window.onload = function() {
+                              $('#myModal').show();
+                            }
+                          </script>";
+                }
+                break;
+
        }
    }
+//    // Trying to login
+//    if ($_SERVER["REQUEST_METHOD"] == "POST") {
+//        try{
+//            $uname = ($_POST["uname"]);
+//            validateLogin($_POST["uname"], $_POST["psw"]);
+//        } catch(loginException $e) {
+//            $loginErr = $e->getMessage();
+//        }
+//    }

 /* This view adds login view */
 include("../views/login-view.php");
--- a/website/public/profile.php
+++ b/website/public/profile.php
@@ -2,9 +2,11 @@
 <html>
 <head>
    <?php include("../views/head.php"); ?>
-    <script src="/js/masonry.js"></script>
+    <script src="js/masonry.js"></script>
+<!--    <script src="js/profile.js"></script>-->
    <style>
        @import url("styles/profile.css");
+        @import url("styles/post-popup.css");
    </style>
 </head>
 <body>
@@ -12,6 +14,7 @@
 include("../queries/user.php");
 include("../queries/friendship.php");
 include("../queries/nicetime.php");
+include("../queries/post.php");

 if(empty($_GET["username"])) {
    $userID = $_SESSION["userID"];
@@ -24,6 +27,13 @@ $profile_friends = selectAllFriends($userID);
 $profile_groups = selectAllUserGroups($userID);
 $posts = selectAllUserPosts($userID);

+
+if ($userID == $_SESSION["userID"]) {
+    $friendship_status = -1;
+} else {
+    $friendship_status = $user["friend_status"];
+}
+
 /*
 * This view adds the main layout over the screen.
 * Header, menu, footer.
@@ -36,5 +46,13 @@ include("../views/profile.php");
 /* This adds the footer. */
 include("../views/footer.php");
 ?>
+
+<script src="js/friendButtons.js"></script>
+<script>
+    $(document).ready(function() {
+        userID = <?= $userID ?>;
+        placeFriendButtons();
+    });
+</script>
 </body>
 </html>
--- a/website/public/resetpassword.php
+++ b/website/public/resetpassword.php
@@ -0,0 +1,49 @@
+<?php
+include_once("../queries/connect.php");
+if ($_SERVER["REQUEST_METHOD"] == "GET") {
+    if (array_key_exists("u", $_GET) and array_key_exists("h", $_GET)) {
+        if (verifyLink($_GET["u"], $_GET["h"])) {
+            include "../views/resetpassword.php";
+        } else {
+            echo "Ongeldige link.";
+        }
+    } else {
+        echo "Ongeldige link";
+    }
+} elseif ($_SERVER["REQUEST_METHOD"] == "POST") {
+    if (verifyLink($_POST["u"], $_POST["h"])) {
+        if ($_POST["password"] == $_POST["password-confirm"]) {
+            changePassword();
+        }
+    }
+} else {
+    echo "Ongeldige link";
+}
+
+function changePassword() {
+    $stmt = $GLOBALS["db"]->prepare("
+        UPDATE
+            `user`
+        SET
+            `password` = :password
+        WHERE
+            `userID` = :userID
+    ");
+    $stmt->bindParam(":password", $_POST["password"]);
+    $stmt->bindParam(":userID", $_POST["u"]);
+    $stmt->execute();
+}
+
+function verifyLink(int $userID, string $hash) {
+    $stmt = $GLOBALS["db"]->prepare("
+        SELECT
+            `password`
+        FROM 
+            `user`
+        WHERE
+            `userID` = :userID
+        ");
+    $stmt->bindParam(":userID", $userID);
+    $password = $stmt->fetch()["password"];
+    return password_verify($password, $hash);
+}
--- a/website/public/styles/index.css
+++ b/website/public/styles/index.css
@@ -3,11 +3,11 @@ a.button {
    border-radius: 5px;
    color: black;
    cursor: pointer;
-    height: 50%;
    padding: 8px 20px;
-    width: 50%;
    font-family: Arial;
-    font-size: 20px;
+    font-size: 22px;
+    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
+
 }

 /* Body */
@@ -28,12 +28,13 @@ body {
 form {
    /*background-color: #a87a87;*/
    border-radius: 12px;
-    height: 75%;
+    height: 85%;
    margin: auto;
    width: 80%;
    overflow-y:auto;
 }

+
 /* inlog titel */
 h1 {
    padding: 8px;
@@ -48,6 +49,11 @@ h2 {
    font-size: 2.0em;
 }

+h3 {
+    padding: 16px;
+    text-align: center;
+    font-size: 1.5em;
+}

 input[type=text], input[type=password], input[type=email], input[type="date"] {
    box-sizing: border-box;
@@ -60,14 +66,22 @@ input[type=text], input[type=password], input[type=email], input[type="date"] {
    width: 55%;
 }

-button[type=submit] {
+.center{
+    text-align: center;
+}
+
+button {
    background-color: #C8CABD;
+    border-radius: 5px;
    color: black;
    cursor: pointer;
+    height: 50%;
+    padding: 8px 20px;
+    margin: 10px;
    font-family: Arial;
    font-size: 22px;
-    height: 30px;
-    width: 120px;
+    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
+
 }

 .error {
@@ -80,31 +94,6 @@ label {
    display: block;
 }

-.left-arrow {
-    display: inline-block;
-    position: relative;
-    background-color: #C8CABD;
-    height: 25px;
-    width: 120px;
-    padding: 3px 3px 3px 3px;
-    text-align: center;
-    border-radius: 0px 5px 5px 0px;
-    font-size: 22px;
-
-}
-.left-arrow:after {
-    content: '';
-    display: block;
-    position: absolute;
-    right: 100%;
-    top: 0;
-    bottom: 0;
-    border-top: 12px solid transparent;
-    border-right: 20px solid #C8CABD;
-    border-bottom: 12px solid transparent;
-    border-left: 0px solid transparent;
-}
-
 /* padding voor registreer container */
 .login_containerregister {
    padding: 16px;
@@ -137,24 +126,84 @@ 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: 500px;
+    height: 400px;
    margin: 34px auto;
    overflow-y: auto;
    padding: 20px;
    width: 45%;
 }

-/*.platform {
-  width: 40%;
-  margin: 34px auto;
-}*/
-
-@-webkit-keyframes animatezoom {
-    from {-webkit-transform: scale(0)}
-    to {-webkit-transform: scale(1)}
-}
-
 ul {
    font-family: Arial;
    font-size: 16px;
 }
+
+/* The Modal (background) */
+.modal {
+    display: none; /* Hidden by default */
+    position: fixed; /* Stay in place */
+    z-index: 1; /* Sit on top */
+    padding-top: 100px; /* Location of the box */
+    left: 0;
+    top: 0;
+    width: 100%; /* Full width */
+    height: 100%; /* Full height */
+    overflow: auto; /* Enable scroll if needed */
+    background-color: rgb(0,0,0); /* Fallback color */
+    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
+}
+
+/* Modal Content */
+.modal-content {
+    position: relative;
+    background-color: #FFFFFF;
+    margin: auto;
+    padding: 0;
+    border: 1px solid #888;
+    width: 500px;
+    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
+    -webkit-animation-name: animatetop;
+    -webkit-animation-duration: 0.4s;
+    animation-name: animatetop;
+    animation-duration: 0.4s
+}
+
+/* Add Animation */
+@-webkit-keyframes animatetop {
+    from {top:-300px; opacity:0}
+    to {top:0; opacity:1}
+}
+
+@keyframes animatetop {
+    from {top:-300px; opacity:0}
+    to {top:0; opacity:1}
+}
+
+/* The Close Button */
+.close {
+    color: white;
+    float: right;
+    font-size: 28px;
+    font-weight: bold;
+}
+
+.close:hover,
+.close:focus {
+    color: #000;
+    text-decoration: none;
+    cursor: pointer;
+}
+
+.modal-header {
+    padding: 2px 16px;
+    background-color: #FBC02D;
+    color: black;
+}
+
+.modal-body {padding: 2px 16px;}
+
+.modal-footer {
+    padding: 2px 16px;
+    background-color: #FBC02D;
+    color: black;
+}
--- a/website/public/styles/main.css
+++ b/website/public/styles/main.css
@@ -175,6 +175,15 @@ textarea:focus, input:focus, select:focus {
 }

 /* All buttons */
+button.red {
+    background-color: firebrick;
+}
+
+button.green {
+    background-color: forestgreen;
+}
+
+
 button,
 input[type="submit"],
 input[type="reset"] {
--- a/website/public/styles/post-popup.css
+++ b/website/public/styles/post-popup.css
@@ -0,0 +1,72 @@
+/* modal based on: http://www.w3schools.com/howto/howto_css_modals.asp */
+
+.modal {
+    display: none;
+    position: fixed;
+    top: 80px;
+    left: 256px;
+    width: calc(100% - 256px); /* Full width */
+    height: calc(100% - 80px); /* Full height */
+    background-color: rgb(0,0,0); /* Fallback color */
+    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
+    overflow-y: auto;
+}
+
+/* Modal Content/Box */
+.modal-content {
+    margin: 5% auto;
+    width: 70%; /* Could be more or less, depending on screen size */
+    overflow-y: auto;
+}
+
+.modal-close {
+    color: #aaa;
+    float: right;
+    font-size: 28px;
+    font-weight: bold;
+    margin: auto;
+}
+
+.modal-close:hover,
+.modal-close:focus {
+    color: black;
+    text-decoration: none;
+    cursor: pointer;
+}
+
+.modal-content img {
+    max-height: 100%;
+    max-width: 100%;
+}
+
+.post-header h4 {
+    font-size: 20pt;
+}
+
+.post-content {
+    margin: 30px auto;
+    width: 90%;
+}
+
+.commentfield {
+    margin-bottom: 20px;
+}
+
+.commentfield textarea {
+    width: 100%;
+}
+
+.comment {
+    padding-top: 10px;
+    padding-bottom: 10px;
+    border-top: 1px solid #4CAF50;
+}
+
+.commentinfo {
+    font-size: 10pt;
+}
+
+.commentcontent {
+    margin: 5px auto;
+    width: 95%;
+}
--- a/website/public/styles/profile.css
+++ b/website/public/styles/profile.css
@@ -78,17 +78,16 @@ div.posts .post form textarea.newpost {
    font-size: 0.8em;
 }

-input.profile-button {
+button.friend-button {
    float: right;
    height: auto;
    padding: 10px;
+    margin-left: 10px;
    border-radius: 5px;
-    background-color: #4CAF50;
-    color: #FFFFFF;
    transition-duration: 250ms;
    cursor: pointer;
 }

-.profile-button:hover {
+button.friend-button:hover {
    box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
 }
--- a/website/public/styles/resetpassword.css
+++ b/website/public/styles/resetpassword.css
@@ -0,0 +1,17 @@
+.password-change {
+    height: 100%;
+    background-color: #FBC02D;
+    margin: auto;
+}
+
+.top-logo {
+    text-align: center;
+}
+
+.item-box {
+    margin: 30px auto auto;
+    display: block;
+}
+.password-change img {
+    width: 50%;
+}
--- a/website/public/styles/search.css
+++ b/website/public/styles/search.css
@@ -25,5 +25,5 @@
 }

 li.search-item:hover{
-    background-color: #EEE;
+    background-color: #FBC02D;
 }