MediaWiki:Mobile.js: Difference between revisions

Latest revision as of 22:27, 7 November 2024

/* All JavaScript here will be loaded for users of the mobile site */

var SpoilerToggle = {
    init: function () {
        if (mw.config.get('skin') === 'citizen') {
            var sidebar = document.querySelector('.citizen-header__start');
            var container = SpoilerToggle.createSpoilerContainer('wheatley_spoils_you', ['citizen-pref', 'citizen-header__item']);
            var button = SpoilerToggle.createSpoilerButton('wheatley_toggle', 'Toggle spoilers', SpoilerToggle.getWheatley());

            button.addEventListener('click', function () {
                SpoilerToggle.toggleSpoilers(button);
            });

            container.prepend(button);
            sidebar.prepend(container);
        }
    },

    createSpoilerContainer: function (id, classList) {
        var container = document.createElement('div');

        container.id = id;
        for (var i = 0; i < classList.length; i++) {
            container.classList.add(classList[i]);
        }

        return container;
    },

    createSpoilerButton: function (id, title, backgroundImageUrl) {
        var button = document.createElement('button');

        button.id = id;
        button.classList.add('citizen-pref__button', 'citizen-header__button', 'citizen-button');
        button.setAttribute('title', title);
        button.style.backgroundImage = 'url(' + backgroundImageUrl + ')';
        button.style.backgroundSize = '20px';
        button.style.backgroundRepeat = 'no-repeat';
        button.style.backgroundPosition = 'center';

        return button;
    },

    getWheatley: function () {
        var spoilersEnabled = mw.storage.get('pwiki-spoilers') === '1';

        SpoilerToggle.toggleText(spoilersEnabled);

        return spoilersEnabled ? 'https://i2.theportalwiki.net/img/2/2b/Wheatley_spoils_you.png' : 'https://i2.theportalwiki.net/img/e/ef/Wheatley_spoils_nothing.png';
    },

    toggleSpoilers: function (button) {
        var cur = mw.storage.get('pwiki-spoilers');
        var spoilersEnabled = cur === '1';
        var neww = spoilersEnabled ? '0' : '1';

        mw.storage.set('pwiki-spoilers', neww);
        button.style.backgroundImage = 'url(' + SpoilerToggle.getWheatley() + ')';

        SpoilerToggle.toggleText(!spoilersEnabled);
    },

    toggleText: function (showSpoilers) {
        var spoilers = document.querySelectorAll('.spoiler-text');

        Array.prototype.forEach.call(spoilers, function (spoiler) {
            if (showSpoilers) {
                spoiler.classList.remove('spoiler-inline');
            } else {
                spoiler.classList.add('spoiler-inline');
            }
        });
    }
};

$(SpoilerToggle.init);