function Gallery() {
    this.tag = $('.tags-list .tag');
    this.gridItem = $('.grid .grid-item');
    this.activeTags = ['toate'];
    this.itemsList = [];
    this.activeItems = [];
    this.noItem = false;
    this.init();
}

Gallery.prototype.init = function () {
    this.masonry();
    this.itemsListGen();
};

Gallery.prototype.itemsListGen = function () {
    var _this = this;

    $(this.gridItem).each(function () {

        var tags = $(this).attr('data-tag');
        tags = tags.trim();

        // creates an array of objects with every item's id and tags
        _this.itemsList.push({
            'id': $(this).attr('id'),
            'tags': tags.split(' ')
        });
    });

};

Gallery.prototype.masonry = function () {
    $('.grid').masonry({
        // options
        columnWidth: '.grid-sizer',
        itemSelector: '.grid-item',
        percentPosition: true,
        hash: false

    });
};

Gallery.prototype.tagClick = function (e) {
    e.preventDefault();
    // currentTag has the clicked tag
    var currentTag = $(e.currentTarget).attr('data-tag-slug');
    $(e.currentTarget).toggleClass('active');

    if (this.noItem) {
        $('.no-item').remove();
        this.noItem = false;
    }

    // refresh current filters
    this.refreshTags(currentTag);

    if ($(e.currentTarget).attr('data-tag-slug') === 'toate' || this.activeTags.length < 1) {
        this.showAll();
    } else {

        // return validated items based on filters
        this.returnValidItems();

        // refresh the layout with the current items
        this.refreshMasonry();
    }

    this.refreshGallery();
};

Gallery.prototype.refreshTags = function (e) {
    // checks if the current tag is already active
    // if it's active, it removes it and checks if there is any other active tag or should trigger 'toate'
    // if it's not active, it adds it to the activeTags and removes 'toate'

    if (this.activeTags.includes(e)) {
        this.activeTags.splice(this.activeTags.indexOf(e), 1);

    } else {
        this.activeTags.push(e);

        if (this.activeTags.includes('toate')) {
            this.removeToate();
        }
    }

};

Gallery.prototype.refreshGallery = function () {
    $(document).unbind('click.fb-start');

    var _this = this;
    $(this.gridItem).find('a').attr('data-fancybox', 'galerie');
    for (var i = 0; i < this.activeItems.length; i++) {
        var id = _this.activeItems[i];
        $('#' + id).find('a').attr('data-fancybox', _this.activeTags);
    }

    $(this.gridItem).find('a').fancybox();
};

Gallery.prototype.returnValidItems = function () {
//    debugger;
    var newValidatedItems = [];

    for (var i = 0; i < this.itemsList.length; i++) {
        var itemTags = this.itemsList[i].tags;

        for (var j = 0; j < this.activeTags.length; j++) {
            if (itemTags.includes(this.activeTags[j])) {
                if (!newValidatedItems.includes(this.itemsList[i].id)) {
                    newValidatedItems.push(this.itemsList[i].id);
                }
            } else if (newValidatedItems.includes(this.itemsList[i].id)) {
                newValidatedItems.splice(newValidatedItems.indexOf(this.itemsList[i].id), 1);
                break;
            } else {
                break;
            }
        }
    }

    this.activeItems = newValidatedItems;
    if (this.activeItems.length < 1) {
        this.noItemFound();
    }
};

Gallery.prototype.refreshMasonry = function () {
    $('.grid-item').hide();

    for (var i = 0; i < this.activeItems.length; i++) {
        $('#' + this.activeItems[i]).show();
    }

    $('.grid').masonry();
};

Gallery.prototype.showAll = function () {
    console.log('show all');
    this.activeTags = ['toate'];
    this.activeItems = [];
    $('.grid-item').show();
    $('.tags-list').find('.active').removeClass('active');
    $('.tags-list').find('.toate a').addClass('active');
    $('.grid').masonry();
};

Gallery.prototype.removeToate = function () {
    $('.tags-list li.toate > a').removeClass('active');
    this.activeTags.splice(this.activeTags.indexOf('toate'), 1);
};

Gallery.prototype.noItemFound = function () {
    this.noItem = true;
    $('.grid').prepend('<div class="no-item text-center">Nu există nicio poză conform selecţiei</div>');
};

$(document).ready(function () {
    var gallery = new Gallery();
    $('.tags-list .tag a').on('click', $.proxy(gallery.tagClick, gallery));

});