$(document).ready(function(){
    var $grid = $('.grid').isotope({
        itemSelector: '.grid-item',
        percentPosition: true,

        masonry: {
            // use outer width of grid-sizer for columnWidth
            columnWidth: '.grid-sizer',
            gutter: 10
        }
    });

    // layout Isotope after each image loads
    $grid.imagesLoaded().progress( function() {
        $grid.isotope('layout');
    });

    $('.filter-button-group').on( 'click', '.btn-filter', function() {
        var $btn = $(this);
        $('.filter-button-group .btn-filter').each(function(i){
            $(this).removeClass('active');
        });
        $btn.addClass('active');
        var filterValue = $btn.data('filter');
        $grid.isotope({ filter: filterValue });
    });

    var hash = (window.location.hash).replace('#', '');
    if (hash.length == 0) {
        //no hash do something
    }
    else {
        //else do something with hash
        $('a[href="#'+hash+'"]').trigger('click');
    }

});