2019-10-02 16:25:46 +00:00
|
|
|
// import { sprintf } from 'sprintf-js';
|
|
|
|
// import { vsprintf } from 'sprintf-js';
|
|
|
|
/*var off_payment_method = document.getElementsByName('offline_payment_method');
|
|
|
|
var ischecked_method = false;
|
|
|
|
for ( var i = 0; i < off_payment_method.length; i++) {
|
|
|
|
if(off_payment_method[i].checked) {
|
|
|
|
ischecked_method = true;
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if(!ischecked_method) { //payment method button is not checked
|
|
|
|
alert("Please choose Offline Payment Method");
|
|
|
|
}*/
|
|
|
|
var toUserRadios = document.getElementsByName('toUser');
|
|
|
|
var isCheckedUser = false;
|
|
|
|
var chatTextArea = document.getElementById('chatTextArea');
|
2019-10-15 05:28:56 +00:00
|
|
|
|
2019-10-02 16:25:46 +00:00
|
|
|
var passphraseInput = document.getElementById('passphrase');
|
2019-10-15 05:28:56 +00:00
|
|
|
var postNewMessageUrl = `http://${hostAddress}/api/chat/post/message`; //hostAddress variable is set in the thymeleaf head fragment
|
|
|
|
var getAllMessagesUrl = `http://${hostAddress}/api/chat/get/messages/`;
|
|
|
|
var getNewMessagesUrl = `http://${hostAddress}/api/chat/get/messages/`;
|
|
|
|
// var postNewMessageUrl = "http://localhost:8080/api/chat/post/message";
|
|
|
|
// var getAllMessagesUrl = "http://localhost:8080/api/chat/get/messages/";
|
|
|
|
// var getNewMessagesUrl = "http://localhost:8080/api/chat/get/messages/";
|
2019-10-02 16:25:46 +00:00
|
|
|
// var messageLog = [];
|
|
|
|
var username = sessionStorage.getItem('username');
|
|
|
|
var password = sessionStorage.getItem('password');
|
|
|
|
var authToken = 'Basic ' + btoa(username + ":" + password);
|
2019-10-15 05:28:56 +00:00
|
|
|
var iterations = 100000;
|
2019-11-05 09:59:19 +00:00
|
|
|
|
|
|
|
var source = document.getElementById("msg_container_template").innerHTML;
|
|
|
|
var msgContainerTemplate = Handlebars.compile(source);
|
|
|
|
var source = document.getElementById("msg_container_send_template").innerHTML;
|
|
|
|
var msgContainerSendTemplate = Handlebars.compile(source);
|
|
|
|
|
|
|
|
var chatAreaNew = document.getElementById('chat_area_new');
|
|
|
|
|
2019-11-05 11:18:29 +00:00
|
|
|
var userBoxes = document.getElementsByName('user-box');
|
|
|
|
|
|
|
|
// Loop through the buttons and add the active class to the current/clicked button
|
|
|
|
// for (var i = 0; i < btns.length; i++) {
|
|
|
|
// btns[i].addEventListener("click", function() {
|
|
|
|
// var current = document.getElementsByClassName("active");
|
|
|
|
|
|
|
|
// // If there's no active class
|
|
|
|
// if (current.length > 0) {
|
|
|
|
// current[0].className = current[0].className.replace(" active", "");
|
|
|
|
// }
|
|
|
|
|
|
|
|
// // Add the active class to the current/clicked button
|
|
|
|
// this.className += " active";
|
|
|
|
// });
|
|
|
|
// }
|
|
|
|
|
|
|
|
for (let i = 0; i < userBoxes.length; i++) {
|
|
|
|
userBoxes[i].addEventListener('click', function() {
|
|
|
|
let current = document.getElementsByClassName('user-box active');
|
|
|
|
if (current.length > 0) {
|
|
|
|
current[0].className = current[0].className.replace(" active", "");
|
2019-11-05 16:18:13 +00:00
|
|
|
|
2019-11-05 11:18:29 +00:00
|
|
|
}
|
|
|
|
// Add the active class to the current/clicked button
|
2019-11-05 16:18:13 +00:00
|
|
|
else if (current.length == 0) {
|
|
|
|
document.getElementById('no-user-selected').hidden = true;
|
|
|
|
document.getElementById('chat-card').hidden = false;
|
|
|
|
}
|
|
|
|
let words = this.innerText.split("\n");
|
|
|
|
// console.log(words);
|
2019-11-06 05:01:48 +00:00
|
|
|
// 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);
|
2019-11-05 11:18:29 +00:00
|
|
|
this.className += " active";
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
2019-11-06 05:01:48 +00:00
|
|
|
function populateMessages(userName)
|
|
|
|
{
|
|
|
|
console.log(userName);
|
|
|
|
}
|
|
|
|
|
2019-10-02 16:25:46 +00:00
|
|
|
// var lastMessageTimeStamp;
|
|
|
|
|
|
|
|
// console.log(authToken);
|
|
|
|
// 'Basic ' + btoa("hmm" + ":" + "hmm")
|
|
|
|
|
2019-11-05 09:59:19 +00:00
|
|
|
Handlebars.registerHelper('avatar', function() {
|
|
|
|
return '<div class="img_cont_msg"> <img src="https://static.turbosquid.com/Preview/001292/481/WV/_D.jpg" class="rounded-circle user_img_msg"> </div>';
|
|
|
|
});
|
2019-10-02 16:25:46 +00:00
|
|
|
|
|
|
|
|
|
|
|
// var user;
|
|
|
|
function getSelectedUser() {
|
2019-10-22 12:12:18 +00:00
|
|
|
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;
|
|
|
|
}
|
|
|
|
}
|
2019-10-02 16:25:46 +00:00
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
// console.log('Credentials = ' + JSON.parse(sessionStorage.getItem('credentials')));
|
|
|
|
|
|
|
|
function handleChatForm() {
|
2019-10-22 12:12:18 +00:00
|
|
|
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'));
|
|
|
|
|
|
|
|
|
|
|
|
})
|
2019-10-02 16:25:46 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
function messageSend(chatMessageDTO) {
|
2019-10-22 12:12:18 +00:00
|
|
|
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));
|
2019-10-02 16:25:46 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
// 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) {
|
2019-10-22 12:12:18 +00:00
|
|
|
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;
|
2019-10-02 16:25:46 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
async function getNewMessages(toUser, lastMessageTimeStamp) {
|
2019-10-22 12:12:18 +00:00
|
|
|
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;
|
2019-10-02 16:25:46 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
// getMessages('user2');
|
2019-10-22 12:12:18 +00:00
|
|
|
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)
|
|
|
|
}
|
|
|
|
});
|
2019-10-02 16:25:46 +00:00
|
|
|
}
|
|
|
|
let parent = document.getElementById('chatMessageForm')
|
2019-10-22 12:12:18 +00:00
|
|
|
parent.addDelegatedListener("click", "input[type='radio']", function(event) {
|
|
|
|
// if (sessionStorage.getItem('status') != null) {
|
|
|
|
if (passphraseInput.value == '') {
|
|
|
|
alert('Please input passphrase')
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
console.log(this.value);
|
|
|
|
if (sessionStorage.getItem(this.value) == null) {
|
|
|
|
chatTextArea.textContent = '';
|
2019-11-05 09:59:19 +00:00
|
|
|
chatAreaNew.innerHTML = '';
|
2019-10-22 12:12:18 +00:00
|
|
|
getAllMessages(this.value)
|
|
|
|
.then(json => {
|
|
|
|
console.log(json);
|
|
|
|
let i = 0;
|
|
|
|
let messageLog = [];
|
2019-11-05 09:59:19 +00:00
|
|
|
let messageLogNew = [];
|
2019-10-22 12:12:18 +00:00
|
|
|
let lastMessageTimeStamp;
|
2019-11-05 11:18:29 +00:00
|
|
|
|
2019-10-22 12:12:18 +00:00
|
|
|
if (json.length > 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 utcDate = obj.messageTime;
|
|
|
|
lastMessageTimeStamp = utcDate;
|
|
|
|
let localDate = new Date(utcDate);
|
|
|
|
let messageLine = sprintf('%s %s: %s ', localDate, obj.fromUser, message);
|
|
|
|
|
2019-11-05 09:59:19 +00:00
|
|
|
|
2019-10-22 12:12:18 +00:00
|
|
|
// localDate.``
|
|
|
|
// console.log('localDate = ' + localDate);
|
|
|
|
console.log(messageLine);
|
|
|
|
// chatTextArea.append(obj.fromUser + ": " + message + "\n");
|
|
|
|
chatTextArea.append(messageLine + '\n');
|
|
|
|
messageLog[i++] = messageLine;
|
|
|
|
chatTextArea.scrollTop = chatTextArea.scrollHeight;
|
|
|
|
// console.log('Message log = ' + messageLog);
|
|
|
|
|
2019-11-05 09:59:19 +00:00
|
|
|
let context = { fromUser: obj.fromUser, message: message, time: localDate.toLocaleString() };
|
|
|
|
let msgContainer;
|
|
|
|
if (obj.fromUser == username) {
|
|
|
|
msgContainer = msgContainerSendTemplate(context);
|
|
|
|
} else {
|
|
|
|
msgContainer = msgContainerTemplate(context);
|
|
|
|
}
|
|
|
|
|
|
|
|
messageLogNew.push(JSON.stringify(context));
|
|
|
|
$(chatAreaNew).append(msgContainer);
|
|
|
|
|
2019-10-22 12:12:18 +00:00
|
|
|
|
|
|
|
});
|
|
|
|
sessionStorage.setItem(this.value, JSON.stringify(messageLog));
|
2019-11-05 09:59:19 +00:00
|
|
|
sessionStorage.setItem(this.value + 'new', JSON.stringify(messageLogNew));
|
|
|
|
// console.log()
|
2019-10-22 12:12:18 +00:00
|
|
|
// sessionStorage.clear();
|
|
|
|
console.log('Last message time = ' + lastMessageTimeStamp);
|
|
|
|
sessionStorage.setItem(this.value + '-time', lastMessageTimeStamp);
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
|
|
|
|
|
|
|
|
console.log("Stored messages = " + sessionStorage.getItem(this.value));
|
|
|
|
let storedMessages = JSON.parse(sessionStorage.getItem(this.value));
|
2019-11-05 09:59:19 +00:00
|
|
|
let storedMessagesNew = JSON.parse(sessionStorage.getItem(this.value + 'new'));
|
2019-10-22 12:12:18 +00:00
|
|
|
let lastMessageTime = sessionStorage.getItem(this.value + '-time');
|
|
|
|
console.log("last message time stamp = " + lastMessageTime);
|
|
|
|
if (lastMessageTime != null) {
|
|
|
|
getNewMessages(this.value, 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);
|
|
|
|
// console.log(message);
|
|
|
|
// chatTextArea.append(message + "\n");
|
|
|
|
let utcDate = obj.messageTime;
|
|
|
|
lastMessageTimeStamp = utcDate;
|
|
|
|
let localDate = new Date(utcDate);
|
|
|
|
let messageLine = sprintf('%s %s: %s', localDate, obj.fromUser, message);
|
|
|
|
|
|
|
|
// localDate.``
|
|
|
|
// console.log('localDate = ' + localDate);
|
|
|
|
console.log(messageLine);
|
|
|
|
// chatTextArea.append(obj.fromUser + ": " + message + "\n");
|
|
|
|
chatTextArea.append(messageLine + '\n');
|
|
|
|
chatTextArea.scrollTop = chatTextArea.scrollHeight;
|
|
|
|
storedMessages.push(messageLine);
|
|
|
|
|
2019-11-05 09:59:19 +00:00
|
|
|
let context = { fromUser: obj.fromUser, message: message, time: localDate.toLocaleString() };
|
|
|
|
let msgContainer;
|
|
|
|
if (obj.fromUser == username) {
|
|
|
|
msgContainer = msgContainerSendTemplate(context);
|
|
|
|
} else {
|
|
|
|
msgContainer = msgContainerTemplate(context);
|
|
|
|
}
|
|
|
|
|
|
|
|
storedMessagesNew.push(JSON.stringify(context));
|
|
|
|
$(chatAreaNew).append(msgContainer);
|
|
|
|
|
2019-10-22 12:12:18 +00:00
|
|
|
})
|
|
|
|
sessionStorage.setItem(this.value + '-time', lastMessageTimeStamp);
|
|
|
|
sessionStorage.setItem(this.value, JSON.stringify(storedMessages));
|
2019-11-05 11:18:29 +00:00
|
|
|
sessionStorage.setItem(this.value + 'new', JSON.stringify(storedMessagesNew));
|
2019-10-22 12:12:18 +00:00
|
|
|
console.log("this value stored" + sessionStorage.getItem(this.value))
|
|
|
|
console.log("last message time stamp = " + lastMessageTimeStamp);
|
|
|
|
console.log(sessionStorage.getItem(this.value + '-time'));
|
|
|
|
|
|
|
|
}
|
|
|
|
chatTextArea.textContent = '';
|
2019-11-05 09:59:19 +00:00
|
|
|
chatAreaNew.innerHTML = '';
|
2019-10-22 12:12:18 +00:00
|
|
|
console.log("Stored messages 2 = " + storedMessages);
|
|
|
|
storedMessages.forEach(function(messageLine) {
|
|
|
|
chatTextArea.append(messageLine + '\n');
|
|
|
|
chatTextArea.scrollTop = chatTextArea.scrollHeight;
|
2019-11-05 09:59:19 +00:00
|
|
|
|
|
|
|
// let context = {message: messageLine};
|
|
|
|
// let msgContainer;
|
|
|
|
// if(obj.fromUser == username)
|
|
|
|
// {
|
|
|
|
// msgContainer = msgContainerSendTemplate(context);
|
|
|
|
// }
|
|
|
|
// else{
|
|
|
|
// msgContainer = msgContainerTemplate(context);
|
|
|
|
// }
|
|
|
|
|
|
|
|
// $(chatAreaNew).append(msgContainer);
|
|
|
|
})
|
|
|
|
|
|
|
|
storedMessagesNew.forEach(function(contextString) {
|
|
|
|
let context = JSON.parse(contextString);
|
|
|
|
let msgContainer;
|
|
|
|
if (context.fromUser == username) {
|
|
|
|
msgContainer = msgContainerSendTemplate(context);
|
|
|
|
} else {
|
|
|
|
msgContainer = msgContainerTemplate(context);
|
|
|
|
}
|
|
|
|
|
|
|
|
$(chatAreaNew).append(msgContainer);
|
2019-10-22 12:12:18 +00:00
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
// sessionStorage.clear();
|
|
|
|
// chatTextArea.append(JSON.stringify(storedMessages));
|
2019-10-02 16:25:46 +00:00
|
|
|
|
2019-10-22 12:12:18 +00:00
|
|
|
}
|
|
|
|
// sessionStorage.setItem('status', 'ready');
|
|
|
|
// sessionStorage.setItem('this.value', messageLog);
|
|
|
|
// console.log('Message log = ' + messageLog);
|
|
|
|
// }
|
|
|
|
|
|
|
|
// let passphraseKey = this.value + '-passphrase';
|
|
|
|
// sessionStorage.setItem(passphraseKey, passphraseInput.value);
|
|
|
|
// console.log(sessionStorage.getItem(passphraseKey));
|
|
|
|
});
|
2019-10-02 16:25:46 +00:00
|
|
|
|
|
|
|
|
2019-11-05 09:59:19 +00:00
|
|
|
handleChatForm();
|
|
|
|
|
|
|
|
$(document).ready(function() {
|
|
|
|
$('#action_menu_btn').click(function() {
|
|
|
|
$('.action_menu').toggle();
|
|
|
|
});
|
|
|
|
});
|