MediaWiki:Common.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

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


/*
    Template:Spoiler on dev.miraheze.org
*/
$(function(){
    //spoiler block behavior
	$('.spoiler').click(function(){
		$(this).toggleClass('off');
	});
	// spoiler button behavior
    $('#spoilerbtn').text('Show all spoilers');
	$('#spoilerbtn').click(function(){
		$(this).toggleClass('hide');
		$('.spoiler').toggleClass('showall');
		
		if ($(this).is('.hide')){ $(this).text('Hide all spoilers'); } 
        else { $(this).text('Show all spoilers'); }
	});	
});
// [[Category:Scripts]]

$(function () {
    const preview = $('<img id="hover-preview">').css({
        position: 'fixed',
        display: 'none',
        border: '2px solid #666',
        background: '#222',
        padding: '4px',
        boxShadow: '0 4px 20px rgba(0,0,0,.5)',
        zIndex: 99999,
        pointerEvents: 'none',
        maxWidth: '50vw',
        maxHeight: '50vh'
    });

    $('body').append(preview);

    $('.hoverzoom img').on('mouseenter', function () {
        let fullSrc = $(this).attr('src');

        // Convert MediaWiki thumbnail URL -> original file URL
        fullSrc = fullSrc
            .replace('/thumb/', '/')
            .replace(/\/\d+px-[^/]+$/, '');

        preview
            .off('load')
            .on('load', function () {
                $(this).css({
                    width: this.naturalWidth / 2,
                    height: 'auto'
                });
            })
            .attr('src', fullSrc)
            .show();
    });

    $('.hoverzoom img').on('mousemove', function (e) {
        preview.css({
            left: e.clientX + 20,
            top: e.clientY + 20
        });
    });

    $('.hoverzoom img').on('mouseleave', function () {
        preview.hide();
    });
});