JSFiddle - React, Tailwind, and code Playground

by s4ty

JavaScript

jQuery.fn.extend({
        pagination: function () {
                paginatorId = this;
                switch (paginatorPosition) {
                case 'top':
                        {
                                paginatorId.before('<div class="paginator"></div>');
                                break
                        }
                case 'bottom':
                        {
                                paginatorId.after('<div class="paginator"></div>');
                                break
                        }
                case 'both':
                        {
                                paginatorId.before('<div class="paginator"></div>');
                                paginatorId.after('<div class="paginator"></div>');
                                break
                        }
                default:
                        {
                                paginatorId.after('<div class="paginator"></div>')
                        }
                }
                initPaginator()
        },
        depagination: function () {
                $('.paginator').remove();
                paginatorId.children().show()
        }
});
 
function initPaginator() {
    if (itemsPerPage < 1) itemsPerPage = 5;
    allItems = paginatorId.children().length;
    if (allItems % itemsPerPage == 0) lastPage = parseInt(allItems / itemsPerPage);
    else lastPage = parseInt(allItems / itemsPerPage) + 1;
    if ((startPage < 1) || (startPage > lastPage)) startPage = 1;
    if (!showIfSinglePage) {
        if (lastPage > 1) appendContent(startPage, 1)
    } else appendContent(startPage, 1)
}
 
function appendContent(a, b) {
    if (a < 0) {
        if (a == -1) a = currentPage - 1;
        else a = currentPage + 1
    }
    currentPage = a;
    till = (currentPage - 1) * itemsPerPage;
    if (!b) {
        paginatorId.fadeOut("medium", function () {
            createPaginator();
            paginatorId.children().hide();
           ...