🐛 Fixed infinitescroll when a paged url is loaded directly (#447)
closes #445 - added an fn to sanitize the pathname, that might include a pagination url - fixed an issue, where the request would still be made if the current page is bigger than max pages - added comments
This commit is contained in:
parent
41bcbb7157
commit
d5002f2c51
2 changed files with 37 additions and 6 deletions
|
@ -1,3 +1,5 @@
|
||||||
|
/* global maxPages */
|
||||||
|
|
||||||
// Code snippet inspired by https://github.com/douglasrodrigues5/ghost-blog-infinite-scroll
|
// Code snippet inspired by https://github.com/douglasrodrigues5/ghost-blog-infinite-scroll
|
||||||
$(function ($) {
|
$(function ($) {
|
||||||
var currentPage = 1;
|
var currentPage = 1;
|
||||||
|
@ -13,9 +15,6 @@ $(function ($) {
|
||||||
var lastWindowHeight = window.innerHeight;
|
var lastWindowHeight = window.innerHeight;
|
||||||
var lastDocumentHeight = $document.height();
|
var lastDocumentHeight = $document.height();
|
||||||
|
|
||||||
// remove hash params from pathname
|
|
||||||
pathname = pathname.replace(/#(.*)$/g, '').replace('/\//g', '/');
|
|
||||||
|
|
||||||
function onScroll() {
|
function onScroll() {
|
||||||
lastScrollY = window.scrollY;
|
lastScrollY = window.scrollY;
|
||||||
requestTick();
|
requestTick();
|
||||||
|
@ -34,7 +33,29 @@ $(function ($) {
|
||||||
ticking = true;
|
ticking = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function sanitizePathname(path) {
|
||||||
|
var paginationRegex = /(?:page\/)(\d)(?:\/)$/i;
|
||||||
|
|
||||||
|
// remove hash params from path
|
||||||
|
path = path.replace(/#(.*)$/g, '').replace('////g', '/');
|
||||||
|
|
||||||
|
// remove pagination from the path and replace the current pages
|
||||||
|
// with the actual requested page. E. g. `/page/3/` indicates that
|
||||||
|
// the user actually requested page 3, so we should request page 4
|
||||||
|
// next, unless it's the last page already.
|
||||||
|
if (path.match(paginationRegex)) {
|
||||||
|
currentPage = parseInt(path.match(paginationRegex)[1]);
|
||||||
|
|
||||||
|
path = path.replace(paginationRegex, '');
|
||||||
|
}
|
||||||
|
|
||||||
|
return path;
|
||||||
|
}
|
||||||
|
|
||||||
function infiniteScroll() {
|
function infiniteScroll() {
|
||||||
|
// sanitize the pathname from possible pagination or hash params
|
||||||
|
pathname = sanitizePathname(pathname);
|
||||||
|
|
||||||
// return if already loading
|
// return if already loading
|
||||||
if (isLoading) {
|
if (isLoading) {
|
||||||
return;
|
return;
|
||||||
|
@ -46,15 +67,22 @@ $(function ($) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// return if currentPage is the last page already
|
/**
|
||||||
if (currentPage === maxPages) {
|
* maxPages is defined in default.hbs and is the value
|
||||||
|
* of the amount of pagination pages.
|
||||||
|
* If we reached the last page or are past it,
|
||||||
|
* we return and disable the listeners.
|
||||||
|
*/
|
||||||
|
if (currentPage >= maxPages) {
|
||||||
|
window.removeEventListener('scroll', onScroll, {passive: true});
|
||||||
|
window.removeEventListener('resize', onResize);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
isLoading = true;
|
isLoading = true;
|
||||||
|
|
||||||
// next page
|
// next page
|
||||||
currentPage++;
|
currentPage += 1;
|
||||||
|
|
||||||
// Load more
|
// Load more
|
||||||
var nextPage = pathname + 'page/' + currentPage + '/';
|
var nextPage = pathname + 'page/' + currentPage + '/';
|
||||||
|
|
|
@ -65,6 +65,9 @@
|
||||||
|
|
||||||
{{#if pagination.pages}}
|
{{#if pagination.pages}}
|
||||||
<script>
|
<script>
|
||||||
|
// maxPages is a global variable that is needed to determine
|
||||||
|
// if we need to load more pages for the infinitescroll, or if
|
||||||
|
// we reached the last page already.
|
||||||
var maxPages = parseInt('{{pagination.pages}}');
|
var maxPages = parseInt('{{pagination.pages}}');
|
||||||
</script>
|
</script>
|
||||||
<script src="{{asset "js/infinitescroll.js"}}"></script>
|
<script src="{{asset "js/infinitescroll.js"}}"></script>
|
||||||
|
|
Loading…
Reference in a new issue