Sorting and Filtering

//Sorting code
$(document).on('click', '.filterButtonSingle', function (e) {
    e.preventDefault();
    var filter = $(this).attr('data-filter');
    var filterdir = "asc";

    //Icon changes and styling
    $(".filterButtonSingle").find('li').removeClass("currentSelection");
    $(".filterButtonSingle").find('i').addClass('hidden');
    $(this).find('i').removeClass('hidden');
    $(this).find('li').addClass('currentSelection');
    if($(this).find('i').hasClass('bi-arrow-up')){
        $(this).find('i').removeClass('bi-arrow-up').addClass('bi-arrow-down');
        filterdir = "desc";
    } else if($(this).find('i').hasClass('bi-arrow-down')){
        $(this).find('i').removeClass('bi-arrow-down').addClass('bi-arrow-up');
        filterdir = "asc";
    }

    //Sorting
    var cards = $('.card');
    var cardArray = [];
    
    //Create an array of cards
    cards.each(function (index) {
        cardArray.push($(this).parent());
    });

    cardArray.sort(function(a, b) {
        if(filter === 'name') {
            var aText = a.attr('data-subject-name').toLowerCase();
            var bText = b.attr('data-subject-name').toLowerCase();
        } else if(filter === 'date') {
            var aText = a.attr('data-subject-createdate').toLowerCase();
            var bText = b.attr('data-subject-createdate').toLowerCase();
        } else if(filter === 'students') {
            var aText = a.attr('data-subject-enroll-count').toLowerCase();
            var bText = b.attr('data-subject-enroll-count').toLowerCase();
        }
        
        if(filterdir === 'asc') {
            if(aText < bText) { return -1; }
            if(aText > bText) { return 1; }
            return 0;
        } else if(filterdir === 'desc') {
            if(aText > bText) { return -1; }
            if(aText < bText) { return 1; }
            return 0;
        }
    });

    cardArray.forEach(function (card) {
        $("#subjectListCards").append(card);
        console.log(card);
    });
});


//Search code
$("#searchInput").on("keyup", function() {
    var value = $(this).val().toLowerCase();
    $(".card").filter(function() {
        $(this).parent().toggle($(this).text().toLowerCase().indexOf(value) > -1)
    });
});