Added prev/next page buttons for pager
Integrated better with vimperator.
This commit is contained in:
parent
4126de8e25
commit
48004f1117
2 changed files with 21 additions and 6 deletions
|
@ -184,12 +184,14 @@ App.Presenters.PagerPresenter = function(
|
||||||
}
|
}
|
||||||
|
|
||||||
function refreshPageList() {
|
function refreshPageList() {
|
||||||
|
var $lastItem = $pageList.find('li:last-child');
|
||||||
|
var currentPage = pager.getPage();
|
||||||
var pages = pager.getVisiblePages();
|
var pages = pager.getVisiblePages();
|
||||||
$pageList.empty();
|
$pageList.find('li.page').remove();
|
||||||
var lastPage = 0;
|
var lastPage = 0;
|
||||||
_.each(pages, function(page) {
|
_.each(pages, function(page) {
|
||||||
if (page - lastPage > 1) {
|
if (page - lastPage > 1) {
|
||||||
$pageList.append(jQuery('<li><a>…</a></li>'));
|
jQuery('<li class="page ellipsis"><a>…</a></li>').insertBefore($lastItem);
|
||||||
}
|
}
|
||||||
lastPage = page;
|
lastPage = page;
|
||||||
|
|
||||||
|
@ -200,12 +202,23 @@ App.Presenters.PagerPresenter = function(
|
||||||
});
|
});
|
||||||
$a.addClass('big-button');
|
$a.addClass('big-button');
|
||||||
$a.text(page);
|
$a.text(page);
|
||||||
if (page === pager.getPage()) {
|
if (page === currentPage) {
|
||||||
$a.addClass('active');
|
$a.addClass('active');
|
||||||
}
|
}
|
||||||
var $li = jQuery('<li/>');
|
jQuery('<li class="page"/>').append($a).insertBefore($lastItem);
|
||||||
$li.append($a);
|
});
|
||||||
$pageList.append($li);
|
|
||||||
|
$pageList.find('li.next a').click(function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
if (currentPage + 1 < pages.length) {
|
||||||
|
syncUrl({page: currentPage + 1});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
$pageList.find('li.prev a').click(function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
if (currentPage - 1 >= 1) {
|
||||||
|
syncUrl({page: currentPage - 1});
|
||||||
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -2,4 +2,6 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ul class="page-list">
|
<ul class="page-list">
|
||||||
|
<li class="prev"><a href="#">Prev</a></li>
|
||||||
|
<li class="next"><a href="#">Next</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
Loading…
Reference in a new issue