|
|
@ -46,115 +46,98 @@ |
|
|
|
|
|
|
|
<script type="text/javascript"> |
|
|
|
|
|
|
|
pageSize = 24; |
|
|
|
incremSlide = 5; |
|
|
|
startPage = 0; |
|
|
|
numberPage = 0; |
|
|
|
// pagination script w/ support from @biberman on stackoverflow - big thanks! |
|
|
|
|
|
|
|
//pagination slider ref https://www.javaer101.com/en/article/123201810.html |
|
|
|
|
|
|
|
var pageCount = $(".browsethearchive-items").length / pageSize; |
|
|
|
var totalSlidepPage = Math.floor(pageCount / incremSlide); |
|
|
|
let startPage; |
|
|
|
const pageSize = 24; |
|
|
|
const totalSlidePage = 5; |
|
|
|
const pageCount = Math.ceil($(".browsethearchive-items").length / pageSize); |
|
|
|
const slideRange = Math.floor(totalSlidePage / 2); |
|
|
|
|
|
|
|
for(var i = 0 ; i<pageCount;i++){ |
|
|
|
$("#pagin").append('<li><a href="#">'+(i+1)+'</a></li> '); |
|
|
|
if(i>pageSize){ |
|
|
|
$("#pagin li").eq(i).hide(); |
|
|
|
} |
|
|
|
slide = function() { |
|
|
|
startPage = $("#pagin li a.current").parent().index(); |
|
|
|
let paginationStart = (startPage - slideRange) < 0 ? 0 : |
|
|
|
(startPage >= (pageCount - slideRange) ? (pageCount - totalSlidePage) : |
|
|
|
(startPage - slideRange)); |
|
|
|
|
|
|
|
$("#pagin li").hide(); |
|
|
|
for (let t = paginationStart; t < (paginationStart + totalSlidePage); t++) { |
|
|
|
$("#pagin li").eq(t + 1).show(); |
|
|
|
} |
|
|
|
|
|
|
|
var prev = $("<li/>").addClass("prev").html("Prev").click(function(){ |
|
|
|
startPage-=1; |
|
|
|
incremSlide-=1; |
|
|
|
numberPage--; |
|
|
|
slide(); |
|
|
|
}); |
|
|
|
next.show(); |
|
|
|
prev.show(); |
|
|
|
|
|
|
|
if (startPage == 1) { |
|
|
|
prev.hide(); |
|
|
|
} |
|
|
|
else if (startPage == pageCount ) { |
|
|
|
next.hide(); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
var next = $("<li/>").addClass("next").html("Next").click(function(){ |
|
|
|
startPage+=1; |
|
|
|
incremSlide+=1; |
|
|
|
numberPage++; |
|
|
|
slide(); |
|
|
|
showPage = function() { |
|
|
|
console.log(startPage); |
|
|
|
$(".browsethearchive-items").hide(); |
|
|
|
$(".browsethearchive-items").each(function(n) { |
|
|
|
if (n >= pageSize * (startPage - 1) && n < pageSize * startPage) |
|
|
|
$(this).show(); |
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
$("#pagin").prepend(prev).append(next); |
|
|
|
|
|
|
|
$("#pagin li").first().find("a").addClass("current"); |
|
|
|
|
|
|
|
slide = function(sens){ |
|
|
|
$("#pagin li").hide(); |
|
|
|
|
|
|
|
for(t=startPage;t<incremSlide;t++){ |
|
|
|
$("#pagin li").eq(t+1).show(); |
|
|
|
} |
|
|
|
if(startPage == 0){ |
|
|
|
next.show(); |
|
|
|
prev.hide(); |
|
|
|
}else if(numberPage == totalSlidepPage ){ |
|
|
|
next.hide(); |
|
|
|
prev.show(); |
|
|
|
}else{ |
|
|
|
next.show(); |
|
|
|
prev.show(); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
slide(); |
|
|
|
for (let i = 0 ; i < pageCount; i++) { |
|
|
|
$("#pagin").append('<li><a href="#">' + (i + 1) + '</a></li> '); |
|
|
|
|
|
|
|
showPage = function(page) { |
|
|
|
$(".browsethearchive-items").hide(); |
|
|
|
$(".browsethearchive-items").each(function(n) { |
|
|
|
if (n >= pageSize * (page - 1) && n < pageSize * page) |
|
|
|
$(this).show(); |
|
|
|
}); |
|
|
|
if (i > pageSize) { |
|
|
|
$("#pagin li").eq(i).hide(); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
showPage(1); |
|
|
|
$("#pagin li a").eq(0).addClass("current"); |
|
|
|
|
|
|
|
|
|
|
|
var $listItems = $('#pagin li a'); |
|
|
|
var activeLink; |
|
|
|
|
|
|
|
let prev = $("<li/>").addClass("prev").html("Prev").click(function() { |
|
|
|
let prevLi = $("#pagin li a.current").parent().prev().find("a"); |
|
|
|
|
|
|
|
$("#pagin li a").click(function() { |
|
|
|
if (prevLi[0]) { |
|
|
|
$("#pagin li a.current").removeClass("current"); |
|
|
|
prevLi.addClass("current"); |
|
|
|
} |
|
|
|
|
|
|
|
$listItems.removeClass('current'); |
|
|
|
$(this).addClass('current'); |
|
|
|
var activeLink=$(this); |
|
|
|
slide(); |
|
|
|
|
|
|
|
showPage(parseInt($(this).text())); |
|
|
|
if (startPage != 0) { |
|
|
|
showPage(); |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
let next = $("<li/>").addClass("next").html("Next").click(function() { |
|
|
|
let nextLi = $("#pagin li a.current").parent().next().find("a"); |
|
|
|
|
|
|
|
var i = 1; |
|
|
|
|
|
|
|
$(".prev").click(function() { |
|
|
|
|
|
|
|
let prevLi = $("#pagin li a.current").parent().prev().find("a"); |
|
|
|
$("#pagin li a.current").removeClass("current"); |
|
|
|
prevLi.addClass("current"); |
|
|
|
if (nextLi[0]) { |
|
|
|
$("#pagin li a.current").removeClass("current"); |
|
|
|
nextLi.addClass("current"); |
|
|
|
} |
|
|
|
|
|
|
|
slide(); |
|
|
|
|
|
|
|
if (i != 1) { |
|
|
|
showPage(--i); |
|
|
|
} |
|
|
|
if (startPage <= pageCount) { |
|
|
|
showPage(); |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
$(".next").click(function() { |
|
|
|
$("#pagin").prepend(prev).append(next); |
|
|
|
|
|
|
|
let nextLi = $("#pagin li a.current").parent().next().find("a"); |
|
|
|
$("#pagin li a.current").removeClass("current"); |
|
|
|
nextLi.addClass("current"); |
|
|
|
$("#pagin li a").click(function() { |
|
|
|
$('#pagin li a').removeClass('current'); |
|
|
|
$(this).addClass('current'); |
|
|
|
|
|
|
|
if (i < ($('.browsethearchive-items').length)/ pageSize) { |
|
|
|
showPage(++i); |
|
|
|
} |
|
|
|
slide(); |
|
|
|
showPage(); |
|
|
|
}); |
|
|
|
|
|
|
|
$("#pagin li a").eq(0).addClass("current"); |
|
|
|
|
|
|
|
slide(); |
|
|
|
showPage(); |
|
|
|
|
|
|
|
</script> |
|
|
|
|
|
|
|