$(document).ready(function() {
    // Has the animation played yet?
    var animPlayed = false;

    $('div#mainContainer').scroll(function() {

        // Detecting if our element has scrolled into view.
        function elementScrolled(elem) {
            var docViewTop = $(window).scrollTop();
            var docViewBottom = docViewTop + $(window).height();
            var elemTop = $(elem).offset().top;
            return ((elemTop <= docViewBottom) && (elemTop >= docViewTop));
        }

        // Start the animation.
        function playAnimation(){
            lottie.loadAnimation(params);
        }

        // If scrolled into view, call the animation function only once.
        if(elementScrolled('.arrow--anim')) {
            if(!animPlayed){
                var animPlayed = true;
                setTimeout(playAnimation, 500);
            }
        }
    });
});