carnet_atterrissage/user/themes/carnet-atterrissage/js/ui/pagesToDisplay.js

// sélectionner l'interval de pages à afficher
// laisser les inputs vides pour afficher toutes les pages
if (debug) console.log('start pagesToDisplay');

(function() {
    let uiContent = document.querySelector('.uiContent');

    let pagesToDisplayContainer = document.createElement('div');
    pagesToDisplayContainer.classList.add('pagesToDisplay');

    let pagesToDisplayTitle = document.createElement('div');
    pagesToDisplayTitle.innerText = "Afficher l'interval de pages";

    let intervalContainer = document.createElement('div');
    intervalContainer.classList.add('intervalContainer');

    let textFrom = document.createElement('p');
    textFrom.innerText = "De";

    let inputFrom = document.createElement('input');
    inputFrom.setAttribute('type', 'text');

    let textTo = document.createElement('p');
    textTo.innerText = "à";

    let inputTo = document.createElement('input');
    inputTo.setAttribute('type', 'text');
    inputTo.addEventListener('keypress', function(event) {
        if (event.key === "Enter") displayPagesRange(inputFrom.value, inputTo.value)
    })
    
    let button = document.createElement('button');
    button.innerText = 'Go';
    button.addEventListener('click', function() { displayPagesRange(inputFrom.value, inputTo.value) });

    intervalContainer.append(textFrom);
    intervalContainer.append(inputFrom);
    intervalContainer.append(textTo);
    intervalContainer.append(inputTo);
    intervalContainer.append(button);

    pagesToDisplayContainer.append(pagesToDisplayTitle);
    pagesToDisplayContainer.append(intervalContainer);

    uiContent.append(pagesToDisplayContainer);

    function displayPagesRange(start, end) {
        start = parseInt(start);
        end = parseInt(end);
        let pages = document.querySelectorAll('.pagedjs_page');

        if (/^\d+$/.test(start) && /^\d+$/.test(end) && start <= pages.length && end <= pages.length && start < end) {
            // disable pages before start
            if (start != 1) {
                for (let i = 0; i < start - 1; i++) {
                    pages[i].style.display = 'none';
                }
            }
            // enable pages between the interval
            for (let j = start - 1; j < end; j++) {
                pages[j].style.display = 'block';
            }
            // disable pages after end
            if (end != pages.length + 1) {
                for (let k = end; k < pages.length; k++) {
                    pages[k].style.display = 'none';
                }
            }
        } else if (start === '' && end === '') {
            for (let page of pages) {
                page.style.display = 'block';
            }
        }
    }
})();

if (debug) console.log('end pagesToDisplay');