2021-10-26 23:37:56 +00:00
|
|
|
const
|
2022-03-24 20:49:22 +00:00
|
|
|
SCROLL_TITLE_HOOK = 'vector.page_title_scroll',
|
|
|
|
SCROLL_TITLE_CONTEXT_ABOVE = 'scrolled-above-page-title',
|
|
|
|
SCROLL_TITLE_CONTEXT_BELOW = 'scrolled-below-page-title',
|
2023-02-14 20:33:36 +00:00
|
|
|
SCROLL_TITLE_ACTION = 'scroll-to-top';
|
2021-10-26 23:37:56 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Fire a hook to be captured by WikimediaEvents for scroll event logging.
|
|
|
|
*
|
|
|
|
* @param {string} direction the scroll direction
|
|
|
|
*/
|
2023-02-14 20:33:36 +00:00
|
|
|
function firePageTitleScrollHook( direction ) {
|
2023-10-04 00:32:27 +00:00
|
|
|
/**
|
2024-01-24 20:23:29 +00:00
|
|
|
* For use by WikimediaEvents only.
|
2024-04-21 21:48:09 +00:00
|
|
|
*
|
2023-10-04 00:32:27 +00:00
|
|
|
* @event vector.page_title_scroll
|
2024-01-24 20:23:29 +00:00
|
|
|
* @internal
|
2023-10-04 00:32:27 +00:00
|
|
|
* @property {string} context
|
|
|
|
* @property {string} action
|
|
|
|
*/
|
2021-10-26 23:37:56 +00:00
|
|
|
if ( direction === 'down' ) {
|
2023-02-14 20:33:36 +00:00
|
|
|
mw.hook( SCROLL_TITLE_HOOK ).fire( {
|
|
|
|
context: SCROLL_TITLE_CONTEXT_BELOW
|
2022-03-24 20:49:22 +00:00
|
|
|
} );
|
2021-10-26 23:37:56 +00:00
|
|
|
} else {
|
2023-02-14 20:33:36 +00:00
|
|
|
mw.hook( SCROLL_TITLE_HOOK ).fire( {
|
|
|
|
context: SCROLL_TITLE_CONTEXT_ABOVE,
|
|
|
|
action: SCROLL_TITLE_ACTION
|
2021-10-26 23:37:56 +00:00
|
|
|
} );
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* 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 ) {
|
2024-06-06 15:22:05 +00:00
|
|
|
return new IntersectionObserver( ( entries ) => {
|
2021-10-26 23:37:56 +00:00
|
|
|
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,
|
2023-02-14 20:33:36 +00:00
|
|
|
firePageTitleScrollHook
|
2021-10-26 23:37:56 +00:00
|
|
|
};
|