ComunicWeb/assets/js/components/conversations/list.js

333 lines
9.8 KiB
JavaScript
Raw Normal View History

2017-06-05 08:12:38 +00:00
/**
2017-06-07 17:24:48 +00:00
* Conversations list window
2017-06-05 08:12:38 +00:00
*
* @author Pierre HUBERT
*/
2017-06-07 17:24:48 +00:00
ComunicWeb.components.conversations.list = {
2017-06-05 08:12:38 +00:00
/**
2017-06-07 17:24:48 +00:00
* Display conversations list window
2017-06-05 08:12:38 +00:00
*
* @param {HTMLElement} nodeBefore The node before the destination
* @return {Boolean} True for a success
*/
display: function(nodeBefore){
//Log action
ComunicWeb.debug.logMessage("INFO : initialize conversation list box.");
//Create a window
2017-06-07 17:24:48 +00:00
var listBox = ComunicWeb.components.conversations.windows.create(nodeBefore);
2017-06-05 08:12:38 +00:00
//Change box title
2017-06-07 17:24:48 +00:00
listBox.boxTitle.innerHTML = "Conversations";
2017-06-05 08:12:38 +00:00
2017-06-13 14:42:09 +00:00
//Change box root elem class
listBox.rootElem.className += " conversations-list-box";
2017-06-05 08:12:38 +00:00
//Remove footer
listBox.boxFooter.remove();
2017-06-05 09:02:10 +00:00
//Add the create button
2017-06-13 09:58:08 +00:00
/*var createButton = createElem("button");
2017-06-05 09:02:10 +00:00
listBox.boxTools.insertBefore(createButton, listBox.boxTools.children[0]);
createButton.className = "btn btn-box-tool";
createButton.onclick = function(){
2017-06-07 17:24:48 +00:00
ComunicWeb.components.conversations.list.displayCreateForm(listBox);
2017-06-11 13:14:23 +00:00
this.remove();
2017-06-05 09:02:10 +00:00
}
//Button icon
var createButtonIcon = createElem("i", createButton);
2017-06-13 09:58:08 +00:00
createButtonIcon.className = "fa fa-pencil";*/
2017-06-05 09:02:10 +00:00
2017-06-10 13:18:03 +00:00
//Get and display conversations list
2017-06-13 09:58:08 +00:00
this.showConversationsList(listBox);
2017-06-05 09:02:10 +00:00
2017-06-05 08:12:38 +00:00
//Success
return true;
},
2017-06-05 09:02:10 +00:00
/**
2017-06-07 17:24:48 +00:00
* Display the form to create a new conversation
2017-06-05 09:02:10 +00:00
*
* @param {Object} listBox Informations about the listbox target
* @return {Boolean} True for a success
*/
displayCreateForm: function(listBox){
//Log action
2017-06-07 17:24:48 +00:00
ComunicWeb.debug.logMessage("INFO : initialize create conversation form");
2017-06-05 09:02:10 +00:00
//Hide boxy body contents
var boxBodyElem = listBox.boxBody.children;
for(i in boxBodyElem){
if(boxBodyElem[i].style)
boxBodyElem[i].style.display = "none";
}
//Change box title
2017-06-07 17:24:48 +00:00
listBox.boxTitle.innerHTML = "New conversation";
2017-06-05 09:02:10 +00:00
2017-06-07 17:24:48 +00:00
//Create and display conversation creation form
2017-06-05 09:02:10 +00:00
var createForm = createElem("div", listBox.boxBody);
2017-06-07 12:16:54 +00:00
//Choose users
//Create select user element
var usersElement = createFormGroup({
2017-06-07 12:16:54 +00:00
target: createForm,
label: "Users",
multiple: true,
placeholder: "Select users",
type: "select2"});
//Initialize user selector
ComunicWeb.components.userSelect.init(usersElement);
2017-06-07 12:16:54 +00:00
2017-06-07 17:24:48 +00:00
//Conversation name
var conversationNameInput = createFormGroup({
2017-06-07 12:16:54 +00:00
target: createForm,
2017-06-07 17:24:48 +00:00
label: "Conversation name",
2017-06-07 12:16:54 +00:00
placeholder: "Optionnal",
type: "text"});
//Follow disucssion
2017-06-07 17:24:48 +00:00
var followConversationInput = createFormGroup({
2017-06-07 12:16:54 +00:00
target: createForm,
2017-06-07 17:24:48 +00:00
label: "Follow conversation",
2017-06-07 12:16:54 +00:00
checked: true,
type: "checkbox"});
//Create button
2017-06-07 12:16:54 +00:00
var createButton = createElem("button", createForm);
createButton.className = "btn btn-primary";
createButton.style.width = "100%";
2017-06-07 17:24:48 +00:00
createButton.innerHTML = "Create conversation";
2017-06-05 09:02:10 +00:00
//Generate a summary object about all the informations we have got
var infos = {
listBox: listBox,
2017-06-07 14:55:47 +00:00
usersElement: usersElement,
2017-06-07 17:24:48 +00:00
conversationNameInput: conversationNameInput,
followConversationInput: followConversationInput,
};
//Make button lives
createButton.onclick = function(){
2017-06-07 17:24:48 +00:00
ComunicWeb.components.conversations.list.submitCreateConversationForm(infos);
};
2017-06-05 09:02:10 +00:00
//Success
return true;
},
/**
2017-06-07 17:24:48 +00:00
* Submit a create a conversation form
*
* @param {Object} infos Data to pass to the function
2017-06-07 17:24:48 +00:00
* * @info {Object} listBox Informations about the listbox creating the conversation
2017-06-07 14:55:47 +00:00
* * @info {HTMLElement} usersElement Pointer on userElement
2017-06-07 17:24:48 +00:00
* * @info {HTMLElement} conversationNameInput Pointer on the input of the form of the conversation
* * @info {HTMLElement} followConversationInput Pointer on the "follow conversation" checkbox
* @return {Boolean} True for a success
*/
2017-06-07 17:24:48 +00:00
submitCreateConversationForm: function(infos){
//First, get the list of users
2017-06-07 14:55:47 +00:00
var selectedUsers = ComunicWeb.components.userSelect.getResults(infos.usersElement);
//We check if less than one user was selected
if(selectedUsers.length < 1){
//Display an error notification
ComunicWeb.common.notificationSystem.showNotification("Please select at least one user!", "danger", 2);
return false;
}
//Add current user to the list
selectedUsers.push(ComunicWeb.user.userLogin.getUserID());
//Prepare the creation of the conversation
//Get all required informations
2017-06-07 17:24:48 +00:00
var conversationInformations = {
2017-06-07 14:55:47 +00:00
users: selectedUsers,
2017-06-07 17:24:48 +00:00
follow: infos.followConversationInput.checked,
conversationName: (infos.conversationNameInput.value == "" ? false : infos.conversationNameInput.value),
2017-06-07 14:55:47 +00:00
};
//Change box body style
var splashScreen = ComunicWeb.common.page.showTransparentWaitSplashScreen(infos.listBox.boxBody);
//Contact the interface to create the conversation
2017-06-10 07:42:09 +00:00
ComunicWeb.components.conversations.interface.createConversation(conversationInformations, function(response){
//First, remove splash screen
splashScreen.remove();
//Check for errors
if(response.error){
//Make an error notification
notifMessage = "An error occured while trying to create conversation. Please try again.";
ComunicWeb.common.notificationSystem.showNotification(notifMessage, "danger", 3);
return false;
}
//Success
2017-06-10 13:18:03 +00:00
notifMessage = "The conversation was successfully created !";
ComunicWeb.common.notificationSystem.showNotification(notifMessage, "success", 2);
//Remove the conversation box
infos.listBox.rootElem.remove();
//Open the conversation (under construction)
console.log("Open conversation ID: " + response.conversationID);
2017-06-10 07:42:09 +00:00
})
2017-06-11 13:14:23 +00:00
},
/**
* Show the conversations list
*
2017-06-13 09:58:08 +00:00
* @param {Object} listBox HTML elements about the listBox
2017-06-11 13:14:23 +00:00
* @return {Boolean} True for a success
*/
2017-06-13 09:58:08 +00:00
showConversationsList: function(listBox){
2017-06-11 13:14:23 +00:00
//Get and show the conversation list
2017-06-13 09:58:08 +00:00
ComunicWeb.components.conversations.interface.getList(function(conversations){
//Add the "create a conversation button"
var createConversationButton = createElem("button", listBox.boxBody);
createConversationButton.style.width = "100%";
createConversationButton.style.marginBottom = "5px";
createConversationButton.className = "btn btn-default btn-flat";
createConversationButton.innerHTML = "Create a new conversation";
//Create a ul element that will contain conversation list
var ulElem = createElem("ul", listBox.boxBody);
ulElem.className = "nav nav-pills nav-stacked";
//Make create converstion button lives
createConversationButton.onclick = function(){
ComunicWeb.components.conversations.list.displayCreateForm(listBox);
};
//Process each conversation elements
for(i in conversations){
//Extract conversation informations
var conversationInfos = conversations[i];
//Create subElement
var liElem = createElem("li", ulElem);
//Display entry
2017-06-13 14:54:23 +00:00
ComunicWeb.components.conversations.list.showConversationEntry(conversationInfos, liElem, listBox);
2017-06-13 09:58:08 +00:00
}
2017-06-11 13:14:23 +00:00
//Enable scrollbar
$(ulElem).slimScroll({
height: '100%'
});
2017-06-11 13:14:23 +00:00
}, true);
//Success
return true;
},
2017-06-13 09:58:08 +00:00
/**
* Show a conversation entry
*
* @param {Object} conversationInfos Informations about the conversation
* @param {HTMLElement} entryTarget The target for the entry
2017-06-13 14:54:23 +00:00
* @param {Object} listBox HTML elements about the listBox
2017-06-13 09:58:08 +00:00
* @return {Boolean} True for a success
*/
2017-06-13 14:54:23 +00:00
showConversationEntry: function(conversationInfos, entryTarget, listBox){
2017-06-13 09:58:08 +00:00
//Create link element
var linkElem = createElem("a", entryTarget);
2017-06-13 14:54:23 +00:00
//Make the link element live
linkElem.onclick = function(){
//Remove conversations list
listBox.rootElem.remove();
2017-06-13 09:58:08 +00:00
2017-06-13 14:54:23 +00:00
//Show conversation
console.log("Open conversation ID: " + conversationInfos.ID);
}
2017-06-13 14:42:09 +00:00
//Add conversations last activity
var lastActivityElem = createElem("small", linkElem);
lastActivityElem.className = "pull-right last-activity";
var lastActivityIcon = createElem("i", lastActivityElem);
lastActivityIcon.className = "fa fa-clock-o";
var lastActivityValueElem = createElem("span", lastActivityElem);
//Calculate last conversation activity
var currentTime = ComunicWeb.common.date.time();
lastActivityValueElem.innerHTML = " "+ComunicWeb.common.date.diffToStr(currentTime - conversationInfos.last_active);
2017-06-13 09:58:08 +00:00
//Create the conversation name element
var conversationNameElem = createElem("strong", linkElem);
//Check if the conversation has a name or not
if(conversationInfos.name)
conversationNameElem.innerHTML = conversationInfos.name;
else {
//Put conversation name field in a waiting state
conversationNameElem.style.fontSize = "90%";
conversationNameElem.innerHTML = "Loading...";
//Get informations about the first two members
var firstMembers = [];
//Retrieve IDs
for(o in conversationInfos.members){
//Limit number to 2
if(firstMembers.length < 2){
//Check this is a valid entry
if(conversationInfos.members[o]){
//Exclude current user ID
if(conversationInfos.members[o] != userID())
firstMembers.push(conversationInfos.members[o]);
}
}
}
//Get users informations
2017-06-13 14:42:09 +00:00
ComunicWeb.user.userInfos.getNames(firstMembers, function(usersName){
2017-06-13 09:58:08 +00:00
2017-06-13 14:42:09 +00:00
//For conversations with many members (more than 3 - we musn't forget current user)
if(conversationInfos.members.length > 3)
usersName += ", ...";
2017-06-13 09:58:08 +00:00
//Apply conversation name
2017-06-13 14:42:09 +00:00
conversationNameElem.innerHTML = usersName;
});
2017-06-13 09:58:08 +00:00
}
//Add members number
//Create paragraph
var membersNumberParagraphElem = createElem("p", linkElem);
membersNumberParagraphElem.className = "conversations-members-numbers";
var membersNumberSmallElem = createElem("small", membersNumberParagraphElem);
//Add icon
var membersNumberIconElem = createElem("i", membersNumberSmallElem);
membersNumberIconElem.className = "fa fa-users";
//Specify value
var membersNumberValueElem = createElem("span", membersNumberSmallElem);
membersNumberValueElem.innerHTML = (conversationInfos.members.length === 1 ? "1 member" : conversationInfos.members.length + " members");
2017-06-13 09:58:08 +00:00
//Success
return true;
}
2017-06-05 08:12:38 +00:00
}