Download as
Browse Code »

Commit 43f488516048e407091d1c25baae60fa198b3257

Authored by Rodrigo Souto
1 parent 892e21db
Exists in master and in 22 other branches angular_poc, api-article-archived, article-readonly, backup-7-jan-2016, captcha_serpro_plugin, content-manager-hostspot, export-comment-paragraph, fix_event_date_issue, login-captcha, master_rails3, new_video_plugin, pg_search_rank, production, refactor_with_role, refactor_with_role_scope, remove_profile_cat_icons, resend_confirmation_email, staging, staging_rails3, tasks_keep_filter_params, theme-brasil-digital-from-staging, travis

Chat scrollback

Showing 2 changed files with 24 additions and 11 deletions   Show diff stats
app/controllers/public/chat_controller.rb
  Diff comments   View file @43f4885
... ... @@ -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
  Diff comments   View file @43f4885
... ... @@ -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 }
... ...