MediaWiki:Common.js: Difference between revisions

Revision as of 17:26, 20 August 2026

/* Any JavaScript here will be loaded for all users on every page load. */

/* Allows images within galleries to be spoiled if "spoiler:" is put at the start of its caption*/
mw.hook('wikipage.content').add(function ($content) {
    $content.find('ul.gallery').each(function () {
        var $gallery = $(this);
        var isWholeGallery = $gallery.hasClass('spoiler-image');
        
        $gallery.find('li.gallerybox').each(function () {
            var $box = $(this);
            var captionText = $box.find('.gallerytext').text().trim().toLowerCase();
            var imgSrc = ($box.find('img').attr('src') || '') + ' ' + ($box.find('img').attr('alt') || '');
            var isIndividual = captionText.indexOf('spoiler: ') === 0

            if (isWholeGallery || isIndividual) {
                $box.addClass('spoiler-image thumb');
                if (isIndividual) {
                    $box.find('.gallerytext').html(function (i, html) {
                        return html.replace('spoiler: ', '');
                    });
                }
            }
        });
    });

    $content.find('ul.mw-gallery-slideshow').each(function () {
        var $gallery = $(this);

        function updateLargeImage() {
            var $current = $gallery.find('.gallerybox.slideshow-current');
            if (!$current.length) {
                $current = $gallery.find('.gallerybox').first();
            }
            var $container = $gallery.find('.mw-gallery-slideshow-img-container');
            if ($current.hasClass('spoiler-image') && !$current.hasClass('revealed')) {
                $container.addClass('spoiler-image');
            } else {
                $container.removeClass('spoiler-image revealed');
            }
        }

        updateLargeImage();

        var observer = new MutationObserver((updateLargeImage);
        observer.observe($gallery[0], {
            attributes: true,
            attributeFilter: ['class'],
            subtree: true,
            childList: true
        });
    });

    $content.on('click', '.gallerybox.spoiler', function () {
        $(this).addClass('spoiler-image revealed');
    });

    $content.on('click', '.mw-gallery-slideshow-img-container.spoiler-image', function (e) {
        if ($(e.target).closest('.oo-ui-buttonElement, button, a.oo-ui-buttonElement-button').length) {
            return;
        }

        var $container = $(this);
        var $gallery = $container.closest('ul.gallery');
        if (!$container.hasClass('revealed')) {
            e.preventDefault();
            e.stopPropagation();

            $container.addClass('revealed');
            $gallery.find.('.gallerybox.slideshow-current').addClass('revealed');

            if ($gallery.hasClass('spoiler-image')) {
                $gallery.addClass('revealed');
                $gallery.find('.gallerybox.spoiler-image').addClass('revealed');
            }
        }
    });
});


/* Toggles spoilered images between blurred and not blurred upon clicking */
$(function() {
    $('.spoiler-image').on('click', function() {
        $(this).toggleClass('revealed');
    });
});