Munchkin Limitation from Seeing Entire Webpage?

Highlighted
Champion Moderator

Munchkin Limitation from Seeing Entire Webpage?

We had our web designer code our resource page so that it paginates as you scroll, loading pages 2+ when you reach the bottom of the page instead of forcing a click to view more. I'm noticing now that Munchkin isn't recognizing any clicks from those secondary 'pages' -- did I shoot myself in the foot, or might there be a way to call them out?

https://www.spigit.com/resource/type/video/

I'm most interested in the videos page, as noted above. Any ideas?

3 REPLIES 3
Highlighted
Level 10 - Community Moderator

Re: Munchkin Limitation from Seeing Entire Webpage?

Yes, when you use an infinite scroll effect with lazy loading, Munchkin doesn't know about the links that are added after initialization (init()).

Fix that by running this code once at the start (to mark off the initial set of natively-detected links) and then run it again every time there's a scroll event.

function refreshMunchkinLinks(native) {

var arrayFrom = Function.prototype.call.bind(Array.prototype.slice);

var visitedAttr = ["data-munchkin-visited","true"],

unvisitedLinks = document.querySelectorAll('A:not(['+ visitedAttr.join('=') + '])');

arrayFrom(unvisitedLinks)

.forEach(function(link){

   link.setAttribute.apply(link,visitedAttr);

   if (!native) {

     link.addEventListener("click",function(e){

     var youTubeId = this.getAttribute('data-youtube-id'),

       loggedHref = youTubeId ? 'video/' + youTubeId : this.href; Munchkin.

     munchkinFunction("clickLink", { href: loggedHref });

   });

  }

});

}

So right after Munchkin.init(), run

refreshMunchkinLinks(true);

then also run

refreshMunchkinLinks(false);

inside an Infinite Scroll append listener. (I detest jQuery so that part of the code is up to your designer. )

Highlighted
Champion Moderator

Re: Munchkin Limitation from Seeing Entire Webpage?

you never cease to amaze me. We'll test this out as soon as my designer gets back from vacation and report back on its success.

Do you just have all this code lying around for some reason!? lol

Highlighted
Level 10 - Community Moderator

Re: Munchkin Limitation from Seeing Entire Webpage?

Do you just have all this code lying around for some reason!? lol

Haha, no, that's why my coding approach is arbitrarily different better on different threads...