Several fixes and improvements, mostly for chat encryption integration

4 files changed, 112 insertions, 79 deletions

diff --git a/main/app/sprinkles/core/assets/SiteAssets/css/main.css b/main/app/sprinkles/core/assets/SiteAssets/css/main.css
index 42e0af8..f3a71cd 100644
--- a/main/app/sprinkles/core/assets/SiteAssets/css/main.css
+++ b/main/app/sprinkles/core/assets/SiteAssets/css/main.css
@@ -21,6 +21,7 @@ GENERAL
 ::-webkit-scrollbar {
     width: 0;
     background: transparent;
+    display: none;
 }
 
 html, body {
@@ -110,7 +111,8 @@ FEED WINDOW
     max-height: -webkit-calc(100% - 155px);
     max-width: 100%;
     margin: 15px;
-    overflow-y: scroll;
+    overflow-y: auto;
+    overflow-x: hidden;
 }
 
 .FeedImage {
diff --git a/main/app/sprinkles/core/assets/SiteAssets/js/chat.js b/main/app/sprinkles/core/assets/SiteAssets/js/chat.js
index fc3be10..2125296 100644
--- a/main/app/sprinkles/core/assets/SiteAssets/js/chat.js
+++ b/main/app/sprinkles/core/assets/SiteAssets/js/chat.js
@@ -24,7 +24,7 @@ function InitializeChatServer() {
     var ChatMessages = $("#ChatMessages");
     var TypingIndicatorAnimationElement = "<div class='spinner'><div class='bounce1'></div><div class='bounce2'></div><div class='bounce3'></div></div>";
 
-    var ChatSocket = new WebSocket('wss://marvinborner.ddnss.de:1337');
+    const ChatSocket = new WebSocket('wss://marvinborner.ddnss.de:1337');
     ChatSocket.onerror = function () {
         setTimeout(function () {
             console.log("%c[CHATSOCKET LOGGER] Connection failed. Trying again...", "color: red");
@@ -73,14 +73,13 @@ function InitializeChatServer() {
             }
 
             if (ServerMessage === false) { // NO SERVER MESSAGE -> SENT BY USER
-
                 // DECRYPT MESSAGE
                 options = {
                     message: openpgp.message.readArmored("-----BEGIN PGP MESSAGE-----\r\nVersion: OpenPGP.js v3.0.9\r\nComment: https://openpgpjs.org\r\n\r\n" + Message + "\r\n\-----END PGP MESSAGE-----\r\n"),
                     publicKeys: openpgp.key.readArmored(PublicKey[Username]).keys, // FOR VERIFICATION
                     privateKeys: [privKeyObj]
                 };
-                openpgp.decrypt(options).then(function(plaintext) {
+                openpgp.decrypt(options).then(function (plaintext) {
                     plaintext ? console.log("%c[ENCRYPTION LOGGER] Decrypting succeeded!", "font-family: monospace; white-space: pre; display: inline-block; border-radius: 10px; padding: 2px; color: #20c20e; background-color: black;") : console.log("%c[ENCRYPTION LOGGER] Decrypting failed!", "font-family: monospace; white-space: pre; display: inline-block; border-radius: 10px; padding: 2px; color: red; background-color: black;");
                     DecryptedMessage = plaintext.data;
                     if (WasHimself === true) { // -> MESSAGE WAS FROM HIMSELF -> Don't write to chat, as its done directly (on enter function at the bottom, for performance)
@@ -204,8 +203,13 @@ function InitializeChatServer() {
 
         // SUBSCRIBE TO CHAT
         SubscribeTextInput.keyup(function (e) {
-            if (e.keyCode === 13 && SubscribeTextInput.val().length > 0) {
-                subscribe(SubscribeTextInput.val());
+            if (ChatSocket.readyState === 1) {
+                if (e.keyCode === 13 && SubscribeTextInput.val().length > 0) {
+                    subscribe(SubscribeTextInput.val());
+                }
+            } else {
+                console.log("%c[CHATSOCKET LOGGER] Not connected to Websocket anymore! Trying to connect again...", "color: red");
+                InitializeChatServer();
             }
         });
 
@@ -217,66 +221,70 @@ function InitializeChatServer() {
 
         // SEND MESSAGE FROM INPUT FIELD
         ChatTextInput.keyup(function (e) {
-            if (e.keyCode === 13 && ChatTextInput.val().length > 0) {
-
-                var LastMessage = $(".MessageWrapper.Normal:last .ChatMessage");
-                if (!LastMessage.hasClass("MessageSent")) { // CHECK IF PREVIOUS MESSAGE WAS FROM HIMSELF TOO -> IF NOT, CREATE NEW 'ALONE' MESSAGE
-                    ChatMessages.append("<div class='MessageWrapper Normal'><div class='ChatMessage MessageSent AloneMessage animated fadeInRight'>" + ChatTextInput.val() + "</div></div>");
-                } else if (LastMessage.hasClass("MessageSent")) { // IF PREVIOUS MESSAGE WAS FROM HIMSELF TOO -> CREATE WITH CORRESPONDING CLASSES FOR DESIGN
-                    ChatMessages.append("<div class='MessageWrapper Normal'><div class='ChatMessage MessageSent BottomMessage animated fadeInRight'>" + ChatTextInput.val() + "</div></div>");
-                    if (LastMessage.hasClass("AloneMessage")) {
-                        LastMessage.removeClass("AloneMessage");
-                        LastMessage.addClass("TopMessage");
-                    } else if (LastMessage.hasClass("BottomMessage")) {
-                        LastMessage.removeClass("BottomMessage");
-                        LastMessage.addClass("MiddleMessage");
+            if (ChatSocket.readyState === 1) {
+                if (e.keyCode === 13 && ChatTextInput.val().length > 0) {
+                    var LastMessage = $(".MessageWrapper.Normal:last .ChatMessage");
+                    if (!LastMessage.hasClass("MessageSent")) { // CHECK IF PREVIOUS MESSAGE WAS FROM HIMSELF TOO -> IF NOT, CREATE NEW 'ALONE' MESSAGE
+                        ChatMessages.append("<div class='MessageWrapper Normal'><div class='ChatMessage MessageSent AloneMessage animated fadeInRight'>" + ChatTextInput.val() + "</div></div>");
+                    } else if (LastMessage.hasClass("MessageSent")) { // IF PREVIOUS MESSAGE WAS FROM HIMSELF TOO -> CREATE WITH CORRESPONDING CLASSES FOR DESIGN
+                        ChatMessages.append("<div class='MessageWrapper Normal'><div class='ChatMessage MessageSent BottomMessage animated fadeInRight'>" + ChatTextInput.val() + "</div></div>");
+                        if (LastMessage.hasClass("AloneMessage")) {
+                            LastMessage.removeClass("AloneMessage");
+                            LastMessage.addClass("TopMessage");
+                        } else if (LastMessage.hasClass("BottomMessage")) {
+                            LastMessage.removeClass("BottomMessage");
+                            LastMessage.addClass("MiddleMessage");
+                        }
                     }
-                }
 
-                // USER USUALLY STOPS TYPING ON SENDING -> CHANGE STATE TO FALSE
-                sendTypingState(false);
-                isTyping = false;
-                clearTimeout(typingTimer);
+                    // USER USUALLY STOPS TYPING ON SENDING -> CHANGE STATE TO FALSE
+                    sendTypingState(false);
+                    isTyping = false;
+                    clearTimeout(typingTimer);
 
-                // ENCRYPT AND SEND MESSAGE WITH OWN PUBLIC KEY
-                options = {
-                    data: ChatTextInput.val(),
-                    publicKeys: openpgp.key.readArmored(PublicKey[ReceiversUsername]).keys,
-                    privateKeys: [privKeyObj] // FOR SIGNING
-                };
-                openpgp.encrypt(options).then(function (Encrypted) {
-                    EncryptedMessage = Encrypted.data.substr(91).slice(0,-29); // SLICING FOR DATABASE SAVING (LESS DATA)
-                    console.log("%c[ENCRYPTION LOGGER]\nEncrypted message for sender: \n\n" + EncryptedMessage, "font-family: monospace; white-space: pre; display: inline-block; border-radius: 10px; padding: 5px; color: #20c20e; background-color: black;");
+                    // ENCRYPT AND SEND MESSAGE WITH OWN PUBLIC KEY
+                    options = {
+                        data: ChatTextInput.val(),
+                        publicKeys: openpgp.key.readArmored(PublicKey[ReceiversUsername]).keys,
+                        privateKeys: [privKeyObj] // FOR SIGNING
+                    };
+                    openpgp.encrypt(options).then(function (Encrypted) {
+                        EncryptedMessage = Encrypted.data.substr(91).slice(0, -29); // SLICING FOR DATABASE SAVING (LESS DATA)
+                        console.log("%c[ENCRYPTION LOGGER]\nEncrypted message for sender: \n\n" + EncryptedMessage, "font-family: monospace; white-space: pre; display: inline-block; border-radius: 10px; padding: 5px; color: #20c20e; background-color: black;");
 
-                    ChatSocket.send(JSON.stringify({
-                        ClientMessageType: "ChatMessage",
-                        MessageType: "Private",
-                        EncryptedWithKey: ReceiversUsername,
-                        Message: EncryptedMessage
-                    }));
-                    ChatTextInput.val("");
-                    ChatTextInput.val("");
-                });
+                        ChatSocket.send(JSON.stringify({
+                            ClientMessageType: "ChatMessage",
+                            MessageType: "Private",
+                            EncryptedWithKey: ReceiversUsername,
+                            Message: EncryptedMessage
+                        }));
+                        ChatTextInput.val("");
+                        ChatTextInput.val("");
+                    });
 
-                // ENCRYPT AND SEND MESSAGE WITH RECEIVERS PUBLIC KEY
-                options = {
-                    data: ChatTextInput.val(),
-                    publicKeys: openpgp.key.readArmored(PublicKey[ReceiversUsername]).keys,
-                    privateKeys: [privKeyObj] // FOR SIGNING
-                };
-                openpgp.encrypt(options).then(function (Encrypted) {
-                    EncryptedMessage = Encrypted.data.substr(91).slice(0,-29); // SLICING FOR DATABASE SAVING (LESS DATA)
-                    console.log("%c[ENCRYPTION LOGGER]\nEncrypted message for receiver: \n\n" + EncryptedMessage, "font-family: monospace; white-space: pre; display: inline-block; border-radius: 10px; padding: 5px; color: #20c20e; background-color: black;");
+                    // ENCRYPT AND SEND MESSAGE WITH RECEIVERS PUBLIC KEY
+                    options = {
+                        data: ChatTextInput.val(),
+                        publicKeys: openpgp.key.readArmored(PublicKey[ReceiversUsername]).keys,
+                        privateKeys: [privKeyObj] // FOR SIGNING
+                    };
+                    openpgp.encrypt(options).then(function (Encrypted) {
+                        EncryptedMessage = Encrypted.data.substr(91).slice(0, -29); // SLICING FOR DATABASE SAVING (LESS DATA)
+                        console.log("%c[ENCRYPTION LOGGER]\nEncrypted message for receiver: \n\n" + EncryptedMessage, "font-family: monospace; white-space: pre; display: inline-block; border-radius: 10px; padding: 5px; color: #20c20e; background-color: black;");
 
-                    ChatSocket.send(JSON.stringify({
-                        ClientMessageType: "ChatMessage",
-                        MessageType: "Private",
-                        EncryptedWithKey: ReceiversUsername,
-                        Message: EncryptedMessage
-                    }));
-                    ChatTextInput.val("");
-                    ChatTextInput.val("");
-                });
+                        ChatSocket.send(JSON.stringify({
+                            ClientMessageType: "ChatMessage",
+                            MessageType: "Private",
+                            EncryptedWithKey: ReceiversUsername,
+                            Message: EncryptedMessage
+                        }));
+                        ChatTextInput.val("");
+                        ChatTextInput.val("");
+                    });
+                } else {
+                    console.log("%c[CHATSOCKET LOGGER] Not connected to Websocket anymore! Trying to connect again...", "color: red");
+                    InitializeChatServer();
+                }
             }
         });
     };
diff --git a/main/app/sprinkles/core/assets/SiteAssets/js/main.js b/main/app/sprinkles/core/assets/SiteAssets/js/main.js
index 08d5888..5d35bae 100644
--- a/main/app/sprinkles/core/assets/SiteAssets/js/main.js
+++ b/main/app/sprinkles/core/assets/SiteAssets/js/main.js
@@ -173,7 +173,7 @@ UserSearchBar.keyup(function () {
 
                 alerts.ufAlerts().ufAlerts('fetch');
 
-                SearchResults.append("<img class='Avatar' data-src='" + answer.avatar + "' data-caching-key='" + answer.user_name + "_avatar_cached'/><div class='UsersFullName'>" + answer.full_name + "</div>");
+                SearchResults.append("<img class='Avatar' src='" + answer.avatar + "'/><div class='UsersFullName'>" + answer.full_name + "</div>");
                 //$(".SearchResults .Avatar").imageCaching(); // refresh
             },
             error: function () {
diff --git a/main/app/sprinkles/core/assets/SiteAssets/php/Chatserver/src/ChatProcessor.php b/main/app/sprinkles/core/assets/SiteAssets/php/Chatserver/src/ChatProcessor.php
index 41ce564..5490b0a 100644
--- a/main/app/sprinkles/core/assets/SiteAssets/php/Chatserver/src/ChatProcessor.php
+++ b/main/app/sprinkles/core/assets/SiteAssets/php/Chatserver/src/ChatProcessor.php
@@ -6,7 +6,6 @@ namespace Websocket;
 use Ratchet\ConnectionInterface;
 use Ratchet\WebSocket\MessageComponentInterface;
 use Ratchet\RFC6455\Messaging\MessageInterface;
-use Nubs\RandomNameGenerator\Alliteration;
 
 class ChatProcessor implements MessageComponentInterface
 {
@@ -16,6 +15,7 @@ class ChatProcessor implements MessageComponentInterface
     private $userID;
     private $userInfo;
     private $verifiedUsers;
+    private $receiverID;
 
     public function __construct() {
         $this->clients = new \SplObjectStorage;
@@ -23,6 +23,7 @@ class ChatProcessor implements MessageComponentInterface
         $this->users = []; // TEMPORARY WEBSOCKET USER
         $this->userID = []; // USER ID WHICH IS DECLARED IN DB
         $this->userInfo = []; // JSON CONTAINING ALL INFO OF USER FROM DB
+        $this->receiverID = [];
         $this->verifiedUsers = [];
     }
 
@@ -51,7 +52,7 @@ class ChatProcessor implements MessageComponentInterface
                         $MessageObject->ServerMessage = TRUE;
                         $MessageObject->ServerMessageType = "Verify";
                         $MessageObject->Granted = TRUE;
-                        $MessageObject->Receiver = $this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name;
+                        if (isset($this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name)) $MessageObject->Receiver = $this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name;
                         $this->verifiedUsers[$conn->resourceId] = TRUE;
                         $this->users[$conn->resourceId]->send(json_encode($MessageObject, TRUE));
                     } else {
@@ -59,7 +60,7 @@ class ChatProcessor implements MessageComponentInterface
                         $MessageObject->ServerMessage = TRUE;
                         $MessageObject->ServerMessageType = "Verify";
                         $MessageObject->Granted = FALSE;
-                        $MessageObject->Receiver = $this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name;
+                        if (isset($this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name)) $MessageObject->Receiver = $this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name;
                         $this->verifiedUsers[$conn->resourceId] = FALSE;
                         $this->users[$conn->resourceId]->send(json_encode($MessageObject, TRUE));
                         $this->onClose($conn);
@@ -69,7 +70,7 @@ class ChatProcessor implements MessageComponentInterface
                     $MessageObject->ServerMessage = TRUE;
                     $MessageObject->ServerMessageType = "Verify";
                     $MessageObject->Granted = FALSE;
-                    $MessageObject->Receiver = $this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name;
+                    if (isset($this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name)) $MessageObject->Receiver = $this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name;
                     $this->verifiedUsers[$conn->resourceId] = FALSE;
                     $this->users[$conn->resourceId]->send(json_encode($MessageObject, TRUE));
                     $this->onClose($conn);
@@ -80,17 +81,43 @@ class ChatProcessor implements MessageComponentInterface
             switch ($data->ClientMessageType) {
                 case "Subscribe": // USER SUBSCRIBED
                     //if (!in_array(array_flip($this->userID)[$this->userID[$conn->resourceId]], (isset(array_flip($this->channels)[$data->Channel]) ? array_flip($this->channels)[$data->Channel] : array()))) { // ONLY JOIN IF NOT ALREADY JOINED
-                        $this->channels[$conn->resourceId] = $data->Channel;
+                    $this->channels[$conn->resourceId] = $data->Channel;
+                    foreach ($this->channels as $id => $channel) {
+                        if ($this->channels[$conn->resourceId] == $channel) {
+                            $MessageObject = new \stdClass();
+                            $MessageObject->ServerMessage = TRUE;
+                            $MessageObject->ServerMessageType = "GroupJoin";
+                            $MessageObject->GroupName = $channel;
+                            $MessageObject->Receiver = $this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name;
+                            $MessageObject->Username = $this->userInfo[$conn->resourceId]->user_name;
+                            $MessageObject->Fullname = $this->userInfo[$conn->resourceId]->full_name;
+                            $MessageObject->Avatar = $this->userInfo[$conn->resourceId]->avatar;
+                            if ($id === $conn->resourceId) {
+                                $MessageObject->WasHimself = TRUE;
+                            } else {
+                                $MessageObject->WasHimself = FALSE;
+                            }
+                            $MessageJson = json_encode($MessageObject, TRUE);
+                            $this->users[$id]->send($MessageJson);
+                        }
+                    }
+                    break;
+                case "SetReceiver": // USER CLICKED ON NEW CHAT
+
+                    break;
+                case "ChatMessage": // MESSAGE RECEIVED
+                    if (isset($this->channels[$conn->resourceId])) {
+                        $target = $this->channels[$conn->resourceId]; // target = ALL CHANNELS TO SEND THE MESSAGE
                         foreach ($this->channels as $id => $channel) {
-                            if ($this->channels[$conn->resourceId] == $channel) {
+                            if ($channel == $target) {
                                 $MessageObject = new \stdClass();
-                                $MessageObject->ServerMessage = TRUE;
-                                $MessageObject->ServerMessageType = "GroupJoin";
+                                $MessageObject->ServerMessage = FALSE;
                                 $MessageObject->GroupName = $channel;
-                                $MessageObject->Receiver = $this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name;
+                                if (isset($this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name)) $MessageObject->Receiver = $this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name;
                                 $MessageObject->Username = $this->userInfo[$conn->resourceId]->user_name;
                                 $MessageObject->Fullname = $this->userInfo[$conn->resourceId]->full_name;
                                 $MessageObject->Avatar = $this->userInfo[$conn->resourceId]->avatar;
+                                $MessageObject->Message = htmlspecialchars($data->Message);
                                 if ($id === $conn->resourceId) {
                                     $MessageObject->WasHimself = TRUE;
                                 } else {
@@ -98,10 +125,12 @@ class ChatProcessor implements MessageComponentInterface
                                 }
                                 $MessageJson = json_encode($MessageObject, TRUE);
                                 $this->users[$id]->send($MessageJson);
+                                $this->getHttpCode("https://beam-messenger.de/wormhole/" . file("/AccessToken.txt", FILE_IGNORE_NEW_LINES)["0"] . "/new/message/" . $this->userInfo[$conn->resourceId]->id . "/" . $this->userInfo[array_flip($this->channels)[$target]]->id . "/" . $data->Message);
                             }
                         }
+                    }
                     break;
-                case "ChatMessage": // MESSAGE RECEIVED
+                case "GroupMessage": // GROUP MESSAGE RECEIVED -- RESERVED FOR LATER USE (CHANNEL BASED RIGHT NOW)
                     if (isset($this->channels[$conn->resourceId])) {
                         $target = $this->channels[$conn->resourceId]; // target = ALL CHANNELS TO SEND THE MESSAGE
                         foreach ($this->channels as $id => $channel) {
@@ -109,7 +138,7 @@ class ChatProcessor implements MessageComponentInterface
                                 $MessageObject = new \stdClass();
                                 $MessageObject->ServerMessage = FALSE;
                                 $MessageObject->GroupName = $channel;
-                                $MessageObject->Receiver = $this->userInfo[array_flip($this->channels)[$target]]->user_name;
+                                if (isset($this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name)) $MessageObject->Receiver = $this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name;
                                 $MessageObject->Username = $this->userInfo[$conn->resourceId]->user_name;
                                 $MessageObject->Fullname = $this->userInfo[$conn->resourceId]->full_name;
                                 $MessageObject->Avatar = $this->userInfo[$conn->resourceId]->avatar;
@@ -126,12 +155,6 @@ class ChatProcessor implements MessageComponentInterface
                         }
                     }
                     break;
-                case "GroupMessage": // GROUP MESSAGE RECEIVED -- RESERVED FOR LATER USE
-                    if (isset($this->channels[$conn->resourceId])) {
-                        $target = $this->channels[$conn->resourceId];
-                        // nothing
-                    }
-                    break;
                 case "TypingState": // USER STARTED TYPING
                     if (isset($this->channels[$conn->resourceId])) {
                         $target = $this->channels[$conn->resourceId];
@@ -141,7 +164,7 @@ class ChatProcessor implements MessageComponentInterface
                                 $MessageObject->ServerMessage = TRUE;
                                 $MessageObject->ServerMessageType = "TypingState";
                                 $MessageObject->GroupName = $channel;
-                                $MessageObject->Receiver = $this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name;
+                                if (isset($this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name)) $MessageObject->Receiver = $this->userInfo[array_flip($this->channels)[$this->channels[$conn->resourceId]]]->user_name;
                                 $MessageObject->Username = $this->userInfo[$conn->resourceId]->user_name;
                                 $MessageObject->Fullname = $this->userInfo[$conn->resourceId]->full_name;
                                 $MessageObject->Avatar = $this->userInfo[$conn->resourceId]->avatar;