Download as
Browse Code »

Commit 4238ca533bd9b82180fe0ed1255738300a23aa3b

Authored by Francisco Marcelo de Araújo Lima Júnior
1 parent 77158095
Exists in master

#community dashboard - add infinite scroll

Showing 7 changed files with 60 additions and 38 deletions   Show diff stats
controllers/public/community_hub_plugin_public_controller.rb
  Diff comments   View file @4238ca5
... ... @@ -81,20 +81,35 @@ class CommunityHubPluginPublicController < PublicController
81 81 def newer_comments
82 82 latest_post = params[:latest_post]
83 83 hub = Article.find(params[:hub])
84   - posts = Comment.find(:all, :order => "id desc", :conditions => ["id > :id and source_id = :hub", { :id => latest_post, :hub => hub }])
  84 + posts = Comment.find(:all, :order => "id desc", :conditions => ["id > :id and source_id = :hub", { :id => latest_post, :hub => hub }], :limit => 20)
85 85  
86 86 if !posts.empty?
87 87 oldest_post = posts.last.id
88 88 latest_post = posts.first.id
  89 + size = posts.size
89 90 else
90 91 oldest_post = 0
91 92 latest_post = 0
92 93 end
93 94  
94   - render :partial => "post", :collection => posts, :locals => { :latest_post => latest_post, :oldest_post => oldest_post, :hub => hub }
  95 + render :partial => "post", :collection => posts, :locals => { :latest_id => latest_post, :oldest_id => oldest_post, :hub => hub }
95 96 end
96 97  
97 98  
  99 + def older_comments
  100 + oldest_id = params[:oldest_id]
  101 + hub = Article.find(params[:hub])
  102 + posts = Comment.find(:all, :order => "id desc", :conditions => ["id < :id and source_id = :hub", { :id => oldest_id, :hub => hub }], :limit => 20)
  103 +
  104 + if !posts.empty?
  105 + oldest_id = posts.last.id
  106 + latest_id = posts.first.id
  107 + end
  108 +
  109 + render :partial => "post", :collection => posts, :locals => { :latest_id => latest_id, :oldest_id => oldest_id, :hub => hub }
  110 + end
  111 +
  112 +
98 113 def newer_articles
99 114 latest_post = params[:latest_post]
100 115 hub = Article.find(params[:hub])
... ...
public/javascripts/community_hub.js
  Diff comments   View file @4238ca5
... ... @@ -3,24 +3,30 @@ var oldest_post_id = 0;
3 3 live_scroll_position = 0;
4 4 var mediations = [];
5 5  
6   -function validate_textarea(txt) {
7   - return (txt.search(/[^\n\s]/)!=-1);
  6 +function load_more_messages() {
  7 +
  8 + var hub_id = jQuery(".hub").attr('id');
  9 + var oldest_id = jQuery("#live-posts li.post").last().attr("id");
  10 +
  11 + jQuery.ajax({
  12 + url: '/plugin/community_hub/public/older_comments',
  13 + type: 'get',
  14 + data: { oldest_id: oldest_id, hub: hub_id },
  15 + success: function(data) {
  16 + if (data.trim().length > 0) {
  17 + jQuery("#live-posts").append(data);
  18 + }
  19 + },
  20 + error: function(ajax, stat, errorThrown) {
  21 + }
  22 + });
8 23 }
9 24  
10   -function clearLoadingMediationCommentSignal(mediation) {
11   - jQuery(".loading-mediation-comment").filter("#" + mediation).removeClass("loading-signal-error");
12   - jQuery(".loading-mediation-comment").filter("#" + mediation).removeClass("loading-signal-done");
13   -}
14 25  
15   -function clearLoadingMessageSignal() {
16   - jQuery("#loading-message").removeClass("loading-signal-error");
17   - jQuery("#loading-message").removeClass("loading-signal-done");
  26 +function validate_textarea(txt) {
  27 + return (txt.search(/[^\n\s]/)!=-1);
18 28 }
19 29  
20   -function clearLoadingMediationSignal() {
21   - jQuery("#loading-mediation").removeClass("loading-signal-error");
22   - jQuery("#loading-mediation").removeClass("loading-signal-done");
23   -}
24 30  
25 31 function toogle_mediation_comments(mediation) {
26 32 jQuery("#mediation-comment-list-" + mediation ).toggle();
... ... @@ -58,16 +64,10 @@ function new_mediation_comment(button, mediation) {
58 64 jQuery("#mediation-comment-form-" + mediation + " textarea").val('');
59 65 jQuery("#mediation-comment-form-" + mediation + " .submit").attr("disabled", false);
60 66 update_mediation_comments(mediation, false);
61   - setTimeout(function(){
62   - clearLoadingMediationCommentSignal(mediation);
63   - }, 3000);
64 67 mediations.push( [ mediation, setInterval(function() { update_mediation_comments(mediation, false)}, 5000) ] );
65 68 }
66 69 else {
67 70 jQuery("#mediation-comment-form-" + mediation + " .submit").attr("disabled", false);
68   - setTimeout(function(){
69   - clearLoadingMediationCommentSignal(mediation);
70   - }, 3000);
71 71 mediations.push( [ mediation, setInterval(function() { update_mediation_comments(mediation, false)}, 5000) ] );
72 72 }
73 73 }, 'json');
... ... @@ -93,12 +93,9 @@ function new_message(button) {
93 93 jQuery(".hub .form-message #message_body").val('');
94 94 jQuery(".hub .form-message .submit").attr("disabled", false);
95 95 update_live_stream(false);
96   - setTimeout(clearLoadingMessageSignal, 3000);
97   -
98 96 }
99 97 else {
100 98 jQuery(".hub .form-message .submit").attr("disabled", false);
101   - setTimeout(clearLoadingMessageSignal, 3000);
102 99 }
103 100 }, 'json');
104 101  
... ... @@ -124,11 +121,9 @@ function new_mediation(button) {
124 121 jQuery(".hub .form-mediation .submit").attr("disabled", false);
125 122 tinymce.get('article_body').setContent('');
126 123 update_mediations();
127   - setTimeout(clearLoadingMediationSignal, 3000);
128 124 }
129 125 else {
130 126 jQuery(".hub .form-mediation .submit").attr("disabled", false);
131   - setTimeout(clearLoadingMediationSignal, 3000);
132 127 }
133 128 }, 'json');
134 129  
... ... @@ -317,6 +312,14 @@ function hub_right_tab_click() {
317 312  
318 313 first_hub_load = true;
319 314  
  315 +jQuery(".hub .live .envelope").scroll(function() {
  316 + jQuery("#auto_scrolling").attr('checked', false);
  317 + if (jQuery(".hub .live .envelope").scrollTop() == (jQuery(".hub ul#live-posts").height() - jQuery(".hub .live .envelope").height() + 23)) {
  318 + load_more_messages();
  319 + }
  320 +});
  321 +
  322 +
320 323 jQuery(document).ready(function() {
321 324  
322 325 jQuery("#live-posts").scroll(function() {
... ... @@ -329,4 +332,5 @@ jQuery(document).ready(function() {
329 332  
330 333 update_live_stream(true);
331 334 update_mediations();
  335 +
332 336 });
... ...
public/style.css
  Diff comments   View file @4238ca5
... ... @@ -7,7 +7,7 @@
7 7 height: 350px;
8 8 padding-top: 10px;
9 9 height: 350px;
10   - display: inline-block;
  10 + display: inline-block;
11 11 }
12 12  
13 13 #hub-loading {
... ... @@ -174,11 +174,14 @@
174 174 margin-bottom: 2em;
175 175 }
176 176  
  177 +.hub .envelope {
  178 + height: 500px;
  179 + overflow-x: hidden;
  180 + overflow-y: scroll;
  181 +}
  182 +
177 183 .hub ul#live-posts, .hub ul#mediation-posts{
178   - height: 500px;
179   - overflow-x: hidden;
180   - overflow-y: scroll;
181   - border-width: 1px;
  184 + border-width: 0 1px 1px;
182 185 border-style: solid;
183 186 border-color: lightGray;
184 187 padding-top: 10px;
... ... @@ -257,7 +260,6 @@
257 260 text-align: center;
258 261 margin-top: 9px;
259 262 line-height: 27px;
260   -
261 263 }
262 264  
263 265 #content .main-block .hub .live h1.mediation {}
... ...
views/community_hub_plugin_public/_mediation.rhtml
  Diff comments   View file @4238ca5
1 1 <% extend CommunityHubPlugin::HubHelper %>
2 2  
3   -<li id="<%= mediation.id %>" class="<%=post_css_classes(mediation.id, latest_post, oldest_post)%>">
  3 +<li id="<%= mediation.id %>" class="<%=post_css_classes(mediation.id, latest_post, oldest_post)%>">
4 4  
5 5 <ul>
6 6 <li class="time"><%= post_time(mediation.created_at) %></li>
... ...
views/community_hub_plugin_public/_mediation_comment_form.rhtml
  Diff comments   View file @4238ca5
1   -<% form_for :message,
  1 +<% form_for :message,
2 2 :method => 'post',
3 3 :url => {
4   - :controller => 'community_hub_plugin_public',
  4 + :controller => 'community_hub_plugin_public',
5 5 :action => 'new_message',
6 6 :article_id => mediation.id
7 7 } do |f| %>
... ...
views/community_hub_plugin_public/_post.rhtml
  Diff comments   View file @4238ca5
1 1 <% extend CommunityHubPlugin::HubHelper %>
2 2  
3   -<li id="<%= post.id %>" class="post">
  3 +<li id="<%= post.id %>" class="post">
4 4 <ul>
5 5 <li class="time"><%= post_time(post.created_at) %></li>
6 6 <li class="avatar">
... ...
views/content_viewer/hub.rhtml
  Diff comments   View file @4238ca5
... ... @@ -18,8 +18,9 @@
18 18 <span class="title"><%= _("Mediation") %></span>
19 19 </h1>
20 20  
21   - <ul id="live-posts">
22   - </ul>
  21 + <div class="envelope">
  22 + <ul id="live-posts"></ul>
  23 + </div>
23 24  
24 25 <span><%= check_box_tag 'auto_scrolling', 'yes', true %><%= _("Auto scrolling") %></span>
25 26  
... ...