diff --git a/js/isotope.js b/js/isotope.js index edb7c09..ca1fc8b 100644 --- a/js/isotope.js +++ b/js/isotope.js @@ -103,15 +103,20 @@ function isotopeDefinition( Outlayer, getSize, matchesSelector, Item, LayoutMode this.modes[ name ] = new Mode( this ); }; - Isotope.prototype.layout = function( opts ) { - // set any options pass - this.option( opts ); + + Isotope.prototype.layout = function() { + // if first time doing layout, do all magic + if ( !this._isLayoutInited && this.options.isInitLayout ) { + this.magic(); + return; + } + this._layout(); + }; + + // private method to be used in layout() & magic() + Isotope.prototype._layout = function() { // don't animate first layout - var isInstant = this._isInitInstant = this.options.isLayoutInstant !== undefined ? - this.options.isLayoutInstant : !this._isLayoutInited; - // - this.filteredItems = this._filter( this.items ); - this._sort(); + var isInstant = this._getIsInstant(); // layout flow this._resetLayout(); this._manageStamps(); @@ -121,6 +126,27 @@ function isotopeDefinition( Outlayer, getSize, matchesSelector, Item, LayoutMode this._isLayoutInited = true; }; + // filter + sort + layout + Isotope.prototype.magic = function( opts ) { + // set any options pass + this.option( opts ); + this._getIsInstant(); + // where the magic happens, amirite + this.filteredItems = this._filter( this.items ); + this._sort(); + this._layout(); + }; + // alias + Isotope.prototype.filterSortLayout = Isotope.prototype.magic; + + // HACK + // Don't animate/transition first layout + // Or don't animate/transition other layouts + Isotope.prototype._getIsInstant = function() { + var isInstant = this.options.isLayoutInstant !== undefined ? + this.options.isLayoutInstant : !this._isLayoutInited; + return this._isInstant = isInstant; + }; // -------------------------- filter -------------------------- // @@ -155,15 +181,15 @@ function isotopeDefinition( Outlayer, getSize, matchesSelector, Item, LayoutMode } // HACK - // disable transition on init + // disable transition if instant var _transitionDuration = this.options.transitionDuration; - if ( this._isInitInstant ) { + if ( this._isInstant ) { this.options.transitionDuration = 0; } this.reveal( hiddenMatched ); this.hide( visibleUnmatched ); // set back - if ( this._isInitInstant ) { + if ( this._isInstant ) { this.options.transitionDuration = _transitionDuration; } diff --git a/notes.md b/notes.md index b2ceffe..629f1fb 100644 --- a/notes.md +++ b/notes.md @@ -10,6 +10,10 @@ move munge sorter to separate file? updateSortData +## discuss + +Method name for filterSortMagic. Currently .magic() + ## bugs ## misc diff --git a/test/filtering.js b/test/filtering.js index eb34e03..0884ac9 100644 --- a/test/filtering.js +++ b/test/filtering.js @@ -35,7 +35,7 @@ test( 'filtering', function() { equal( ids, '1,2,3,4,5,6,7', 'all items there by default' ); function checkFilter( filter, expectedIDs, message ) { - iso.layout({ filter: filter }); + iso.magic({ filter: filter }); ids = getFilteredItemIDs( iso ); equal( ids, expectedIDs, message || filter ); } @@ -44,7 +44,7 @@ test( 'filtering', function() { checkFilter( '.tall', '3,4,7' ); checkFilter( '.tall.orange', '3,7' ); - iso.layout({ + iso.magic({ filter: function( elem ) { var num = parseInt( getText( elem ), 10 ); return num > 5; @@ -63,7 +63,7 @@ test( 'filtering', function() { checkFilter( ':not(.orange)', '2,4,5' ); checkFilter( '.orange:not(.tall)', '1,6' ); - iso.layout({ + iso.magic({ filter: function() { var num = parseInt( $(this).text(), 10 ); return num > 5; diff --git a/test/layout-complete.js b/test/layout-complete.js index a38a000..caf1861 100644 --- a/test/layout-complete.js +++ b/test/layout-complete.js @@ -14,7 +14,7 @@ test( 'layoutComplete', function() { next(); }); - iso.layout({ + iso.magic({ filter: '.a1' }); }, @@ -24,7 +24,7 @@ test( 'layoutComplete', function() { next(); }); - iso.layout({ + iso.magic({ filter: '.b2' }); }, @@ -34,7 +34,7 @@ test( 'layoutComplete', function() { next(); }); - iso.layout({ + iso.magic({ sortBy: 'random' }); }, @@ -44,13 +44,13 @@ test( 'layoutComplete', function() { next(); }); - iso.layout({ + iso.magic({ filter: '.a2', transitionDuration: '0.6s' }); setTimeout( function() { - iso.layout({ + iso.magic({ filter: '.b2' }); }, 300 ); diff --git a/test/sorting.js b/test/sorting.js index 8e8cfa3..9f5f3b4 100644 --- a/test/sorting.js +++ b/test/sorting.js @@ -25,7 +25,7 @@ test( 'sorting', function() { sortBy: 'number' }); - iso.layout({ sortBy: 'letter' }); + iso.magic({ sortBy: 'letter' }); var texts = getItemsText( iso ); @@ -48,12 +48,12 @@ test( 'sorting', function() { equal( getItemsText( iso ), 'A1,A2,A3,A4,B1,B2,B4', 'sortBy array' ); - iso.layout({ + iso.magic({ sortAscending: false }); equal( getItemsText( iso ), 'B4,B2,B1,A4,A3,A2,A1', 'sortAscending false' ); - iso.layout({ + iso.magic({ sortAscending: { letter: true, number: false