//portfolio
let isotope;
let selector;
$(window).load(function () {
    $portfolio_selectors = $('.sort-list-filter >li>a');
    $portfolio_add_selectors = $('.sort-list-filter >li > a.additional-filter');
    $portfolio_sorters = $('.sort-list-sorting > li > a');
    if ($portfolio_selectors != 'undefined') {
        $portfolio = $('.sort-list-items');
        isotope = $portfolio.isotope({
            itemSelector: 'li',
            layoutMode: 'masonry',
            getSortData: {
                name: '.name',
                date: '.date parseInt'
            }
        });
        $portfolio_selectors.on('click', function () {
            if ($(this).hasClass("additional-filter")) {
                $portfolio_add_selectors.removeClass('active');
                $(this).addClass('active');
                selector = $('.sort-list-filter > li > a.active:not(.additional-filter)').attr('data-filter') + $(this).attr('data-filter');
            } else {
                changeSelector($(this));
            }
            $portfolio.isotope({filter: selector});
            return false;
        });
        $portfolio_sorters.on('click', function () {
            const prevSort = $('.sort-list-sorting > li > a.active');
            $portfolio_sorters.removeClass('active');
            $('.fa', $portfolio_sorters).remove();
            $(this).addClass('active');

            let sortBy = $(this).attr('data-sort');
            let sortAsc = $(this).attr('data-asc') === 'true';
            console.log(sortAsc);
            if (prevSort.attr('data-sort') === sortBy) {
                sortAsc = !sortAsc;
                $(this).attr('data-asc', sortAsc);
                console.log(sortAsc);
            }

            if (sortAsc) {
                $(this).append(' <i class="fa fa-arrow-up"></i>');
            } else {
                $(this).append(' <i class="fa fa-arrow-down"></i>');
            }

            $portfolio.isotope({
                sortBy: sortBy,
                sortAscending: sortAsc
            });
            return false;
        });
    }
    $('.sort-list-filter > li > a.active').click();
});

window.addEventListener('popstate', function (e) {
    const filter = e.state !== '' ? '.' + e.state : '*';
    const el = $('.sort-list-filter > li > a[data-filter="' + filter + '"]');
    el.click();
});

function changeSelector(el) {
    $portfolio_selectors = $('.sort-list-filter > li > a');
    $portfolio_selectors.removeClass('active').blur();
    el.addClass('active');
    if (history.pushState) {
        const category = el.attr('data-filter').substr(1);
        history.pushState(category, category, '/projects/' + category);
    }
    selector = el.attr('data-filter');
    $('.sort-list-items').isotope({filter: selector});
}

autoHeight();

function autoHeight() {
    $('.sort-list-item').each(function () {
        $(this).css('height', $(this).outerHeight() + 40);
    });
}

$(document).ready(function() {
    $('.vote-btn').each((el) => {
        console.log(el);
    });
});