jQuery(document).ready(function($) {

  // init categories content images behaviour
  if($('body').is('.categories')){
    var $diapo = $('<div id="diaporama"></div>');
    $("#categories-content")
      .before($diapo)
      .children('section.projet-block').each(function(index, el) {
        $(this)
          .addClass('projet-'+index)
          .hover(function (e) {
            $diapo.children().removeClass('visible');
            var c = $(this).attr('class').match('projet-[0-9]+');
            console.log("class",c[0]);
            $diapo.children('.'+c[0]).addClass('visible');
          })
          .find('.projet-img')
            .addClass('projet-'+index)
            .appendTo($diapo);
      });
    $diapo.children('.projet-img').first().addClass('visible');
  }



  // init Masonry
  var $grid = $('.grid').masonry({
    itemSelector: '.grid-block'
    // columnWidth: 200
  });
  // layout Masonry after each image loads
  // $grid.imagesLoaded().progress( function() {
  //   $grid.masonry('layout');
  // });



});