diff --git a/src/jquery.molequul-widget.js b/src/jquery.molequul-widget.js index 9e4d58e..6bdd092 100644 --- a/src/jquery.molequul-widget.js +++ b/src/jquery.molequul-widget.js @@ -78,16 +78,14 @@ // sorting var originalOrderSorter = { - 'original-order' : function( $elem ) { - return this.elemCount; + 'original-order' : function( $elem, instance ) { + return instance.elemCount; } }; - this.options.getSortData = $.extend( originalOrderSorter, this.options.getSortData ); - + this.options.getSortData = $.extend( this.options.getSortData, originalOrderSorter ); this._setupAtoms( this.atoms.$all ); - this.atoms.$all.molequul( '_setupAtoms' ); // get top left position of where the bricks should be @@ -103,15 +101,10 @@ instance.$elem.addClass( instance.options.containerClass ); }, 0 ); - // console.log( this.options.layoutMode ) - // do any layout-specific setup this.width = this.$elem.width(); this._getMasonryColCount(); - // save data - // this.data( 'molequul', props ); - // bind resize method if ( this.options.resizeable ) { $(window).bind('smartresize.molequul', function() { instance.$elem.molequul('resize') } ); @@ -130,8 +123,6 @@ // after it has already been initialized. _init : function( callback ) { - // this.options = $.extend( true, Molequul.options, this.options ); - // check if watched properties are new var instance = this; $.each( [ 'filter', 'sortBy', 'sortDir' ], function( i, propName ){ @@ -181,6 +172,20 @@ // ====================== Adding ====================== _addSortData : function( $atoms ) { + + }, + + _setupAtoms : function( $atoms ) { + + // base style for atoms + var atomStyle = { position: 'absolute' }; + if ( this.usingTransforms ) { + atomStyle.left = 0; + atomStyle.top = 0; + } + + $atoms.css( atomStyle ); + var instance = this; $atoms.each(function(){ var $this = $(this), @@ -189,28 +194,14 @@ key; // get value for sort data based on fn( $elem ) passed in for ( key in getSortData ) { - sortData[ key ] = getSortData[ key ]( $this ); + sortData[ key ] = getSortData[ key ]( $this, instance ); } // apply sort data to $element $this.data( 'molequul-sort-data', sortData ); // increment element count + // console.log( instance.elemCount ) instance.elemCount ++; }); - }, - - _setupAtoms : function( $atoms ) { - - // base style for atoms - var atomStyle = { position: 'absolute' }; - if ( this.usingTransforms ) { - atomStyle.left = 0; - atomStyle.top = 0; - } - - $atoms.css( atomStyle ); - - // add sort data to each elem - this._addSortData( $atoms ); // return this.molequul( 'addSortData', props ).css( atomStyle ); }, @@ -513,7 +504,8 @@ reLayout : function( callback ) { - this + console.log('relaying out', this.atoms.$filtered.length ) + return this [ '_' + this.options.layoutMode + 'ResetLayoutProps' ]() .layout( this.atoms.$filtered, callback ) }, @@ -521,19 +513,26 @@ // ====================== Convenience methods ====================== // adds a jQuery object of items to a molequul container - add : function( $content ) { + addAtoms : function( $content ) { var $newAtoms = this._filterFind( $content, this.options.itemSelector ); this._setupAtoms( $newAtoms ); // add new atoms to atoms pools this.atoms.$all = this.atoms.$all.add( $newAtoms ); - this.atoms.$filtered = this.atoms.$filtered.add( $newAtoms ); - return this; + // this.atoms.$filtered = this.atoms.$filtered.add( $newAtoms ); + return $newAtoms; }, // convienence method for adding elements properly to any layout - insert : function( $content ) { + insert : function( $content, callback ) { this.$elem.append( $content ); - return this.add( $content )._init(); + + var $newAtoms = this.addAtoms( $content ), + $filteredAtoms = this._filter( $newAtoms ); + + this.atoms.$filtered = this.atoms.$filtered.add( $filteredAtoms ); + + this._sort().reLayout( callback ); + }, // convienence method for working with Infinite Scroll