I have infinite ajax scroll running in a silverstripe website. Also I have "NoneLeft" Extension running to let people know, they reached the bottom.
The IAScroll is showing ArticlePages in a ArticleHolder page and displaying the "NoneLeft" text as it should. Now, when I show only an ArticlePage directly (without ArticleHolder around) it is also showing the "NoneLeft" Text. Is there any way to switch it off or limiting to a certain page? Or do I have to unbind ias from jQuery? Thx a lot
Silverstripe ArticleHolder.php
<?php
class ArticleHolder extends Page {
private static $allowed_children = array('ArticlePage');
}
class ArticleHolder_Controller extends Page_Controller {
public function PaginatedArticles(){
$paginatedItems = new PaginatedList(ArticlePage::get()->sort("Date DESC"), $this->request);
$paginatedItems->setPageLength(4);
return $paginatedItems;
}
}
script.js
var ias = jQuery.ias({
container: '#posts',
item: '.post',
pagination: '#pagination',
next: '.next',
delay: 0,
negativeMargin: 250,
history: true; }
});
// Adds a text when there are no more pages left to load
ias.extension(new IASNoneLeftExtension({
text: "You reached the end"
}));
the html output of #pagination, when several posts are present
<div id="pagination" class="line" style="display: none;">
<div class="unit size1of4 lineLeftRight lineLeft">
<p></p>
</div>
<div class="unit size1of4 lineLeftRight lineLeft">
<p> …
<a class="next" href="?start=4"> Next
</a>
</p>
</div>
<div class="unit size1of4 lastUnit lineLeftRight lineRight">
<p></p>
</div>
</div>
when there is only one article, there is no #pagination but again the "NoneLeft" text
<div id="ias_noneleft_1403162234904" class="ias-noneleft line">
<div class="unit size1of4 lineLeftRight lineLeft">
<p></p>
</div>
<div class="unit size2of4 lineMiddle">
<p>
You reached the end
</p>
</div>
<div class="unit size1of4 lastUnit lineLeftRight lineRight">
<p></p>
</div>
</div>
Alright, I found it. When displaying a single ArticlePage, I still had a
div with class .post
around the article.as soon as infinite ajax scroll sees the .post div, it adds the noneLeft text. Moving the
.post class div
into the loop of ArticleHolder helped.ArticleHolder.ss