Skip to content
Permalink
Browse files

Improving pagination (using ellipses for bootstrap3, and allowing to …

…set surrounding size).
  • Loading branch information...
felixfontein committed Dec 5, 2016
1 parent 9727d85 commit c3de0f2be7581c70c9911e07b3e5203bfdf5e648
@@ -1,14 +1,14 @@
{# -*- coding: utf-8 -*- #}
{% macro page_navigation(current_page, page_links, prevlink, nextlink, prev_next_links_reversed) %}
{% macro page_navigation(current_page, page_links, prevlink, nextlink, prev_next_links_reversed, surrounding=5) %}
<div class="page-navigation">
{% for i, link in enumerate(page_links) %}
{% if abs(i - current_page) <= 3 or i == 0 or i == page_links|length - 1 %}
{% if abs(i - current_page) <= surrounding or i == 0 or i == page_links|length - 1 %}
{% if i == current_page %}
<span class="current-page">{{ i+1 }}</span>
{% else %}
<a href="{{ page_links[i] }}">{{ i+1 }}</a>
{% endif %}
{% elif i == current_page - 4 or i == current_page + 4 %}
{% elif i == current_page - surrounding - 1 or i == current_page + surrounding + 1 %}
<span class="ellipsis">&#x22EF;</span>
{% endif %}
{% endfor %}
@@ -1,14 +1,14 @@
## -*- coding: utf-8 -*-
<%def name="page_navigation(current_page, page_links, prevlink, nextlink, prev_next_links_reversed)">
<%def name="page_navigation(current_page, page_links, prevlink, nextlink, prev_next_links_reversed, surrounding=5)">
<div class="page-navigation">
% for i, link in enumerate(page_links):
% if abs(i - current_page) <= 3 or i == 0 or i == len(page_links) - 1:
% if abs(i - current_page) <= surrounding or i == 0 or i == len(page_links) - 1:
% if i == current_page:
<span class="current-page">${i+1}</span>
% else:
<a href="${page_links[i]}">${i+1}</a>
% endif
% elif i == current_page - 4 or i == current_page + 4:
% elif i == current_page - surrounding - 1 or i == current_page + surrounding + 1:
<span class="ellipsis">&#x22EF;</span>
% endif
% endfor
@@ -1,5 +1,5 @@
{# -*- coding: utf-8 -*- #}
{% macro page_navigation(current_page, page_links, prevlink, nextlink, prev_next_links_reversed) %}
{% macro page_navigation(current_page, page_links, prevlink, nextlink, prev_next_links_reversed, surrounding=5) %}
<nav aria-label="Page navigation">
<ul class="pagination">
{% if prev_next_links_reversed %}
@@ -16,7 +16,11 @@
{% endif %}
{% endif %}
{% for i, link in enumerate(page_links) %}
<li {{ ' class="active"' if i == current_page else '' }}><a href="{{ link }}">{{ i + 1 }}{{ ' <span class="sr-only">(current)</span>' if i == current_page else '' }}</a></li>
{% if abs(i - current_page) <= surrounding or i == 0 or i == page_links|length - 1 %}
<li {{ ' class="active"' if i == current_page else '' }}><a href="{{ link }}">{{ i + 1 }}{{ ' <span class="sr-only">(current)</span>' if i == current_page else '' }}</a></li>
{% elif i == current_page - surrounding - 1 or i == current_page + surrounding + 1 %}
<li class="disabled"><a href="#" aria-label="…"><span aria-hidden="true">…</span></a></li>
{% endif %}
{% endfor %}
{% if prev_next_links_reversed %}
{% if prevlink %}
@@ -1,5 +1,5 @@
## -*- coding: utf-8 -*-
<%def name="page_navigation(current_page, page_links, prevlink, nextlink, prev_next_links_reversed)">
<%def name="page_navigation(current_page, page_links, prevlink, nextlink, prev_next_links_reversed, surrounding=5)">
<nav aria-label="Page navigation">
<ul class="pagination">
% if prev_next_links_reversed:
@@ -16,7 +16,11 @@
% endif
% endif
% for i, link in enumerate(page_links):
<li ${' class="active"' if i == current_page else ''}><a href="${link}">${i + 1}${' <span class="sr-only">(current)</span>' if i == current_page else ''}</a></li>
% if abs(i - current_page) <= surrounding or i == 0 or i == len(page_links) - 1:
<li ${' class="active"' if i == current_page else ''}><a href="${link}">${i + 1}${' <span class="sr-only">(current)</span>' if i == current_page else ''}</a></li>
% elif i == current_page - surrounding - 1 or i == current_page + surrounding + 1:
<li class="disabled"><a href="#" aria-label="…"><span aria-hidden="true">…</span></a></li>
% endif
% endfor
% if prev_next_links_reversed:
% if prevlink:

0 comments on commit c3de0f2

Please sign in to comment.
You can’t perform that action at this time.