Start to update conversations pane

This commit is contained in:
Pierre HUBERT 2021-03-06 12:04:01 +01:00
parent 152530a87e
commit 3f5d9fc466
5 changed files with 117 additions and 162 deletions

View File

@ -225,9 +225,7 @@ function log(message){
*/ */
function openConversation(id, fullscreen = false){ function openConversation(id, fullscreen = false){
if(!fullscreen) if(!fullscreen)
ComunicWeb.components.conversations.manager.addConversation({ ComunicWeb.components.conversations.manager.addConversation(id);
conversationID: id
});
else else
openPage("conversations/" + id); openPage("conversations/" + id);
} }

View File

@ -260,76 +260,65 @@ const ConvChatWindow = {
* @param {Object} conversationWindow Informations about the conversation window * @param {Object} conversationWindow Informations about the conversation window
* @return {Boolean} True for a success * @return {Boolean} True for a success
*/ */
load: function(conversationID, conversationWindow){ load: async function(conversationID, conversationWindow) {
//Log action try {
ComunicWeb.debug.logMessage("Loading conversation " + conversationID);
//Change conversation window name (loading state) //Change conversation window name (loading state)
this.changeName("Loading", conversationWindow); this.changeName("Loading", conversationWindow);
//Peform a request to informations about the conversation /** @type {Conversation} */
ComunicWeb.components.conversations.interface.getInfosOne(conversationID, function(informations){ const conv = await new Promise((res, rej) => {
ConversationsInterface.getInfosOne(conversationID, (info) => {
//In case of error if (info.error)
if(informations.error){ rej(info)
//Display error notification else
ComunicWeb.common.notificationSystem.showNotification("Couldn't get informations about the conversation !", "danger"); res(info)
return false;
}
//Get informations about the members of the conversation
getMultipleUsersInfo(informations.members, function(membersInfos){
//Quit in case of error
if(informations.error){
//Display error notification
ComunicWeb.common.notificationSystem.showNotification("Couldn't get informations about the conversation members !", "danger");
return false;
}
//Create conversation informations root object
var conversationInfos = {
box: conversationWindow,
membersInfos: membersInfos,
infos: informations
};
//Save conversation informations in the cache
ComunicWeb.components.conversations.chatWindows.__conversationsCache["conversation-"+conversationID] = conversationInfos;
//Change the name of the conversation
ComunicWeb.components.conversations.utils.getName(informations, function(conversationName){
ComunicWeb.components.conversations.chatWindows.changeName(conversationName, conversationWindow);
}); });
})
//Update conversation members informations const users = await getUsers(conv.members.map(m => m.user_id));
ComunicWeb.components.conversations.chatWindows.updateMembersList(conversationInfos);
//Display conversation settings pane // Create conversation informations root object
ComunicWeb.components.conversations.chatWindows.showConversationSettings(conversationInfos); var conversationInfos = {
box: conversationWindow,
membersInfos: users,
infos: conv
};
//Register the conversation in the service // Save conversation informations in the cache
ComunicWeb.components.conversations.service.registerConversation(conversationID); this.__conversationsCache["conversation-"+conversationID] = conversationInfos;
//Make send a message button lives //Change the name of the conversation
conversationInfos.box.sendMessageForm.formRoot.onsubmit = function(){ this.changeName(await getConvName(conv), conversationWindow);
//Submit new message
ComunicWeb.components.conversations.chatWindows.submitMessageForm(conversationInfos);
//Block page reloading // Update conversation members informations
return false; this.updateMembersList(conversationInfos);
};
//Add call button (if possible) // Display conversation settings pane
ComunicWeb.components.conversations.chatWindows.showCallButton(conversationInfos); this.showConversationSettings(conversationInfos);
}); // Register the conversation in the service
}); ConvService.registerConversation(conversationID);
//Success // Make send a message button lives
return true; conversationInfos.box.sendMessageForm.formRoot.onsubmit = (e) => {
e.preventDefault();
//Submit new message
this.submitMessageForm(conversationInfos);
};
//Add call button (if possible)
this.showCallButton(conversationInfos);
}
catch(e) {
console.error(e);
notify(tr("Failed to load conversation!"), "danger");
}
}, },
/** /**
@ -430,46 +419,43 @@ const ConvChatWindow = {
emptyElem(conversation.box.membersList); emptyElem(conversation.box.membersList);
//Then process each user //Then process each user
var i = 0; for(let member of conversation.infos.members) {
for(i in conversation.infos.members){ let user = conversation.membersInfos.get(member.user_id);
if(conversation.membersInfos['user-'+conversation.infos.members[i]]){ if(!user)
var memberInfos = conversation.membersInfos['user-'+conversation.infos.members[i]]; continue;
//Display user informations //Display user informations
var userLi = createElem("li", conversation.box.membersList); var userLi = createElem("li", conversation.box.membersList);
var userLink = createElem("a", userLi); var userLink = createElem("a", userLi);
//Add user account image //Add user account image
var userImage = createElem("img", userLink); var userImage = createElem("img", userLink);
userImage.className = "contacts-list-img"; userImage.className = "contacts-list-img";
userImage.src = memberInfos.accountImage; userImage.src = user.image;
//Add member informations //Add member informations
var memberInfosList = createElem2({ var memberInfosList = createElem2({
type: "div", type: "div",
appendTo: userLink, appendTo: userLink,
class: "contacts-list-info", class: "contacts-list-info",
}); });
//Add user name //Add user name
var memberName = createElem2({ var memberName = createElem2({
type: "span", type: "span",
appendTo: memberInfosList, appendTo: memberInfosList,
class: "contacts-list-name", class: "contacts-list-name",
innerHTML: memberInfos.firstName + " " + memberInfos.lastName, innerHTML: user.fullName,
}); });
//Check if members is a moderator or not of the conversation //Add member status
var memberStatus = conversation.infos.ID_owner == memberInfos.userID ? "Moderator" : "Member"; createElem2({
type: "span",
//Add member status appendTo: memberInfosList,
var memberStatus = createElem2({ class: "contacts-list-msg",
type: "span", innerHTML: member.is_admin ? tr("Admin") : tr("Member")
appendTo: memberInfosList, });
class: "contats-list-msg",
innerHTML: memberStatus
});
}
} }
//Enable slimscrooll //Enable slimscrooll
@ -545,13 +531,13 @@ const ConvChatWindow = {
settingsForm.conversationNameInput.value = conversation.infos.name; settingsForm.conversationNameInput.value = conversation.infos.name;
//Update conversation members //Update conversation members
ComunicWeb.components.userSelect.pushEntries(settingsForm.usersElement, conversation.infos.members); ComunicWeb.components.userSelect.pushEntries(settingsForm.usersElement, conversation.infos.members.map(m => m.user_id));
// Update checkbox to allow or not everyone to add members // Update checkbox to allow or not everyone to add members
$(settingsForm.allowEveryoneToAddMembers).iCheck(conversation.infos.canEveryoneAddMembers ? "check" : "uncheck"); $(settingsForm.allowEveryoneToAddMembers).iCheck(conversation.infos.canEveryoneAddMembers ? "check" : "uncheck");
//Check if user is a conversation moderator or not //Check if user is a conversation moderator or not
if(conversation.infos.ID_owner != userID()) { if(!conversation.infos.members.find(m => m.user_id == userID()).is_admin) {
//We disable name field //We disable name field
settingsForm.conversationNameInput.disabled = "true"; settingsForm.conversationNameInput.disabled = "true";
@ -632,7 +618,7 @@ const ConvChatWindow = {
//Check if any users were selected //Check if any users were selected
if(newValues.members.length === 0){ if(newValues.members.length === 0){
//Inform user that its input is invalid //Inform user that its input is invalid
ComunicWeb.common.notificationSystem.showNotification("Please select at least one user !", "danger", 3); notify("Please select at least one user !", "danger", 3);
return false; return false;
} }
@ -651,7 +637,7 @@ const ConvChatWindow = {
//Check for errors //Check for errors
if(result.error) if(result.error)
ComunicWeb.common.notificationSystem.showNotification("An error occured while trying to update conversation settings !", "danger", 4); notify("An error occured while trying to update conversation settings !", "danger", 4);
//Reload the conversation //Reload the conversation
ComunicWeb.components.conversations.chatWindows.unload(conversation.infos.ID, true); ComunicWeb.components.conversations.chatWindows.unload(conversation.infos.ID, true);
@ -678,7 +664,7 @@ const ConvChatWindow = {
//Check if message is empty //Check if message is empty
if(!checkString(form.inputText.value) && !form.inputImage.files[0]){ if(!checkString(form.inputText.value) && !form.inputImage.files[0]){
ComunicWeb.common.notificationSystem.showNotification("Please type a valid message before trying to send it !", "danger", 2); notify("Please type a valid message before trying to send it !", "danger", 2);
return false; return false;
} }
@ -686,11 +672,11 @@ const ConvChatWindow = {
form.sendButton.disabled = true; form.sendButton.disabled = true;
//Prepare what to do next //Prepare what to do next
var onceSent = function(result){ var onceSent = (result) => {
//Check for errors //Check for errors
if(result.error){ if(result.error){
ComunicWeb.common.notificationSystem.showNotification("An error occured while trying to send message! Please try again...", "danger", 2); notify("An error occured while trying to send message! Please try again...", "danger", 2);
//Unlock send button //Unlock send button
form.sendButton.disabled = false; form.sendButton.disabled = false;
@ -841,13 +827,13 @@ const ConvChatWindow = {
* Generate message HTML node based on given information * Generate message HTML node based on given information
* *
* @param {object} conversationInfo Information about the created conversation * @param {object} conversationInfo Information about the created conversation
* @param {object} message Information about the target message * @param {ConversationMessage} message Information about the target message
* @return {object} Information about the created message element * @return {object} Information about the created message element
*/ */
_get_message_element: function(conversationInfo, message){ _get_message_element: function(conversationInfo, message){
//Check if it is the current user who sent the message //Check if it is the current user who sent the message
var userIsPoster = message.ID_user == userID(); var userIsPoster = message.user_id == userID();
//Create message element //Create message element
const messageContainer = createElem2({ const messageContainer = createElem2({
@ -891,15 +877,11 @@ const ConvChatWindow = {
}); });
//Load user informations //Load user informations
let userInfos; let userInfo = conversationInfo.membersInfos.get(message.user_id);
if(conversationInfo.membersInfos["user-" + message.ID_user]){ if(userInfo) {
//Get informations
userInfos = conversationInfo.membersInfos["user-" + message.ID_user];
//Replace poster name //Replace poster name
usernameElem.innerHTML = userInfos.firstName + " " + userInfos.lastName; usernameElem.innerHTML = userInfo.fullName;
userAccountImage.src = userInfos.accountImage; userAccountImage.src = userInfo.image;
} }
//Add message //Add message
@ -954,7 +936,7 @@ const ConvChatWindow = {
//Parse emojies in text message //Parse emojies in text message
ComunicWeb.components.textParser.parse({ ComunicWeb.components.textParser.parse({
element: textMessage, element: textMessage,
user: userInfos, user: userInfo,
}); });
@ -996,17 +978,9 @@ const ConvChatWindow = {
updateLink.addEventListener("click", function(){ updateLink.addEventListener("click", function(){
ComunicWeb.components.conversations.messageEditor.open(message, function(newContent){ ComunicWeb.components.conversations.messageEditor.open(message, function(newContent){
/* /*
DEPRECATED WITH WEBSOCKETS
DEPRECATED WITH WEBSOCKETS */
//Apply and parse new message
textMessage.innerHTML = removeHtmlTags(newContent);
ComunicWeb.components.textParser.parse({
element: textMessage,
});*/
}); });
}); });
@ -1052,7 +1026,7 @@ const ConvChatWindow = {
//Return information about the message //Return information about the message
return { return {
userID: message.ID_user, userID: message.user_id,
rootElem: messageContainer, rootElem: messageContainer,
userNameElem: usernameElem, userNameElem: usernameElem,
dateElem: dateElem, dateElem: dateElem,
@ -1178,13 +1152,13 @@ document.addEventListener("updatedConvMessage", (e) => {
const msg = e.detail; const msg = e.detail;
// Get message target // Get message target
const target = document.querySelector("[data-chatwin-msg-id='"+msg.ID+"']"); const target = document.querySelector("[data-chatwin-msg-id='"+msg.id+"']");
if(!target) if(!target)
return; return;
// Get conversation info // Get conversation info
const convInfo = ConvChatWindow.__conversationsCache["conversation-"+msg.convID]; const convInfo = ConvChatWindow.__conversationsCache["conversation-"+msg.conv_id];
if(!convInfo) if(!convInfo)
return; return;

View File

@ -212,12 +212,12 @@ const ConversationsList = {
/** /**
* Show a conversation entry * Show a conversation entry
* *
* @param {Conversation} conversationInfos Informations about the conversation * @param {Conversation} conv Information about the conversation
* @param {HTMLElement} entryTarget The target for the entry * @param {HTMLElement} entryTarget The target for the entry
* @param {Object} listBox HTML elements about the listBox * @param {Object} listBox HTML elements about the listBox
* @return {Boolean} True for a success * @return {Boolean} True for a success
*/ */
showConversationEntry: function(conversationInfos, entryTarget, listBox){ showConversationEntry: function(conv, entryTarget, listBox){
//Create link element //Create link element
var linkElem = createElem("a", entryTarget); var linkElem = createElem("a", entryTarget);
@ -228,9 +228,7 @@ const ConversationsList = {
listBox.rootElem.remove(); listBox.rootElem.remove();
//Add & open conversation //Add & open conversation
ComunicWeb.components.conversations.manager.addConversation({ ComunicWeb.components.conversations.manager.addConversation(conv.id);
conversationID: conversationInfos.ID
});
} }
//Add conversations last activity //Add conversations last activity
@ -242,7 +240,7 @@ const ConversationsList = {
//Calculate last conversation activity //Calculate last conversation activity
var currentTime = ComunicWeb.common.date.time(); var currentTime = ComunicWeb.common.date.time();
lastActivityValueElem.innerHTML = " "+ComunicWeb.common.date.diffToStr(currentTime - conversationInfos.last_activity); lastActivityValueElem.innerHTML = " "+ComunicWeb.common.date.diffToStr(currentTime - conv.last_activity);
//Create the conversation name element //Create the conversation name element
@ -253,7 +251,7 @@ const ConversationsList = {
conversationNameElem.innerHTML = "Loading..."; conversationNameElem.innerHTML = "Loading...";
//Get conversation name and apply it //Get conversation name and apply it
ComunicWeb.components.conversations.utils.getName(conversationInfos, function(conversationName){ ComunicWeb.components.conversations.utils.getName(conv, function(conversationName){
conversationNameElem.innerHTML = conversationName; conversationNameElem.innerHTML = conversationName;
}); });
@ -269,7 +267,7 @@ const ConversationsList = {
//Specify value //Specify value
var membersNumberValueElem = createElem("span", membersNumberSmallElem); var membersNumberValueElem = createElem("span", membersNumberSmallElem);
membersNumberValueElem.innerHTML = (conversationInfos.members.length === 1 ? tr("1 member") : conversationInfos.members.length + " members"); membersNumberValueElem.innerHTML = (conv.members.length === 1 ? tr("1 member") : conv.members.length + " members");
//Success //Success
return true; return true;

View File

@ -101,36 +101,21 @@ ComunicWeb.components.conversations.manager = {
/** /**
* Add a new conversation to the list of opened conversation accordingly to specified informations * Add a new conversation to the list of opened conversation accordingly to specified informations
* *
* @param {Object} infos Informations about the conversation to open * @param {number} convID Informations about the conversation to open
* @info {Integer} conversationID The ID of the conversation to open
* @return {Boolean} True or false depending of the success of the operation
*/ */
addConversation: function(infos){ addConversation: function(convID){
//We check if a conversation ID was specified or not
if(infos.conversationID){
ComunicWeb.debug.logMessage("Open a conversation based on its ID");
var conversationID = infos.conversationID;
}
else {
//It is an error
ComunicWeb.debug.logMessage("Don't know which conversation to open !");
return false;
}
//Check if the conversation is already open or not //Check if the conversation is already open or not
if(ComunicWeb.components.conversations.cachingOpened.isopen(conversationID)){ if(ComunicWeb.components.conversations.cachingOpened.isopen(convID)){
ComunicWeb.debug.logMessage("The conversation " + conversationID + " is already opened !"); ComunicWeb.debug.logMessage("The conversation " + convID + " is already opened !");
return false; return;
} }
//Save conversation ID in session storage //Save conversation ID in session storage
ComunicWeb.components.conversations.cachingOpened.add(conversationID); ComunicWeb.components.conversations.cachingOpened.add(convID);
//Open the conversation //Open the conversation
ComunicWeb.components.conversations.chatWindows.openConversation(conversationID); ComunicWeb.components.conversations.chatWindows.openConversation(convID);
//Success
return true;
}, },
/** /**

View File

@ -41,7 +41,7 @@ const ConvService = {
this.__serviceCache = {}; //Create service cache object this.__serviceCache = {}; //Create service cache object
// Get the last messages of the conversations // Get the last messages of the conversations
const list = await ComunicWeb.components.conversations.interface.asyncRefreshSingle(conversationID, 0); const list = await ConversationsInterface.asyncRefreshSingle(conversationID, 0);
//Register conversation locally //Register conversation locally
this.__serviceCache['conversation-' + conversationID] = { this.__serviceCache['conversation-' + conversationID] = {
@ -50,10 +50,10 @@ const ConvService = {
}; };
// Register conversation remotly // Register conversation remotly
await ComunicWeb.components.conversations.interface.register(conversationID) await ConversationsInterface.register(conversationID)
for(const msg of list) for(const msg of list)
ComunicWeb.components.conversations.chatWindows.addMessage(conversationID, msg); ConvChatWindow.addMessage(conversationID, msg);
} catch(e) { } catch(e) {
console.error(e); console.error(e);