MediaWiki:Gadget-DeferredDisplay.js: Difference between revisions

From Little Tail Wiki
Jump to navigationJump to search
m Reverted edits by Zoltier (talk) to last revision by Meguumin
Tag: Rollback
No edit summary
Tag: Reverted
Line 1: Line 1:
/**
/**
  * Deferred display of {{tl|nsfw}}-tagged images.
  * Deferred display of {{tl|nsfw}}-tagged images.
  * @author Vish, 2024
* jshint validation
  * @author Dschwen, 2013
  */
  */


$(document).ready(function() {
(function ($, mw) {
    // Hide images immediately
// nothing should be tagged outside these pages yet
    $('img[alt*=NSFWTAG]').css('opacity', '0');
var fpc = "Featured picture candidate";
    $('.image[title*=NSFWTAG]').find('img').css('opacity', '0');
var ti = mw.config.get("wgTitle");
   
if ($.inArray(mw.config.get('wgNamespaceNumber'), [4, 5, 10, 11, 14, 15]) === -1 || (ti.indexOf(fpc) === -1 && ti !== "Nsfw/sandbox"))
    // Create overlay div and apply styles
return;
    function createOverlay(parent) {
// wrap non thumb images first
        parent.css({
$('img[alt*=NSFWTAG]').each(function (i, e) {
            display: 'block'
$(e).wrap($('<div>').css({
        });
display: 'inline-block',
        var image = parent.find('img');
width: $(e).width() + 'px',
 
height: $(e).height() + 'px',
        // Use the `height` attribute or fallback to CSS
backgroundColor: '#eee'
        var overlayHeight = image.attr('height') || image.css('height') || '100%';
}));
       
}).parent().add($('.thumbinner,.gallerybox').has('.nsfwelement').find('.image, .mw-file-description').parent())
        var overlay = $('<div>').css({
.one('click', function (e) {
            position: 'absolute',
$(this).css('background', 'none').find('img').css({
            top: 0,
visibility: ''
            left: 0,
});
            width: '100%',
e.preventDefault();
            height: overlayHeight,
})
            backgroundImage: 'url("https://static.jojowiki.com/images/customizations/Dialog-warning-yellow.png")',
.css({
            backgroundRepeat: 'no-repeat',
backgroundImage: 'url("https://static.jojowiki.com/images/customizations/Dialog-warning-yellow.png")',
            backgroundPosition: 'center',
backgroundRepeat: 'no-repeat',
            backgroundSize: 'contain',
backgroundPosition: 'center'
            backgroundColor: 'black',
})
            cursor: 'pointer',
.find('img').css({
            zIndex: 1 // Ensure overlay is on top
visibility: 'hidden'
        }).appendTo(parent);
});
 
}(jQuery, mediaWiki));
        overlay.one('click', function(e) {
            e.preventDefault();
            $(this).remove();
            parent.css({
                backgroundImage: '',
                backgroundRepeat: '',
                backgroundPosition: '',
                backgroundSize: '',
                display: ''
            }).find('img').css({
                visibility: '',
                opacity: '100%'
            });
        });
 
        console.log('Overlay created with height:', overlayHeight);
    }
 
    // Wrap non-thumb images and add overlay
    $('img[alt*=NSFWTAG]').parent().add($('.thumb')
        .has('.nsfwelement').find('.image').parent())
        .each(function() {
            var parent = $(this);
            parent.css({
                position: 'relative', // Ensure parent is positioned
            }).find('img').css({
                visibility: 'hidden'
            });
 
            createOverlay(parent);
        });
 
    // Add overlay to elements with NSFWTAG in title attribute within .image
    $('.image[title*=NSFWTAG]').each(function() {
        var parent = $(this).closest('.thumb');
        if (parent.find('img[alt*=NSFWTAG]').length === 0) { // Only apply if no img with NSFWTAG is found
            parent.css({
                position: 'relative', // Ensure parent is positioned
            });
 
            createOverlay(parent);
        }
    });
});

Revision as of 17:46, 11 March 2025

/**
 * Deferred display of {{tl|nsfw}}-tagged images.
 * jshint validation
 * @author Dschwen, 2013
 */

(function ($, mw) {
	// nothing should be tagged outside these pages yet
	var fpc = "Featured picture candidate";
	var ti = mw.config.get("wgTitle");
	if ($.inArray(mw.config.get('wgNamespaceNumber'), [4, 5, 10, 11, 14, 15]) === -1 || (ti.indexOf(fpc) === -1 && ti !== "Nsfw/sandbox"))
		return;
	// wrap non thumb images first
	$('img[alt*=NSFWTAG]').each(function (i, e) {
		$(e).wrap($('<div>').css({
			display: 'inline-block',
			width: $(e).width() + 'px',
			height: $(e).height() + 'px',
			backgroundColor: '#eee'
		}));
	}).parent().add($('.thumbinner,.gallerybox').has('.nsfwelement').find('.image, .mw-file-description').parent())
		.one('click', function (e) {
			$(this).css('background', 'none').find('img').css({
				visibility: ''
			});
			e.preventDefault();
		})
		.css({
			backgroundImage: 'url("https://static.jojowiki.com/images/customizations/Dialog-warning-yellow.png")',
			backgroundRepeat: 'no-repeat',
			backgroundPosition: 'center'
		})
		.find('img').css({
		visibility: 'hidden'
	});
}(jQuery, mediaWiki));