Isotope/Masonry with Meteor works locally but not on deploy. Possible timing issue?


#1
Template.home.rendered = function() {
    var self = this;
    var $container = $('.gallery');

    $container.imagesLoaded({background: true})
        .always( function( instance ) {
            console.log('all images loaded');
        })
        .done( function( instance ) {
            console.log('all images successfully loaded');
            $container.isotope({
                itemSelector: '.image',
                layoutMode: 'masonry'
            });
            $container.isotope('layout');
        })
        .fail( function() {
            console.log('all images loaded, at least one is broken');
        })
        .progress( function( instance, image ) {
            var result = image.isLoaded ? 'loaded' : 'broken';
            console.log( 'image is ' + result + ' for ' + image.img.src );
        });
};

My Isotope (https://atmospherejs.com/isotope/isotope) ends up getting a height: 0px, so it seems like it’s being initialized too early. I thought that was the whole point of imagesLoaded (https://atmospherejs.com/iamkevingreen/imagesloaded). It works locally but not on deploy where things are slower, so that’s just my hunch, and I don’t know how to resolve it. Haven’t been able to find any good resources for getting Isotope/Masonry to work with Meteor that weren’t outdated, so has anyone been able to get it working recently?

Also welcome to alternatives other than Isotope/Masonry. Was looking at Cast.js but haven’t tried yet.