From b71cf367984e88df4489da5007aa52b3ed801f88 Mon Sep 17 00:00:00 2001
From: Lars van Hijfte <larsvanhijfte@hotmail.com>
Date: Thu, 19 Jan 2017 11:08:55 +0100
Subject: [PATCH] Fixed chat

It now has a userID again,
displays which user you are chatting withhover over user changes different background
---
 website/public/{ => API}/loadMessages.php |  2 +-
 website/public/{ => API}/sendMessage.php  |  2 +-
 website/public/js/chat.js                 | 13 +++++++++++--
 website/public/styles/chat.css            |  5 +++++
 website/public/styles/menu.css            |  7 ++++++-
 website/queries/friendship.php            |  3 ++-
 website/queries/header.php                | 13 ++++++++-----
 website/queries/private_message.php       |  2 +-
 website/views/chat-view.php               | 10 ++--------
 9 files changed, 37 insertions(+), 20 deletions(-)
 rename website/public/{ => API}/loadMessages.php (79%)
 rename website/public/{ => API}/sendMessage.php (86%)

diff --git a/website/public/loadMessages.php b/website/public/API/loadMessages.php
similarity index 79%
rename from website/public/loadMessages.php
rename to website/public/API/loadMessages.php
index fb9f129..532c53f 100644
--- a/website/public/loadMessages.php
+++ b/website/public/API/loadMessages.php
@@ -1,6 +1,6 @@
 <?php
 
-include_once("../queries/private_message.php");
+include_once("../../queries/private_message.php");
 
 if (isset($_POST["lastID"]) && $_POST["lastID"] != "") {
 
diff --git a/website/public/sendMessage.php b/website/public/API/sendMessage.php
similarity index 86%
rename from website/public/sendMessage.php
rename to website/public/API/sendMessage.php
index e555e2a..4f69023 100644
--- a/website/public/sendMessage.php
+++ b/website/public/API/sendMessage.php
@@ -1,6 +1,6 @@
 <?php
 
-include_once("../queries/private_message.php");
+include_once("../../queries/private_message.php");
 
 if (isset($_POST["destination"]) &&
     isset($_POST["content"])) {
diff --git a/website/public/js/chat.js b/website/public/js/chat.js
index cf33f69..75eb32e 100644
--- a/website/public/js/chat.js
+++ b/website/public/js/chat.js
@@ -1,10 +1,12 @@
 $(document).ready(function() {
     loadMessages();
+    sayEmpty();
+    $(".chat-field").hide();
 });
 
 function loadMessages() {
     $.post(
-        "loadMessages.php",
+        "API/loadMessages.php",
         $("#lastIDForm").serialize()
     ).done(function(data) {
         if (data && data != "[]") {
@@ -23,7 +25,7 @@ function loadMessages() {
 function sendMessage() {
     console.log($("#sendMessageForm").serialize());
     $.post(
-        "sendMessage.php",
+        "API/sendMessage.php",
         $("#sendMessageForm").serialize()
     ).done(function( data ) {
         console.log(data);
@@ -51,7 +53,14 @@ function addMessages(messages) {
 }
 
 function switchUser(userID) {
+    $(".chat-field").show();
     $(".destinationID").val(userID);
     $("#chat-history").html("");
     $("#lastID").val("");
+    $(".chat-left .friend-item").removeClass("active-friend-chat");
+    $(".chat-left #friend-item-" + userID).addClass("active-friend-chat");
+}
+
+function sayEmpty() {
+    $("#chat-history").html("Begin nu met chatten!");
 }
\ No newline at end of file
diff --git a/website/public/styles/chat.css b/website/public/styles/chat.css
index 8f486bb..e2fa7c9 100644
--- a/website/public/styles/chat.css
+++ b/website/public/styles/chat.css
@@ -88,4 +88,9 @@
     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;
 }
\ No newline at end of file
diff --git a/website/public/styles/menu.css b/website/public/styles/menu.css
index 45163de..6cdae65 100644
--- a/website/public/styles/menu.css
+++ b/website/public/styles/menu.css
@@ -30,9 +30,14 @@
     cursor: pointer;
 }
 
+.friend-item:hover {
+    background: #845663;
+    color: white;
+}
+
 .menu button {
     background: none;
-    color: #333;
+    color: inherit;
     width: 100%;
     height: 100%;
     padding: 0;
diff --git a/website/queries/friendship.php b/website/queries/friendship.php
index 14fa6ee..17bbef4 100644
--- a/website/queries/friendship.php
+++ b/website/queries/friendship.php
@@ -4,10 +4,11 @@ require("connect.php");
 function selectAllFriends($db, $userID) {
     $stmt = $db->prepare("
         SELECT
+            `userID`,
             `username`,
             IFNULL(
                 `profilepicture`,
-                'img/notbad.png'
+                'img/notbad.jpg'
             ) AS profilepicture,
             `onlinestatus`,
             `role`
diff --git a/website/queries/header.php b/website/queries/header.php
index 5e78291..1743552 100644
--- a/website/queries/header.php
+++ b/website/queries/header.php
@@ -2,13 +2,16 @@
 function getHeaderInfo() {
     $stmt = $GLOBALS["db"]->prepare("
     SELECT
-      `fname`,
-      `lname`,
-      `profilepicture`
+        `fname`,
+        `lname`,
+        IFNULL(
+            `profilepicture`,
+            'img/notbad.jpg'
+        ) AS profilepicture
     FROM
-      `user`
+        `user`
     WHERE
-      `userID` = :userID
+        `userID` = :userID
     ");
     $stmt->bindParam(":userID", $_SESSION["userID"]);
     $stmt->execute();
diff --git a/website/queries/private_message.php b/website/queries/private_message.php
index 2d953c5..a32f931 100644
--- a/website/queries/private_message.php
+++ b/website/queries/private_message.php
@@ -1,6 +1,6 @@
 <?php
 
-include_once("connect.php");
+require_once("connect.php");
 
 session_start();
 
diff --git a/website/views/chat-view.php b/website/views/chat-view.php
index a3acd4c..b63d6b8 100644
--- a/website/views/chat-view.php
+++ b/website/views/chat-view.php
@@ -28,7 +28,7 @@
 
                     // Echo the friend.
                     echo "
-                        <li class='friend-item' onclick='switchUser(\"$userID\")'>
+                        <li class='friend-item' id='friend-item-$userID' onclick='switchUser(\"$userID\")'>
                             <div class='friend'>
                                 <img alt='PF' class='profile-picture' src='$pf'/>
                                 $username
@@ -38,12 +38,6 @@
                 }
                 ?>
             </ul>
-            <!--            <a href="#">-->
-            <!--                <div class="chat-conversation">-->
-            <!--                    <img class="profile-picture" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTDnuRSeeyPve7KwDvJJ6OBzj3gyghwLcE2z9kZeYBOyZavh3mw">-->
-            <!--                    Rudolf Leslo-->
-            <!--                </div>-->
-            <!--            </a>-->
         </nav>
         <div class="chat-right right">
             <div id="chat-history" class="chat-history platform">
@@ -74,7 +68,7 @@
                         <input type="text"
                                name="content"
                                id="newContent"
-                               placeholder="Reageer..."
+                               placeholder="Schrijf een bericht..."
                                autofocus
                                required
                         />