IW4M-Admin/WebfrontCore/wwwroot/js/loader.js

let loaderOffset = 10;
let loadCount = 10;
let loaderReachedEnd = false;
let startAt = null;
let isLoaderLoading = false;
let loadUri = '';
let loaderResponseId = '';
let additionalParams = [];

function initLoader(location, loaderId, count = 10, start = count, additional = []) {
    loadUri = location;
    loaderResponseId = loaderId;
    loadCount = count;
    loaderOffset = start;
    additionalParams = additional;
    setupListeners();
}

function loadMoreItems() {
    if (isLoaderLoading || loaderReachedEnd) {
        return false;
    }

    showLoader();
    isLoaderLoading = true;
    let params = { offset: loaderOffset, count: loadCount, startAt: startAt };
    for (i = 0; i < additionalParams.length; i++) {
        let param = additionalParams[i];
        params[param.name] = param.value;
    }

    $.get(loadUri, params)
        .done(function (response) {
            $(loaderResponseId).append(response);
            if (response.trim().length === 0) {
                staleLoader();
                loaderReachedEnd = true;
                $('.loader-load-more').addClass('disabled');
            }
            $(document).trigger("loaderFinished", response);
            startAt = $(response).filter('.loader-data-time').last().data('time');
            hideLoader();
            isLoaderLoading = false;
        })
        .fail(function (jqxhr, statis, error) {
            errorLoader();
            isLoaderLoading = false;
        });
    loaderOffset += loadCount;
}

var hasScrollBar = false;

function _ScrollHandler(e) {
    //throttle event:
    /*
    https://stackoverflow.com/questions/3898130/check-if-a-user-has-scrolled-to-the-bottom
    */
    var $window = $(window);
    var $document = $(document);
    hasScrollBar = true;
    let _throttleTimer = null;
    let _throttleDelay = 100;

    clearTimeout(_throttleTimer);
    _throttleTimer = setTimeout(function () {

        //do work
        if ($window.scrollTop() + $window.height() > $document.height() - 100) {
            loadMoreItems();
        }

    }, _throttleDelay);
}

function setupListeners() {
    if ($(loaderResponseId).length === 1) {
        /*
            https://stackoverflow.com/questions/19731730/jquery-js-detect-users-scroll-attempt-without-any-window-overflow-to-scroll
            */

        $('html').bind('mousewheel DOMMouseScroll', function (e) {
            var delta = e.originalEvent.wheelDelta || -e.originalEvent.detail;

            if (delta < 0 && !hasScrollBar) {
                loadMoreItems();
            }
        });



        $(document).ready(function () {
            $(window)
                .off('scroll', _ScrollHandler)
                .on('scroll', _ScrollHandler);
            $('.loader-load-more:not(.disabled)').click(function (e) {
                if (!isLoaderLoading) {
                    loadMoreItems();
                }
            });
        });
    }
}