mirror of https://github.com/metafizzy/isotope
Filter & sort magical layouts
http://isotope.metafizzy.co
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
42 lines
1.1 KiB
42 lines
1.1 KiB
var Isotope = window.Isotope = require('../../js/isotope'); |
|
var $ = require('jquery'); |
|
require('jquery-bridget'); |
|
|
|
// enable $().isotope() plugin |
|
$.bridget( 'isotope', Isotope ); |
|
|
|
var $container = $('#container').isotope({ |
|
layoutMode: 'fitRows', |
|
transitionDuration: '0.8s', |
|
cellsByRow: { |
|
columnWidth: 130, |
|
rowHeight: 140 |
|
}, |
|
getSortData: { |
|
number: '.number parseInt', |
|
symbol: '.symbol', |
|
name: '.name', |
|
category: '[data-category]', |
|
weight: function( itemElem ) { |
|
// remove parenthesis |
|
return parseFloat( $(itemElem).find('.weight').text().replace( /[\(\)]/g, '') ); |
|
} |
|
} |
|
}); |
|
|
|
$('#options').on( 'click', 'button', function( event ) { |
|
var $target = $( event.target ); |
|
var key = $target.parent().attr('data-isotope-key'); |
|
var value = $target.attr('data-isotope-value'); |
|
|
|
if ( key === 'filter' && value === 'number-greater-than-50' ) { |
|
value = function( elem ) { |
|
var numberText = $( elem ).find('.number').text(); |
|
return parseInt( numberText, 10 ) > 40; |
|
}; |
|
} |
|
console.log( key, value ); |
|
var opts = {}; |
|
opts[ key ] = value; |
|
$container.isotope( opts ); |
|
});
|
|
|