This is what I'm trying to use now, but still I get the same layout in RTL as in LTR.

masonry-alm.js

var x = document.getElementsByTagName("html")[0].getAttribute("dir");

jQuery(function() {
    var masonryInit = true; // set Masonry init flag
    jQuery.fn.almComplete = function(alm){ // Ajax Load More callback function
        if(jQuery('#masonry-grid').length){
            var $container = jQuery('#masonry-grid ul'); // our container
            if(masonryInit){
                // initialize Masonry only once
                masonryInit = false;

                if ( x == 'rtl') {
                    $container.masonry({
                        itemSelector: '.grid-item',
                        columnWidth: '.grid-item',
                        percentPosition: true,
                        resizesContainer: true,
                        originLeft: false,
                        isRTL: true
                    });
                    console.log('RTL detected');
                } else {
                    $container.masonry({
                        itemSelector: '.grid-item',
                        columnWidth: '.grid-item',
                        percentPosition: true,
                        resizesContainer: true
                    });
                    console.log('RTL not detected');
                }

            }else{
                $container.masonry('reloadItems'); // Reload masonry items after callback
            }
            $container.imagesLoaded( function() { // When images are loaded, fire masonry again.
                $container.masonry();
            });
        }
    };
});