Commit b9eeaf74

mo khan <mo@mokhan.ca>
2014-09-05 03:05:31
add infinite scroll to artists page.
1 parent 2f9dc38
Changed files (4)
app/views/profiles/_index.html.erb
@@ -0,0 +1,23 @@
+<div class="row-fluid">
+  <% @profiles.each_slice(6).each do |batch| %>
+    <ul class='thumbnails'>
+      <% batch.each do |profile| %>
+        <li class="span2">
+          <div class="thumbnail">
+            <%= link_to profile_path(profile) do %>
+              <%= avatar_for(profile) %>
+            <% end %>
+            <div class="caption">
+              <h4><%= link_to shrink(profile.name, 12), profile_path(profile) %></h4>
+              <p><%= link_to shrink(profile.city, 20, 'sugarland'), profile_path(profile) %></p>
+              <p><small><%= time_ago_in_words(profile.created_at) %> ago.</small></p>
+            </div>
+          </div>
+        </li>
+      <% end %>
+    </ul>
+  <% end %>
+</div>
+<div id='more-button-row' class="row-fluid">
+  <%= link_to_next_page @profiles, 'More...', params: { cache: false }, remote: true, class: 'more-button hidden', data: { disable_with: 'loading...' } %>
+</div>
app/views/profiles/index.html.erb
@@ -1,23 +1,16 @@
-<div class="row-fluid">
-  <% @profiles.each_slice(6).each do |batch| %>
-    <ul class='thumbnails'>
-      <% batch.each do |profile| %>
-        <li class="span2">
-          <div class="thumbnail">
-            <%= link_to profile_path(profile) do %>
-              <%= avatar_for(profile) %>
-            <% end %>
-            <div class="caption">
-              <h4><%= link_to shrink(profile.name, 12), profile_path(profile) %></h4>
-              <p><%= link_to shrink(profile.city, 20, 'sugarland'), profile_path(profile) %></p>
-              <p><small><%= time_ago_in_words(profile.created_at) %> ago.</small></p>
-            </div>
-          </div>
-        </li>
-      <% end %>
-    </ul>
-  <% end %>
+<%= content_for(:javascript) do %>
+<script type="text/javascript" charset="utf-8">
+  $(window).scroll(function(){
+    if ( $(window).scrollTop() > ($(document).height() - $(window).height()) ) {
+      $('.more-button').trigger('click');
+    }
+  });
+</script>
+<% end %>
+
+<div id="bakery">
+  <%= render partial: 'index' %>
 </div>
-<div class="row-fluid">
+<div id="pagination-row" class="row-fluid">
   <%= render "shared/paging", items: @profiles %>
 </div>
app/views/profiles/index.js.erb
@@ -0,0 +1,4 @@
+$('#more-button-row').remove();
+$('#pagination-row').remove();
+$('#bakery').append('<%= j render partial: 'index' %>');
+history.pushState({ }, "page <%= params[:page] %>", "<%= paginate_profiles_path(page: params[:page]) %>");
config/routes.rb
@@ -20,7 +20,7 @@ Cake::Application.routes.draw do
   end
 
   resources :profiles, :only => [:index, :show] do
-    get 'page/:page', :action => :index, :on => :collection
+    get 'page/:page', :action => :index, :on => :collection, as: :paginate
   end
 
   get 'categories/:slug' => "categories#show", :as => :category