Commit 43f488516048e407091d1c25baae60fa198b3257
1 parent
892e21db
Exists in
master
and in
27 other branches
Chat scrollback
Showing
2 changed files
with
24 additions
and
11 deletions
Show diff stats
app/controllers/public/chat_controller.rb
... | ... | @@ -51,7 +51,7 @@ class ChatController < PublicController |
51 | 51 | messages = ChatMessage.where('(to_id=:other and from_id=:me) or (to_id=:me and from_id=:other)', {:me => user.id, :other => other.id}) |
52 | 52 | end |
53 | 53 | |
54 | - messages = messages.order('created_at DESC').includes(:to, :from).limit(20) | |
54 | + messages = messages.order('created_at DESC').includes(:to, :from).offset(params[:offset]).limit(20) | |
55 | 55 | messages_json = messages.map do |message| |
56 | 56 | { |
57 | 57 | :body => message.body, | ... | ... |
public/javascripts/chat.js
... | ... | @@ -116,13 +116,19 @@ jQuery(function($) { |
116 | 116 | return body; |
117 | 117 | }, |
118 | 118 | |
119 | - show_message: function (jid, name, body, who, identifier, time) { | |
119 | + show_message: function (jid, name, body, who, identifier, time, offset) { | |
120 | 120 | if (body) { |
121 | 121 | body = Jabber.render_body_message(body); |
122 | 122 | var jid_id = Jabber.jid_to_id(jid); |
123 | 123 | var tab_id = '#' + Jabber.conversation_prefix + jid_id; |
124 | - if ($(tab_id).find('.message').length > 0 && $(tab_id).find('.message:last').attr('data-who') == who) { | |
125 | - $(tab_id).find('.history').find('.message:last .content').append('<p>' + body + '</p>'); | |
124 | + var history = $(tab_id).find('.history'); | |
125 | + | |
126 | + var offset_container = $('#chat-offset-container-'+offset); | |
127 | + if(offset_container.length == 0) | |
128 | + offset_container = $('<div id="chat-offset-container-'+offset+'"></div>').prependTo(history); | |
129 | + | |
130 | + if (offset_container.find('.message:last').attr('data-who') == who) { | |
131 | + offset_container.find('.message:last .content').append('<p>' + body + '</p>'); | |
126 | 132 | } |
127 | 133 | else { |
128 | 134 | if (time==undefined) { |
... | ... | @@ -134,10 +140,11 @@ jQuery(function($) { |
134 | 140 | .replace('%{time}', time) |
135 | 141 | .replace('%{name}', name) |
136 | 142 | .replace('%{avatar}', getAvatar(identifier)); |
137 | - $('#' + Jabber.conversation_prefix + jid_id).find('.history').append(message_html); | |
143 | + offset_container.append(message_html); | |
138 | 144 | $(".message span.time").timeago(); |
139 | 145 | } |
140 | - $(tab_id).find('.history').scrollTo({top:'100%', left:'0%'}); | |
146 | + if(offset == 0) history.scrollTo({top:'100%', left:'0%'}); | |
147 | + else history.scrollTo(offset_container.height()); | |
141 | 148 | if (who != "self") { |
142 | 149 | if ($(tab_id).find('.history:visible').length == 0) { |
143 | 150 | count_unread_messages(jid_id); |
... | ... | @@ -568,6 +575,13 @@ jQuery(function($) { |
568 | 575 | panel.find('.chat-target .other-name').html(title); |
569 | 576 | $('#chat .history').perfectScrollbar(); |
570 | 577 | |
578 | + panel.find('.history').scroll(function(){ | |
579 | + if($(this).scrollTop() == 0){ | |
580 | + var offset = panel.find('.message').size(); | |
581 | + recent_messages(jid, offset); | |
582 | + } | |
583 | + }); | |
584 | + | |
571 | 585 | var textarea = panel.find('textarea'); |
572 | 586 | textarea.attr('name', panel.id); |
573 | 587 | |
... | ... | @@ -581,10 +595,9 @@ jQuery(function($) { |
581 | 595 | return panel; |
582 | 596 | } |
583 | 597 | |
584 | - function recent_messages(jid) { | |
585 | - $.getJSON('/chat/recent_messages', { | |
586 | - identifier: getIdentifier(jid) | |
587 | - }, function(data) { | |
598 | + function recent_messages(jid, offset) { | |
599 | + if(!offset) offset = 0; | |
600 | + $.getJSON('/chat/recent_messages', {identifier: getIdentifier(jid), offset: offset}, function(data) { | |
588 | 601 | $.each(data, function(i, message) { |
589 | 602 | var body = message['body']; |
590 | 603 | var from = message['from']; |
... | ... | @@ -592,7 +605,7 @@ jQuery(function($) { |
592 | 605 | var date = message['created_at']; |
593 | 606 | var who = from['id']==getCurrentIdentifier() ? 'self' : from['id'] |
594 | 607 | |
595 | - Jabber.show_message(jid, from['name'], body, who, from['id'], date); | |
608 | + Jabber.show_message(jid, from['name'], body, who, from['id'], date, offset); | |
596 | 609 | }); |
597 | 610 | }); |
598 | 611 | } | ... | ... |