Skip to content

Utilizando WillPaginate com o formato de Endless

julianalucena edited this page May 15, 2011 · 7 revisions

O Endless utilizado no Redu foi feito baseado no WillPaginate. O processo de utilização é o mesmo, porém ao invés de renderizar os links de paginação, o Endless é renderizado.

#Redefinição do Renderer

Para que o WillPaginate seja renderizado de uma forma diferente (no formato de Endless) um novo Renderer para o WillPaginate foi definido em lib/endless_renderer.rb: o EndlessRenderer.

# Renderer do WillPaginate responsável por renderizar
# a paginação no formato de Endless.
class EndlessRenderer < WillPaginate::ViewHelpers::LinkRenderer

  # A paginação só mostrará a próxima página
  def pagination
    [:next_page]
  end

  # Redefinição do HTML para paginação da próxima página
  def next_page
    @template.link_to "Mostrar mais resultados",
      url(@collection.next_page), :remote => true
  end

  # Container da paginação
  def html_container(html)
    if @options[:class].eql? "pagination"
      # Por default, o atributo class do elemento HTML do endless
      # será "endless".
      @options[:class] = "endless"
    end

    tag(:div, html, container_attributes)
  end

end

#Utilizando o Endless O Renderer default do WillPaginate utilizado no Redu é o PaginationListLinkRenderer, como pode ser observado no config/environment.rb:

WillPaginate::ViewHelpers.pagination_options[:renderer] = 'PaginationListLinkRenderer'

Deste modo, o WillPaginate, por default, é renderizado no formato de links de paginação.

##Indicando o renderer Quando for necessário utilizar o WillPaginate no formato de Endless, deve-se indicar o renderer alternativo a ser utilizado:

will_paginate @events, :renderer => EndlessRenderer

Código HTML gerado pelo código Ruby acima:

<div class="endless">
  <a href="/ium/cursos/ciencia-da-computacao-5c/pessoas?page=2" data-remote="true">Mostrar mais resultados</a>
</div>

##Respondendo à requisição do Endless no controlador ###Render padrão A resposta pode ser mostrada ao usuário através do shared/endless.js.erb que é genérico e foi projetado para maioria dos casos, como pode ser observado abaixo:

items = '<%= escape_javascript render(:partial => partial, :collection => collection, :locals => partial_locals) %>'
$('<%= raw selector %>').append(items);

endless = '<%= will_paginate collection, :renderer => EndlessRenderer %>'
$('.endless').html(endless);

Para usar o render padrão do Endless, basta utilizar o seguinte helper:

format.js { render_endless 'users/item', @users, '#users_list', {:entity => @course} }

Onde os parâmetros podem ser identificados em sua definição no base_controller.rb:

  # Renderiza a resposta do endless de acordo com os parâmetros passados
  def render_endless(partial, collection, selector, partial_locals={})
    locals = {
      :collection => collection, # Coleção em questão
      :partial => partial, # Partial do itens a serem renderizados
      :selector => selector, # Seletor do HTML que receberá os itens
      :partial_locals => partial_locals # Locals necessários no partial do item
    }
    render :template => 'shared/endless', :locals => locals
  end

###Render customizado Basta não utilizar o endless_renderer e criar/renderizar um arquivo js.erb que contenha as ações desejadas. Não esquecer de:

  1. adicionar a listagem requisitada pelo usuário à listagem já existente na página visualizada;
  2. trocar o endless para que o parametro :page seja modificado para o referente a próxima página.

#Referências Revisited: roll your own pagination links with will_paginate and Rails 3