MediaWiki:SupportPage.js: Difference between revisions
Jump to navigation
Jump to search
Content deleted Content added
No edit summary |
check for languageSwitcherBackdrop |
||
(16 intermediate revisions by the same user not shown) | |||
Line 5: | Line 5: | ||
$(function() { |
$(function() { |
||
⚫ | |||
var languageSwitcherButton = document.querySelector('.language-switcher__button'), |
|||
languageSwitcher = document.querySelector('.language-switcher__content'), |
|||
languageSwitcherBackdrop = document.querySelector('.dropdown-backdrop'); |
|||
languageSwitcherButton.addEventListener('click', function() { |
|||
if ( languageSwitcherButton.ariaExpanded === 'true' ) { |
|||
hideLanguageSwitcher(); |
|||
} else { |
|||
showLanguageSwitcher(); |
|||
checkScroll(); |
|||
} |
|||
}); |
|||
if ( languageSwitcherBackdrop ) { |
|||
languageSwitcherBackdrop.addEventListener('click', hideLanguageSwitcher); |
|||
} |
|||
⚫ | |||
languageSwitcherButton.ariaExpanded = 'true'; |
|||
languageSwitcher.hidden = false; |
|||
document.body.dataset.dropdownOpen = 'true'; |
|||
} |
|||
function hideLanguageSwitcher() { |
|||
languageSwitcherButton.ariaExpanded = 'false'; |
|||
languageSwitcher.hidden = true; |
|||
document.body.dataset.dropdownOpen = 'false'; |
|||
} |
|||
function checkScroll() { |
|||
⚫ | |||
if ( languageSwitcher.offsetHeight + languageSwitcher.scrollTop >= languageSwitcher.scrollHeight ) { |
|||
⚫ | |||
languageSwitcher.classList.remove('scroll-shadow'); |
|||
if ( $('.sp-languages ul').height() > $('.sp-languages').height() ) { |
|||
} else { |
|||
$('.sp-languages-expand').show(); |
|||
languageSwitcher.classList.add('scroll-shadow'); |
|||
$('.sp-languages-expand').hide(); |
|||
} |
} |
||
} |
} |
||
languageSwitcher.addEventListener('scroll', checkScroll); |
|||
showHideLanguageExpand(); |
|||
⚫ | |||
$( window ).resize( showHideLanguageExpand ); |
|||
⚫ | |||
/* -- table of contents code -- */ |
/* -- table of contents code -- */ |
||
// Build a list of corresponding |
// Build a list of corresponding fragment links and anchors |
||
var toc = []; |
var toc = []; |
||
$('# |
$('.sp-page [href^="#"]').each( function() { |
||
var id = $(this).attr('href').replace('#', ''); |
var id = $(this).attr('href').replace('#', ''); |
||
toc.push({ |
toc.push({ |
||
Line 46: | Line 74: | ||
} |
} |
||
// |
// fix inbound fragment links |
||
function delayedFragmentTargetOffset() { |
|||
if ( window.location.hash ) { |
|||
var offset = $(':target').offset(); |
|||
window.scroll( 0, window.scrollY - scrollOffset ); |
|||
if (offset) { |
|||
var scrollto = offset.top - scrollOffset; |
|||
$('html, body').animate({ scrollTop: scrollto }, 0); |
|||
} |
|||
} |
} |
||
setTimeout(delayedFragmentTargetOffset, 200); |
|||
// Highlight current section in toc |
// Highlight current section in toc |
||
var lastSection; |
var lastSection; |
||
function |
function scrollFunction() { |
||
var fromTop = $(this).scrollTop(); // Get container scroll position |
var fromTop = $(this).scrollTop(); // Get container scroll position |
||
var currentSection = toc.filter(function(item) { |
var currentSection = toc.filter(function(item) { |
||
return fromTop > item.anchor.offset().top - 64; |
return fromTop > item.anchor.offset().top - 64; |
||
}); |
}); |
||
currentSection = currentSection[currentSection.length - 1]; |
currentSection = currentSection[currentSection.length - 1]; |
||
if ( currentSection && lastSection !== currentSection ) { |
if ( currentSection && lastSection !== currentSection ) { |
||
Line 63: | Line 98: | ||
$('#toc > ul a').removeClass('-active'); |
$('#toc > ul a').removeClass('-active'); |
||
currentSection.link.addClass('-active'); |
currentSection.link.addClass('-active'); |
||
} |
|||
if ( fromTop === 0 ) { |
|||
$('.sp-top-nav').removeClass('pinned'); |
|||
} else { |
|||
$('.sp-top-nav').addClass('pinned'); |
|||
} |
} |
||
} |
} |
||
scrollFunction(); |
|||
$(window).scroll( |
$(window).scroll( scrollFunction ); |
||
/* -- end of table of contents code -- */ |
/* -- end of table of contents code -- */ |
||
Latest revision as of 11:40, 11 June 2024
/*
* MediaWiki:SupportPage.js
* Loaded by MediaWiki:Common.js on support pages e.g. "Problems donating"
*/
$(function() {
/* -- New language switcher code -- */
var languageSwitcherButton = document.querySelector('.language-switcher__button'),
languageSwitcher = document.querySelector('.language-switcher__content'),
languageSwitcherBackdrop = document.querySelector('.dropdown-backdrop');
languageSwitcherButton.addEventListener('click', function() {
if ( languageSwitcherButton.ariaExpanded === 'true' ) {
hideLanguageSwitcher();
} else {
showLanguageSwitcher();
checkScroll();
}
});
if ( languageSwitcherBackdrop ) {
languageSwitcherBackdrop.addEventListener('click', hideLanguageSwitcher);
}
function showLanguageSwitcher() {
languageSwitcherButton.ariaExpanded = 'true';
languageSwitcher.hidden = false;
document.body.dataset.dropdownOpen = 'true';
}
function hideLanguageSwitcher() {
languageSwitcherButton.ariaExpanded = 'false';
languageSwitcher.hidden = true;
document.body.dataset.dropdownOpen = 'false';
}
function checkScroll() {
if ( languageSwitcher.offsetHeight + languageSwitcher.scrollTop >= languageSwitcher.scrollHeight ) {
languageSwitcher.classList.remove('scroll-shadow');
} else {
languageSwitcher.classList.add('scroll-shadow');
}
}
languageSwitcher.addEventListener('scroll', checkScroll);
/* -- End of new language switcher code -- */
/* -- table of contents code -- */
// Build a list of corresponding fragment links and anchors
var toc = [];
$('.sp-page [href^="#"]').each( function() {
var id = $(this).attr('href').replace('#', '');
toc.push({
link: $(this),
anchor: $( document.getElementById(id) )
});
});
// Add smooth scrolling effect
var scrollOffset = 88, // Offset in px
scrollDuration = 500, // in ms
smoothScroll = function(event) {
var offsetTop = event.data.anchor.offset().top;
$('html, body').stop().animate({
scrollTop: offsetTop - scrollOffset
}, scrollDuration);
window.location.hash = event.data.anchor.attr('id');
event.preventDefault();
};
for (var i = 0; i < toc.length; i++) {
toc[i].link.on( 'click', toc[i], smoothScroll );
}
// fix inbound fragment links
function delayedFragmentTargetOffset() {
var offset = $(':target').offset();
if (offset) {
var scrollto = offset.top - scrollOffset;
$('html, body').animate({ scrollTop: scrollto }, 0);
}
}
setTimeout(delayedFragmentTargetOffset, 200);
// Highlight current section in toc
var lastSection;
function scrollFunction() {
var fromTop = $(this).scrollTop(); // Get container scroll position
var currentSection = toc.filter(function(item) {
return fromTop > item.anchor.offset().top - 64;
});
currentSection = currentSection[currentSection.length - 1];
if ( currentSection && lastSection !== currentSection ) {
lastSection = currentSection;
$('#toc > ul a').removeClass('-active');
currentSection.link.addClass('-active');
}
if ( fromTop === 0 ) {
$('.sp-top-nav').removeClass('pinned');
} else {
$('.sp-top-nav').addClass('pinned');
}
}
scrollFunction();
$(window).scroll( scrollFunction );
/* -- end of table of contents code -- */
// Collapsible continents/countries on Ways to Give
mw.loader.using('jquery.makeCollapsible', function() {
$('.mw-collapsible').makeCollapsible();
});
});