First version of send conversation message

This commit is contained in:
Pierre 2017-06-21 16:44:10 +02:00
parent b2924cb14e
commit b421e8365f
4 changed files with 133 additions and 71 deletions

View File

@ -15,6 +15,13 @@
margin-bottom: 0px; margin-bottom: 0px;
} }
/**
* Conversations create message form
*/
#conversationsElem .create-message-form .btn {
padding-left: 6px;
padding-right:6px;
}
/** /**
* Conversation settings pane * Conversation settings pane

View File

@ -32,7 +32,7 @@ function createElem(nodeType, appendTo){
* @info {String} id The ID of the new element * @info {String} id The ID of the new element
* @info {String} title The title of the new element * @info {String} title The title of the new element
* @info {String} src The src attribute of the new element * @info {String} src The src attribute of the new element
* @info {String} type The type of the new element * @info {String} elemType The type attribute of the new element
* @info {String} value The value of the new element * @info {String} value The value of the new element
* @info {String} placeholder The placeholder of the new element * @info {String} placeholder The placeholder of the new element
* @info {String} innerHTML Specify the html content of the newly created element * @info {String} innerHTML Specify the html content of the newly created element
@ -67,8 +67,8 @@ function createElem2(infos){
newElem.src = infos.src; newElem.src = infos.src;
//Specify element type //Specify element type
if(infos.type) if(infos.elemType)
newElem.type = infos.type; newElem.type = infos.elemType;
//Specify element value //Specify element value
if(infos.value) if(infos.value)

View File

@ -35,6 +35,128 @@ ComunicWeb.components.conversations.chatWindows = {
return true; return true;
}, },
/**
* Create a new chat window
*
* @param {Object} infos Informations required for the new chat window
* @info {HTMLElement} target The target of the new chat window
* @info {Integer} conversationID The ID of the target conversation
* @return {Object} Informations about the new chat window
*/
create: function(infos){
//Log action
ComunicWeb.debug.logMessage("Create a new chat window");
//First, create the generic conversation window
var infosBox = ComunicWeb.components.conversations.windows.create(infos.target.children[0]);
//Save conversation ID
infosBox.conversationID = infos.conversationID;
//Change box root class name
infosBox.rootElem.className += " direct-chat";
//Adapt close button behaviour
infosBox.closeFunction = function(){
//Remove root element
infosBox.rootElem.remove();
//Remove the conversation from opened ones
ComunicWeb.components.conversations.cachingOpened.remove(infosBox.conversationID);
//Unload conversation
ComunicWeb.components.conversations.chatWindows.unload(infosBox.conversationID);
}
infosBox.closeButton.onclick = infosBox.closeFunction;
//Debug
infosBox.boxBody.innerHTML = "<div class='direct-chat-messages'>Hello world</p>";
//Add button to get conversation members
infosBox.membersButton = createElem("button");
infosBox.closeButton.parentNode.insertBefore(infosBox.membersButton, infosBox.closeButton);
infosBox.membersButton.type = "button";
infosBox.membersButton.className = "btn btn-box-tool";
infosBox.membersButton.setAttribute("data-toggle", "tooltip");
infosBox.membersButton.setAttribute("data-widget", "chat-pane-toggle");
infosBox.membersButton.title = "Conversation members";
//Add button icon
var buttonIcon = createElem("i", infosBox.membersButton);
buttonIcon.className = "fa fa-users";
//Add conversation members pane
var membersPane = createElem("div", infosBox.boxBody);
membersPane.className = "direct-chat-contacts";
//Add conversation members list
infosBox.membersList = createElem("ul", membersPane);
infosBox.membersList.className = "contacts-list";
//Add send a message form
this.addMessageform(infosBox);
//Return informations about the chat window
return infosBox;
},
/**
* Add a message form to the chat windows
*
* @param {Object} infosBox Informations about the chat box
* @return {Boolean} True for a success
*/
addMessageform: function(infosBox){
//Create form contener
var conversationFormContener = createElem2({
appendTo: infosBox.boxFooter,
type: "div",
class: "create-message-form"
});
//Create input gropu
var inputGroup = createElem2({
appendTo: conversationFormContener,
type: "div",
class: "input-group"
});
//Create text input (for message)
var inputText = createElem2({
appendTo: inputGroup,
type: "input",
class: "form-control",
placeholder: "New message...",
elemType: "text"
});
//Create button group
var buttonGroup = createElem2({
appendTo: inputGroup,
type: "span",
class: "input-group-btn",
});
//Add send button
var sendButton = createElem2({
appendTo: buttonGroup,
type: "button",
class: "btn btn-primary btn-flat",
elemType: "submit",
innerHTML: "Send",
});
//Success
return true;
},
/** /**
* Load (or reload) a conversation * Load (or reload) a conversation
* *
@ -134,73 +256,6 @@ ComunicWeb.components.conversations.chatWindows = {
return true; return true;
}, },
/**
* Create a new chat window
*
* @param {Object} infos Informations required for the new chat window
* @info {HTMLElement} target The target of the new chat window
* @info {Integer} conversationID The ID of the target conversation
* @return {Object} Informations about the new chat window
*/
create: function(infos){
//Log action
ComunicWeb.debug.logMessage("Create a new chat window");
//First, create the generic conversation window
var infosBox = ComunicWeb.components.conversations.windows.create(infos.target.children[0]);
//Save conversation ID
infosBox.conversationID = infos.conversationID;
//Change box root class name
infosBox.rootElem.className += " direct-chat";
//Adapt close button behaviour
infosBox.closeFunction = function(){
//Remove root element
infosBox.rootElem.remove();
//Remove the conversation from opened ones
ComunicWeb.components.conversations.cachingOpened.remove(infosBox.conversationID);
//Unload conversation
ComunicWeb.components.conversations.chatWindows.unload(infosBox.conversationID);
}
infosBox.closeButton.onclick = infosBox.closeFunction;
//Debug
infosBox.boxBody.innerHTML = "<div class='direct-chat-messages'>Hello world</p>";
//Add button to get conversation members
infosBox.membersButton = createElem("button");
infosBox.closeButton.parentNode.insertBefore(infosBox.membersButton, infosBox.closeButton);
infosBox.membersButton.type = "button";
infosBox.membersButton.className = "btn btn-box-tool";
infosBox.membersButton.setAttribute("data-toggle", "tooltip");
infosBox.membersButton.setAttribute("data-widget", "chat-pane-toggle");
infosBox.membersButton.title = "Conversation members";
//Add button icon
var buttonIcon = createElem("i", infosBox.membersButton);
buttonIcon.className = "fa fa-users";
//Add conversation members pane
var membersPane = createElem("div", infosBox.boxBody);
membersPane.className = "direct-chat-contacts";
//Add conversation members list
infosBox.membersList = createElem("ul", membersPane);
infosBox.membersList.className = "contacts-list";
//Return informations about the chat window
return infosBox;
},
/** /**
* Change the name of the converation at the top of the windows * Change the name of the converation at the top of the windows
* *

View File

@ -60,7 +60,7 @@ ComunicWeb.pages.home.home = {
maxHeight: "70px", maxHeight: "70px",
}); });
console.log(textarea2);
} }
else{ else{
//Display landing page //Display landing page