From 4a2081561915ab6dd3f71f09435caebf38db98a1 Mon Sep 17 00:00:00 2001 From: Pierre Date: Tue, 15 May 2018 19:17:23 +0200 Subject: [PATCH] Can load older messages on conversations page --- .../css/pages/conversations/conversation.css | 1 + assets/js/pages/conversations/conversation.js | 124 ++++++++++++++++-- 2 files changed, 115 insertions(+), 10 deletions(-) diff --git a/assets/css/pages/conversations/conversation.css b/assets/css/pages/conversations/conversation.css index 871a5de0..869c2263 100644 --- a/assets/css/pages/conversations/conversation.css +++ b/assets/css/pages/conversations/conversation.css @@ -7,6 +7,7 @@ .big-box-conversation .direct-chat-text { display: inline-block; margin-left: 10px; + max-width: 150px; } .big-box-conversation .right .direct-chat-text { diff --git a/assets/js/pages/conversations/conversation.js b/assets/js/pages/conversations/conversation.js index cf4aa995..cd8254c5 100644 --- a/assets/js/pages/conversations/conversation.js +++ b/assets/js/pages/conversations/conversation.js @@ -42,6 +42,9 @@ ComunicWeb.pages.conversations.conversation = { //Conversation information conversation: null, + //Enabled top scroll detection + initTopScrollDetection: false, + //Related user information users: null, }; @@ -185,6 +188,9 @@ ComunicWeb.pages.conversations.conversation = { response.forEach(function(message){ ComunicWeb.pages.conversations.conversation.addMessage(message); }); + + //Init top scroll detection (if available) + ComunicWeb.pages.conversations.conversation.initTopScrollDetection(); }); }, @@ -221,11 +227,20 @@ ComunicWeb.pages.conversations.conversation = { //Create message container var messageContainer = createElem2({ - appendTo: this._conv_info.window.messagesTarget, type: "div", class: "direct-chat-msg " + (userIsOwner ? "right" : "") }); + //Apply message container + if(toLatestMessages){ + this._conv_info.window.messagesTarget.appendChild(messageContainer); + } + else { + + //Put the message in the begining + this._conv_info.window.messagesTarget.insertBefore(messageContainer, this._conv_info.window.messagesTarget.firstChild); + } + //Top message information var topInformation = createElem2({ appendTo: messageContainer, @@ -308,17 +323,19 @@ ComunicWeb.pages.conversations.conversation = { nameContainer.innerHTML = userFullName(this._conv_info.users["user-" + info.ID_user]); } - //Set a timeout to make slimscroll properly work - setTimeout(function(){ + //Set a timeout to make slimscroll properly work (for newest messages) + if(toLatestMessages){ + setTimeout(function(){ - //Enable / update slimscroll - var target = ComunicWeb.pages.conversations.conversation._conv_info.window.messagesTarget; - var scrollBottom = $(target).prop("scrollHeight")+"px"; - $(target).slimScroll({ - scrollTo: scrollBottom - }); + //Enable / update slimscroll + var target = ComunicWeb.pages.conversations.conversation._conv_info.window.messagesTarget; + var scrollBottom = $(target).prop("scrollHeight")+"px"; + $(target).slimScroll({ + scrollTo: scrollBottom + }); - }, 100); + }, 100); + } }, /** @@ -478,6 +495,93 @@ ComunicWeb.pages.conversations.conversation = { return false; } + }, + + /** + * Init top scroll detection (if required) + */ + initTopScrollDetection: function(){ + + //Check if top scroll dection has already been enabled on this conversation + if(this._conv_info.initTopScrollDetection) + return; + + //Check if there isn't any message in the list + if(this._conv_info.last_message_id == 0) + return; + + //Mark top scroll detection as initialized + this._conv_info.initTopScrollDetection = true; + + //Define some variables + var refreshLocked = false; + var topScrollCount = 0; + + //Save conversation information + var convInfo = this._conv_info; + + $(this._conv_info.window.messagesTarget).bind("slimscrolling", function(e, pos){ + + //Check if a request is already pending + if(refreshLocked) + return; + + //Check if we are not at the top of the screen + if(pos != 0){ + topScrollCount = 0; + return; + } + + //Increment value + topScrollCount++; + + //The user must scroll several seconds to request a refresh + if(topScrollCount < 3) + return; + + //Lock refresh + refreshLocked = true; + + //Query older messages + ComunicWeb.components.conversations.interface.getOlderMessages(convInfo.id, convInfo.first_message_id, 10, function(response){ + + //Unlock service + refreshLocked = false; + + //Check for errors + if(response.error) + return notify("An error occured while trying to retrive older messages !", "danger"); + + //Check if there is not any message to display + if(response.length == 0){ + + //Lock service + refreshLocked = true; + return; + + } + + //Process the list of messages + //Reverse messages order + response.reverse(); + + //Save the current oldest message + var oldestMessage = convInfo.window.messagesTarget.firstChild; + + //Process the list of messages in reverse order + response.forEach(function(message){ + ComunicWeb.pages.conversations.conversation.addMessage(message); + }); + + //Update slimscroll + newScrollPos = oldestMessage.offsetTop - 30; + if(newScrollPos < 0) + newScrollPos = 0; + $(convInfo.window.messagesTarget).slimScroll({ + scrollTo: newScrollPos + "px" + }); + }); + }); } }; \ No newline at end of file