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.

( function () {
	'use strict';

	var DEFAULTS = {
		minBytes: 3000,
		dailyStable: false,
		blurbChars: 200
	};

	function init() {
		var panels = document.querySelectorAll( '.lhc-article' );
		if ( !panels.length ) {
			return;
		}
		var api = new mw.Api();
		Array.prototype.forEach.call( panels, function ( panel ) {
			start( api, panel );
		} );
	}

	function start( api, panel ) {
		var category = panel.getAttribute( 'data-category' );
		if ( category ) {
			return pickRandom( api, panel, category ).catch( function () {
			} );
		}

		var page = resolvePage( panel );
		if ( page ) {
			return loadArticle( api, panel, page ).catch( function () {} );
		}
	}

	function resolvePage( panel ) {
		var explicit = panel.getAttribute( 'data-page' );
		if ( explicit ) {
			return explicit;
		}
		var link = panel.querySelector( 'a[title]' );
		if ( !link ) {
			return null;
		}
		var title = link.getAttribute( 'title' );
		if ( /\(page does not exist\)$/.test( title ) ) {
			return null;
		}
		return title;
	}

	function pickRandom( api, panel, category ) {
		var minBytes = parseInt( panel.getAttribute( 'data-min-bytes' ), 10 );
		if ( isNaN( minBytes ) ) {
			minBytes = DEFAULTS.minBytes;
		}

		return api.get( {
			action: 'query',
			generator: 'categorymembers',
			gcmtitle: 'Category:' + category,
			gcmnamespace: 0,
			gcmtype: 'page',
			gcmlimit: 'max',
			prop: 'info',
			formatversion: 2
		} ).then( function ( data ) {
			var pages = ( data.query && data.query.pages ) || [];

			var candidates = pages.filter( function ( p ) {
				return p.length >= minBytes;
			} ).sort( function ( a, b ) {
				return a.title.localeCompare( b.title );
			} );

			if ( !candidates.length ) {
				mw.log.warn( '[lhc-article] no candidates in ' + category +
					' (' + pages.length + ' pages, min ' + minBytes + ' bytes)' );
				return;
			}

			return loadArticle(
				api, panel, candidates[ pickIndex( candidates.length ) ].title
			);
		} );
	}

	function pickIndex( n ) {
		if ( !DEFAULTS.dailyStable ) {
			return Math.floor( Math.random() * n );
		}
		var d = new Date();
		var key = d.getUTCFullYear() + '-' +
			( d.getUTCMonth() + 1 ) + '-' + d.getUTCDate();
		var h = 2166136261;
		for ( var i = 0; i < key.length; i++ ) {
			h = ( h ^ key.charCodeAt( i ) ) * 16777619 >>> 0;
		}
		return h % n;
	}

	function loadArticle( api, panel, title ) {
		return api.get( {
			action: 'parse',
			page: title,
			prop: 'text',
			section: 0,
			redirects: 1,
			formatversion: 2
		} ).then( function ( data ) {
			var html = data.parse && data.parse.text;
			if ( !html ) {
				return;
			}
			var doc = new DOMParser().parseFromString( html, 'text/html' );
			render( panel, {
				title: data.parse.title || title,
				image: extractImage( doc ),
				blurb: extractBlurb( doc )
			} );
		} );
	}

	function extractImage( doc ) {
		var img = doc.querySelector(
			'.infobox img, .infobox-image img, table.infobox img'
		) || doc.querySelector( 'img' );

		if ( !img ) {
			return null;
		}
		var src = img.getAttribute( 'src' );
		if ( !src ) {
			return null;
		}
		if ( src.indexOf( '//' ) === 0 ) {
			return location.protocol + src;
		}
		if ( src.indexOf( '/' ) === 0 ) {
			return location.origin + src;
		}
		return src;
	}

	function extractBlurb( doc ) {
		var junk = doc.querySelectorAll(
			'table, .infobox, .navbox, .hatnote, .thumb, ' +
			'sup.reference, .mw-editsection, .noexcerpt, style'
		);
		Array.prototype.forEach.call( junk, function ( el ) {
			el.parentNode.removeChild( el );
		} );

		var paras = doc.querySelectorAll( 'p' );
		for ( var i = 0; i < paras.length; i++ ) {
			var text = paras[ i ].textContent.replace( /\s+/g, ' ' ).trim();
			if ( text.length > 40 ) {
				return truncate( text, DEFAULTS.blurbChars );
			}
		}
		return null;
	}

	function truncate( text, max ) {
		if ( text.length <= max ) {
			return text;
		}
		var cut = text.slice( 0, max );
		var space = cut.lastIndexOf( ' ' );
		return ( space > 0 ? cut.slice( 0, space ) : cut ) + '…';
	}

	function render( panel, article ) {
		var href = mw.util.getUrl( article.title );

		var wrap = document.createElement( 'div' );
		wrap.className = 'lhc-ra';

		if ( article.image ) {
			var link = document.createElement( 'a' );
			link.href = href;
			var img = document.createElement( 'img' );
			img.src = article.image;
			img.alt = article.title;
			link.appendChild( img );
			wrap.appendChild( link );
		}

		var heading = document.createElement( 'div' );
		heading.className = 'lhc-ra-title';
		var titleLink = document.createElement( 'a' );
		titleLink.href = href;
		titleLink.textContent = article.title;
		heading.appendChild( titleLink );
		wrap.appendChild( heading );

		if ( article.blurb ) {
			var p = document.createElement( 'p' );
			p.className = 'lhc-ra-blurb';
			p.textContent = article.blurb;
			wrap.appendChild( p );
		}

		var more = document.createElement( 'a' );
		more.href = href;
		more.className = 'lhc-ra-more';
		more.textContent = 'Read the full article →';
		wrap.appendChild( more );

		panel.textContent = '';
		panel.appendChild( wrap );
	}

	mw.loader.using( [ 'mediawiki.api', 'mediawiki.util' ] ).then( function () {
		if ( document.readyState !== 'loading' ) {
			init();
		} else {
			document.addEventListener( 'DOMContentLoaded', init );
		}
	} );

}() );