MediaWiki:Common.js

/* The Perfect Tower II Wiki: JavaScript for every reader on every page, so keep it small.
 * Source: onwiki/MediaWiki/Common.js in the wiki repository. */
/* global mw, $ */

/* Older pages mark tables with the classes "collapsible" and "collapsed" (for example Factory and
 * Module:Recipe table). They become MediaWiki collapsibles. From mediawiki.org's
 * Gadget-collapsibleTables.js. */
mw.hook( 'wikipage.content' ).add( function ( $content ) {
	var $tables = $content.find( 'table.collapsible:not(.mw-collapsible)' ).addClass( 'mw-collapsible' );
	$tables.filter( '.collapsed' ).addClass( 'mw-collapsed' );
	if ( $tables.length ) {
		mw.loader.using( 'jquery.makeCollapsible' ).then( function () {
			$tables.makeCollapsible();
		} );
	}
} );

/* Navboxes with the class "autocollapse" (Module:Navbox) start collapsed when a page has two or more
 * collapsibles. A legacy "collapsible" table keeps its toggle in the first header cell, and a toggle on
 * a colored header takes the header's text color. */
mw.hook( 'wikipage.collapsibleContent' ).add( function ( $collapsibles ) {
	$collapsibles.each( function () {
		var $element = $( this ),
			$toggle;
		if ( $element.hasClass( 'collapsible' ) ) {
			$element.find( 'tr:first > th:first' ).prepend( $element.find( 'tr:first > * > .mw-collapsible-toggle' ) );
		}
		if ( $collapsibles.length >= 2 && $element.hasClass( 'autocollapse' ) ) {
			$element.data( 'mw-collapsible' ).collapse();
		}
		$toggle = $element.find( '.mw-collapsible-toggle' );
		if ( $toggle.length && $toggle.parent()[ 0 ].style.color ) {
			$toggle.find( 'a' ).css( 'color', 'inherit' );
		}
	} );
} );

/* Number format: Template:Number shows scientific notation (1.2E7) unless the reader picks named numbers
 * (12 M). The choice sits in Vector's Appearance menu after the theme and is stored the same way: the
 * server sets tpt-notation-clientpref-<format> on <html> (WikiBranding.php), readers keep it in the
 * client preferences cookie, logged-in users in the tpt-notation option. */
mw.messages.set( {
	'tpt-notation-name': 'Numbers',
	'tpt-notation-scientific-label': 'Scientific (1.2E7)',
	'tpt-notation-named-label': 'Named (12 M)'
} );
$( function () {
	if ( !document.getElementById( 'vector-appearance' ) ||
		!/(^| )tpt-notation-clientpref-/.test( document.documentElement.className )
	) {
		return;
	}
	mw.loader.using( 'skins.vector.clientPreferences' ).then( function ( require ) {
		return require( 'skins.vector.clientPreferences' ).render( '#vector-appearance', {
			'tpt-notation': { options: [ 'scientific', 'named' ], preferenceKey: 'tpt-notation' }
		} );
	} ).then( function ( menu ) {
		// Last in the menu, after Vector's own options, which Vector may add after this one.
		var numbers = document.getElementById( 'skin-client-prefs-tpt-notation' );
		function keepLast() {
			if ( numbers.parentNode === menu && menu.lastElementChild !== numbers ) {
				menu.appendChild( numbers );
			}
		}
		if ( menu && numbers ) {
			keepLast();
			new MutationObserver( keepLast ).observe( menu, { childList: true } );
		}
	} );
} );

/* Wide tables: a table wider than the text column scrolls sideways in its own box
 * (.wiki-table-scroll in MediaWiki:Common.css), so it never runs under the contents column or off the
 * screen. Tables that fit stay as they are and keep their sticky header row. Checked again when the
 * column changes width (window, contents pinned or not, fonts) and when a table expands or collapses. */
( function () {
	var timer, lastWidth;

	function fitTables() {
		document.querySelectorAll( '.mw-parser-output table.wikitable' ).forEach( function ( table ) {
			var box = table.parentNode,
				wrapped = box.classList.contains( 'wiki-table-scroll' ),
				room = wrapped ? box.parentNode : box,
				style, width, wide;
			// A table inside another table: the outer one decides.
			if ( room.closest( 'table' ) ) {
				return;
			}
			style = getComputedStyle( room );
			width = room.clientWidth - parseFloat( style.paddingLeft ) - parseFloat( style.paddingRight );
			wide = table.offsetWidth > width + 1;
			if ( wide && !wrapped ) {
				box = document.createElement( 'div' );
				box.className = 'wiki-table-scroll';
				box.tabIndex = 0; // Keyboard users can scroll it with the arrow keys.
				table.parentNode.insertBefore( box, table );
				box.appendChild( table );
			} else if ( !wide && wrapped ) {
				box.parentNode.insertBefore( table, box );
				box.parentNode.removeChild( box );
			}
		} );
	}

	function fitSoon() {
		clearTimeout( timer );
		timer = setTimeout( fitTables, 50 );
	}

	mw.hook( 'wikipage.content' ).add( fitSoon );
	$( document ).on( 'afterExpand.mw-collapsible afterCollapse.mw-collapsible', fitSoon );
	if ( document.fonts ) {
		document.fonts.ready.then( fitSoon );
	}
	$( function () {
		var content = document.getElementById( 'mw-content-text' );
		if ( content && window.ResizeObserver ) {
			new ResizeObserver( function ( entries ) {
				var width = Math.round( entries[ 0 ].contentRect.width );
				if ( width !== lastWidth ) {
					lastWidth = width;
					fitSoon();
				}
			} ).observe( content );
		} else {
			$( window ).on( 'resize', fitSoon );
		}
	} );
}() );