StarCitizenTools/mediawiki-skins-Citizen
1
0
Fork 0
mirror of https://github.com/StarCitizenTools/mediawiki-skins-Citizen.git synced 2024-11-28 08:10:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(core): ♻️ remove redundant intersection observers

Browse source
This commit is contained in:
alistair3149 2024-09-10 18:37:36 -04:00
parent 8640d4ef30
commit ca1f31d789
No known key found for this signature in database
2 changed files with 2 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
resources/skins.citizen.scripts/scrollObserver.js
View file

@ -29,27 +29,6 @@ function initDirectionObserver( onScrollDown, onScrollUp, threshold ) {
window.addEventListener( 'scroll', throttledOnScroll );
}
/**
* Create an observer based on element visiblity.
* Based on Vector
*
* @param {Function} onHidden functionality for when the element is visible
* @param {Function} onVisible functionality for when the element is hidden
* @return {IntersectionObserver}
*/
function initIntersectionObserver( onHidden, onVisible ) {
/* eslint-disable-next-line compat/compat */
return new IntersectionObserver( ( [ entry ] ) => {
if ( entry.isIntersecting ) {
// Viewport is within the target element.
onVisible();
} else if ( entry.boundingClientRect.top < 0 ) {
// Viewport has crossed the bottom edge of the target element.
onHidden();
}
} );
}
/**
* Create an observer for showing/hiding feature and for firing scroll event hooks.
*
@ -72,6 +51,5 @@ function initScrollObserver( show, hide ) {
module.exports = {
initDirectionObserver,
initIntersectionObserver,
initScrollObserver
};

4
resources/skins.citizen.scripts/stickyHeader.js
View file

@ -1,7 +1,7 @@
const SCROLL_DOWN_CLASS = 'citizen-scroll--down';
const SCROLL_UP_CLASS = 'citizen-scroll--up';
const STICKY_CLASS = 'citizen-page-header--sticky';
const { initDirectionObserver, initIntersectionObserver } = require( './scrollObserver.js' );
const { initDirectionObserver, initScrollObserver } = require( './scrollObserver.js' );
/**
* Observes the scroll direction and adds/removes corresponding classes to the body element.
@ -84,7 +84,7 @@ function init() {
toggleStickyHeader( true );
}, 250 );
const observer = initIntersectionObserver(
const observer = initScrollObserver(
() => {
toggleStickyHeader( true );
window.addEventListener( 'resize', onResize );