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.
43 lines
1.1 KiB
43 lines
1.1 KiB
10 years ago
|
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 );
|
||
|
|
});
|