IsekaiWidgets/modules/masonry/ext.isekai.masonry.base.js

function debounce(func, wait, immediate) {
    let timeout;
    return function () {
        let context = this;
        let args = arguments;
        let later = function () {
            timeout = null;
            if (!immediate) {
                func.apply(context, args);
            }
        };
        let callNow = immediate && !timeout;
        clearTimeout(timeout);
        timeout = setTimeout(later, wait);
        if (callNow) {
            func.apply(context, args);
        }
    };
}

$(function () {
    let masonry = new isekai.lib.Masonry('.isekai-masonry', {
        itemSelector: '.isekai-masonry-item',
        columnWidth: '.isekai-masonry-sizer',
        gutter: '.isekai-masonry-gutter-sizer',
        percentPosition: true
    });

    let resizeObserver = new ResizeObserver(debounce(function () {
        console.log('masonry resize');
        masonry.layout();
    }, 100));

    let items = document.querySelectorAll('.isekai-masonry-item');
    items.forEach(function (item) {
        resizeObserver.observe(item);
    });
});