implement chat WIP b00tc4mp#391

staff/pere-hernandez/isdigram/data.js

@@ -23,6 +23,14 @@ var data = (function () {
         localStorage.posts = JSON.stringify(posts)
     }
 
+    function loadChats(){
+        return JSON.parse(localStorage.chats || '[]')
+    }
+
+    function saveChats(chats){
+        localStorage.chats = JSON.stringify(chats)
+    }
+
 
 
     //data
@@ -121,6 +129,46 @@ var data = (function () {
     }
 
 
+
+    //Chat-related data
+
+    function findChat(callback) {
+        var chats = loadChats()
+
+        var chat = chats.find(callback)
+
+        return chat
+    }
+
+
+    function insertChat(chat) {
+        var chats = loadChats()
+
+        chat.id = generateId()
+
+        chats.push(chat)
+
+        saveChats(chats)
+    }
+
+
+    function updateChat(chat) {
+        var chats = loadChats()
+
+        var index = chats.findIndex(function (chat2) {
+            return chat2.id === chat.id
+        })
+
+
+        if (index > -1){
+            chats.splice(index, 1, chat)
+        }
+
+        saveChats(chats)
+    }
+
+
+
     return {
         findUser: findUser,
         insertUser: insertUser,
@@ -129,7 +177,10 @@ var data = (function () {
         getAllUsers: getAllUsers,
         findPost: findPost,
         getAllPosts: getAllPosts,
-        deletePost: deletePost
+        deletePost: deletePost,
+        findChat: findChat,
+        insertChat: insertChat,
+        updateChat: updateChat
     }
 
 })()

staff/pere-hernandez/isdigram/home/index.css

@@ -148,19 +148,20 @@ ul {
 }
 
 .chat-title {
+    box-sizing: border-box;
     background-color: #AFCDEF;
     margin-top: 2vh;
     height: 8vh;
     display: flex;
     align-items: center;
     font-size: 3vh;
     padding-left: 2vw;
-    position:fixed;
     width: 100%;
 }
 
 #chat-section {
     height: 100%;
+    flex-direction: column;
     align-items: flex-start;
     justify-content: flex-start;
 }
@@ -181,7 +182,7 @@ ul {
     height: 8vh;
 }
 
-.chat-text-input {
+#chat-text-input {
     background-color: #f3f2f2;
     height: 5vh;
     margin: 0;

staff/pere-hernandez/isdigram/home/index.js

@@ -161,19 +161,26 @@
                 userLi.innerHTML = user.username
 
                 userLi.addEventListener('click',  function () {
+
+                    var chat = logic.createChat(user)
+                    chatSection.innerHTML = ''
                     userList.style.display = 'none'
                     chatButton.style.display = ''
 
                     var chatTitle = document.createElement('div')
                     chatTitle.classList.add('chat-title')
                     chatTitle.innerHTML = user.username
 
+                    var messageSection = document.createElement('section')
+                    messageSection.classList.add('message-section')
+                    messageSection.innerHTML = 'ijhvk,'
+
                     var chatForm = document.createElement('form')
                     chatForm.classList.add('chat-form')
 
                     var chatInputText = document.createElement('input')
                     chatInputText.type = 'text'
-                    chatInputText.classList.add('chat-text-input')
+                    chatInputText.setAttribute('id', 'chat-text-input')
 
                     var sendMessageButton = document.createElement('button')
                     sendMessageButton.type = 'submit'
@@ -187,8 +194,21 @@
 
                     chatForm.append(chatInputText, sendMessageButton)
 
-                    chatSection.append(chatTitle, chatForm)
+                    chatSection.append(chatTitle, messageSection, chatForm)
                     chatSection.style.display = 'flex'
+
+                    chatForm.onsubmit = function (){
+                        var messageImput = document.getElementById('chat-text-input')
+                        var messageText = messageImput.value
+
+                        try {
+                            var message = logic.createMessage(messageText, user.username)
+
+                            logic.addMessageToChat(message, chat)
+                        } catch (error) {
+
+                        }
+                    }
                 })
 
                 userList.appendChild(userLi)

staff/pere-hernandez/isdigram/logic.js

@@ -128,7 +128,7 @@ var logic = (function () {
             author: sessionStorage.userId,
             photo: photo,
             comment: comment,
-            date: new Date().toLocaleDateString('en-CA'),
+            date: new Date().toLocaleDateString('en-CA')
         }
 
         data.insertPost(post)
@@ -161,7 +161,46 @@ var logic = (function () {
         data.deletePost(function (post) {
             return post.id === postId
         })
-    }    
+    }
+
+
+    //CHAT-related functions
+
+    function createChat(user){
+        var chat = {
+            users: [sessionStorage.userId, user.id],
+            messages: [],
+            date: new Date().toLocaleDateString('en-CA')
+        }
+
+        data.insertChat(chat)
+
+        return chat
+    }
+
+    function addMessageToChat (message, chat){
+        var chat = data.findChat(function (chat1){
+            return chat1.id === chat.id
+        })
+
+        chat.messages.push(message)
+
+        data.updateChat(chat)
+    }
+
+
+
+    //MESSAGE-related functions
+
+    function createMessage(message, reciever){
+        var message = {
+            text: message,
+            author: sessionStorage.userId,
+            reciever: reciever,
+            time: new Date().toLocaleDateString('en-CA')
+        }
+        return message
+    }
 
     return {
         registerUser: registerUser,
@@ -173,6 +212,9 @@ var logic = (function () {
         checkLoggedInStatus: checkLoggedInStatus,
         createPost: createPost,
         retrievePosts: retrievePosts,
-        deletePost: deletePost
+        deletePost: deletePost,
+        createChat: createChat,
+        addMessageToChat: addMessageToChat,
+        createMessage: createMessage
     }
 }) ()