From fd6de29a89a745aa576d62bc1a8adddbcf54fd50 Mon Sep 17 00:00:00 2001 From: Rohan Sircar Date: Wed, 6 Nov 2019 19:42:43 +0530 Subject: [PATCH] Done get and post logic Also added an initial input box for passphrase which is set to hidden later --- chatto/src/main/resources/static/js/chat.js | 331 +++++++----------- chatto/src/main/resources/templates/chat.html | 28 +- 2 files changed, 144 insertions(+), 215 deletions(-) diff --git a/chatto/src/main/resources/static/js/chat.js b/chatto/src/main/resources/static/js/chat.js index e1f3d9e..11325e7 100644 --- a/chatto/src/main/resources/static/js/chat.js +++ b/chatto/src/main/resources/static/js/chat.js @@ -55,6 +55,7 @@ var userBoxes = document.getElementsByName('user-box'); for (let i = 0; i < userBoxes.length; i++) { userBoxes[i].addEventListener('click', function() { let current = document.getElementsByClassName('user-box active'); + let passphrase = passphraseInput.value; if (current.length > 0) { current[0].className = current[0].className.replace(" active", ""); @@ -63,202 +64,29 @@ for (let i = 0; i < userBoxes.length; i++) { else if (current.length == 0) { document.getElementById('no-user-selected').hidden = true; document.getElementById('chat-card').hidden = false; + let elem = document.getElementById('passphrase-initial'); + passphrase = elem.value; + elem.hidden = true; } - let words = this.innerText.split("\n"); - // console.log(words); - // let children = this.children; - // let userName = children[0].innerText; let userName = this.querySelectorAll('span')[1].innerText; document.getElementById('user-name-span').innerText = userName; - populateMessages(userName); + populateMessages(userName, passphrase); + sessionStorage.setItem('selectedUser', userName); this.className += " active"; }) } -function populateMessages(userName) -{ - console.log(userName); -} - -// var lastMessageTimeStamp; - -// console.log(authToken); -// 'Basic ' + btoa("hmm" + ":" + "hmm") - -Handlebars.registerHelper('avatar', function() { - return '
'; -}); - - -// var user; -function getSelectedUser() { - for (var i = 0; i < toUserRadios.length; i++) { - if (toUserRadios[i].checked) { - let user = toUserRadios[i].value; - console.log('sending to user = ' + user); - isCheckedUser = true; - return user; - } - } - -} - -// console.log('Credentials = ' + JSON.parse(sessionStorage.getItem('credentials'))); - -function handleChatForm() { - let chatInput = document.getElementById('chatInput'); - let myForm = document.getElementById('chatMessageForm'); - myForm.addEventListener( - 'submit', - function(e) { - e.preventDefault(); - let user = getSelectedUser(); - - if (!myForm.checkValidity()) { - console.log("error"); - myForm.classList.add('was-validated'); - return; - } - myForm.classList.add('was-validated'); - - if (!isCheckedUser) { - window.alert('please select a user'); - return; - } - // console.log('second user = ' + user); - let messageContent = chatInput.value; - let localDate = new Date(); - let messageLine = sprintf('%s %s %s: %s', localDate.toLocaleDateString(), localDate.toLocaleTimeString(), username, messageContent); - chatTextArea.append(messageLine + "\n"); - chatTextArea.scrollTop = chatTextArea.scrollHeight; - // let messageCipher = sjcl.encrypt("password", messageContent); - let messageCipher = sjcl.encrypt(passphraseInput.value, messageContent, { mode: "gcm", ts: 128, adata: "", iter: iterations }); - let messageCipherJson = JSON.parse(messageCipher); - // let messageCipherSpring = JSON.stringify(messageCipherJson); - // console.log('message cipher json ' + messageCipherJson); - // console.log('message cipher string ' + messageCipherSpring); - let chatMessageDTO = { - "toUser": user, - "messageCipher": messageCipherJson - } - // console.log(chatMessageDTO); - // console.log(JSON.stringify(chatMessageDTO)); - messageSend(JSON.stringify(chatMessageDTO)); - // sessionStorage.setItem('passphrase', passphraseInput.value); - // console.log(sessionStorage.getItem('passphrase')); - - - }) -} - -function messageSend(chatMessageDTO) { - let headers = new Headers(); - // console.log("Token = " + btoa("hmm" + ":" + "hmm")) - - // headers.append('Accept','application/json') - headers.append('Content-Type', 'application/json'); - headers.append('Authorization', authToken); - fetch(postNewMessageUrl, { - method: 'POST', - headers: headers, - body: chatMessageDTO - }) - .then(response => console.log(response)); -} - -// function getMessages(toUser) { -// let headers = new Headers(); -// let messageLog = []; -// // console.log("Token = " + btoa("hmm" + ":" + "hmm")) - -// // headers.append('Accept','application/json') -// // headers.append('Content-Type', 'application/json'); -// headers.append('Authorization', 'Basic ' + btoa("hmm" + ":" + "hmm")); -// let myPromise = fetch(getUrl + toUser, { -// method: 'GET', -// headers: headers -// }) -// .then(response => { -// console.log(response); -// return response.json(); -// }) -// .then(json => { - -// console.log(json); -// let i = 0; -// json.forEach(function (obj) { -// // console.log(obj.toUser); -// messageCipher = JSON.stringify(obj.messageCipher); -// console.log(messageCipher); -// // let message = sjcl.decrypt("password", messageCipher); -// let message = sjcl.decrypt(passphraseInput.value, messageCipher); -// let messageLine = sprintf('%s %s: %s \n', obj.messageTime, obj.fromUser, message); -// console.log(messageLine); -// // chatTextArea.append(obj.fromUser + ": " + message + "\n"); -// chatTextArea.append(messageLine); -// messageLog[i++] = messageLine; -// }); -// console.log(messageLog); -// // return messageLog; - -// }); -// return messageLog; -// } - -// async function getUserAsync(name) -// { -// let response = await fetch(`https://api.github.com/users/${name}`); -// let data = await response.json() -// return data; -// } - -// getUserAsync('yourUsernameHere') -// .then(data => console.log(data)); - -async function getAllMessages(toUser) { - let headers = new Headers(); - // headers.append('Accept','application/json') - // headers.append('Content-Type', 'application/json'); - headers.append('Authorization', authToken); - let response = await fetch(getAllMessagesUrl + toUser, { - method: 'GET', - headers: headers - }); - let data = await response.json(); - return data; -} - -async function getNewMessages(toUser, lastMessageTimeStamp) { - let headers = new Headers(); - headers.append('Authorization', authToken); - let response = await fetch(`${getNewMessagesUrl}${toUser}/${lastMessageTimeStamp}`, { - method: 'GET', - headers: headers - }); - let data = await response.json(); - return data; -} - -// getMessages('user2'); -window.EventTarget.prototype.addDelegatedListener = function(type, delegateSelector, listener) { - this.addEventListener(type, function(event) { - if (event.target && event.target.matches(delegateSelector)) { - listener.call(event.target, event) - } - }); -} -let parent = document.getElementById('chatMessageForm') -parent.addDelegatedListener("click", "input[type='radio']", function(event) { - // if (sessionStorage.getItem('status') != null) { - if (passphraseInput.value == '') { +function populateMessages(userName, passphrase) { + console.log('Selected user = ' + userName); + if (passphrase == '') { alert('Please input passphrase') return; } - console.log(this.value); - if (sessionStorage.getItem(this.value) == null) { + // console.log(userName); + if (sessionStorage.getItem(userName) == null) { chatTextArea.textContent = ''; chatAreaNew.innerHTML = ''; - getAllMessages(this.value) + getAllMessages(userName) .then(json => { console.log(json); let i = 0; @@ -272,7 +100,7 @@ parent.addDelegatedListener("click", "input[type='radio']", function(event) { messageCipher = JSON.stringify(obj.messageCipher); console.log(messageCipher); // let message = sjcl.decrypt("password", messageCipher); - let message = sjcl.decrypt(passphraseInput.value, messageCipher); + let message = sjcl.decrypt(passphrase, messageCipher); let utcDate = obj.messageTime; lastMessageTimeStamp = utcDate; let localDate = new Date(utcDate); @@ -301,12 +129,12 @@ parent.addDelegatedListener("click", "input[type='radio']", function(event) { }); - sessionStorage.setItem(this.value, JSON.stringify(messageLog)); - sessionStorage.setItem(this.value + 'new', JSON.stringify(messageLogNew)); + sessionStorage.setItem(userName, JSON.stringify(messageLog)); + sessionStorage.setItem(userName + username + 'new', JSON.stringify(messageLogNew)); // console.log() // sessionStorage.clear(); console.log('Last message time = ' + lastMessageTimeStamp); - sessionStorage.setItem(this.value + '-time', lastMessageTimeStamp); + sessionStorage.setItem(userName + '-time', lastMessageTimeStamp); } @@ -314,19 +142,19 @@ parent.addDelegatedListener("click", "input[type='radio']", function(event) { } else { - console.log("Stored messages = " + sessionStorage.getItem(this.value)); - let storedMessages = JSON.parse(sessionStorage.getItem(this.value)); - let storedMessagesNew = JSON.parse(sessionStorage.getItem(this.value + 'new')); - let lastMessageTime = sessionStorage.getItem(this.value + '-time'); + console.log("Stored messages = " + sessionStorage.getItem(userName)); + let storedMessages = JSON.parse(sessionStorage.getItem(userName)); + let storedMessagesNew = JSON.parse(sessionStorage.getItem(userName + username + 'new')); + let lastMessageTime = sessionStorage.getItem(userName + '-time'); console.log("last message time stamp = " + lastMessageTime); if (lastMessageTime != null) { - getNewMessages(this.value, lastMessageTime) + getNewMessages(userName, lastMessageTime) .then(json => { console.log(json) if (json.length > 0) { json.forEach(function(obj) { let messageCipher = JSON.stringify(obj.messageCipher); - let message = sjcl.decrypt(passphraseInput.value, messageCipher); + let message = sjcl.decrypt(passphrase, messageCipher); // console.log(message); // chatTextArea.append(message + "\n"); let utcDate = obj.messageTime; @@ -354,12 +182,12 @@ parent.addDelegatedListener("click", "input[type='radio']", function(event) { $(chatAreaNew).append(msgContainer); }) - sessionStorage.setItem(this.value + '-time', lastMessageTimeStamp); - sessionStorage.setItem(this.value, JSON.stringify(storedMessages)); - sessionStorage.setItem(this.value + 'new', JSON.stringify(storedMessagesNew)); - console.log("this value stored" + sessionStorage.getItem(this.value)) + sessionStorage.setItem(userName + '-time', lastMessageTimeStamp); + sessionStorage.setItem(userName, JSON.stringify(storedMessages)); + sessionStorage.setItem(userName + username + 'new', JSON.stringify(storedMessagesNew)); + console.log("this value stored" + sessionStorage.getItem(userName)) console.log("last message time stamp = " + lastMessageTimeStamp); - console.log(sessionStorage.getItem(this.value + '-time')); + console.log(sessionStorage.getItem(userName + '-time')); } chatTextArea.textContent = ''; @@ -404,17 +232,114 @@ parent.addDelegatedListener("click", "input[type='radio']", function(event) { } // sessionStorage.setItem('status', 'ready'); - // sessionStorage.setItem('this.value', messageLog); + // sessionStorage.setItem('userName', messageLog); // console.log('Message log = ' + messageLog); // } - // let passphraseKey = this.value + '-passphrase'; - // sessionStorage.setItem(passphraseKey, passphraseInput.value); + // let passphraseKey = userName + '-passphrase'; + // sessionStorage.setItem(passphraseKey, passphrase); // console.log(sessionStorage.getItem(passphraseKey)); +} + +// var lastMessageTimeStamp; + +// console.log(authToken); +// 'Basic ' + btoa("hmm" + ":" + "hmm") + +Handlebars.registerHelper('avatar', function() { + return '
'; }); -handleChatForm(); +// var user; +function getSelectedUser() { + for (var i = 0; i < toUserRadios.length; i++) { + if (toUserRadios[i].checked) { + let user = toUserRadios[i].value; + console.log('sending to user = ' + user); + isCheckedUser = true; + return user; + } + } + +} + +function getSelectedUserNew() { + return sessionStorage.getItem('selectedUser'); +} + +document.getElementById('chatMessageForm').addEventListener('submit', function(e) { + let chatInput = document.getElementById('chatInput'); + e.preventDefault(); + let user = getSelectedUserNew(); + + if (!this.checkValidity()) { + console.log("error"); + this.classList.add('was-validated'); + return; + } + this.classList.add('was-validated'); + + if (user == null) { + window.alert('please select a user'); + return; + } + let messageContent = chatInput.value; + let localDate = new Date(); + let messageLine = sprintf('%s %s %s: %s', localDate.toLocaleDateString(), localDate.toLocaleTimeString(), username, messageContent); + chatTextArea.append(messageLine + "\n"); + chatTextArea.scrollTop = chatTextArea.scrollHeight; + let messageCipher = sjcl.encrypt(passphraseInput.value, messageContent, { mode: "gcm", ts: 128, adata: "", iter: iterations }); + let messageCipherJson = JSON.parse(messageCipher); + let chatMessageDTO = { + "toUser": user, + "messageCipher": messageCipherJson + } + messageSend(JSON.stringify(chatMessageDTO)); +}) + +// console.log('Credentials = ' + JSON.parse(sessionStorage.getItem('credentials'))); + + +function messageSend(chatMessageDTO) { + let headers = new Headers(); + // console.log("Token = " + btoa("hmm" + ":" + "hmm")) + + // headers.append('Accept','application/json') + headers.append('Content-Type', 'application/json'); + headers.append('Authorization', authToken); + fetch(postNewMessageUrl, { + method: 'POST', + headers: headers, + body: chatMessageDTO + }) + .then(response => console.log(response)); +} + + +async function getAllMessages(toUser) { + let headers = new Headers(); + // headers.append('Accept','application/json') + // headers.append('Content-Type', 'application/json'); + headers.append('Authorization', authToken); + let response = await fetch(getAllMessagesUrl + toUser, { + method: 'GET', + headers: headers + }); + let data = await response.json(); + return data; +} + +async function getNewMessages(toUser, lastMessageTimeStamp) { + let headers = new Headers(); + headers.append('Authorization', authToken); + let response = await fetch(`${getNewMessagesUrl}${toUser}/${lastMessageTimeStamp}`, { + method: 'GET', + headers: headers + }); + let data = await response.json(); + return data; +} $(document).ready(function() { $('#action_menu_btn').click(function() { diff --git a/chatto/src/main/resources/templates/chat.html b/chatto/src/main/resources/templates/chat.html index 3d1c176..2ab9e8c 100644 --- a/chatto/src/main/resources/templates/chat.html +++ b/chatto/src/main/resources/templates/chat.html @@ -101,6 +101,7 @@

Please select a user

+
@@ -152,21 +153,24 @@
-
-
- +
+
+
+ +
+ + +
+ +
- -
- -
-
+
-
+