Make work with Views Infinite Scroll

Use this patch in conjunction with the one here: #1806628: Support Masonry module

Works well with #1806628-13: Support Masonry module

Both patches work perfectly. Thanks for your efforts.

Both patches work here too - much appreciated!

Dear BWPanda,

I used "Masonry Views" 7.x-1.0 and Masonry API 7.x-2.0 with Infinite Scroll but it dont works. Infinite Scroll is inactive then.

Then i used "Masonry Views" from git (http://drupalcode.org/project/masonry.git/tree/e5b3dff) and Masonry API 7.x-2.x-dev but here i cant activate the Masonry style in Views. I choose "Masonry Grid" and apply then but its automatic "not selected" after "Apply". I cant see in setting, i dont get an error, nothing, I can not choose or activate it.

Is this nomal?

I'm re-opening this with a new patch for 7.x-2.x. This patch is slightly more generic and works great with Views Infinite Scroll after applying the new patch at #1806628-44: Support Masonry module.

Tested #12 patch and #1806628-44: Support Masonry module and now it works like a charm.

Patch in #12 works fine with Masonry 2.x.

As of Masonry 3.1.1, $container.masonry('reload'); needs to become $container.masonry('reloadItems');

attention if #2022371: Support for Masonry 3.0? get's pulled in please make sure to modify

      $container.bind('change', function() {
        $container.masonry('reload');
      });

to

      $container.bind('change', function() {
        $container.masonry('reloadItems');
      });

If I make this change, scrolling down on the page is fine, but scrolling back up doesn't work - some of the items get stacked on top of each other. I think "reload" is preferable over "reloadItems," at least in my case.

there is no reload anymore in 3.x see http://masonry.desandro.com/methods.html for reference. that change will only be needed as soon as #2022371: Support for Masonry 3.0? get's pulled in.

Thanks Andre-B. It's working for the most part, but I'm having two issues:

1. Scrolling down, everything is fine. Scrolling up, things get a little wacky.
2. Refreshing the page doesn't seem to give the masonry items enough space, but clearing the site cache does.

This issues may or may not be related to this particular ticket, I may look around to see what others have done, but at least it's working for the most part.

Updated issue summary.

#12 +1 works!

Just a note as I was scratching my head on this one...

if using masonry-1.x, need to uninstall and 1.x and install 2.x. Drush up won't update automatically.

Both patches work beautifully. Thanks for your efforts.

1806628-44 / 1808018-12 like everyone mentioned works well.

The patches provided by #12 works perfectly. Thanks!

1) https://drupal.org/comment/7683411#comment-7683411 (#12)
2) https://drupal.org/comment/7683407#comment-7683407 (#44)

Testing environment:

Masonry API - 7.x-2.0
Masonry Views - 7.x-1.0
Drupal - 7.26
Views Infinite Scroll - 7.x-1.1

I was having issues with the layout after load since the images weren't being added after the change event was fired, the js ignored if the user selected to load images first, so lost the benefit of masonry, the layout would have to be reloaded. I also tried adding a few comments to file itself.

Missed the last bracket.

Thanks a lot !

perfect result with
patch on https://drupal.org/comment/8472445#comment-8472445 (V2 on #24)
+ patch on https://drupal.org/comment/7940483#comment-7940483 (#50)

[edit] : it seems that the javascript used inside the view is not loaded after the first page (ie : slideshows will be loaded on 1st page, not on the next ones..)
it's probably related to those other issues : https://drupal.org/node/2164235 and https://drupal.org/node/2122273

hi,
the last two days, I have been searching a lot around the question i described above (field-slideshow doesn't load after first page), but i didn't understand yet what could be a solution, and not even to which module is it related : view-infinite-scroll, masonry or field-slideshow ?
i understand the idea of a callback, to reload some function after a new page is loaded, but i don't how and where to do it..
Can anyone give a hint on that ?
Thanks
P-

re: #23: patching for one module doesn't make sense.
The generalized approach from patch #12 is better, and will offer support for other modules e.g. views load more pager.

Also, this is probably a bug.
A javascript behavior should respond to dynamic page events.
Otherwise we could just use document.onload

Hm... patch #12 didn't work with Views Load More module.

The solution I finally got to work was actually this: #1907272-2: Re-attach behaviors after ajax callback

Trying to apply patch at #24 I get "Hunk #1 FAILED at 51."

Shouldn't this apply to 7.x-2.x-dev version??

#22 works. thanks

Other way: www.ladrupalera.com/drupal/desarrollo/javascript/tutorial-sobre-masonry

Following #22 works for me.

Using:

Drupal 7.36
Masonry API 7.x-2.0
Masonry Views 7.x-1.0+0-dev
Views Infinite Scroll 7.x-1.2+1-dev

Thanks.

Added as part of new maintainance cleanup.
Dom (new maintainer)

Working scenario
Masonry API 7.x-2.0+1-dev
Masonry Views 7.x-1.0
Views Infinite Scroll 7.x-1.2+1-dev

I also applied the patches from Views Infinite Scroll #72 and from this issue queue patch in comment #24. Specifically for the #24 patch I also had to replace Drupal.settings.infinite_scroll with Drupal.settings.views_infinite_scroll.

Masonry Views = 7.x-3.0-beta1+1-dev
Masonry = 7.x-3.0-beta1
Views Infinite Scroll 7.x-1.2+1-dev

no worked

This is a regression introduced in the fixing of :
#2513922: Nested Views also get Masonry applied to them
Reverting the correction there makes it work again for this one.
Update to the latest masonry_views 3.x (dev currently) to get the latest correction.

Also note that you need to be using Views Infinite Scroll 7.x-1.x-dev branch with patch #73 applied from here:
https://www.drupal.org/node/1806628#comment-10132738

Thanks and sorry for inconvenience.

Any News on this ?, I just cannot seem to get it to work, I am using Masonry Views 7.x-3.0-beta1+3-dev and infinite scroll and 7.x-1.1 I applied Patch from #72 and applied script from #75.

-- Edit --

i managed to get it to work by adding a case to the switch statement in views_plugin_pager_infinite_scroll.inc line 30

case 'masonry_views':
$content_selector = 'div.view-content';
$items_selector = '.views-row';
break;

All the other patches where checking for other random plugins, and the default case statement did not run either...

Hi !
Have you try using Views Infinite Scroll 7.x-1.x-dev and applying patch #73 at https://www.drupal.org/node/1806628#comment-10132738 as per what is explained at #41 ?
(also clear cache after changes just in case :) )

patch #73 has solved my problem.