Merge pull request #1334 from mluto/load-more-chat-messages

Load more than 100 chat messages using a 'load more'-link
This commit is contained in:
John McLear 2013-01-13 10:31:45 -08:00
commit 33e0ec2097
10 changed files with 256 additions and 57 deletions

View file

@ -81,6 +81,7 @@
"pad.share.emebdcode": "In Webseite einbetten",
"pad.chat": "Chat",
"pad.chat.title": "Den Chat dieses Pads \u00f6ffnen",
"pad.chat.loadmessages": "Weitere Nachrichten laden",
"timeslider.pageTitle": "{{appTitle}} Pad-Versionsgeschichte",
"timeslider.toolbar.returnbutton": "Zur\u00fcck zum Pad",
"timeslider.toolbar.authors": "Autoren:",

File diff suppressed because one or more lines are too long

View file

@ -281,27 +281,7 @@ Pad.prototype.getChatMessage = function getChatMessage(entryNum, callback) {
});
};
Pad.prototype.getLastChatMessages = function getLastChatMessages(count, callback) {
//return an empty array if there are no chat messages
if(this.chatHead == -1)
{
callback(null, []);
return;
}
var _this = this;
//works only if we decrement the amount, for some reason
count--;
//set the startpoint
var start = this.chatHead-count;
if(start < 0)
start = 0;
//set the endpoint
var end = this.chatHead;
Pad.prototype.getChatMessages = function getChatMessages(start, end, callback) {
//collect the numbers of chat entries and in which order we need them
var neededEntries = [];
var order = 0;
@ -310,7 +290,9 @@ Pad.prototype.getLastChatMessages = function getLastChatMessages(count, callback
neededEntries.push({entryNum:i, order: order});
order++;
}
var _this = this;
//get all entries out of the database
var entries = [];
async.forEach(neededEntries, function(entryObject, callback)

View file

@ -205,6 +205,8 @@ exports.handleMessage = function(client, message)
handleUserInfoUpdate(client, message);
} else if (message.data.type == "CHAT_MESSAGE") {
handleChatMessage(client, message);
} else if (message.data.type == "GET_CHAT_MESSAGES") {
handleGetChatMessages(client, message);
} else if (message.data.type == "SAVE_REVISION") {
handleSaveRevisionMessage(client, message);
} else if (message.data.type == "CLIENT_MESSAGE" &&
@ -362,6 +364,74 @@ function handleChatMessage(client, message)
});
}
/**
* Handles the clients request for more chat-messages
* @param client the client that send this message
* @param message the message from the client
*/
function handleGetChatMessages(client, message)
{
if(message.data.start == null)
{
messageLogger.warn("Dropped message, GetChatMessages Message has no start!");
return;
}
if(message.data.end == null)
{
messageLogger.warn("Dropped message, GetChatMessages Message has no start!");
return;
}
var start = message.data.start;
var end = message.data.end;
var count = start - count;
if(count < 0 && count > 100)
{
messageLogger.warn("Dropped message, GetChatMessages Message, client requested invalid amout of messages!");
return;
}
var padId = sessioninfos[client.id].padId;
var pad;
async.series([
//get the pad
function(callback)
{
padManager.getPad(padId, function(err, _pad)
{
if(ERR(err, callback)) return;
pad = _pad;
callback();
});
},
function(callback)
{
pad.getChatMessages(start, end, function(err, chatMessages)
{
if(ERR(err, callback)) return;
var infoMsg = {
type: "COLLABROOM",
data: {
type: "CHAT_MESSAGES",
messages: chatMessages
}
};
// send the messages back to the client
for(var i in pad2sessions[padId])
{
if(pad2sessions[padId][i] == client.id)
{
socketio.sockets.sockets[pad2sessions[padId][i]].json.send(infoMsg);
break;
}
}
});
}]);
}
/**
* Handles a handleSuggestUserName, that means a user have suggest a userName for a other user
@ -778,19 +848,18 @@ function handleClientReady(client, message)
var pad;
var historicalAuthorData = {};
var currentTime;
var chatMessages;
var padIds;
async.series([
// Get ro/rw id:s
function (callback) {
//Get ro/rw id:s
function (callback)
{
readOnlyManager.getIds(message.padId, function(err, value) {
if(ERR(err, callback)) return;
padIds = value;
callback();
});
},
//check permissions
function(callback)
{
@ -816,7 +885,7 @@ function handleClientReady(client, message)
}
});
},
//get all authordata of this new user
//get all authordata of this new user, and load the pad-object from the database
function(callback)
{
async.parallel([
@ -840,6 +909,7 @@ function handleClientReady(client, message)
callback();
});
},
//get pad
function(callback)
{
padManager.getPad(padIds.padId, function(err, value)
@ -851,7 +921,7 @@ function handleClientReady(client, message)
}
], callback);
},
//these db requests all need the pad object
//these db requests all need the pad object (timestamp of latest revission, author data)
function(callback)
{
var authors = pad.getAllAuthors();
@ -880,20 +950,11 @@ function handleClientReady(client, message)
callback();
});
}, callback);
},
//get the latest chat messages
function(callback)
{
pad.getLastChatMessages(100, function(err, _chatMessages)
{
if(ERR(err, callback)) return;
chatMessages = _chatMessages;
callback();
});
}
], callback);
},
//glue the clientVars together, send them and tell the other clients that a new one is there
function(callback)
{
//Check that the client is still here. It might have disconnected between callbacks.
@ -966,7 +1027,9 @@ function handleClientReady(client, message)
"padId": message.padId,
"initialTitle": "Pad: " + message.padId,
"opts": {},
"chatHistory": chatMessages,
// tell the client the number of the latest chat-message, which will be
// used to request the latest 100 chat-messages later (GET_CHAT_MESSAGES)
"chatHead": pad.chatHead,
"numConnectedUsers": pad2sessions[padIds.padId].length,
"isProPad": false,
"readOnlyId": padIds.readOnlyPadId,
@ -980,11 +1043,10 @@ function handleClientReady(client, message)
},
"abiwordAvailable": settings.abiwordAvailable(),
"plugins": {
"plugins": plugins.plugins,
"parts": plugins.parts,
},
"initialChangesets": [] // FIXME: REMOVE THIS SHIT
"plugins": plugins.plugins,
"parts": plugins.parts,
},
"initialChangesets": [] // FIXME: REMOVE THIS SHIT
}
//Add a username to the clientVars if one avaiable

View file

@ -488,6 +488,22 @@ table#otheruserstable {
-ms-overflow-x: hidden;
overflow-x: hidden;
}
.chatloadmessages
{
margin-bottom: 5px;
margin-top: 5px;
margin-left: auto;
margin-right: auto;
display: block;
}
#chatloadmessagesbutton
{
line-height: 1.8em;
}
#chatloadmessagesball
{
display: none;
}
#chatinputbox {
padding: 3px 2px;
position: absolute;

View file

@ -28,6 +28,8 @@ var Tinycon = require('tinycon/tinycon');
var chat = (function()
{
var isStuck = false;
var gotInitialMessages = false;
var historyPointer = 0;
var chatMentions = 0;
var self = {
show: function ()
@ -76,7 +78,7 @@ var chat = (function()
this._pad.collabClient.sendMessage({"type": "CHAT_MESSAGE", "text": text});
$("#chatinput").val("");
},
addMessage: function(msg, increment)
addMessage: function(msg, increment, isHistoryAdd)
{
//correct the time
msg.time += this._pad.clientTimeOffset;
@ -112,7 +114,10 @@ var chat = (function()
var authorName = msg.userName == null ? _('pad.userlist.unnamed') : padutils.escapeHtml(msg.userName);
var html = "<p class='" + authorClass + "'><b>" + authorName + ":</b><span class='time " + authorClass + "'>" + timeStr + "</span> " + text + "</p>";
$("#chattext").append(html);
if(isHistoryAdd)
$(html).insertAfter('#chatloadmessagesbutton');
else
$("#chattext").append(html);
//should we increment the counter??
if(increment)
@ -125,7 +130,7 @@ var chat = (function()
$("#chatcounter").text(count);
// chat throb stuff -- Just make it throw for twice as long
if(wasMentioned && !alreadyFocused)
if(wasMentioned && !alreadyFocused && !isHistoryAdd)
{ // If the user was mentioned show for twice as long and flash the browser window
$('#chatthrob').html("<b>"+authorName+"</b>" + ": " + text).show().delay(4000).hide(400);
chatMentions++;
@ -141,8 +146,8 @@ var chat = (function()
chatMentions = 0;
Tinycon.setBubble(0);
});
self.scrollDown();
if(!isHistoryAdd)
self.scrollDown();
},
init: function(pad)
{
@ -157,12 +162,23 @@ var chat = (function()
}
});
var that = this;
$.each(clientVars.chatHistory, function(i, o){
that.addMessage(o, false);
})
// initial messages are loaded in pad.js' _afterHandshake
$("#chatcounter").text(0);
$("#chatloadmessagesbutton").click(function()
{
var start = Math.max(self.historyPointer - 20, 0);
var end = self.historyPointer;
$("#chatcounter").text(clientVars.chatHistory.length);
if(start == end) // nothing to load
return;
$("#chatloadmessagesbutton").css("display", "none");
$("#chatloadmessagesball").css("display", "block");
pad.collabClient.sendMessage({"type": "GET_CHAT_MESSAGES", "start": start, "end": end});
self.historyPointer = start;
});
}
}

View file

@ -400,7 +400,29 @@ function getCollabClient(ace2editor, serverVars, initialUserInfo, options, _pad)
}
else if (msg.type == "CHAT_MESSAGE")
{
chat.addMessage(msg, true);
chat.addMessage(msg, true, false);
}
else if (msg.type == "CHAT_MESSAGES")
{
for(var i = msg.messages.length - 1; i >= 0; i--)
{
chat.addMessage(msg.messages[i], true, true);
}
if(!chat.gotInitalMessages)
{
chat.scrollDown();
chat.gotInitalMessages = true;
chat.historyPointer = clientVars.chatHead - msg.messages.length;
}
// messages are loaded, so hide the loading-ball
$("#chatloadmessagesball").css("display", "none");
// there are less than 100 messages or we reached the top
if(chat.historyPointer <= 0)
$("#chatloadmessagesbutton").css("display", "none");
else // there are still more messages, re-show the load-button
$("#chatloadmessagesbutton").css("display", "block");
}
else if (msg.type == "SERVER_MESSAGE")
{

View file

@ -555,6 +555,18 @@ var pad = {
pad.collabClient.setOnChannelStateChange(pad.handleChannelStateChange);
pad.collabClient.setOnInternalAction(pad.handleCollabAction);
// load initial chat-messages
if(clientVars.chatHead != -1)
{
var chatHead = clientVars.chatHead;
var start = Math.max(chatHead - 100, 0);
pad.collabClient.sendMessage({"type": "GET_CHAT_MESSAGES", "start": start, "end": chatHead});
}
else // there are no messages
{
$("#chatloadmessagesbutton").css("display", "none");
}
function postAceInit()
{
padeditbar.init();

View file

@ -368,7 +368,10 @@
<div id="chatbox">
<div id="titlebar"><span id ="titlelabel" data-l10n-id="pad.chat"></span><a id="titlecross" onClick="chat.hide();return false;">-&nbsp;</a></div>
<div id="chattext" class="authorColors"></div>
<div id="chattext" class="authorColors">
<img alt="loading.." id="chatloadmessagesball" class="chatloadmessages" src="../static/img/loading.gif" align="top">
<button id="chatloadmessagesbutton" class="chatloadmessages" data-l10n-id="pad.chat.loadmessages"></button>
</div>
<div id="chatinputbox">
<form>
<input id="chatinput" type="text" maxlength="999">

View file

@ -0,0 +1,85 @@
describe("chat-load-messages", function(){
it("creates a pad", function(done) {
helper.newPad(done);
});
it("adds a lot of messages", function(done) {
var inner$ = helper.padInner$;
var chrome$ = helper.padChrome$;
var chatButton = chrome$("#chaticon");
chatButton.click();
var chatInput = chrome$("#chatinput");
var chatText = chrome$("#chattext");
var messages = 140;
for(var i=1; i <= messages; i++) {
var num = ''+i;
if(num.length == 1)
num = '00'+num;
if(num.length == 2)
num = '0'+num;
chatInput.sendkeys('msg' + num);
chatInput.sendkeys('{enter}');
}
helper.waitFor(function(){
return chatText.children("p").length == messages;
}).always(function(){
expect(chatText.children("p").length).to.be(messages);
$('#iframe-container iframe')[0].contentWindow.location.reload();
done();
});
});
it("checks initial message count", function(done) {
var chatText;
var expectedCount = 101;
helper.waitFor(function(){
// wait for the frame to load
var chrome$ = $('#iframe-container iframe')[0].contentWindow.$;
if(!chrome$) // page not fully loaded
return false;
var chatButton = chrome$("#chaticon");
chatButton.click();
chatText = chrome$("#chattext");
return chatText.children("p").length == expectedCount;
}).always(function(){
expect(chatText.children("p").length).to.be(expectedCount);
done();
});
});
it("loads more messages", function(done) {
var expectedCount = 122;
var chrome$ = $('#iframe-container iframe')[0].contentWindow.$;
var chatButton = chrome$("#chaticon");
chatButton.click();
var chatText = chrome$("#chattext");
var loadMsgBtn = chrome$("#chatloadmessagesbutton");
loadMsgBtn.click();
helper.waitFor(function(){
return chatText.children("p").length == expectedCount;
}).always(function(){
expect(chatText.children("p").length).to.be(expectedCount);
done();
});
});
it("checks for button vanishing", function(done) {
var expectedDisplay = 'none';
var chrome$ = $('#iframe-container iframe')[0].contentWindow.$;
var chatButton = chrome$("#chaticon");
chatButton.click();
var chatText = chrome$("#chattext");
var loadMsgBtn = chrome$("#chatloadmessagesbutton");
loadMsgBtn.click();
helper.waitFor(function(){
return loadMsgBtn.css('display') == expectedDisplay;
}).always(function(){
expect(loadMsgBtn.css('display')).to.be(expectedDisplay);
done();
});
});
});