MediaWiki:SupportPage.js: Difference between revisions

From Donate
Jump to navigation Jump to search
Content deleted Content added
set fragment identifier when clicking a ToC link - phab:T205107
highlight current section when page first loads, as well as after scrolling
Line 48: Line 48:
// Highlight current section in toc
// Highlight current section in toc
var lastSection;
var lastSection;
$(window).scroll(function() {
function highlightCurrentSection() {
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) {
Line 59: Line 59:
currentSection.link.addClass('-active');
currentSection.link.addClass('-active');
}
}
});
}
highlightCurrentSection();
$(window).scroll( highlightCurrentSection );
/* -- end of table of contents code -- */
/* -- end of table of contents code -- */



Revision as of 14:21, 25 September 2018

/* 
 * MediaWiki:SupportPage.js
 * Loaded by MediaWiki:Common.js on support pages e.g. "Problems donating"
 */

$(function() {

    /* -- language bar code -- */
    function showHideLanguageExpand() {
        if ( $('.sp-languages ul').height() > $('.sp-languages').height() ) {
            $('.sp-languages-expand').show();
        } else if ( !$('.sp-languages').hasClass('-expanded') ) {
            $('.sp-languages-expand').hide();
        }
    }

    showHideLanguageExpand();
    $( window ).resize( showHideLanguageExpand );
    /* -- end of language bar code -- */

    /* -- table of contents code -- */
    
    // Build a list of corresponding toc links and anchors
    var toc = [];
    $('#toc > ul a').each( function() {
        var id = $(this).attr('href').replace('#', '');
        toc.push({
            link: $(this),
            anchor: $( document.getElementById(id) )
        });
    });

    // Add smooth scrolling effect
    var scrollOffset = 24, // 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 );
    }

    // Highlight current section in toc
    var lastSection;
    function highlightCurrentSection() {
        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 ( lastSection !== currentSection ) {
            lastSection = currentSection;
            $('#toc > ul a').removeClass('-active');
            currentSection.link.addClass('-active');
        }
    }
    highlightCurrentSection();
    $(window).scroll( highlightCurrentSection );
    /* -- end of table of contents code -- */

});