MediaWiki:Common.js
Jump to navigation
Jump to search
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)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/**
* The following code is sampled from the ARK Wiki and the Terraria Wiki respectively.
* (https://terraria.wiki.gg/wiki/MediaWiki:Common.js)
* (https://ark.wiki.gg/wiki/MediaWiki:Common.js)
*
* For language wikis, use
* <code> mw.loader.load("https://aether.wiki.gg/load.php?lang=en&modules=site&only=scripts&skin=vector"); </code>
* as the content of common.js to import from this script.
*/
// load various utilities from the commons wiki, including l10nFactory and isEditorActive
mw.loader.getScript( 'https://commons.wiki.gg/index.php?title=MediaWiki:Common-base.js&action=raw&ctype=text/javascript' ).then(function(){
/**
* Pause animations on mouseover of a designated container (.animated-container and .mcui)
*
* This is so people have a chance to look at the image and click on pages they want to view.
**/
$("#mw-content-text").on("mouseenter mouseleave", ".animated-container, .mcui", function(e) {
$(this).find(".animated").toggleClass("animated-paused", e.type === "mouseenter");
});
/**
* Creates minecraft style tooltips
*
* Replaces normal tooltips. Supports minecraft [[formatting codes]] (except k), and a description with line breaks (/).
*/
( function() {
var escapeChars = { '\\&': '&', '<': '<', '>': '>' };
var escape = function( text ) {
// "\" must be escaped first
return text.replace( /\\\\/g, '\' )
.replace( /\\&|[<>]/g, function( char ) { return escapeChars[char]; } );
};
var $tooltip = $();
var $win = $( window ), winWidth, winHeight, width, height;
$( '#mw-content-text' ).on( {
'mouseenter.minetip': function( e ) {
$tooltip.remove();
var $elem = $( this ), title = $elem.attr( 'data-minetip-title' );
if ( title === undefined ) {
title = $elem.attr( 'title' );
if ( title !== undefined ) {
title = $.trim( title.replace( /&/g, '\\&' ) );
$elem.attr( 'data-minetip-title', title );
}
}
// No title or title only contains formatting codes
if ( title === undefined || title !== '' && title.replace( /&([0-9a-fl-or])/g, '' ) === '' ) {
// Find deepest child title
var childElem = $elem[0], childTitle;
do {
if ( childElem.hasAttribute( 'title' ) ) {
childTitle = childElem.title;
}
childElem = childElem.firstChild;
} while( childElem && childElem.nodeType === 1 );
if ( childTitle === undefined ) {
return;
}
// Append child title as title may contain formatting codes
if ( !title ) {
title = '';
}
title += $.trim( childTitle.replace( /&/g, '\\&' ) );
// Set the retrieved title as data for future use
$elem.attr( 'data-minetip-title', title );
}
if ( !$elem.data( 'minetip-ready' ) ) {
// Remove title attributes so the native tooltip doesn't get in the way
$elem.find( '[title]' ).addBack().removeAttr( 'title' );
$elem.data( 'minetip-ready', true );
}
if ( title === '' ) {
return;
}
var content = '<span class="minetip-title">' + escape( title ) + '&r</span>';
var description = $.trim( $elem.attr( 'data-minetip-text' ) );
if ( description ) {
// Apply normal escaping plus "/"
description = escape( description ).replace( /\\\//g, '/' );
content += '<span class="minetip-description">' + description.replace( /\//g, '<br>' ) + '&r</span>';
}
// Add classes for minecraft formatting codes
while ( content.search( /&[0-9a-fl-o]/ ) > -1 ) {
content = content.replace( /&([0-9a-fl-o])(.*?)(&r|$)/g, '<span class="format-$1">$2</span>&r' );
}
// Remove reset formatting
content = content.replace( /&r/g, '' );
$tooltip = $( '<div id="minetip-tooltip">' );
$tooltip.html( content ).appendTo( 'body' );
// Cache current window and tooltip size
winWidth = $win.width();
winHeight = $win.height();
width = $tooltip.outerWidth( true );
height = $tooltip.outerHeight( true );
// Trigger a mouse movement to position the tooltip
$elem.trigger( 'mousemove', e );
},
'mousemove.minetip': function( e, trigger ) {
if ( !$tooltip.length ) {
$( this ).trigger( 'mouseenter' );
return;
}
// Get event data from remote trigger
e = trigger || e;
// Get mouse position and add default offsets
var top = e.clientY - 34;
var left = e.clientX + 14;
// If going off the right of the screen, go to the left of the cursor
if ( left + width > winWidth ) {
left -= width + 36;
}
// If now going off to the left of the screen, resort to going above the cursor
if ( left < 0 ) {
left = 0;
top -= height - 22;
// Go below the cursor if too high
if ( top < 0 ) {
top += height + 47;
}
// Don't go off the top of the screen
} else if ( top < 0 ) {
top = 0;
// Don't go off the bottom of the screen
} else if ( top + height > winHeight ) {
top = winHeight - height;
}
// Apply the positions
$tooltip.css( { top: top, left: left } );
},
'mouseleave.minetip': function() {
if ( !$tooltip.length ) {
return;
}
$tooltip.remove();
$tooltip = $();
}
}, '.minetip, .invslot-item' );
}() );
///////////////////////////////////////////////////////////////////////////////////////////////////////////////
/**
* content width toggle
*/
$(function(){
$body = $("body");
$("<div id=\"nav-content-size-toggle\"><span></span></div>")
.prependTo($("#mw-head"))
.on("click", function(){
$body.toggleClass("content-size-expanded");
});
});
///////////////////////////////////////////////////////////////////////////////////////////////////////////////
/**
* image size fix for <gallery>
*/
$(function() {
$(".mw-gallery-traditional .thumb").each(function() {
var $this = $(this);
/* $this.css('display', 'flex'); // do this in common.css: .mw-gallery-traditional .thumb{ display: flex; } */
$this.css("height", $this.height()+"px").find(">div").css("margin", "auto");
var $img = $this.find("img").first();
if(!$img.length) {
return;
}
var $width = $img.attr("width") - 0; //cast to number.
var $filewidth = $img.attr("data-file-width") - 0;
if($filewidth < $width) {
var $fileheight = $img.attr("data-file-height");
if( $filewidth * 2 > $width) {
$img.attr({"width": $filewidth, "height": $fileheight});
} else {
$img.attr({"width": $filewidth*2, "height": $fileheight*2});
}
}
});
});
///////////////////////////////////////////////////////////////////////////////////////////////////////////////
mw.loader.load("https://aether.wiki.gg/wiki/MediaWiki:DiscordIntegrator.js?action=raw\u0026ctype=text/javascript");
/*end of mw.loader.getScript().then callback*/ });