Download as
Browse Code »

Commit ece9f50fb1076c1efee54b4ab3b161f2cac70046

Authored by Dmitriy Zaporozhets
1 parent 48bc4fc2
Exists in master and in 4 other branches 6-8-stable, 7-0-stable, 7-0-stable-spb, spb-stable

fixed unworking infinite scroll

Showing 11 changed files with 180 additions and 66 deletions   Show diff stats
app/assets/javascripts/application.js
  Diff comments   View file @ece9f50
... ... @@ -10,6 +10,7 @@
10 10 //= require jquery.ui.selectmenu
11 11 //= require jquery.tagify
12 12 //= require jquery.cookie
  13 +//= require jquery.endless-scroll
13 14 //= require modernizr
14 15 //= require chosen
15 16 //= require raphael
... ...
app/assets/javascripts/commits.js
  Diff comments   View file @ece9f50
... ... @@ -2,6 +2,7 @@ var CommitsList = {
2 2 ref:null,
3 3 limit:0,
4 4 offset:0,
  5 + disable:false,
5 6  
6 7 init:
7 8 function(ref, limit) {
... ... @@ -36,15 +37,21 @@ var CommitsList = {
36 37 $("#commits_list").append(html);
37 38 if(count > 0) {
38 39 this.offset += count;
39   - this.initLoadMore();
  40 + } else {
  41 + this.disable = true;
40 42 }
41 43 },
42 44  
43 45 initLoadMore:
44 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 55 CommitsList.getOld();
49 56 }
50 57 });
... ...
app/assets/javascripts/note.js
  Diff comments   View file @ece9f50
... ... @@ -3,6 +3,7 @@ var NoteList = {
3 3 first_id: 0,
4 4 last_id: 0,
5 5 resource_name: null,
  6 +disable:false,
6 7  
7 8 init:
8 9 function(resource_name, first_id, last_id) {
... ... @@ -26,9 +27,12 @@ getOld:
26 27  
27 28 append:
28 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 38 replace:
... ... @@ -76,11 +80,16 @@ initRefresh:
76 80  
77 81 initLoadMore:
78 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 91 NoteList.getOld();
83 92 }
84   - });
  93 + });
85 94 }
86 95 }
... ...
app/assets/javascripts/pager.js
  Diff comments   View file @ece9f50
1 1 var Pager = {
2   - ref:null,
3 2 limit:0,
4 3 offset:0,
  4 + disable:false,
5 5  
6 6 init:
7   - function(ref, limit) {
8   - this.ref=ref;
  7 + function(limit) {
9 8 this.limit=limit;
10 9 this.offset=limit;
11 10 this.initLoadMore();
... ... @@ -28,17 +27,24 @@ var Pager = {
28 27 $(".content_list").append(html);
29 28 if(count > 0) {
30 29 this.offset += count;
31   - this.initLoadMore();
  30 + } else {
  31 + this.disable = true;
32 32 }
33 33 },
34 34  
35 35 initLoadMore:
36 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 46 Pager.getOld();
41 47 }
42   - });
  48 + });
43 49 }
44 50 }
... ...
app/assets/javascripts/projects.js
View file @48bc4fc
... ... @@ -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
  Diff comments   View file @ece9f50
... ... @@ -13,7 +13,7 @@ class CommitsController < ApplicationController
13 13  
14 14 def index
15 15 @repo = project.repo
16   - @limit, @offset = (params[:limit] || 20), (params[:offset] || 0)
  16 + @limit, @offset = (params[:limit] || 40), (params[:offset] || 0)
17 17 @commits = @project.commits(@ref, params[:path], @limit, @offset)
18 18  
19 19 respond_to do |format|
... ...
app/views/commits/index.html.haml
  Diff comments   View file @ece9f50
... ... @@ -26,6 +26,6 @@
26 26 - if @commits.count == @limit
27 27 :javascript
28 28 $(function(){
29   - CommitsList.init("#{@ref}", 20);
  29 + CommitsList.init("#{@ref}", #{@limit});
30 30 });
31 31  
... ...
app/views/notes/_load.js.haml
  Diff comments   View file @ece9f50
... ... @@ -14,3 +14,8 @@
14 14  
15 15 - else
16 16 :plain
  17 +
  18 +- else
  19 + - if params[:first_id]
  20 + :plain
  21 + NoteList.append(#{params[:first_id]}, "");
... ...
app/views/projects/index.html.haml
  Diff comments   View file @ece9f50
... ... @@ -3,7 +3,7 @@
3 3 %small= "( #{current_user.projects.count} )"
4 4 %hr
5 5 - unless @projects.empty?
6   - %div.tile= render "tile"
  6 + %div.content_list= render "tile"
7 7  
8 8 -# If projects requris paging
9 9 -# We add ajax loader & init script
... ... @@ -13,7 +13,7 @@
13 13  
14 14 :javascript
15 15 $(function(){
16   - ProjectsList.init(16);
  16 + Pager.init(#{@limit});
17 17 });
18 18 - else
19 19 %h2 Nothing here
... ...
app/views/projects/index.js.haml
  Diff comments   View file @ece9f50
1 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
  Diff comments   View file @ece9f50
... ... @@ -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 129 \ No newline at end of file
... ...