Skip to content

Commit

Permalink
use once
Browse files Browse the repository at this point in the history
  • Loading branch information
@desandro
desandro committed Nov 10, 2015
1 parent 8ebfd53 commit 025a681
Show file tree
Hide file tree
Showing 7 changed files with 22 additions and 48 deletions.
18 changes: 5 additions & 13 deletions js/packery.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -331,15 +331,9 @@ Packery.prototype._bindFitEvents = function( item ) {
_this.dispatchEvent( 'fitComplete', null, [ item ] );
}
// when item is laid out
item.on( 'layout', function() {
tick();
return true;
});
item.once( 'layout', tick );
// when all items are laid out
this.on( 'layoutComplete', function() {
tick();
return true;
});
this.once( 'layoutComplete', tick );
};

// -------------------------- resize -------------------------- //
Expand Down Expand Up @@ -429,15 +423,15 @@ Packery.prototype.itemDragEnd = function( elem ) {
var onLayoutComplete = this._getDragEndLayoutComplete( elem, item );

if ( item.needsPositioning ) {
item.on( 'layout', onLayoutComplete );
item.once( 'layout', onLayoutComplete );
item.moveTo( item.placeRect.x, item.placeRect.y );
} else if ( item ) {
// item didn't need placement
item.copyPlaceRectPosition();
}

this.clearDragTimeout();
this.on( 'layoutComplete', onLayoutComplete );
this.once( 'layoutComplete', onLayoutComplete );
this.layout();

};
Expand All @@ -458,7 +452,7 @@ Packery.prototype._getDragEndLayoutComplete = function( elem, item ) {
completeCount++;
// don't proceed if not complete
if ( completeCount != asyncCount ) {
return true;
return;
}
// reset item
if ( item ) {
Expand All @@ -475,8 +469,6 @@ Packery.prototype._getDragEndLayoutComplete = function( elem, item ) {
if ( itemNeedsPositioning ) {
_this.dispatchEvent( 'dragItemPositioned', null, [ item ] );
}
// listen once
return true;
};
};

Expand Down
7 changes: 2 additions & 5 deletions test/unit/consecutive.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,31 +13,28 @@ test( 'consecutive', function() {
i1.style.height = '28px';
i1.style.background = 'blue';

pckry.on( 'layoutComplete', function() {
pckry.once( 'layoutComplete', function() {
ok( true, 'layoutComplete triggered' );
equal( i3.style.left, '0px', 'i3.style.left' );
equal( i3.style.top, '20px', 'i3.style.top' );
after( then, fit1 );
return true;
});

stop();
pckry.layout();
var then = true;

function fit1() {
pckry.on( 'layoutComplete', function() {
pckry.once( 'layoutComplete', function() {
equal( i3.style.left, '60px', 'i3.style.left' );
equal( i3.style.top, '30px', 'i3.style.top' );
// all done
start();
return true;
});
i0.style.width = '38px';
i0.style.height = '38px';
i0.style.background = 'orange';
pckry.layout();
return true;
}

});
Expand Down
3 changes: 1 addition & 2 deletions test/unit/defaults-empty.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,11 +11,10 @@ test( 'defaults / empty', function() {
equal( Packery.data( empty ), pckry, 'data method returns instance' );
ok( pckry.isResizeBound, 'isResizeBound' );

pckry.on( 'layoutComplete', function( items ) {
pckry.once( 'layoutComplete', function( items ) {
ok( true, 'layoutComplete triggered with no items' );
equal( items.length, 0, 'no items' );
start();
return true; // bind once
});
stop();
// add gutter, to check that container size doesn't get negative number
Expand Down
12 changes: 4 additions & 8 deletions test/unit/draggable.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ test( 'draggable', function() {
var dragElem = container.querySelector('.dragger');

// simulate drag to middle
pckry.on( 'layoutComplete', function() {
pckry.once( 'layoutComplete', function() {
equal( true, true, 'layout complete did trigger' );
var itemElems = container.querySelectorAll('.item');
equal( itemElems[1].style.left, '55px', '2nd item x' );
Expand All @@ -26,21 +26,19 @@ test( 'draggable', function() {
equal( pckry.items[2].element, dragElem, 'dragged elem in now 3rd in items' );
// trigger the next thing
after( then1, dragOutside );
return true; // bind once
});
stop();
simulateDrag( dragElem, pckry, 35, 15 );
var then1 = true;

function dragOutside() {
pckry.on( 'dragItemPositioned', function() {
pckry.once( 'dragItemPositioned', function() {
equal( true, true, 'dragItemPositioned event did trigger' );
equal( dragElem.style.left, '60px', 'dragged 3rd item x, aligned inside container' );
equal( dragElem.style.top, '0px', 'dragged 3rd item y, aligned inside container' );
equal( pckry.items[3].element, dragElem, 'dragged elem in now 4th in items' );
// the next thing
after( then2, dragWithGrid );
return true; // bind once
});

simulateDrag( dragElem, pckry, 300, -30 );
Expand All @@ -51,24 +49,22 @@ test( 'draggable', function() {
pckry.options.columnWidth = 25;
pckry.options.rowHeight = 25;
pckry._getMeasurements();
pckry.on( 'dragItemPositioned', function() {
pckry.once( 'dragItemPositioned', function() {
equal( dragElem.style.left, '25px', 'dragged 3rd item x, aligned to grid' );
// TODO, this should be 50px
equal( dragElem.style.top, '50px', 'dragged 3rd item y, aligned to grid' );
// the next thing
after( then3, dragOutsideWithGrid );
return true; // bind one
});
simulateDrag( dragElem, pckry, 35, 160 );
var then3 = true;
}

function dragOutsideWithGrid() {
pckry.on( 'dragItemPositioned', function() {
pckry.once( 'dragItemPositioned', function() {
equal( dragElem.style.left, '50px', 'dragged 3rd item x, aligned inside container, with grid' );
equal( dragElem.style.top, '0px', 'dragged 3rd item y, aligned inside container' );
start();
return true; // bind once
});
simulateDrag( dragElem, pckry, 300, -30 );
}
Expand Down
18 changes: 6 additions & 12 deletions test/unit/fit.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,20 +34,18 @@ test( '.fit()', function() {
after( then1, fit2 );
}

pckry.on( 'fitComplete', function( item ) {
pckry.once( 'fitComplete', function( item ) {
ok( true, 'fitComplete event emitted' );
equal( item, item3, 'item argument returned' );
equal( elem3.style.left, '30px', 'elem3.style.left = 30px' );
isFit = true;
ready1();
return true;
});

pckry.on( 'layoutComplete', function() {
pckry.once( 'layoutComplete', function() {
ok( true, 'layoutComplete event emitted' );
isLaidOut = true;
ready1();
return true;
});

// fit it
Expand All @@ -70,20 +68,18 @@ test( '.fit()', function() {
elem3.style.width = '18px';
elem3.style.height = '18px';

pckry.on( 'fitComplete', function() {
pckry.once( 'fitComplete', function() {
ok( true, 'fitComplete event emitted' );
equal( elem3.style.left, '40px', 'elem3.style.left = 40px' );
equal( elem3.style.top, '20px', 'elem3.style.top = 20px' );
isFit = true;
ready2();
return true;
});

pckry.on( 'layoutComplete', function() {
pckry.once( 'layoutComplete', function() {
ok( true, 'layoutComplete event emitted' );
isLaidOut = true;
ready2();
return true;
});

pckry.fit( elem3, 40, 20 );
Expand All @@ -103,18 +99,16 @@ test( '.fit()', function() {

var then3;
function fit3() {
pckry.on( 'fitComplete', function() {
pckry.once( 'fitComplete', function() {

equal( elem3.style.left, '60px', 'x value limited' );
equal( elem3.style.top, '120px', 'y value NOT limited' );
isFit = true;
ready3();
return true;
});
pckry.on( 'layoutComplete', function() {
pckry.once( 'layoutComplete', function() {
isLaidOut = true;
ready3();
return true;
});
// try to position item outside container
pckry.fit( elem3, 120, 120 );
Expand Down
9 changes: 3 additions & 6 deletions test/unit/grid.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,10 +37,9 @@ test( 'layout with columnWidth and rowHeight', function() {

pckry.options.columnWidth = gridSizer;
pckry.options.rowHeight = gridSizer;
pckry.on( 'layoutComplete', function() {
pckry.once( 'layoutComplete', function() {
checkPackeryGrid( pckry );
after( then1, setGutter );
return true; // bind once
});
stop();
pckry.layout();
Expand All @@ -50,10 +49,9 @@ test( 'layout with columnWidth and rowHeight', function() {

function setGutter() {
pckry.options.gutter = container.querySelector('.gutter-sizer');
pckry.on( 'layoutComplete', function() {
pckry.once( 'layoutComplete', function() {
checkPackeryGrid( pckry );
after( then2, setPercentageGrid );
return true; // bind once
});
pckry.layout();
var then2 = true;
Expand All @@ -62,10 +60,9 @@ test( 'layout with columnWidth and rowHeight', function() {

function setPercentageGrid() {
gridSizer.style.width = '40%';
pckry.on( 'layoutComplete', function() {
pckry.once( 'layoutComplete', function() {
checkPackeryGrid( pckry );
start();
return true; // bind once
});
pckry.layout();
equal( pckry.columnWidth, 32, 'columnWidth is set from element width, in percentage' );
Expand Down
3 changes: 1 addition & 2 deletions test/unit/layout.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ test( 'layout', function() {
elem0.style.width = '18px';
elem3.style.height = '58px';
var items = pckry._getItemsForLayout( pckry.items );
pckry.on( 'layoutComplete', function( completeItems ) {
pckry.once( 'layoutComplete', function( completeItems ) {
equal( true, true, 'layoutComplete event did fire' );
equal( completeItems.length, items.length, 'event-emitted items matches layout items length' );
strictEqual( completeItems[0], items[0], 'event-emitted items has same first item' );
Expand All @@ -36,7 +36,6 @@ test( 'layout', function() {
checkItemPosition( elem2, 40, 0, '3nd item' );

setTimeout( checkHorizontal, 10 );
return true;
});

stop();
Expand Down

0 comments on commit 025a681

Please sign in to comment.