Alamantus
/
lexiconga-lite
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Remove pagination (keep the code)

This commit is contained in:
Robbie Antenesse 2019-05-07 10:02:53 -06:00
parent d5edcaf6a5
commit 72041ecafb
2 changed files with 25 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/js/pagination.js
View File

@ -1,5 +1,18 @@
import { DEFAULT_PAGE_SIZE } from '../constants';
import { renderWords } from "./render"; import { renderWords } from "./render";
export function getPaginationData(words) {
const numWords = words.length;
const pageSize = window.localStorage.getItem('pageSize') ? parseInt(window.localStorage.getItem('pageSize')) : DEFAULT_PAGE_SIZE;
const pages = Math.floor(numWords / pageSize);
const currentPage = window.hasOwnProperty('currentPage') ? window.currentPage : 0;
const pageStart = currentPage * pageSize;
const pageEnd = typeof words[pageStart + pageSize] !== 'undefined'
? pageStart + pageSize : words.length - 1;
return { numWords, pageSize, pages, currentPage, pageStart, pageEnd, };
}
export function goToPage(page) { export function goToPage(page) {
if (typeof page.target !== 'undefined') { if (typeof page.target !== 'undefined') {
page = page.target.value; page = page.target.value;

29
src/js/render.js
View File

@ -4,7 +4,7 @@ import { getWordsStats, wordExists } from './utilities';
import { getMatchingSearchWords, highlightSearchTerm, getSearchFilters, getSearchTerm } from './search'; import { getMatchingSearchWords, highlightSearchTerm, getSearchFilters, getSearchTerm } from './search';
import { showSection } from './displayToggles'; import { showSection } from './displayToggles';
import { setupSearchFilters, setupWordOptionButtons, setupPagination, setupWordOptionSelections, setupEditFormButtons } from './setupListeners'; import { setupSearchFilters, setupWordOptionButtons, setupPagination, setupWordOptionSelections, setupEditFormButtons } from './setupListeners';
import { DEFAULT_PAGE_SIZE } from '../constants'; import { getPaginationData } from './pagination';
export function renderAll() { export function renderAll() {
renderDictionaryDetails(); renderDictionaryDetails();
@ -108,12 +108,10 @@ export function renderWords() {
const words = getMatchingSearchWords(); const words = getMatchingSearchWords();
let wordsHTML = ''; let wordsHTML = '';
const pageSize = window.localStorage.getItem('pageSize') ? parseInt(window.localStorage.getItem('pageSize')) : DEFAULT_PAGE_SIZE; // const { pageStart, pageEnd } = getPaginationData(words);
const currentPage = window.hasOwnProperty('currentPage') ? window.currentPage : 0;
const start = currentPage * pageSize;
const end = typeof words[start + pageSize] !== 'undefined' ? start + pageSize : words.length - 1;
words.slice(start, end).forEach(originalWord => { // words.slice(pageStart, pageEnd).forEach(originalWord => {
words.forEach(originalWord => {
let detailsMarkdown = removeTags(originalWord.longDefinition); let detailsMarkdown = removeTags(originalWord.longDefinition);
const references = detailsMarkdown.match(/\{\{.+?\}\}/g); const references = detailsMarkdown.match(/\{\{.+?\}\}/g);
if (references && Array.isArray(references)) { if (references && Array.isArray(references)) {
@ -165,23 +163,20 @@ export function renderWords() {
resultsText += !filters.allPartsOfSpeechChecked ? ' (Filtered)' : ''; resultsText += !filters.allPartsOfSpeechChecked ? ' (Filtered)' : '';
document.getElementById('searchResults').innerHTML = resultsText; document.getElementById('searchResults').innerHTML = resultsText;
renderPagination(); // renderPagination(words);
} }
export function renderPagination() { export function renderPagination(filteredWords) {
const numWords = window.currentDictionary.words.length; const paginationData = getPaginationData(filteredWords);
const pageSize = window.localStorage.getItem('pageSize') ? parseInt(window.localStorage.getItem('pageSize')) : DEFAULT_PAGE_SIZE;
const pages = Math.floor(numWords / pageSize);
const currentPage = window.hasOwnProperty('currentPage') ? window.currentPage : 0;
if (pages > 0) { if (paginationData.pages > 0) {
let paginationHTML = (currentPage > 0 ? '<span class="button prev-button">&laquo; Previous</span>' : '') let paginationHTML = (paginationData.currentPage > 0 ? '<span class="button prev-button">&laquo; Previous</span>' : '')
+ '<select class="page-selector">'; + '<select class="page-selector">';
for (let i = 0; i < pages; i++) { for (let i = 0; i < paginationData.pages; i++) {
paginationHTML += `<option value="${i}"${currentPage === i ? ' selected' : ''}>Page ${i + 1}</option>`; paginationHTML += `<option value="${i}"${paginationData.currentPage === i ? ' selected' : ''}>Page ${i + 1}</option>`;
} }
paginationHTML += '</select>' paginationHTML += '</select>'
+ (currentPage < pages - 1 ? '<span class="button next-button">Next &raquo;</span>' : ''); + (paginationData.currentPage < paginationData.pages - 1 ? '<span class="button next-button">Next &raquo;</span>' : '');
Array.from(document.getElementsByClassName('pagination')).forEach(pagination => { Array.from(document.getElementsByClassName('pagination')).forEach(pagination => {
pagination.innerHTML = paginationHTML; pagination.innerHTML = paginationHTML;