(function ( $ ) { $.fn.mpmansory = function ( options ) { var settings = $.extend({ childrenClass: '', breakpoints: { lg: 3, md: 3, sm: 6, xs: 12 }, distributeBy: { attr: 'data-order', attrOrder: 'asc', order: false, height: false }, onload: function ( items ) { return true; } }, options); Array.min = function( array ){ return Math.min.apply( Math, array ); }; $.emptyArray = function ( array ) { for (var i = 0; i'); wrap.addClass(classStr); $(this).append(wrap); cols.push(wrap); } return cols; } $.fn.distributeItemsByHeight = function ( wrappers, items ) { /* * @params [Array] {wrappers} - the array containing the columns elements * @params [Array] {items} - the array containing items * @description - distribute the items through the columns - to the columns with lowest height */ var counter = 0; for (var k = 0; k 1200) { return 'lg'; } else if ($(window).width() > 972) { return 'md'; } else if ($(window).width() > 720) { return 'sm'; } else if ($(window).width() > 480) { return 'xs'; } else if ($(window).width() > 320) { return 'xs'; } else { return 'xs'; } } $.fn.distributeItemsByOrder = function ( wrappers, items ) { /* * @params [Array] {wrappers} - the array containing the columns elements * @params [Array] {items} - the array containing items * @description - distribute the items through the columns - to the columns with lowest height */ var counter = 0; for (var k = 0; k 1) { if (counter2 == items[i].length) counter2 = 0; wrappers[counter].append($(items[i][counter2])); counter2++; } else { wrappers[counter].append($(items[i])); } counter++; } } $.fn.apply = function ( settings, nrOfColumns, wrappers, items ) { var _this = $(this); var currentSize = _this.getCurrentColumnSize(); var columns = nrOfColumns; //find number of columns //build the bootstrap class string var classStr = "col-lg-" + settings.breakpoints.lg + " col-md-"+settings.breakpoints.md + " col-sm-" + settings.breakpoints.sm + " col-xs-" + settings.breakpoints.xs + " " + settings.columnClasses; wrappers = $(this).initialize( columns, classStr ); //create columns'white if ( settings.distributeBy.order ) { _this.distributeItemsByOrder( wrappers, items); //apply mansory } else if ( settings.distributeBy.height ) { _this.distributeItemsByHeight( wrappers, items); //apply mansory } else if ( settings.distributeBy.attr ) { _this.distributeItemsByAttr( wrappers, _this.orderItemsByAttr(items, settings.distributeBy), settings.distributeBy); } return { wrappers: wrappers, items: items }; } return this.each(function () { var _this = $(this); var currentSize = _this.getCurrentColumnSize(); var numberOfColumns = 12 / settings.breakpoints[currentSize]; var items = _this.children( (settings.childrenClass != '' ? '.'+settings.childrenClass : 'div') ); var wrappers = new Array(); var returns = _this.apply( settings, numberOfColumns, wrappers, items ); wrappers = returns.wrappers; $(window).on('resize', function ( e ) { if (_this.getCurrentColumnSize() != currentSize ) { numberOfColumns = 12 / settings.breakpoints[_this.getCurrentColumnSize()]; wrappers = $.emptyArray(wrappers); returns = _this.apply( settings , numberOfColumns, wrappers, items); wrappers = returns.wrappers; currentSize = _this.getCurrentColumnSize(); } }); if (settings.hasOwnProperty('onload')) { //execute on load settings.onload( items ); } }); } })(jQuery);