thelounge/client/js/socket-events/more.js

63 lines
1.8 KiB
JavaScript
Raw Normal View History

2017-05-18 20:08:54 +00:00
"use strict";
const $ = require("jquery");
const socket = require("../socket");
const render = require("../render");
const chat = $("#chat");
const templates = require("../../views");
socket.on("more", function(data) {
const documentFragment = render.buildChannelMessages(data.chan, data.messages);
const chan = chat
.find("#chan-" + data.chan)
.find(".messages");
// get the scrollable wrapper around messages
const scrollable = chan.closest(".chat");
const heightOld = chan.height();
// Remove the date-change marker we put at the top, because it may
// not actually be a date change now
const children = $(chan).children();
if (children.eq(0).hasClass("date-marker-container")) { // Check top most child
children.eq(0).remove();
} else if (children.eq(1).hasClass("date-marker-container")) {
// The unread-marker could be at index 0, which will cause the date-marker to become "stuck"
children.eq(1).remove();
}
// Add the older messages
chan.prepend(documentFragment).end();
// restore scroll position
const position = chan.height() - heightOld;
scrollable.scrollTop(position);
if (data.messages.length !== 100) {
scrollable.find(".show-more").removeClass("show");
}
// Date change detect
// Have to use data instaid of the documentFragment because it's being weird
let lastDate;
$(data.messages).each(function() {
const msgData = this;
const msgDate = new Date(msgData.time);
const msg = $(chat.find("#chan-" + data.chan + " .messages #msg-" + msgData.id));
// Top-most message in a channel
if (!lastDate) {
lastDate = msgDate;
msg.before(templates.date_marker({msgDate: msgDate}));
}
if (lastDate.toDateString() !== msgDate.toDateString()) {
msg.before(templates.date_marker({msgDate: msgDate}));
}
lastDate = msgDate;
});
scrollable.find(".show-more-button").prop("disabled", false);
});