var $cards = $('#items .full-works');
var $card = $('#items .card');
var $cat = $('.cat-list .cat a');
var $img = $('.item #items .img');

function masonry() {
    var $grid = $cards.masonry({
        itemSelector: '.card',
        columnWidth: '.card',
        percentPosition: true,
        gutter: 10,
        transitionDuration: '0.2s'
    });
    var $grid2 = $img.masonry({
        itemSelector: '.img-card',
        columnWidth: '.img-card',
        percentPosition: true,
        gutter: 10,
        transitionDuration: '0.2s'
    });
    $grid.imagesLoaded().progress(function() {
        $grid.masonry();
    });
    $grid2.imagesLoaded().progress(function() {
        $grid2.masonry();
    });
}

function filteritem() {
    var $container = $('#masonryContainer');

    $cards.multipleFilterMasonry({
        itemSelector: '.card',
        filtersGroupSelector: '.cat-list'
    });
}

function contact() {
    var $contact = $('header .contact');

    $contact.on('click', function() {
        if ($(this).hasClass('open')) {
            $(this).removeClass('open');
            $(this).addClass('close');
        } else {
            $(this).addClass('open');
            $(this).removeClass('close');
        }
    })
}

function customscroll() {
  var $page = $('#page-wrapper.blog')
  var $page_item = $("body.blog #start, body.item");

  $("body").mCustomScrollbar({
      theme: "dark",
      scrollbarPosition: "outside",
      callbacks: {
          whileScrolling: function() {
              var pct = this.mcs.topPct;
              if (pct < 1) {
                $page.addClass("up");
                $page.removeClass("down");
              } else {
                $page.removeClass("up");
                $page.addClass("down")
              }
          }
      }
  });

  $page_item.mCustomScrollbar({
    theme: "dark",
    scrollbarPosition: "outside",
    scrollInertia: 1000,
  });
}

function scrolltop() {
  var $top = $('.top');

  $top.on('click', function(e) {
    // e.preventDefault()

  })
}

jQuery(document).ready(function($) {
    masonry();
    filteritem();
    contact();
    customscroll();
    // scrolltop();

    // $(window).load(function() {
    //     $('html, body').scrollTop(0);
    // });

});