jquery-infinite-pages 0.1.1

checksums.yaml

@@ -0,0 +1,15 @@
+---
+!binary "U0hBMQ==":
+  metadata.gz: !binary |-
+    NjczYTQwYjA4ZjRlNGFhMjBkZGY3Mzg0YTY4ZWFiMDQyMjNjZjU4ZA==
+  data.tar.gz: !binary |-
+    MzczYWYzN2Q3MzYzYTNhMTBhYTA0ZWVkYzhmODUxNmQ3OWZjNmVlNg==
+SHA512:
+  metadata.gz: !binary |-
+    OTljMjI0OGYyYmVkNTM1ZDNjZWYyZDI3Y2U4YjczMWRkOTAxZDM2NmYyZDdm
+    Yjk0YTg2YmExMzIxYTFiOTdjMzY4MDJkOWQ3OGE4OGViMGQyMTI5ZDQ5YjU4
+    M2Q0YjQxNmIzMjE2ZTE5YmYyYzAxMDdiMWQ2NTlmZjUzMGQxNTE=
+  data.tar.gz: !binary |-
+    MmRlYzE0ZjM5Y2M1NzNiNGYwMDQyNTQ1MTYxNjY3MWRjMzQ5YjFkOGQwZmJk
+    OGM2MzU3NjIzYWY5ZGVkZTcyNmNkMjFmNjk5MzY3ZDU1NjY5ZWFhMjAwNDg2
+    MGVjNjc4NDI4M2E3ZjAzNWQxMzI2OGI0MTM1NjgwZDlkZWYyNWI=

data/LICENSE

@@ -0,0 +1,21 @@
+The MIT License
+
+Copyright (c) 2014 Magoosh, Inc. http://magoosh.com
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,149 @@
+jQuery Infinite Pages
+=====================
+
+A light-weight jQuery plugin for adding infinite scrolling to paginated HTML views
+that tastes great with [Rails](https://github.com/rails/rails) and
+[Kaminari](https://github.com/amatsuda/kaminari).
+
+This project was originally designed for Rails, so it's wrapped in a gem for easy
+installation. However, the core plugin is flexible enough to use anywhere.
+
+Usage
+-----
+jQuery Infinite Pages binds to an element containing a `rel="next"` pagination link and
+watches for scroll events.
+
+When the link is close to the bottom of the screen, an async request to the next page
+is triggered. The server's response should then append the new page and update the
+pagination link.
+
+```coffeescript
+# Setup plugin and define optional event callbacks
+$('.infinite-table').infinitePages
+ debug: true
+ buffer: 200 # load new page when within 200px of nav link
+ loading: ->
+   # jQuery callback on the nav element
+   $(this).text("Loading...")
+ success: ->
+   # called after successful ajax call
+ error: ->
+   # called after failed ajax call
+   $(this).text("Trouble! Please drink some coconut water and click again")
+```
+
+You can also manually control the firing of load events:
+
+```
+# Force load of the next page
+$('.infinite-table').infinitePages('next')
+
+# Pause firing of events on scroll
+$('.infinite-table').infinitePages('pause')
+
+# Resume...
+$('.infinite-table').infinitePages('resume')
+```
+
+Installation
+------------
+
+Add this line to your application's Gemfile:
+
+```ruby
+gem 'jquery-infinite-pages', :git => 'git://github.com/magoosh/jquery-infinite-pages.git'
+```
+
+And then execute:
+
+```
+bundle install
+```
+
+Add to your `application.js`:
+
+```javascript
+//= require jquery.infinite-pages
+```
+
+### Non-Rails
+
+Just copy the `jquery.infinite-pages.js.coffee` file from `app/assets/javascripts` to
+wherever you want it.
+
+Rails/Kaminari Example
+----------------------
+
+The following is an example of how to integrate this plugin into your Rails app
+using Kaminari.
+
+Set up pagination in `lessons_controller.rb`:
+
+```ruby
+class LessonsController
+  def index
+    @lessons = Lesson.order('lessons.name ASC').page(params[:page])
+  end
+end
+```
+
+Write the template for your list of lessons in `index.html.erb`:
+
+```erb
+<div class="infinite-table">
+  <table>
+    <tr>
+      <th>Lesson</th>
+      <th></th>
+    </tr>
+    <%= render :partial => 'lessons', :object => @lessons %>
+  </table>
+  <p class="pagination">
+    <%= link_to_next_page(@lessons, 'Next Page', :remote => true))%>
+  </p>
+</div>
+```
+
+...and `_lessons.html.erb`:
+
+```erb
+<% @lessons.each do |lesson| %>
+  <tr>
+    <td><%= lesson.name %> (<%= lesson.length.format %>)</td>
+    <td><%= link_to "watch", lesson_path(lesson) %></td>
+  </tr>
+<% end %>
+```
+
+Append new data to the table in `index.js.erb`:
+
+```javascript
+// Append new data
+$("<%=j render(:partial => 'lessons', :object => @lessons) %>")
+  .appendTo($(".infinite-table table"));
+
+// Update pagination link
+<% if answers.last_page? %>
+  $('.pagination').html("That's all, folks!");
+<% else %>
+  $('.pagination')
+    .html("<%=j link_to_next_page(@lessons, 'Next Page', :remote => true))%>");
+<% end %>
+```
+
+At this point, the pagination link at the bottom of your table should allow you
+to load the next page without refreshing. Finally, we trigger the next page load
+with the `infinitePages` plugin in `lessons.js.coffee`:
+
+```coffee
+$ ->
+  # Configure infinite table
+  $('.infinite-table').infinitePages
+    # debug: true
+    loading: ->
+      $(this).text('Loading next page...')
+    error: ->
+      $(this).button('There was an error, please try again')
+```
+
+Voila! You should now have an infinitely long list of lessons.

data/app/assets/javascripts/jquery.infinite-pages.js.coffee

@@ -0,0 +1,126 @@
+###
+jQuery Infinite Pages v0.1.1
+https://github.com/magoosh/jquery-infinite-pages
+
+Released under the MIT License
+###
+
+#
+# Built with a class-based template for jQuery plugins in Coffeescript:
+# https://gist.github.com/rjz/3610858
+#
+
+(($, window) ->
+  # Define the plugin class
+  class InfinitePages
+    
+    # Default settings
+    defaults:
+      debug: false  # set to true to log messages to the console
+      navSelector: 'a[rel=next]'
+      buffer: 1000  # 1000px buffer by default
+      loading: null # optional callback when next-page request begins
+      success: null # optional callback when next-page request finishes
+      error:   null # optional callback when next-page request fails
+      state:
+        paused:  false
+        loading: false
+    
+    # Constructs the new InfinitePages object
+    #
+    # container - the element containing the infinite table and pagination links
+    constructor: (container, options) ->
+      @options = $.extend({}, @defaults, options)
+      @$container = $(container)
+      @$table = $(container).find('table')
+      
+      @init()
+      
+    # Setup and bind to related events
+    init: ->
+      
+      # Debounce scroll event to improve performance
+      scrollTimeout = null
+      scrollHandler = (=> @check())
+      
+      $(window).scroll ->
+        if scrollTimeout
+          clearTimeout(scrollTimeout)
+          scrollTimeout = null
+        scrollTimeout = setTimeout(scrollHandler, 250)
+        
+    # Internal helper for logging messages
+    _log: (msg) ->
+      console?.log(msg) if @options.debug
+      
+    # Check the distance of the nav selector from the bottom of the window and fire
+    # load event if close enough
+    check: ->
+      nav = @$container.find(@options.navSelector)
+      if nav.size() == 0
+        @_log "No more pages to load"
+      else
+        windowBottom = $(window).scrollTop() + $(window).height()
+        distance = nav.offset().top - windowBottom
+        
+        if @options.state.paused
+          @_log "Paused"
+        else if @options.state.loading
+          @_log "Waiting..."
+        else if (distance > @options.buffer)
+          @_log "#{distance - @options.buffer}px remaining..."
+        else
+          @next() # load the next page
+        
+    # Load the next page
+    next: ->
+      if @options.state.done
+        @_log "Loaded all pages"
+      else
+        @_loading()
+        
+        $.getScript(@$container.find(@options.navSelector).attr('href'))
+          .done (=> @_success())
+          .fail (=> @_error())
+    
+    _loading: ->
+      @options.state.loading = true
+      @_log "Loading next page..."
+      if typeof @options.loading is 'function'
+        @$container.find(@options.navSelector).each(@options.loading)
+    
+    _success: ->
+      @options.state.loading = false
+      @_log "New page loaded!"
+      if typeof @options.success is 'function'
+        @$container.find(@options.navSelector).each(@options.success)
+    
+    _error: ->
+      @options.state.loading = false
+      @_log "Error loading new page :("
+      if typeof @options.error is 'function'
+        @$container.find(@options.navSelector).each(@options.error)
+    
+    # Pause firing of events on scroll
+    pause: ->
+      @options.state.paused = true
+      @_log "Scroll checks paused"
+    
+    # Resume firing of events on scroll
+    resume: ->
+      @options.state.paused = false
+      @_log "Scroll checks resumed"
+      @check()
+    
+  # Define the plugin
+  $.fn.extend infinitePages: (option, args...) ->
+    @each ->
+      $this = $(this)
+      data = $this.data('infinitepages')
+      
+      if !data
+        $this.data 'infinitepages', (data = new InfinitePages(this, option))
+      if typeof option == 'string'
+        data[option].apply(data, args)
+  
+) window.jQuery, window

data/lib/jquery-infinite-pages.rb

@@ -0,0 +1,2 @@
+require 'jquery/infinite_pages/version'
+require 'jquery/infinite_pages/engine'

data/lib/jquery/infinite_pages/engine.rb

@@ -0,0 +1,6 @@
+module Jquery
+  module InfinitePages
+    class Engine < ::Rails::Engine
+    end
+  end
+end

data/lib/jquery/infinite_pages/version.rb

@@ -0,0 +1,3 @@
+module JqueryInfinitePages
+  VERSION = "0.1.1"
+end

metadata

@@ -0,0 +1,79 @@
+--- !ruby/object:Gem::Specification
+name: jquery-infinite-pages
+version: !ruby/object:Gem::Version
+  version: 0.1.1
+platform: ruby
+authors:
+- Zach Millman
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2014-04-14 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: jquery-rails
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: railties
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '3.1'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '3.1'
+description: A light-weight infinite scrolling jQuery plugin, wrapped in a gem for
+  Rails
+email:
+- zach@magoosh.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- lib/jquery/infinite_pages/engine.rb
+- lib/jquery/infinite_pages/version.rb
+- lib/jquery-infinite-pages.rb
+- app/assets/javascripts/jquery.infinite-pages.js.coffee
+- LICENSE
+- README.md
+homepage: https://github.com/magoosh/jquery-infinite-pages
+licenses:
+- MIT
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 2.1.11
+signing_key: 
+specification_version: 4
+summary: Infinite pages for jQuery + Rails
+test_files: []