combine filtrers

This commit is contained in:
e-lie 2018-09-01 19:53:24 +00:00 committed by elie
parent 9fa5ecd854
commit 6c6800e83a
2 changed files with 9 additions and 5 deletions

View file

@ -110,10 +110,12 @@
transitionDuration: 200 transitionDuration: 200
}); });
filterByClassAndName = function(filterClass) { filterByClassAndName = function() {
var input = jQuery("#filter-app-cards").val().toLowerCase(); var input = jQuery("#filter-app-cards").val().toLowerCase();
var stringMatch = (jQuery(this).find('.app-title').text().toLowerCase().indexOf(input) > -1); var stringMatch = (jQuery(this).find('.app-title').text().toLowerCase().indexOf(input) > -1);
var classMatch = jQuery(this).hasClass(filterClass);
var filterClass = jQuery("#dropdownFilter").attr("data-filter");
var classMatch = (filterClass === '*') ? true : jQuery(this).hasClass(filterClass);
return stringMatch && classMatch; return stringMatch && classMatch;
}, },
@ -121,10 +123,12 @@
cardGrid.isotope({ filter: '.official' }); cardGrid.isotope({ filter: '.official' });
jQuery('.dropdownFilter').on('click', function() { jQuery('.dropdownFilter').on('click', function() {
cardGrid.isotope({ filter: filterByClassAndName });
// change dropdown label // change dropdown label
jQuery('#app-cards-list-filter-text').text(jQuery(this).find('.menu-item').text()); jQuery('#app-cards-list-filter-text').text(jQuery(this).find('.menu-item').text());
// change filter attribute
jQuery('#dropdownFilter').attr("data-filter", jQuery(this).attr("data-filter"));
cardGrid.isotope({ filter: filterByClassAndName });
}); });
jQuery("#filter-app-cards").on("keyup", function() { jQuery("#filter-app-cards").on("keyup", function() {

View file

@ -22,7 +22,7 @@
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span id="app-cards-list-filter-text">Only official apps</span> <span class="caret"></span> <span id="app-cards-list-filter-text">Only official apps</span> <span class="caret"></span>
</button> </button>
<ul id="dropdownFilter" class="dropdown-menu" role="menu"> <ul id="dropdownFilter" class="dropdown-menu" data-filter="official" role="menu">
<li class="button dropdownFilter" data-filter="official"><a class="menu-item" role="menu-item" tabindex="-1">Only official apps</a></li> <li class="button dropdownFilter" data-filter="official"><a class="menu-item" role="menu-item" tabindex="-1">Only official apps</a></li>
<li role="presentation" class="button dropdownFilter" data-filter="working"><a class="menu-item" role="menu-item" tabindex="-1">Only working apps</a></li> <li role="presentation" class="button dropdownFilter" data-filter="working"><a class="menu-item" role="menu-item" tabindex="-1">Only working apps</a></li>
<li role="presentation" class="button dropdownFilter" data-filter="*"><a class="menu-item" role="menu-item" tabindex="-1">All apps</a></li> <li role="presentation" class="button dropdownFilter" data-filter="*"><a class="menu-item" role="menu-item" tabindex="-1">All apps</a></li>