mediawiki-extensions-Relate.../resources/ext.relatedArticles.readMore.bootstrap/index.js
Isarra b31970084f Use SkinAfterContent hook to place cards in the DOM
This allows skins to determine where the cards appear in a consistent
fashion with other extensions, and require minimal special handling from
the extension itself.

Also change default settings as to when RelatedArticle cards will appear
- keep the whitelist to allow projects to configure their usage such as
in the case of only wanting it on mobile, etc, but now that it should
just work in any given skin, default it to on for all so that it's easier
for the average third party to install for whatever use.

Note that this default setting change will not affect WMF wikis, as
wmgRelatedArticlesFooterWhitelistedSkins is explicitly set in the
wmf-config regardless.

Bug: T181242
Depends-On: I5b0ad889e633fde88c392577ce5373c81fc5486a
Change-Id: Iebd759c0d1a536768d18953f372664df762d9e04
2019-07-26 19:28:49 +00:00

59 lines
1.7 KiB
JavaScript

/* eslint-disable no-jquery/no-global-selector */
( function () {
var data = require( './data.json' ),
relatedPages = new mw.relatedPages.RelatedPagesGateway(
new mw.Api(),
mw.config.get( 'wgPageName' ),
mw.config.get( 'wgRelatedArticles' ),
data.useCirrusSearch,
data.onlyUseCirrusSearch
),
// Make sure this is never undefined as I'm paranoid
LIMIT = mw.config.get( 'wgRelatedArticlesCardLimit', 3 ),
debouncedLoad = $.debounce( 100, function () {
loadRelatedArticles(); // eslint-disable-line no-use-before-define
} ),
$window = $( window );
/**
* Load related articles when the user scrolls past half of the window height.
*
* @ignore
*/
function loadRelatedArticles() {
var readMore = $( '.read-more-container' ).get( 0 ),
scrollThreshold = $window.height() * 2;
if ( mw.viewport.isElementCloseToViewport( readMore, 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.relatedArticles.cards',
'ext.relatedArticles.readMore'
] ),
relatedPages.getForCurrentPage( LIMIT )
).then( function ( _, pages ) {
if ( pages.length ) {
mw.track( 'ext.relatedArticles.init', pages );
} else {
$( readMore ).remove();
}
} );
// detach handler to stop subsequent loads on scroll
$window.off( 'scroll', debouncedLoad );
}
}
function showReadMore() {
// try related articles load on scroll
$window.on( 'scroll', debouncedLoad );
// try an initial load, in case of no scroll
loadRelatedArticles();
}
$( showReadMore );
}() );