neutrino/js Paginator: js

Универсальный пагинатор на чистом JavaScript. Версия 1.1.5 Пагинация зависит от двух параметров: от количества элементов на странице (tableSize) и от общего колличества элементов (totalItems). Следовательно пагинатор необходимо упаковать в отдельный и независимый модуль. Для независимости упаковки требуется еще условиться о формате callback функции, которая отработает при выборе занумерованного-таба:

/**  
 * Обработка активации занумерованного таба - функцию извне определяет пользователь     
 * @param {Type} callbackParams - пользовательские параметры,
 * callbackParams - этот объект передается отдельно от callback и затем происходит их совместный вызов.
 */
callback(callbackParams) {}

Получаем - три входных параметра - tableSize, totalItems и пользовательская функция callback(callbackParams)
позволяют прицепить этот пагинатор где вздумается. А кроме того функция rebuild() налету переделает paginator, если вы поменяете его настройки.
Всего этого достаточно чтобы закапсулировать пагинатор в независимый модуль.

Сейчас в модуле реализовано два пагинатора с поблочной перемоткой плюс пошаговый пагинатор. Поблочная перемотка - это перемотка сразу по несколько табов при нажатии на кнопки next или previous (пореже дергает сервер).
Можно также активировать кнопку Go (еще реже дергает сервер).
Естественно остальные чудесные пагинаторы с кучей красивых эффектов вы можете реализовать самостоятельно - достаточно форкнуть проект.

Пример создания и использования пагинатора:

    let testTable = new TestsTable("one-ellipsis-test-table");

    testTable.paginator = PaginatorFactory.createOneEllipsisBlockPaginator({
        containerId: "one-ellipsis-pagination",            
        totalItems: testTable.getDataMap().size,
        callback: testTable.callbackForPaginator,
        callbackParams: {table: testTable},
        tableSize: 5, /*необязательный параметр*/
        maxVisibleTabs: 5, /*необязательный параметр*/
        enableGo: true /*необязательный параметр*/});

    class TestsTable {

        callbackForPaginator(callbackParams) {
            let linkToPaginator = this; //this - здесь получается это указатель на Paginator

            console.log("tabNumber=" + linkToPaginator.currentTab + " rangeStart=" + linkToPaginator.rangeStart() +
                    " rangeEnd=" + linkToPaginator.rangeEnd() + " tableSize=" + linkToPaginator.tableSize +
                    " totalItems=" + linkToPaginator.totalItems);
            callbackParams.table.refresh(linkToPaginator.rangeStart(), linkToPaginator.rangeEnd());
        }

        refresh(rangeStart, rangeEnd) { }
    }

Лицензия: свободная.

Описание

Конвейеры