Browse Source

clean up setupAtoms, addAtoms, insert methods

pull/14/head
David DeSandro 14 years ago
parent
commit
328f3086f0
  1. 67
      src/jquery.molequul-widget.js

67
src/jquery.molequul-widget.js

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

Loading…
Cancel
Save