pagination update!

This commit is contained in:
Alexandra
2024-10-24 01:43:11 -06:00
parent e72e6f081a
commit 32ab00f75b
2 changed files with 76 additions and 9 deletions

View File

@@ -9,6 +9,7 @@ import http from "http";
import sanitize from "sanitize";
import debugPrint from "./lib/debugprint.js";
import compression from "compression";
import { url } from "inspector";
let fileListPath = "./filelist.json";
let queryCountFile = "./queries.txt";
@@ -120,6 +121,9 @@ app.get("/", function (req, res) {
app.get("/search", async function (req, res) {
let query = req.query.q ? req.query.q : "";
let pageNum = parseInt(req.query.p)
let urlPrefix = encodeURI(`/search?s=${req.query.s}&q=${req.query.q}&p=`)
pageNum = pageNum ? pageNum : 1
let settings = {};
try {
settings = req.query.s ? JSON.parse(atob(req.query.s)) : defaultSettings;
@@ -153,7 +157,9 @@ app.get("/search", async function (req, res) {
let options = {
query: query,
results: results,
pageNum: pageNum,
indexing: search.indexing,
urlPrefix: urlPrefix
};
let page = "results";
options = buildOptions(page, options);

View File

@@ -1,3 +1,8 @@
<%
let entryStart = Math.floor((pageNum - 1) * 100)
let entryEnd = entryStart + 100
entryEnd = entryEnd > results.items.length ? results.items.length : entryEnd
%>
<script src='https://code.jquery.com/jquery-3.7.1.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.2/js/bootstrap.min.js'></script>
@@ -5,7 +10,7 @@
<script src='https://cdn.datatables.net/2.1.8/js/dataTables.bootstrap4.js'></script>
<link rel="stylesheet" href="https://cdn.datatables.net/2.1.8/css/dataTables.bootstrap4.css">
<div class="row w-100 m-0">
<form class="m-2 form-inline w-100" action="/search">
<form class="ml-2 form-inline w-100" action="/search">
<div class="w-100 align-items-center">
<div class="form-group">
<a href="/">
@@ -27,6 +32,7 @@ _ / / / _ /_/ /_ / _ / / __/ / / / /_
</form>
<div class="col-sm-12 w-100 mt-3">
<p>Displaying results <%= entryStart %> through <%= entryEnd %>. </p>
<table class="table text-white table-bordered" id="results">
<thead>
<tr>
@@ -39,7 +45,7 @@ _ / / / _ /_/ /_ / _ / / __/ / / / /_
<th>Search Score</th>
</tr>
</thead>
<% for (let x = 0; x < results.items.length; x++) { %>
<% for (let x = entryStart; x < entryEnd; x++) { %>
<tr>
<td>
<a href="<%= results.items[x].path %>">
@@ -67,12 +73,67 @@ _ / / / _ /_/ /_ / _ / / __/ / / / /_
</tr>
<% } %>
</table>
<%
let pageCount = Math.ceil(results.items.length / 100)
pageCount = pageCount ? pageCount : 1 //always ensure 1 page
if(pageCount > 1) {
%>
<div class="row justify-content-between">
<div class="d-md-flex justify-content-between align-items-center dt-layout-end col-md-auto ml-auto">
<div class="dt-paging">
<nav aria-label="pagination">
<ul class="pagination">
<%
let ellipsesElem = '<li class="dt-paging-button page-item disabled"><a class="page-link ellipsis" aria-controls="results" aria-disabled="true" data-dt-idx="ellipsis" tabindex="-1">…</a></li> '
let pageUrlPrefix = ''
const getPageRange = (page) => {
let pageUpperLimit = pageCount - 4
if(page > 4 && page < pageUpperLimit){
return {
lower: page,
upper: page + 3
}
}
else if(page <= 4){
return {
lower: 2,
upper: pageCount >= 5 ? 5 : pageCount
}
}
else if(page >= pageUpperLimit){
return {
lower: pageCount - 4,
upper: pageCount - 1
}
}
}
let pageRange = getPageRange(pageNum)
%>
<li class="dt-paging-button page-item <%= pageNum == 1 ? 'disabled' : '' %>"><a <%= pageNum != 1 ? `href=${urlPrefix + (pageNum - 1)}` : '' %> class="page-link previous" aria-controls="results" aria-disabled="true" aria-label="Previous" data-dt-idx="previous" tabindex="-1"></a></li>
<li class="dt-paging-button page-item <%= pageNum == 1 ? 'active' : '' %>"><a href="<%= urlPrefix + 1 %>" class="page-link" aria-controls="results" aria-current="page" data-dt-idx="0">1</a></li>
<%- pageNum >= 5 ? ellipsesElem : '' %>
<% for(let x = pageRange.lower; x <= pageRange.upper; x++){ %>
<li class="dt-paging-button page-item <%= pageNum == x ? 'active' : '' %>"><a href="<%= urlPrefix + x %>" class="page-link" aria-controls="results" aria-current="page" data-dt-idx="<%= x - 1 %>"><%= x %></a></li>
<% } %>
<%- pageNum <= pageCount - 5 ? ellipsesElem : '' %>
<li class="dt-paging-button page-item <%= pageNum == pageCount ? 'active' : '' %>"><a href="<%= urlPrefix + pageCount %>" class="page-link" aria-controls="results" data-dt-idx="<%= pageCount - 1 %>"><%= pageCount %></a></li>
<li class="dt-paging-button page-item <%= pageNum == pageCount ? 'disabled' : '' %>"><a <%= pageNum != pageCount ? `href=${urlPrefix + (pageNum + 1)}` : '' %> class="page-link next" aria-controls="results" aria-label="Next" data-dt-idx="next"></a></li>
</ul>
</nav>
</div>
</div>
</div>
<% } %>
</div>
</div>
<script defer>resultTable = new DataTable('#results', {
"order": [6, 'desc'],
"lengthMenu": [100, { label: 'All', value: -1 }, 50, 25, 10],
"oLanguage": {
"sSearch": "Filter: "
}
});</script>
<script defer>
resultTable = new DataTable('#results', {
"order": [6, 'desc'],
"lengthMenu": [100, { label: 'All', value: -1 }, 50, 25, 10],
"paging": false,
"filter": false,
"layout": {
"bottomStart": ''
}
});
</script>