查看“︁MediaWiki:Common.js”︁的源代码

( function () {

    function moveTOC() {
        var toc = document.getElementById( "toc" );
        if ( !toc ) { toc = document.querySelector( ".mw-table-of-contents-container" ); }
        var sidebar = document.getElementById( "column-one" );
        if ( !toc || !sidebar ) { return; }
        if ( document.getElementById( "p-toc" ) ) { return; }
        var box = document.createElement( "div" );
        box.className = "portlet";
        box.id = "p-toc";
        var title = document.createElement( "h3" );
        title.textContent = "\u76ee\u5f55";
        var inner = document.createElement( "div" );
        inner.className = "pBody";
        inner.appendChild( toc );
        box.appendChild( title );
        box.appendChild( inner );
        sidebar.appendChild( box );
    }

    function pickLinks( portlet ) {
        var out = [];
        if ( !portlet ) { return out; }
        var links = portlet.querySelectorAll( "ul a" );
        for ( var i = 0; i < links.length; i++ ) { out.push( links[ i ] ); }
        return out;
    }

    function syncBarHeight( bar ) {
        if ( !bar ) { return; }
        document.body.style.paddingTop = bar.offsetHeight + "px";
    }

    function enableHorizontalScroll( bar ) {
        if ( !bar ) { return; }
        bar.addEventListener( "wheel", function ( e ) {
            if ( Math.abs( e.deltaY ) > Math.abs( e.deltaX ) ) {
                bar.scrollLeft += e.deltaY;
                e.preventDefault();
            }
        }, { passive: false } );

        var down = false, startX = 0, startLeft = 0;
        bar.addEventListener( "mousedown", function ( e ) {
            if ( e.target && e.target.tagName === "A" ) { return; }
            down = true;
            startX = e.pageX;
            startLeft = bar.scrollLeft;
            bar.style.cursor = "grabbing";
        } );
        window.addEventListener( "mousemove", function ( e ) {
            if ( !down ) { return; }
            bar.scrollLeft = startLeft - ( e.pageX - startX );
        } );
        window.addEventListener( "mouseup", function () {
            down = false;
            bar.style.cursor = "";
        } );
    }

    function makeSticky() {
        var old = document.getElementById( "sg-topbar" );
        if ( old ) { old.parentNode.removeChild( old ); }

        var leftLinks = pickLinks( document.getElementById( "p-cactions" ) );
        var rightLinks = pickLinks( document.getElementById( "p-personal" ) );

        if ( leftLinks.length === 0 && rightLinks.length === 0 ) { return; }

        var bar = document.createElement( "div" );
        bar.id = "sg-topbar";
        bar.className = "sg-sticky-bar";

        var left = document.createElement( "div" );
        left.className = "sg-bar-left";
        for ( var i = 0; i < leftLinks.length; i++ ) {
            var a = document.createElement( "a" );
            a.href = leftLinks[ i ].href;
            a.textContent = leftLinks[ i ].textContent;
            left.appendChild( a );
        }

        var right = document.createElement( "div" );
        right.className = "sg-bar-right";
        for ( var j = 0; j < rightLinks.length; j++ ) {
            var b = document.createElement( "a" );
            b.href = rightLinks[ j ].href;
            b.textContent = rightLinks[ j ].textContent;
            right.appendChild( b );
        }

        bar.appendChild( left );
        bar.appendChild( right );
        document.body.appendChild( bar );

        var personal = document.getElementById( "p-personal" );
        var cactions = document.getElementById( "p-cactions" );
        if ( personal ) { personal.style.visibility = "hidden"; }
        if ( cactions ) { cactions.style.visibility = "hidden"; }

        document.body.className = document.body.className + " sg-sticky-on";
        syncBarHeight( bar );
        enableHorizontalScroll( bar );
        window.addEventListener( "resize", function () { syncBarHeight( bar ); } );
    }


    function moveFooterLogo() {
        var el = document.getElementById( "f-copyrightico" );
        if ( !el ) { return; }
        if ( window.innerWidth <= 720 ) {
            el.style.visibility = "visible";
            return;
        }
        document.body.appendChild( el );
        el.classList.add( "sg-floating-logo" );
        el.style.visibility = "visible";
    }

    function run() {
        moveTOC();
        makeSticky();
        moveFooterLogo();
    }

    if ( document.readyState === "loading" ) {
        document.addEventListener( "DOMContentLoaded", run );
    } else {
        run();
    }

}() );