mediawiki-skins-Vector/resources/skins.vector.js/scrollObserver.js
libraryupgrader d22fd0d7ab build: Updating npm dependencies
* eslint-config-wikimedia: 0.26.0 → 0.27.0
* @wikimedia/codex: 1.3.5 → 1.4.0
* @wikimedia/codex-icons: 1.3.5 → 1.4.0

Change-Id: I3dbc33dde89f03b188918e29f89434aafc3690a9
2024-04-21 21:57:17 +00:00

56 lines
1.5 KiB
JavaScript

const
SCROLL_TITLE_HOOK = 'vector.page_title_scroll',
SCROLL_TITLE_CONTEXT_ABOVE = 'scrolled-above-page-title',
SCROLL_TITLE_CONTEXT_BELOW = 'scrolled-below-page-title',
SCROLL_TITLE_ACTION = 'scroll-to-top';
/**
* Fire a hook to be captured by WikimediaEvents for scroll event logging.
*
* @param {string} direction the scroll direction
*/
function firePageTitleScrollHook( direction ) {
/**
* For use by WikimediaEvents only.
*
* @event vector.page_title_scroll
* @internal
* @property {string} context
* @property {string} action
*/
if ( direction === 'down' ) {
mw.hook( SCROLL_TITLE_HOOK ).fire( {
context: SCROLL_TITLE_CONTEXT_BELOW
} );
} else {
mw.hook( SCROLL_TITLE_HOOK ).fire( {
context: SCROLL_TITLE_CONTEXT_ABOVE,
action: SCROLL_TITLE_ACTION
} );
}
}
/**
* Create an observer for showing/hiding feature and for firing scroll event hooks.
*
* @param {Function} show functionality for when feature is visible
* @param {Function} hide functionality for when feature is hidden
* @return {IntersectionObserver}
*/
function initScrollObserver( show, hide ) {
return new IntersectionObserver( function ( entries ) {
if ( !entries[ 0 ].isIntersecting && entries[ 0 ].boundingClientRect.top < 0 ) {
// Viewport has crossed the bottom edge of the target element.
show();
} else {
// Viewport is above the bottom edge of the target element.
hide();
}
} );
}
module.exports = {
initScrollObserver,
firePageTitleScrollHook
};