Update conversations page

This commit is contained in:
Pierre HUBERT 2020-04-09 11:36:32 +02:00
parent 1596fda533
commit 9502a1d9dc
3 changed files with 20 additions and 88 deletions

View File

@ -6,6 +6,8 @@
.conversations-page-container .conversations-list-box { .conversations-page-container .conversations-list-box {
max-height: 100%; max-height: 100%;
max-width: 300px;
margin: auto;
} }
.conversations-page-container .conversations-list-box ul { .conversations-page-container .conversations-list-box ul {

View File

@ -15,9 +15,8 @@ ComunicWeb.pages.conversations.listPane = {
* Display the list of conversation * Display the list of conversation
* *
* @param {HTMLElement} target The target of the page * @param {HTMLElement} target The target of the page
* @param {Object} args Additional arguments
*/ */
display: function(target, args){ display: function(target){
//Create the box //Create the box
var listBox = createElem2({ var listBox = createElem2({
@ -58,13 +57,13 @@ ComunicWeb.pages.conversations.listPane = {
} }
//Load the list of conversations //Load the list of conversations
ComunicWeb.pages.conversations.listPane.refresh_list(boxBody, args); ComunicWeb.pages.conversations.listPane.refresh_list(boxBody);
}, 5000); }, 5000);
//Force load the list of conversations //Force load the list of conversations
ComunicWeb.pages.conversations.listPane._curr_list = null; ComunicWeb.pages.conversations.listPane._curr_list = null;
ComunicWeb.pages.conversations.listPane.refresh_list(boxBody, args); ComunicWeb.pages.conversations.listPane.refresh_list(boxBody);
}, },
@ -72,9 +71,8 @@ ComunicWeb.pages.conversations.listPane = {
* Refresh the list of conversations * Refresh the list of conversations
* *
* @param {HTMLElement} target The target for the list * @param {HTMLElement} target The target for the list
* @param {Object} args Additionnal arguments
*/ */
refresh_list: function(target, args){ refresh_list: function(target){
//Loading message, if required //Loading message, if required
if(target.childElementCount == 0){ if(target.childElementCount == 0){
@ -110,7 +108,7 @@ ComunicWeb.pages.conversations.listPane = {
emptyElem(target); //Remove any previously shown list emptyElem(target); //Remove any previously shown list
//Display the list of conversations //Display the list of conversations
ComunicWeb.pages.conversations.listPane._display_list(target, result, args); ComunicWeb.pages.conversations.listPane._display_list(target, result);
}); });
}, },
@ -121,9 +119,8 @@ ComunicWeb.pages.conversations.listPane = {
* *
* @param {HTMLElement} target The target for the list * @param {HTMLElement} target The target for the list
* @param {Object} list The list of conversations * @param {Object} list The list of conversations
* @param {Object} args Additional arguments
*/ */
_display_list: function(target, list, args){ _display_list: function(target, list){
//Create the conversations container //Create the conversations container
var conversationsContainer = createElem2({ var conversationsContainer = createElem2({
@ -132,16 +129,13 @@ ComunicWeb.pages.conversations.listPane = {
class: "nav nav-pills nav-stacked" class: "nav nav-pills nav-stacked"
}); });
//Make sure there isn't any selected conversation currently
args.selected_conversation = null;
//Process the list of conversations //Process the list of conversations
for (var num in list) { for (var num in list) {
if (list.hasOwnProperty(num)) { if (list.hasOwnProperty(num)) {
var conversation = list[num]; var conversation = list[num];
//Display conversation element //Display conversation element
args = this._display_entry(conversationsContainer, conversation, args); this._display_entry(conversationsContainer, conversation);
} }
} }
@ -149,21 +143,7 @@ ComunicWeb.pages.conversations.listPane = {
ComunicWeb.pages.conversations.utils.enableSlimScroll( ComunicWeb.pages.conversations.utils.enableSlimScroll(
conversationsContainer, conversationsContainer,
ComunicWeb.pages.conversations.utils.getAvailableHeight(), ComunicWeb.pages.conversations.utils.getAvailableHeight(),
0); 0);
//Scroll to selected conversation, if possible
if(args.selected_conversation != null){
var newScrollPos = args.selected_conversation.offsetTop - 30;
if(newScrollPos < 0)
newScrollPos = 0;
//Enable slimscroll again
ComunicWeb.pages.conversations.utils.enableSlimScroll(
conversationsContainer,
ComunicWeb.pages.conversations.utils.getAvailableHeight() + 55,
newScrollPos);
}
}, },
/** /**
@ -171,10 +151,8 @@ ComunicWeb.pages.conversations.listPane = {
* *
* @param {HTMLElement} target The target for the conversation * @param {HTMLElement} target The target for the conversation
* @param {Object} info Information about the conversation to display * @param {Object} info Information about the conversation to display
* @param {Object} args Additional arguments
* @return Additional arguments (may be modified)
*/ */
_display_entry: function(target, info, args) { _display_entry: function(target, info) {
//Create conversation container element //Create conversation container element
var convContainer = createElem2({ var convContainer = createElem2({
@ -196,16 +174,9 @@ ComunicWeb.pages.conversations.listPane = {
convLink.className += " selected"; convLink.className += " selected";
//Open the conversation //Open the conversation
args.opener(info.ID); openPage("conversations/"+info.ID)
}); });
//Check if it is the current conversation
if(args.getCurrentID() == info.ID){
convLink.className += " selected";
//Save selected conversation link
args.selected_conversation = convContainer;
}
//Add conversation last activity on the rigth //Add conversation last activity on the rigth
var lastActivityContainer = createElem2({ var lastActivityContainer = createElem2({
@ -249,9 +220,6 @@ ComunicWeb.pages.conversations.listPane = {
type: "span", type: "span",
innerHTML: (info.members.length === 1 ? "1 member" : info.members.length + " members") innerHTML: (info.members.length === 1 ? "1 member" : info.members.length + " members")
}); });
//Return the list of arguments
return args;
} }
} }

View File

@ -14,60 +14,22 @@ ComunicWeb.pages.conversations.main = {
*/ */
open: function(args, target){ open: function(args, target){
//Conversation page is organized like an array with two columns //Create a container
//Left column : the list of conversations const container = createElem2({
//Rigth column : the message of the currently opened conversation
//Create a row
var row = createElem2({
appendTo: target, appendTo: target,
type: "div", type: "div",
class: "row conversations-page-container" class: "conversations-page-container"
}); });
//Left area: The list of conversations
var leftArea = createElem2({
appendTo: row,
type: "div",
class: "col-md-3"
});
//Right area : The conversations
var rightArea = createElem2({
appendTo: row,
type: "div",
class: "col-md-9"
});
/**
* Open a conversation
*
* @param {Number} id The ID of the conversation
*/
var conversationOpener = function(id){
//Empty the target
emptyElem(rightArea);
//Open the conversation
ComunicWeb.pages.conversations.conversation.open(id, rightArea);
//Update website URI
ComunicWeb.common.page.update_uri("Conversations", "conversations/" + id);
}
//Check if a conversation has to be opened //Check if a conversation has to be opened
if(args.subfolder){ if(args.subfolder){
ComunicWeb.pages.conversations.conversation.open(this.getCurrentConversationID(), container);
//Open the conversation
conversationOpener(ComunicWeb.pages.conversations.main.getCurrentConversationID());
} }
//Display the list of conversation // Otherwise display the list of conversations
ComunicWeb.pages.conversations.listPane.display(leftArea, { else {
opener: conversationOpener, ComunicWeb.pages.conversations.listPane.display(container);
getCurrentID: this.getCurrentConversationID }
});
}, },
/** /**