diff --git a/client/js/lounge.js b/client/js/lounge.js index 53f8acef..3adf2881 100644 --- a/client/js/lounge.js +++ b/client/js/lounge.js @@ -13,6 +13,7 @@ require("./libs/jquery/stickyscroll"); const slideoutMenu = require("./libs/slideout"); const templates = require("../views"); const socket = require("./socket"); +const render = require("./render"); require("./socket-events"); const storage = require("./localStorage"); const utils = require("./utils"); @@ -348,14 +349,17 @@ $(function() { .find(".chat") .unsticky(); - var lastActiveChan = lastActive - .find(".chan.active") - .removeClass("active"); + const lastActiveChan = lastActive.find(".chan.active"); - lastActiveChan - .find(".unread-marker") - .data("unread-id", 0) - .appendTo(lastActiveChan.find(".messages")); + if (lastActiveChan.length > 0) { + lastActiveChan + .removeClass("active") + .find(".unread-marker") + .data("unread-id", 0) + .appendTo(lastActiveChan.find(".messages")); + + render.trimMessageInChannel(lastActiveChan, 100); + } var chan = $(target) .addClass("active") diff --git a/client/js/render.js b/client/js/render.js index 307fb488..121e83f9 100644 --- a/client/js/render.js +++ b/client/js/render.js @@ -26,6 +26,7 @@ module.exports = { renderChannel, renderChannelUsers, renderNetworks, + trimMessageInChannel, }; function buildChannelMessages(container, chanId, chanType, messages) { @@ -242,6 +243,25 @@ function renderNetworks(data, singleNetwork) { } } +function trimMessageInChannel(channel, messageLimit) { + const messages = channel.find(".messages .msg").slice(0, -messageLimit); + + if (messages.length === 0) { + return; + } + + messages.remove(); + + channel.find(".show-more").addClass("show"); + + // Remove date-separators that would otherwise be "stuck" at the top of the channel + channel.find(".date-marker-container").each(function() { + if ($(this).next().hasClass("date-marker-container")) { + $(this).remove(); + } + }); +} + function loadMoreHistory(entries) { entries.forEach((entry) => { if (!entry.isIntersecting) { diff --git a/client/js/socket-events/msg.js b/client/js/socket-events/msg.js index 889d491f..c75c9fe5 100644 --- a/client/js/socket-events/msg.js +++ b/client/js/socket-events/msg.js @@ -66,17 +66,18 @@ function processReceivedMessage(data) { sidebar.find("[data-target='" + target + "'] .badge").removeClass("highlight").empty(); } - // Message arrived in a non active channel, trim it to 100 messages - if (activeChannelId !== targetId && container.find(".msg").slice(0, -100).remove().length) { - channel.find(".show-more").addClass("show"); + let messageLimit = 0; - // Remove date-separators that would otherwise - // be "stuck" at the top of the channel - channel.find(".date-marker-container").each(function() { - if ($(this).next().hasClass("date-marker-container")) { - $(this).remove(); - } - }); + if (activeChannelId !== targetId) { + // If message arrives in non active channel, keep only 100 messages + messageLimit = 100; + } else if (container.isScrollBottom()) { + // If message arrives in active channel, keep 500 messages if scroll is currently at the bottom + messageLimit = 500; + } + + if (messageLimit > 0) { + render.trimMessageInChannel(channel, messageLimit); } if ((data.msg.type === "message" || data.msg.type === "action" || data.msg.type === "notice") && channel.hasClass("channel")) {