mirror of
https://github.com/pierre42100/ComunicWeb
synced 2024-11-23 04:29:21 +00:00
First version of send conversation message
This commit is contained in:
parent
b2924cb14e
commit
b421e8365f
@ -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
|
||||||
|
@ -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)
|
||||||
|
@ -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
|
||||||
*
|
*
|
||||||
|
@ -60,7 +60,7 @@ ComunicWeb.pages.home.home = {
|
|||||||
maxHeight: "70px",
|
maxHeight: "70px",
|
||||||
});
|
});
|
||||||
|
|
||||||
console.log(textarea2);
|
|
||||||
}
|
}
|
||||||
else{
|
else{
|
||||||
//Display landing page
|
//Display landing page
|
||||||
|
Loading…
Reference in New Issue
Block a user