Commit ece9f50fb1076c1efee54b4ab3b161f2cac70046

Authored by Dmitriy Zaporozhets
1 parent 48bc4fc2

fixed unworking infinite scroll

app/assets/javascripts/application.js
@@ -10,6 +10,7 @@ @@ -10,6 +10,7 @@
10 //= require jquery.ui.selectmenu 10 //= require jquery.ui.selectmenu
11 //= require jquery.tagify 11 //= require jquery.tagify
12 //= require jquery.cookie 12 //= require jquery.cookie
  13 +//= require jquery.endless-scroll
13 //= require modernizr 14 //= require modernizr
14 //= require chosen 15 //= require chosen
15 //= require raphael 16 //= require raphael
app/assets/javascripts/commits.js
@@ -2,6 +2,7 @@ var CommitsList = { @@ -2,6 +2,7 @@ var CommitsList = {
2 ref:null, 2 ref:null,
3 limit:0, 3 limit:0,
4 offset:0, 4 offset:0,
  5 + disable:false,
5 6
6 init: 7 init:
7 function(ref, limit) { 8 function(ref, limit) {
@@ -36,15 +37,21 @@ var CommitsList = { @@ -36,15 +37,21 @@ var CommitsList = {
36 $("#commits_list").append(html); 37 $("#commits_list").append(html);
37 if(count > 0) { 38 if(count > 0) {
38 this.offset += count; 39 this.offset += count;
39 - this.initLoadMore(); 40 + } else {
  41 + this.disable = true;
40 } 42 }
41 }, 43 },
42 44
43 initLoadMore: 45 initLoadMore:
44 function() { 46 function() {
45 - $(window).bind('scroll', function(){  
46 - if($(window).scrollTop() == $(document).height() - $(window).height()){  
47 - $(window).unbind('scroll'); 47 + $(document).endlessScroll({
  48 + bottomPixels: 400,
  49 + fireDelay: 1000,
  50 + fireOnce:true,
  51 + ceaseFire: function() {
  52 + return CommitsList.disable;
  53 + },
  54 + callback: function(i) {
48 CommitsList.getOld(); 55 CommitsList.getOld();
49 } 56 }
50 }); 57 });
app/assets/javascripts/note.js
@@ -3,6 +3,7 @@ var NoteList = { @@ -3,6 +3,7 @@ var NoteList = {
3 first_id: 0, 3 first_id: 0,
4 last_id: 0, 4 last_id: 0,
5 resource_name: null, 5 resource_name: null,
  6 +disable:false,
6 7
7 init: 8 init:
8 function(resource_name, first_id, last_id) { 9 function(resource_name, first_id, last_id) {
@@ -26,9 +27,12 @@ getOld: @@ -26,9 +27,12 @@ getOld:
26 27
27 append: 28 append:
28 function(id, html) { 29 function(id, html) {
29 - this.first_id = id;  
30 - $("#notes-list").append(html);  
31 - this.initLoadMore(); 30 + if(this.first_id == id) {
  31 + this.disable = true;
  32 + } else {
  33 + this.first_id = id;
  34 + $("#notes-list").append(html);
  35 + }
32 }, 36 },
33 37
34 replace: 38 replace:
@@ -76,11 +80,16 @@ initRefresh: @@ -76,11 +80,16 @@ initRefresh:
76 80
77 initLoadMore: 81 initLoadMore:
78 function() { 82 function() {
79 - $(window).bind('scroll', function(){  
80 - if($(window).scrollTop() == $(document).height() - $(window).height()){  
81 - $(window).unbind('scroll'); 83 + $(document).endlessScroll({
  84 + bottomPixels: 400,
  85 + fireDelay: 1000,
  86 + fireOnce:true,
  87 + ceaseFire: function() {
  88 + return NoteList.disable;
  89 + },
  90 + callback: function(i) {
82 NoteList.getOld(); 91 NoteList.getOld();
83 } 92 }
84 - }); 93 + });
85 } 94 }
86 } 95 }
app/assets/javascripts/pager.js
1 var Pager = { 1 var Pager = {
2 - ref:null,  
3 limit:0, 2 limit:0,
4 offset:0, 3 offset:0,
  4 + disable:false,
5 5
6 init: 6 init:
7 - function(ref, limit) {  
8 - this.ref=ref; 7 + function(limit) {
9 this.limit=limit; 8 this.limit=limit;
10 this.offset=limit; 9 this.offset=limit;
11 this.initLoadMore(); 10 this.initLoadMore();
@@ -28,17 +27,24 @@ var Pager = { @@ -28,17 +27,24 @@ var Pager = {
28 $(".content_list").append(html); 27 $(".content_list").append(html);
29 if(count > 0) { 28 if(count > 0) {
30 this.offset += count; 29 this.offset += count;
31 - this.initLoadMore(); 30 + } else {
  31 + this.disable = true;
32 } 32 }
33 }, 33 },
34 34
35 initLoadMore: 35 initLoadMore:
36 function() { 36 function() {
37 - $(window).bind('scroll', function(){  
38 - if($(window).scrollTop() == $(document).height() - $(window).height()){  
39 - $(window).unbind('scroll'); 37 + $(document).endlessScroll({
  38 + bottomPixels: 400,
  39 + fireDelay: 1000,
  40 + fireOnce:true,
  41 + ceaseFire: function() {
  42 + return Pager.disable;
  43 + },
  44 + callback: function(i) {
  45 + $('.loading').show();
40 Pager.getOld(); 46 Pager.getOld();
41 } 47 }
42 - }); 48 + });
43 } 49 }
44 } 50 }
app/assets/javascripts/projects.js
@@ -1,42 +0,0 @@ @@ -1,42 +0,0 @@
1 -var ProjectsList = {  
2 - limit:0,  
3 - offset:0,  
4 -  
5 - init:  
6 - function(limit) {  
7 - this.limit=limit;  
8 - this.offset=limit;  
9 - this.initLoadMore();  
10 - },  
11 -  
12 - getOld:  
13 - function() {  
14 - $('.loading').show();  
15 - $.ajax({  
16 - type: "GET",  
17 - url: location.href,  
18 - data: "limit=" + this.limit + "&offset=" + this.offset,  
19 - complete: function(){ $('.loading').hide()},  
20 - dataType: "script"});  
21 - },  
22 -  
23 - append:  
24 - function(count, html) {  
25 - $(".tile").append(html);  
26 - if(count > 0) {  
27 - this.offset += count;  
28 - this.initLoadMore();  
29 - }  
30 - },  
31 -  
32 - initLoadMore:  
33 - function() {  
34 - $(window).bind('scroll', function(){  
35 - if($(window).scrollTop() == $(document).height() - $(window).height()){  
36 - $(window).unbind('scroll');  
37 - $('.loading').show();  
38 - ProjectsList.getOld();  
39 - }  
40 - });  
41 - }  
42 -}  
app/controllers/commits_controller.rb
@@ -13,7 +13,7 @@ class CommitsController < ApplicationController @@ -13,7 +13,7 @@ class CommitsController < ApplicationController
13 13
14 def index 14 def index
15 @repo = project.repo 15 @repo = project.repo
16 - @limit, @offset = (params[:limit] || 20), (params[:offset] || 0) 16 + @limit, @offset = (params[:limit] || 40), (params[:offset] || 0)
17 @commits = @project.commits(@ref, params[:path], @limit, @offset) 17 @commits = @project.commits(@ref, params[:path], @limit, @offset)
18 18
19 respond_to do |format| 19 respond_to do |format|
app/views/commits/index.html.haml
@@ -26,6 +26,6 @@ @@ -26,6 +26,6 @@
26 - if @commits.count == @limit 26 - if @commits.count == @limit
27 :javascript 27 :javascript
28 $(function(){ 28 $(function(){
29 - CommitsList.init("#{@ref}", 20); 29 + CommitsList.init("#{@ref}", #{@limit});
30 }); 30 });
31 31
app/views/notes/_load.js.haml
@@ -14,3 +14,8 @@ @@ -14,3 +14,8 @@
14 14
15 - else 15 - else
16 :plain 16 :plain
  17 +
  18 +- else
  19 + - if params[:first_id]
  20 + :plain
  21 + NoteList.append(#{params[:first_id]}, "");
app/views/projects/index.html.haml
@@ -3,7 +3,7 @@ @@ -3,7 +3,7 @@
3 %small= "( #{current_user.projects.count} )" 3 %small= "( #{current_user.projects.count} )"
4 %hr 4 %hr
5 - unless @projects.empty? 5 - unless @projects.empty?
6 - %div.tile= render "tile" 6 + %div.content_list= render "tile"
7 7
8 -# If projects requris paging 8 -# If projects requris paging
9 -# We add ajax loader & init script 9 -# We add ajax loader & init script
@@ -13,7 +13,7 @@ @@ -13,7 +13,7 @@
13 13
14 :javascript 14 :javascript
15 $(function(){ 15 $(function(){
16 - ProjectsList.init(16); 16 + Pager.init(#{@limit});
17 }); 17 });
18 - else 18 - else
19 %h2 Nothing here 19 %h2 Nothing here
app/views/projects/index.js.haml
1 :plain 1 :plain
2 - ProjectsList.append(#{@projects.count}, "#{escape_javascript(render(:partial => 'projects/tile'))}"); 2 + Pager.append(#{@projects.count}, "#{escape_javascript(render(:partial => 'projects/tile'))}");
vendor/assets/javascripts/jquery.endless-scroll.js 0 → 100644
@@ -0,0 +1,128 @@ @@ -0,0 +1,128 @@
  1 +/**
  2 + * Endless Scroll plugin for jQuery
  3 + *
  4 + * v1.4.8
  5 + *
  6 + * Copyright (c) 2008 Fred Wu
  7 + *
  8 + * Dual licensed under the MIT and GPL licenses:
  9 + * http://www.opensource.org/licenses/mit-license.php
  10 + * http://www.gnu.org/licenses/gpl.html
  11 + */
  12 +
  13 +/**
  14 + * Usage:
  15 + *
  16 + * // using default options
  17 + * $(document).endlessScroll();
  18 + *
  19 + * // using some custom options
  20 + * $(document).endlessScroll({
  21 + * fireOnce: false,
  22 + * fireDelay: false,
  23 + * loader: "<div class=\"loading\"><div>",
  24 + * callback: function(){
  25 + * alert("test");
  26 + * }
  27 + * });
  28 + *
  29 + * Configuration options:
  30 + *
  31 + * bottomPixels integer the number of pixels from the bottom of the page that triggers the event
  32 + * fireOnce boolean only fire once until the execution of the current event is completed
  33 + * fireDelay integer delay the subsequent firing, in milliseconds, 0 or false to disable delay
  34 + * loader string the HTML to be displayed during loading
  35 + * data string|function plain HTML data, can be either a string or a function that returns a string,
  36 + * when passed as a function it accepts one argument: fire sequence (the number
  37 + * of times the event triggered during the current page session)
  38 + * insertAfter string jQuery selector syntax: where to put the loader as well as the plain HTML data
  39 + * callback function callback function, accepts one argument: fire sequence (the number of times
  40 + * the event triggered during the current page session)
  41 + * resetCounter function resets the fire sequence counter if the function returns true, this function
  42 + * could also perform hook actions since it is applied at the start of the event
  43 + * ceaseFire function stops the event (no more endless scrolling) if the function returns true
  44 + *
  45 + * Usage tips:
  46 + *
  47 + * The plugin is more useful when used with the callback function, which can then make AJAX calls to retrieve content.
  48 + * The fire sequence argument (for the callback function) is useful for 'pagination'-like features.
  49 + */
  50 +
  51 +(function($){
  52 +
  53 + $.fn.endlessScroll = function(options) {
  54 +
  55 + var defaults = {
  56 + bottomPixels : 50,
  57 + fireOnce : true,
  58 + fireDelay : 150,
  59 + loader : "<br />Loading...<br />",
  60 + data : "",
  61 + insertAfter : "div:last",
  62 + resetCounter : function() { return false; },
  63 + callback : function() { return true; },
  64 + ceaseFire : function() { return false; }
  65 + };
  66 +
  67 + var options = $.extend({}, defaults, options),
  68 + firing = true,
  69 + fired = false,
  70 + fireSequence = 0,
  71 + is_scrollable;
  72 +
  73 + if (options.ceaseFire.apply(this) === true)
  74 + firing = false;
  75 +
  76 + if (firing === true) {
  77 + $(this).scroll(function() {
  78 + if (options.ceaseFire.apply(this) === true) {
  79 + firing = false;
  80 + return; // Scroll will still get called, but nothing will happen
  81 + }
  82 +
  83 + if (this == document || this == window) {
  84 + is_scrollable = $(document).height() - $(window).height() <= $(window).scrollTop() + options.bottomPixels;
  85 + } else {
  86 + // calculates the actual height of the scrolling container
  87 + var inner_wrap = $(".endless_scroll_inner_wrap", this);
  88 + if (inner_wrap.length == 0)
  89 + inner_wrap = $(this).wrapInner("<div class=\"endless_scroll_inner_wrap\" />").find(".endless_scroll_inner_wrap");
  90 + is_scrollable = inner_wrap.length > 0 &&
  91 + (inner_wrap.height() - $(this).height() <= $(this).scrollTop() + options.bottomPixels);
  92 + }
  93 +
  94 + if (is_scrollable && (options.fireOnce == false || (options.fireOnce == true && fired != true))) {
  95 + if (options.resetCounter.apply(this) === true) fireSequence = 0;
  96 +
  97 + fired = true;
  98 + fireSequence++;
  99 +
  100 + $(options.insertAfter).after("<div id=\"endless_scroll_loader\">" + options.loader + "</div>");
  101 +
  102 + data = typeof options.data == 'function' ? options.data.apply(this, [fireSequence]) : options.data;
  103 +
  104 + if (data !== false) {
  105 + $(options.insertAfter).after("<div id=\"endless_scroll_data\">" + data + "</div>");
  106 + $("#endless_scroll_data").hide().fadeIn(250, function() {$(this).removeAttr("id");});
  107 +
  108 + options.callback.apply(this, [fireSequence]);
  109 +
  110 + if (options.fireDelay !== false || options.fireDelay !== 0) {
  111 + $("body").after("<div id=\"endless_scroll_marker\"></div>");
  112 + // slight delay for preventing event firing twice
  113 + $("#endless_scroll_marker").fadeTo(options.fireDelay, 1, function() {
  114 + $(this).remove();
  115 + fired = false;
  116 + });
  117 + }
  118 + else
  119 + fired = false;
  120 + }
  121 +
  122 + $("#endless_scroll_loader").remove();
  123 + }
  124 + });
  125 + }
  126 + };
  127 +
  128 +})(jQuery);
0 \ No newline at end of file 129 \ No newline at end of file