New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

v3.0.0 cuts last element before moving it to the next row #46

Closed
luopio opened this Issue Oct 20, 2014 · 4 comments

Comments

Projects
None yet
2 participants
@luopio

luopio commented Oct 20, 2014

Everything works beautifully in 2.1.1. I'm testing by using the same layout, same JS code and just switching between release 3.0.0 and 2.1.1:

$('.properties-listing-container').shuffle({
itemSelector: '.property-listing',
columnWidth: 300,
gutterWidth: 20
});

Container is a div with article-elements inside. Article has fixed width of 300px.

v2.1.1 works correctly:
v2 1 1

v3.0.0 won't update until around 1160px container width, which results in cutting the last element. Also note the behaviour on second line.
v3 0 0

Same thing happens in FF (33) and Chrome on Ubuntu 14.04. Also witnessed on Mac by other devs in my team.

@Vestride

This comment has been minimized.

Show comment
Hide comment
@Vestride

Vestride Oct 20, 2014

Owner

Could you post a link to your demo please.

On Monday, October 20, 2014, Lauri Kainulainen notifications@github.com
wrote:

Everything works beautifully in 2.1.1. I'm testing by using the same
layout, same JS code and just switching between release 3.0.0 and 2.1.1:

$('.properties-listing-container').shuffle({
itemSelector: '.property-listing',
columnWidth: 300,
gutterWidth: 20
});

Container is a div with article-elements inside. Article has fixed width
of 300px.

v2.1.1 works correctly:
[image: v2 1 1]
https://cloud.githubusercontent.com/assets/69383/4697414/a9aef03a-5825-11e4-950c-aa1cf58483d2.png

v3.0.0 won't update until around 1160px container width, which results in
cutting the last element. Also note the behaviour on second line.
[image: v3 0 0]
https://cloud.githubusercontent.com/assets/69383/4697413/a9ab725c-5825-11e4-8421-7400f35fd650.png

Same thing happens in FF (33) and Chrome on Ubuntu 14.04. Also witnessed
on Mac by other devs in my team.


Reply to this email directly or view it on GitHub
#46.

Sent with my thumbs

Owner

Vestride commented Oct 20, 2014

Could you post a link to your demo please.

On Monday, October 20, 2014, Lauri Kainulainen notifications@github.com
wrote:

Everything works beautifully in 2.1.1. I'm testing by using the same
layout, same JS code and just switching between release 3.0.0 and 2.1.1:

$('.properties-listing-container').shuffle({
itemSelector: '.property-listing',
columnWidth: 300,
gutterWidth: 20
});

Container is a div with article-elements inside. Article has fixed width
of 300px.

v2.1.1 works correctly:
[image: v2 1 1]
https://cloud.githubusercontent.com/assets/69383/4697414/a9aef03a-5825-11e4-950c-aa1cf58483d2.png

v3.0.0 won't update until around 1160px container width, which results in
cutting the last element. Also note the behaviour on second line.
[image: v3 0 0]
https://cloud.githubusercontent.com/assets/69383/4697413/a9ab725c-5825-11e4-8421-7400f35fd650.png

Same thing happens in FF (33) and Chrome on Ubuntu 14.04. Also witnessed
on Mac by other devs in my team.


Reply to this email directly or view it on GitHub
#46.

Sent with my thumbs

@luopio

This comment has been minimized.

Show comment
Hide comment
@luopio

luopio Oct 20, 2014

Didn't have a demo I could publish, but here's one now: http://jsfiddle.net/luopio/oo63amox/1/. If you make the result window smaller, it'll allow the last element to cut before moving it to row 2.

luopio commented Oct 20, 2014

Didn't have a demo I could publish, but here's one now: http://jsfiddle.net/luopio/oo63amox/1/. If you make the result window smaller, it'll allow the last element to cut before moving it to row 2.

@Vestride

This comment has been minimized.

Show comment
Hide comment
@Vestride

Vestride Oct 20, 2014

Owner

Thanks, for the demo, I see what the issue is. The COLUMN_THRESHOLD value is too high at 0.3.

I had added this buffer value because reading the width of elements isn't precise enough and was causing columns to jump between values. I do not remember why I set it so high though. I'll need to play around with this value. Maybe it should be customizable too.

Owner

Vestride commented Oct 20, 2014

Thanks, for the demo, I see what the issue is. The COLUMN_THRESHOLD value is too high at 0.3.

I had added this buffer value because reading the width of elements isn't precise enough and was causing columns to jump between values. I do not remember why I set it so high though. I'll need to play around with this value. Maybe it should be customizable too.

@Vestride

This comment has been minimized.

Show comment
Hide comment
@Vestride

Vestride Mar 24, 2015

Owner

Released v3.1.0. There is now a new option columnThreshold and updated logic to retrieve non-integer widths of elements.

Owner

Vestride commented Mar 24, 2015

Released v3.1.0. There is now a new option columnThreshold and updated logic to retrieve non-integer widths of elements.

@Vestride Vestride closed this Mar 24, 2015

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment