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

feat: improve scrollspy handling

Browse source 
Better support for non-latin language
Add throttle function
This commit is contained in:
alistair3149 2021-03-13 22:34:15 -05:00 committed by GitHub
parent 378f12c12d
commit 6273711f60
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 27 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
resources/skins.citizen.scripts.toc/skins.citizen.scripts.toc.js
View file

@ -29,6 +29,23 @@ function SmoothScroll() {
} }
} }
/**
* Throttle scroll event
*
* @param {Function} fn - function
* @param {number} wait - wait time in ms
* @return {Function}
*/
function throttle( fn, wait ) {
var time = Date.now();
return function () {
if ( ( time + wait - Date.now() ) < 0 ) {
fn();
time = Date.now();
}
};
}
/** /**
* Add active HTML class to items in table of content based on user viewport. * Add active HTML class to items in table of content based on user viewport.
* *
@ -40,9 +57,9 @@ function ScrollSpy() {
mwbodyStyle = window.getComputedStyle( mwbody ), mwbodyStyle = window.getComputedStyle( mwbody ),
scrollOffset = parseInt( mwbodyStyle.marginTop, 10 ) + 1; scrollOffset = parseInt( mwbodyStyle.marginTop, 10 ) + 1;
window.addEventListener( 'scroll', function () { window.addEventListener( 'scroll', throttle( function () {
var scrollPos = document.documentElement.scrollTop || document.body.scrollTop, var scrollPos = document.documentElement.scrollTop || document.body.scrollTop,
section, id, node, active; section, id, id2, toclink, node, active;
scrollPos += scrollOffset; scrollPos += scrollOffset;
@ -51,8 +68,13 @@ function ScrollSpy() {
Object.prototype.hasOwnProperty.call( sections, section ) && Object.prototype.hasOwnProperty.call( sections, section ) &&
sections[ section ].offsetTop <= scrollPos sections[ section ].offsetTop <= scrollPos
) { ) {
id = mw.util.escapeIdForAttribute( sections[ section ].id ); id = sections[ section ].id;
node = document.querySelector( "a[href='#" + id + "']" ).parentNode; // Try the ID of the span before
if ( sections[ section ].previousSibling !== null ) {
id2 = sections[ section ].previousSibling.id || '';
}
toclink = document.querySelector( "a[href='#" + id + "']" ) || document.querySelector( "a[href='#" + id2 + "']" );
node = toclink.parentNode;
active = document.querySelector( '.active' ); active = document.querySelector( '.active' );
if ( active !== null ) { if ( active !== null ) {
active.classList.remove( 'active' ); active.classList.remove( 'active' );
@ -62,7 +84,7 @@ function ScrollSpy() {
} }
} }
} }
} ); }, 10 ) );
} }
/** /**