Jump to content

User:Ugog Nizdast/FloatingTOC.js

From Wikipedia, the free encyclopedia
Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.
/* [[Category:Wikipedia scripts]]
Originally designed to replace User:Osarius/FloatingTOC.css.
*/

if (typeof hideDefault === 'undefined') var hideDefault;  //declared as global
if (typeof leftDefault === 'undefined') var leftDefault;

function hideShow(header, content) {
    header.text(function () {
        return content.is(":visible") ? "Hide" : "Show";
    });
}

$(function() {
    importStylesheet('User:Ugog Nizdast/FloatingTOC.css');

    var itm = document.getElementById("toc");

    if (itm) { //check if toc exists
        var cln = itm.cloneNode(true); // clone and append the toc
        cln.id = "toc2";
        document.body.appendChild(cln);

        $('#toc2').wrap("<div class='content1' id='main1' ></div>"); //encase it with header and container
        var header = "<div class='header1' id= 'header1'><span id='hide'>Hide</span></div>";
        $('.content1').append(header);
        $('#main1').wrapAll("<div class='container1' id='main2'></div>");

        var useless = document.getElementsByClassName("toctoggle")[1]; //remove the damn not working "hide" option
        $(useless).remove();

        $header = $(".header1");
        $content = $header.prev();
        if (leftDefault) $("#main2").css('right', ""); //config variables
        if (hideDefault) {
            $("#toc2").css('display', "none");
            hideShow($header, $content); //when default is hidden, display as "hide" too
        }

        $(".header1").click(function () { //when clicked, collapse! vice-versa
            $content.slideToggle( function () {
                hideShow($header, $content);
            });
        });
    }
});