Skip to content

Instantly share code, notes, and snippets.

@devnix

devnix/_pagination.html.twig

Forked from maxpou/_pagination.html.twig
Last active May 29, 2019 15:37
Show Gist options
  • Save devnix/c927bfd64084e7a592f7aeda436ac4be to your computer and use it in GitHub Desktop.
Save devnix/c927bfd64084e7a592f7aeda436ac4be to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. devnix revised this gist May 29, 2019. 1 changed file with 33 additions and 36 deletions.
    69 changes: 33 additions & 36 deletions _pagination.html.twig
    View file
    Original file line number Diff line number Diff line change
    @@ -1,43 +1,40 @@
    {#
    Parameters:
    * nbPages (int): number of pages
    * currentPage (int): current pages
    * total (int): number of pages
    * current (int): current pages
    * url (string): route name & query (string): route parameter
    ex: list/page-5?q=myFilter (5 = page and query = myFilter)
    * nearbyPagesLimit (int) optional: limit of pages around the current page
    #}

    {% spaceless %}
    {% if nbPages > 1 %}

    {# Number of page around current page+1 #}
    {% set nearbyPagesLimit = 4 %}

    <div>
    <ul class="pagination">
    {% if currentPage != 1 %}
    <li>
    <a href="{{ path(url, { 'page': 1, 'q': query }) }}">First</a>
    </li>
    {% endif %}
    {% for i in 1..nbPages %}
    {% if 0 == (currentPage - nearbyPagesLimit) - loop.index %} {# dot before #}
    <li class="disabled"><a href="#">...</a></li>
    {% elseif 0 == (currentPage + nearbyPagesLimit) - loop.index %} {# dot after #}
    <li class="disabled"><a href="#">...</a></li>
    {% elseif 0 < (currentPage - nearbyPagesLimit) - loop.index %} {# hide all before #}
    {% elseif 0 > (currentPage + nearbyPagesLimit) - loop.index %} {# hide all after #}
    {% else %}
    <li {% if currentPage == loop.index %} class="active"{% endif %}>
    <a href="{{ path(url, { 'page': loop.index, 'q': query }) }}">{{ loop.index }}</a>
    </li>
    {% macro pagination(total, current, url, nearbyPagesLimit = 4) %}
    {% spaceless %}
    {% if total > 1 %}
    <ul class="pagination">
    {% for i in 1..total %}
    {% if 0 == (current - nearbyPagesLimit) - loop.index %}
    <li><a href="{{ (url ~ 1)|e }}">1</a></li>
    {% if 1 != loop.index %}
    <li><span>…</span></li>
    {% endif %}
    {% elseif 0 == (current + nearbyPagesLimit) - loop.index and (current + nearbyPagesLimit) < total %}
    <li><span>…</span></li>
    {% elseif 0 < (current - nearbyPagesLimit) - loop.index %}
    {% elseif 0 > (current + nearbyPagesLimit) - loop.index %}
    {% else %}
    <li {{ current == loop.index ? 'class="active"' }}>
    {% if current == loop.index %}
    <span>{{ loop.index }}</span>
    {% else %}
    <a href="{{ url ~ loop.index }}">{{ loop.index }}</a>
    {% endif %}
    </li>
    {% endif %}
    {% endfor %}
    {% if current != total and (current + nearbyPagesLimit) < total %}
    <li><a href="{{ (url ~ total)|e }}">{{ total }}</a></li>
    {% endif %}
    {% endfor %}
    {% if currentPage != nbPages %}
    <li>
    <a href="{{ path(url, { 'page': nbPages, 'q': query }) }}">Last</a>
    </li>
    {% endif %}
    </ul>
    </div>
    {% endif %}
    {% endspaceless %}
    </ul>
    {% endif %}
    {% endspaceless %}
    {% endmacro %}
  2. @maxpou maxpou revised this gist Feb 25, 2016. 1 changed file with 4 additions and 4 deletions.
    8 changes: 4 additions & 4 deletions _pagination.html.twig
    View file
    Original file line number Diff line number Diff line change
    @@ -16,16 +16,16 @@
    <ul class="pagination">
    {% if currentPage != 1 %}
    <li>
    <a href="{{ path(url, { 'page': 1, 'q': query }) }}">Début</a>
    <a href="{{ path(url, { 'page': 1, 'q': query }) }}">First</a>
    </li>
    {% endif %}
    {% for i in 1..nbPages %}
    {% if 0 == (currentPage - nearbyPagesLimit) - loop.index %} {# dot before #}
    <li class="disabled"><a href="#">...</a></li>
    {% elseif 0 == (currentPage + nearbyPagesLimit) - loop.index %} {# dot after #}
    <li class="disabled"><a href="#">...</a></li>
    {% elseif 0 < (currentPage - nearbyPagesLimit) - loop.index %} {# hide before #}
    {% elseif 0 > (currentPage + nearbyPagesLimit) - loop.index %} {# hide after #}
    {% elseif 0 < (currentPage - nearbyPagesLimit) - loop.index %} {# hide all before #}
    {% elseif 0 > (currentPage + nearbyPagesLimit) - loop.index %} {# hide all after #}
    {% else %}
    <li {% if currentPage == loop.index %} class="active"{% endif %}>
    <a href="{{ path(url, { 'page': loop.index, 'q': query }) }}">{{ loop.index }}</a>
    @@ -34,7 +34,7 @@
    {% endfor %}
    {% if currentPage != nbPages %}
    <li>
    <a href="{{ path(url, { 'page': nbPages, 'q': query }) }}">Fin</a>
    <a href="{{ path(url, { 'page': nbPages, 'q': query }) }}">Last</a>
    </li>
    {% endif %}
    </ul>
  3. @maxpou maxpou created this gist Feb 25, 2016.
    43 changes: 43 additions & 0 deletions _pagination.html.twig
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,43 @@
    {#
    Parameters:
    * nbPages (int): number of pages
    * currentPage (int): current pages
    * url (string): route name & query (string): route parameter
    ex: list/page-5?q=myFilter (5 = page and query = myFilter)
    #}

    {% spaceless %}
    {% if nbPages > 1 %}

    {# Number of page around current page+1 #}
    {% set nearbyPagesLimit = 4 %}

    <div>
    <ul class="pagination">
    {% if currentPage != 1 %}
    <li>
    <a href="{{ path(url, { 'page': 1, 'q': query }) }}">Début</a>
    </li>
    {% endif %}
    {% for i in 1..nbPages %}
    {% if 0 == (currentPage - nearbyPagesLimit) - loop.index %} {# dot before #}
    <li class="disabled"><a href="#">...</a></li>
    {% elseif 0 == (currentPage + nearbyPagesLimit) - loop.index %} {# dot after #}
    <li class="disabled"><a href="#">...</a></li>
    {% elseif 0 < (currentPage - nearbyPagesLimit) - loop.index %} {# hide before #}
    {% elseif 0 > (currentPage + nearbyPagesLimit) - loop.index %} {# hide after #}
    {% else %}
    <li {% if currentPage == loop.index %} class="active"{% endif %}>
    <a href="{{ path(url, { 'page': loop.index, 'q': query }) }}">{{ loop.index }}</a>
    </li>
    {% endif %}
    {% endfor %}
    {% if currentPage != nbPages %}
    <li>
    <a href="{{ path(url, { 'page': nbPages, 'q': query }) }}">Fin</a>
    </li>
    {% endif %}
    </ul>
    </div>
    {% endif %}
    {% endspaceless %}