diff --git a/frontend/js/leaderboard/pagination.js b/frontend/js/leaderboard/pagination.js index 8bbb79e7..518b3063 100644 --- a/frontend/js/leaderboard/pagination.js +++ b/frontend/js/leaderboard/pagination.js @@ -8,9 +8,7 @@ function setupPaginationListeners() { }); document.getElementById("next-page-btn")?.addEventListener("click", () => { - const totalPages = Math.ceil( - leaderboardData[activeDatasetType].length / itemsPerPage, - ); + const totalPages = window.totalPages || 1; if (currentPage < totalPages) { currentPage++; @@ -25,6 +23,13 @@ function renderPagination(totalItems) { if (!pageNumbers) return; + const isSearching = + typeof currentSearchTerm !== "undefined" && currentSearchTerm.length > 0; + if (isSearching) { + pageNumbers.innerHTML = ""; + return; + } + const totalPages = Math.ceil(totalItems / itemsPerPage); pageNumbers.innerHTML = ""; diff --git a/frontend/js/leaderboard/search.js b/frontend/js/leaderboard/search.js index 2bbb48de..ef321155 100644 --- a/frontend/js/leaderboard/search.js +++ b/frontend/js/leaderboard/search.js @@ -18,6 +18,7 @@ function setupSearchListeners() { clearBtn.style.display = e.target.value.trim() !== "" ? "flex" : "none"; + currentPage = 1; applyFiltersAndRender(); }, 300), ); @@ -29,6 +30,7 @@ function setupSearchListeners() { clearBtn.style.display = "none"; searchInput.focus(); + currentPage = 1; applyFiltersAndRender(); }); @@ -53,6 +55,7 @@ function setupSearchListeners() { currentSearchTerm = ""; clearBtn.style.display = "none"; searchInput.blur(); + currentPage = 1; applyFiltersAndRender(); } }); diff --git a/frontend/leaderboard.html b/frontend/leaderboard.html index 701222a9..cff71a80 100644 --- a/frontend/leaderboard.html +++ b/frontend/leaderboard.html @@ -556,37 +556,63 @@

Leaderboard

(user) => user && !zeroScoreUserIds.has(user.id), ); - const totalPages = Math.ceil(renderableData.length / itemsPerPage) || 1; - document.getElementById("prev-page-btn").disabled = currentPage === 1; - document.getElementById("next-page-btn").disabled = - currentPage === totalPages; - + const isSearching = currentSearchTerm.length > 0; const statsEl = document.getElementById("leaderboard-stats"); - const startRow = - renderableData.length === 0 - ? 0 - : (currentPage - 1) * itemsPerPage + 1; - - const endRow = Math.min( - currentPage * itemsPerPage, - renderableData.length, - ); - - statsEl.innerHTML = ` -
- Total Users: ${filteredData.length} - | Showing: ${startRow}-${endRow} - | Page: ${currentPage}/${totalPages} -
- `; + if (isSearching) { + document.getElementById("prev-page-btn").disabled = true; + document.getElementById("next-page-btn").disabled = true; + window.totalPages = 1; + + const totalMatched = filteredData.length; + const startRow = totalMatched === 0 ? 0 : 1; + const endRow = totalMatched; + + statsEl.innerHTML = ` +
+ Total Users: ${totalMatched} + | Showing: ${startRow}-${endRow} + | Page: 1/1 +
+ `; + } else { + const totalPages = + Math.ceil(renderableData.length / itemsPerPage) || 1; + window.totalPages = totalPages; + document.getElementById("prev-page-btn").disabled = currentPage === 1; + document.getElementById("next-page-btn").disabled = + currentPage === totalPages; + + const startRow = + renderableData.length === 0 + ? 0 + : (currentPage - 1) * itemsPerPage + 1; + + const endRow = + currentPage === totalPages + ? filteredData.length + : currentPage * itemsPerPage; + + statsEl.innerHTML = ` +
+ Total Users: ${filteredData.length} + | Showing: ${startRow}-${endRow} + | Page: ${currentPage}/${totalPages} +
+ `; + } - renderLeaderboard(filteredData, zeroScoreUserIds, totalPages); + renderLeaderboard(filteredData, zeroScoreUserIds, window.totalPages); } function renderLeaderboard(data, zeroScoreUserIds, totalPages) {