From 9623c1cc4263f439081d057a79c1d27ebab198fb Mon Sep 17 00:00:00 2001 From: Sumit Asthana Date: Sat, 5 Dec 2015 23:14:15 +0530 Subject: [PATCH] RelatedArticles load after half window scroll Only triggers RelatedArticles module load and query after user has scrolled through half the document height. Bug: T116838 Change-Id: If290988fb7cc187cad37dd4a8a2c4f38abed9bb9 --- extension.json | 3 +- .../index.js | 42 +++++++++++++------ 2 files changed, 32 insertions(+), 13 deletions(-) diff --git a/extension.json b/extension.json index f1f11684..9917e582 100644 --- a/extension.json +++ b/extension.json @@ -88,7 +88,8 @@ ], "dependencies": [ "mediawiki.api", - "ext.relatedArticles.readMore.gateway" + "ext.relatedArticles.readMore.gateway", + "jquery.throttle-debounce" ], "targets": [ "mobile", diff --git a/resources/ext.relatedArticles.readMore.bootstrap/index.js b/resources/ext.relatedArticles.readMore.bootstrap/index.js index 3cd056e3..bf0af833 100644 --- a/resources/ext.relatedArticles.readMore.bootstrap/index.js +++ b/resources/ext.relatedArticles.readMore.bootstrap/index.js @@ -8,25 +8,43 @@ mw.config.get( 'wgRelatedArticlesUseCirrusSearch' ), mw.config.get( 'wgRelatedArticlesOnlyUseCirrusSearch' ) ), - LIMIT = 3; + LIMIT = 3, + debouncedLoad = $.debounce( 100, function () { + loadRelatedArticles(); + } ), + $window = $( window ), + /** + * Threshold value to load related articles - after about half scroll + */ + scrollThreshold = ( $( document ).height() / 2 ) - $window.height(); + function loadRelatedArticles() { + if ( $window.scrollTop() > scrollThreshold ) { + $.when( + // Note we load dependencies here rather than ResourceLoader + // to avoid PHP exceptions when Cards not installed + // which should never happen given the if statement. + mw.loader.using( [ 'ext.cards', 'ext.relatedArticles.readMore' ] ), + relatedPages.getForCurrentPage( LIMIT ) + ).done( function ( _, pages ) { + if ( pages.length ) { + mw.track( 'ext.relatedArticles.init', pages ); + } + } ); + // detach handler to stop subsequent loads on scroll + $window.off( 'scroll', debouncedLoad ); + } + } if ( config.wgNamespaceNumber === 0 && !config.wgIsMainPage && // any skin except minerva stable ( config.skin !== 'minerva' || config.wgMFMode === 'beta' ) ) { - $.when( - // Note we load dependencies here rather than ResourceLoader - // to avoid PHP exceptions when Cards not installed - // which should never happen given the if statement. - mw.loader.using( [ 'ext.cards', 'ext.relatedArticles.readMore' ] ), - relatedPages.getForCurrentPage( LIMIT ) - ).done( function ( _, pages ) { - if ( pages.length ) { - mw.track( 'ext.relatedArticles.init', pages ); - } - } ); + // try related articles load on scroll + $window.on( 'scroll', debouncedLoad ); + // try an initial load, in case of no scroll + loadRelatedArticles(); } }( jQuery ) );