MediaWiki:SupportPage.js

/* 
 * 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();
        }
    });

    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();
    });

});