| 1 | let url = window.location.href.toString().split(window.location.host)[1].split("?")[0];
|
|---|
| 2 |
|
|---|
| 3 | let pages = parseInt(document.getElementById("helper").getAttribute("data-pages"));
|
|---|
| 4 | let currentPage = parseInt(findGetParameter("page"));
|
|---|
| 5 | let sort = findGetParameter("sort");
|
|---|
| 6 | let order = findGetParameter("order");
|
|---|
| 7 | let group = findGetParameter("groupBy")
|
|---|
| 8 |
|
|---|
| 9 | let sortByInput = document.getElementById("sortBy");
|
|---|
| 10 | sortByInput.value = sort;
|
|---|
| 11 |
|
|---|
| 12 | let orderInput = document.getElementById("order");
|
|---|
| 13 | orderInput.value = order;
|
|---|
| 14 |
|
|---|
| 15 | let groupByInput = document.getElementById("groupBy") === null ? document.createElement("input") : document.getElementById("groupBy");
|
|---|
| 16 | groupByInput.value = group;
|
|---|
| 17 |
|
|---|
| 18 | sortByInput.addEventListener("change", function () {
|
|---|
| 19 | window.location.href = url + "?page=" + currentPage + "&sort=" + sortByInput.value + "&order=" + orderInput.value + "&groupBy=" + groupByInput.value;
|
|---|
| 20 | })
|
|---|
| 21 |
|
|---|
| 22 | orderInput.addEventListener("change", function() {
|
|---|
| 23 | window.location.href = url + "?page=" + currentPage + "&sort=" + sortByInput.value + "&order=" + orderInput.value + "&groupBy=" + groupByInput.value;
|
|---|
| 24 | })
|
|---|
| 25 |
|
|---|
| 26 | groupByInput.addEventListener("change", function () {
|
|---|
| 27 | window.location.href = url + "?page=" + 1 + "&sort=" + sortByInput.value + "&order=" + orderInput.value + "&groupBy=" + groupByInput.value;
|
|---|
| 28 | })
|
|---|
| 29 |
|
|---|
| 30 | document.getElementById('pagination').innerHTML = createPagination(pages, currentPage);
|
|---|
| 31 |
|
|---|
| 32 | function createPagination(pages, page) {
|
|---|
| 33 | let str = '<ul class="pagination justify-content-center">';
|
|---|
| 34 | let active;
|
|---|
| 35 | let pagesBefore = page - 1;
|
|---|
| 36 | let pagesAfter = page + 1;
|
|---|
| 37 |
|
|---|
| 38 | if (page > 1) {
|
|---|
| 39 | str += '<li class="page-item"><a class="page-link" href="'+url+'?page='+(page-1)+'&sort='+sort+'&order='+order+'&groupBy='+group+'">Previous</a></li>';
|
|---|
| 40 | }
|
|---|
| 41 |
|
|---|
| 42 | if (pages < 6) {
|
|---|
| 43 | for (let p = 1; p <= pages; p++) {
|
|---|
| 44 | active = page == p ? "active" : "";
|
|---|
| 45 | str += '<li class="page-item '+active+'"><a class="page-link" href="'+url+'?page='+p+'&sort='+sort+'&order='+order+'&groupBy='+group+'">'+ p +'</a></li>';
|
|---|
| 46 | }
|
|---|
| 47 | }
|
|---|
| 48 |
|
|---|
| 49 | else {
|
|---|
| 50 | if (page > 2) {
|
|---|
| 51 | str += '<li class="page-item"><a class="page-link" href="'+url+'?page=1&sort='+sort+'&order='+order+'&groupBy='+group+'">1</a></li>';
|
|---|
| 52 | if (page > 3) {
|
|---|
| 53 | str += '<li class="page-item"><a class="page-link" href="'+url+'?page='+(page-2)+'&sort='+sort+'&order='+order+'&groupBy='+group+'">...</a></li>';
|
|---|
| 54 | }
|
|---|
| 55 | }
|
|---|
| 56 |
|
|---|
| 57 | if (page === 1) {
|
|---|
| 58 | pagesAfter += 2;
|
|---|
| 59 | } else if (page === 2) {
|
|---|
| 60 | pagesAfter += 1;
|
|---|
| 61 | }
|
|---|
| 62 |
|
|---|
| 63 | if (page === pages) {
|
|---|
| 64 | pagesBefore -= 2;
|
|---|
| 65 | } else if (page === pages-1) {
|
|---|
| 66 | pagesBefore -= 1;
|
|---|
| 67 | }
|
|---|
| 68 |
|
|---|
| 69 | for (let p = pagesBefore; p <= pagesAfter; p++) {
|
|---|
| 70 | if (p === 0) {
|
|---|
| 71 | p += 1;
|
|---|
| 72 | }
|
|---|
| 73 | if (p > pages) {
|
|---|
| 74 | continue
|
|---|
| 75 | }
|
|---|
| 76 | active = page == p ? "active" : "";
|
|---|
| 77 | str += '<li class="page-item '+active+'"><a class="page-link" href="'+url+'?page='+p+'&sort='+sort+'&order='+order+'&groupBy='+group+'">'+ p +'</a></li>';
|
|---|
| 78 | }
|
|---|
| 79 |
|
|---|
| 80 | if (page < pages-1) {
|
|---|
| 81 | if (page < pages-2) {
|
|---|
| 82 | str += '<li class="page-item"><a class="page-link" href="'+url+'?page='+(page+2)+'&sort='+sort+'&order='+order+'&groupBy='+group+'">...</a></li>';
|
|---|
| 83 | }
|
|---|
| 84 | str += '<li class="page-item"><a class="page-link" href="'+url+'?page='+pages+'&sort='+sort+'&order='+order+'&groupBy='+group+'">'+pages+'</a></li>';
|
|---|
| 85 | }
|
|---|
| 86 | }
|
|---|
| 87 |
|
|---|
| 88 | if (page < pages) {
|
|---|
| 89 | str += '<li class="page-item"><a class="page-link" href="'+url+'?page='+(page+1)+'&sort='+sort+'&order='+order+'&groupBy='+group+'">Next</a></li>';
|
|---|
| 90 | }
|
|---|
| 91 | str += '</ul>';
|
|---|
| 92 |
|
|---|
| 93 | return str;
|
|---|
| 94 | }
|
|---|
| 95 |
|
|---|
| 96 | function findGetParameter(parameterName) {
|
|---|
| 97 | let result = null,
|
|---|
| 98 | tmp = [];
|
|---|
| 99 | location.search
|
|---|
| 100 | .substr(1)
|
|---|
| 101 | .split("&")
|
|---|
| 102 | .forEach(function (item) {
|
|---|
| 103 | tmp = item.split("=");
|
|---|
| 104 | if (tmp[0] === parameterName) result = tmp[1];
|
|---|
| 105 | });
|
|---|
| 106 | return result;
|
|---|
| 107 | } |
|---|
