pagination на jquery

Есть функция пагинации:

js

function Pagination() {
    var rowsShown = $('.quantity__link_active').data('value');
    if(rowsShown === 'all') {
        $('.table__row').show();
        $('.pageList__link').remove();
    } else {
        var rowsTotal = $('.table__row').length;
        var numPages = Math.ceil(rowsTotal/rowsShown);
        $('.pageList__link').remove();
        for(var i = 0; i < numPages; i++) {
            var pageNum = i + 1;
            $('.pageList').append('<a href="#" rel="'+ i +'" class="pageList__link">'+ pageNum +'</a> ');
        }
        $('.pageList__link:first').addClass('pageList__link_active');
        $('.table__row').hide()
        for(var i = 0; i <= rowsShown - 1; i++) {
            $($('.table__row')[i]).show();
        }
        $('.pageList__link').on('click', function(){
            $('.pageList__link').removeClass('pageList__link_active');
            $(this).addClass('pageList__link_active');
            $('.table__row').hide();
            var currPage = $(this).attr('rel');
            var startItem = currPage * rowsShown;
            var endItem = startItem + rowsShown;
            for(var i = startItem; i < endItem; i++) {
                $($('.table__row')[i]).show();
            }
            return false;
        });
    }
};

html

<div class="pageList"></div>
<div class="quantity__items">
    <span class="quantity__text">Количество задач:</span>
    <a class="quantity__link quantity__link_active" href="#" data-value="20">20</a>
    <a class="quantity__link" href="#" data-value="50">50</a>
    <a class="quantity__link" href="#" data-value="100">100</a>
    <a class="quantity__link" href="#" data-value="all">все</a>
</div>

table__row встраивается автоматически из json файла.

Если страниц меньше 7, выглядит адекватно, но как только страниц становится больше, то едет вёрстка.

Хотелось бы сделать так:

Объясните, пожалуйста, алгоритм "сворачивания" страниц, если их становится больше 5. Желательно, чтобы выводилась всегда первая и последняя страница.

Без готовых решений и плагинов. Хочется понять, как оно работает и своими силами написать.

Спасибо!

UPD: Сделал сворачивание, но не могу понять, как выводить следующие 2 страницы.

if($('.pageList__link').length > 5) {
            $('.pageList__link').hide();
            $('.pageList__link:first').show().after('<span class="pageList__ellipses">...</span>');
            $('.pageList__link:last').show();
        }