idac: added scrolling up after page change

This commit is contained in:
Dniel97 2023-11-22 01:25:12 +01:00
parent 989cbdf748
commit e124d5e52e
Signed by untrusted user: Dniel97
GPG Key ID: 6180B3C768FB2E08
2 changed files with 10 additions and 9 deletions

View File

@ -11,7 +11,7 @@ function evaluateRank(evalId) {
} else if (evalId >= 13 && evalId <= 16) { } else if (evalId >= 13 && evalId <= 16) {
return "Expert"; return "Expert";
} else if (evalId >= 17 && evalId <= 20) { } else if (evalId >= 17 && evalId <= 20) {
return "Professional"; return "Pro";
} else if (evalId >= 21 && evalId <= 24) { } else if (evalId >= 21 && evalId <= 24) {
return "Master"; return "Master";
} else if (evalId == 25) { } else if (evalId == 25) {

View File

@ -19,13 +19,14 @@ function loadRanking(courseId, pageNumber = 1) {
var total_pages = data.total_pages; var total_pages = data.total_pages;
// Generate the HTML table // Generate the HTML table
var tableHtml = '<div class="table-responsive"><table class="table table-hover"><thead><tr><th scope="col">#</th><th scope="col">Name/Car</th><th scope="col">Time</th><th scope="col">Eval</th><th scope="col" class="d-none d-lg-table-cell">Store/Date</th></tr></thead><tbody>'; var tableHtml = '<div data-bs-spy="scroll" data-bs-smooth-scroll="true" class="table-responsive"><table class="table table-hover"><thead><tr><th scope="col">#</th><th scope="col">Name/Car</th><th scope="col">Time</th><th scope="col" class="d-none d-sm-table-cell">Eval</th><th scope="col" class="d-none d-lg-table-cell">Store/Date</th></tr></thead><tbody>';
$.each(data.ranking, function (i, ranking) { $.each(data.ranking, function (i, ranking) {
tableHtml += '<tr class="align-middle">'; // Add a 1 to the i variable to get the correct rank number
tableHtml += `<tr id="rank-${i+1}" class="align-middle">`;
tableHtml += '<td>' + ranking.rank + '</td>'; tableHtml += '<td>' + ranking.rank + '</td>';
tableHtml += '<td>' + ranking.name + '<br/>' + getCarName(ranking.style_car_id) + '</td>'; tableHtml += '<td>' + ranking.name + '<br/>' + getCarName(ranking.style_car_id) + '</td>';
tableHtml += '<td>' + formatGoalTime(ranking.record) + '</td>'; tableHtml += '<td class="fs-3">' + formatGoalTime(ranking.record) + '</td>';
tableHtml += '<td>' + evaluateRank(ranking.eval_id) + '</td>'; tableHtml += '<td class="fs-4 d-none d-sm-table-cell">' + evaluateRank(ranking.eval_id) + '</td>';
// Ignore the Store and Date columns on small screens // Ignore the Store and Date columns on small screens
tableHtml += '<td class="d-none d-lg-table-cell">' + ranking.store + '<br/>' + ranking.update_date + '</td>'; tableHtml += '<td class="d-none d-lg-table-cell">' + ranking.store + '<br/>' + ranking.update_date + '</td>';
tableHtml += '</tr>'; tableHtml += '</tr>';
@ -39,15 +40,15 @@ function loadRanking(courseId, pageNumber = 1) {
var paginationHtml = '<nav class="mt-3"><ul class="pagination justify-content-center">'; var paginationHtml = '<nav class="mt-3"><ul class="pagination justify-content-center">';
// Deactivate the previous button if the current page is the first page // Deactivate the previous button if the current page is the first page
paginationHtml += '<li class="page-item ' + (pageNumber === 1 ? 'disabled' : '') + '">'; paginationHtml += '<li class="page-item ' + (pageNumber === 1 ? 'disabled' : '') + '">';
paginationHtml += '<a class="page-link" href="#" data-page="' + (pageNumber - 1) + '">Previous</a>'; paginationHtml += '<a class="page-link" href="#rank-1" data-page="' + (pageNumber - 1) + '">Previous</a>';
paginationHtml += '</li>'; paginationHtml += '</li>';
for (var i = 1; i <= total_pages; i++) { for (var i = 1; i <= total_pages; i++) {
// Set the active class to the current page // Set the active class to the current page
paginationHtml += '<li class="page-item ' + (pageNumber === i ? 'active disabled' : '') + '"><a class="page-link" href="#" data-page="' + i + '">' + i + '</a></li>'; paginationHtml += '<li class="page-item ' + (pageNumber === i ? 'active disabled' : '') + '"><a class="page-link" href="#rank-1" data-page="' + i + '">' + i + '</a></li>';
} }
// Deactivate the next button if the current page is the last page // Deactivate the next button if the current page is the last page
paginationHtml += '<li class="page-item ' + (pageNumber === total_pages ? 'disabled' : '') + '">'; paginationHtml += '<li class="page-item ' + (pageNumber === total_pages ? 'disabled' : '') + '">';
paginationHtml += '<a class="page-link" href="#" data-page="' + (pageNumber + 1) + '">Next</a>'; paginationHtml += '<a class="page-link" href="#rank-1" data-page="' + (pageNumber + 1) + '">Next</a>';
paginationHtml += '</li>'; paginationHtml += '</li>';
paginationHtml += '</ul></nav>'; paginationHtml += '</ul></nav>';
@ -83,7 +84,7 @@ $(document).ready(function () {
// Event delegation for pagination links // Event delegation for pagination links
$("#pagination-ranking").on("click", "a.page-link", function (event) { $("#pagination-ranking").on("click", "a.page-link", function (event) {
event.preventDefault(); // Prevent the default behavior of the link // event.preventDefault(); // Prevent the default behavior of the link
var clickedPage = $(this).data("page"); var clickedPage = $(this).data("page");
// Check if the changePage function is not already in progress // Check if the changePage function is not already in progress
if (!$(this).hasClass('disabled')) { if (!$(this).hasClass('disabled')) {