Backbone pagination

index_view.js.coffee

FinnishTools.Views.Videos ||= {}

class FinnishTools.Views.Videos.IndexView extends Backbone.View
  template: JST["backbone/templates/videos/index"]
  
  events:
    "click .pagination ul li" : "changePage"
  
  initialize: ->
    _.bindAll(this, 'addOne', 'addAll', 'render')
    
    @options.videos.bind('reset', @addAll)
  
  addAll: ->
    @$("tbody").empty()
    @options.videos.each(@addOne)
  
  addOne: (video) ->
    view = new FinnishTools.Views.Videos.VideoView({model : video })
    @$("tbody").append(view.render().el)
  
  changePage: (e)->
    e.preventDefault()
    target = $(e.target)
    
    li = target.parent()
    return if li.hasClass("disabled")
    
    if li.hasClass("next")
      @currentPage++
    else if li.hasClass("prev")
      @currentPage--
    else
      @currentPage = target.text()
    
    paginated = @options.videos.byPage(@currentPage)
    @options.videos = paginated
    @addAll()
    @renderPagination()
    $("body").scrollTop(0)
    
  renderPagination: ->
    @currentPage = 1 unless @currentPage
    
    itemsCount = @options.videos.length
    pagesNum = Math.ceil(itemsCount / 10)
    pages = _.range(1, pagesNum+1)
    
    view = JST["backbone/templates/shared/pagination"]({pagesNum: pagesNum, currentPage: @currentPage, pages: pages})
    @$("#pages").html(view)
    
    currentPageEl = @$(".pagination ul li:contains('#{@currentPage}')")
    currentPageEl.addClass("active")
    
  render: ->
    $(@el).html(@template(videos: @options.videos.toJSON() ))
    @addAll()
    @renderTabs()
    @renderPagination()
    
    return this