https://shop.exacteditions.com/assets/search-71b25a88.js

1import range from 'helpers/range';
2
3/**
4 *
5 * @param {Number} page The page number of the url.
6 * @returns {String} The relative path to the page.
7 */
8function urlFor(page) {
9  const urlParams = new URLSearchParams(window.location.search);
10  urlParams.set('page', page);
11  return `${window.location.pathname}?${urlParams.toString()}`;
12}
13
14/**
15 * Simple pagination for the shop search.
16 * relies on two elements in the dom - `#pager` and `#count`.
17*/
18export default function pagination() {
19  const RESULTS_PER_PAGE = 6;
20  const MAX_RESULTS = 120;
21  const RADIUS = 3;
22
23  const pager = document.querySelector('#pager');
24  const count = document.querySelector('#count');
25  const useNewSearch = document.querySelector('#use-new-search');
26
27  if (!pager || !count || !useNewSearch) return;
28
29  const totalResults = Math.min(Number(count.dataset.count), MAX_RESULTS);
30
31  const maxPage = Math.ceil(totalResults / RESULTS_PER_PAGE);
32
33  if (maxPage <= 1) return;
34
35  const urlParams = new URLSearchParams(window.location.search);
36
37  // If the parameter is not set, lhs will return 0, and so we have 0 || 1.
38  let currentPage = Number(urlParams.get('page')) || 1;
39  currentPage = Math.min(currentPage, maxPage);
40
41  const previousPage = Math.max(currentPage - 1, 1);
42  const goBack = `<li><a href="${urlFor(previousPage)}" aria-label="Previous page"><i class="fa fa-angle-left"/></a></li>`;
43
44  const start = Math.max(1, currentPage - RADIUS);
45  const end = Math.min(maxPage, currentPage + RADIUS);
46
47  pager.innerHTML = goBack;
48
49  range(end - start + 1, start).forEach((page) => {
50    let act = '';
51    let ariaLabel = `Go to page ${page}`;
52    let ariaCurrent = '';
53
54    if (page === currentPage) {
55      act = 'active';
56      ariaLabel = `Current page, page ${page}`;
57      ariaCurrent = 'aria-current="true"';
58    }
59
60    const link = `<li data-page="${page}" class="${act}"><a href="${urlFor(page)}" aria-label="${ariaLabel}" ${ariaCurrent}>${page}</a></li>`;
61    pager.innerHTML += link;
62  });
63
64  const nextPage = Math.min(maxPage, currentPage + 1);
65  const goForward = `<li><a href="${urlFor(nextPage)}" aria-label="Next page"><i class="fa fa-angle-right"/></a></li>`;
66  pager.innerHTML += goForward;
67}