MediaWiki:Skin/ResizeGalleries.js

// <source lang="JavaScript">

var resizeGalleries = {
	init: function () {
		if (typeof doNotResize != 'undefined') return;

		this.$tables = $('table.gallery:not(.noresize)');
		if (this.$tables.length < 1) return;

		$(window).resize( function () { resizeGalleries.delay(); } );
		this.resize();

	},
	delay: function () {
		if ( typeof this.timeoutId !== 'undefined' ) window.clearTimeout( this.timeoutId );
		this.timeoutId = window.setTimeout( function () { resizeGalleries.resize(); }, 10);
	},
	resize: function () {
		this.$tables.each( function () {
			var $table = $(this);
			var $tds = $table.find( 'tbody:first > tr > td' ); // Do not clone; breaks other scripts!
			if ( $tds.length < 1 ) return;  // paranoia
			if ($tds.first().outerWidth() == 0) return;

			// XXX: we assume that all <td>s in each gallery have the same width, and that no row is longer than the first
			var curShown = $table.find( 'tbody:first > tr:first > td' ).length;
			var newShown = Math.floor( $table.parent().width() / $tds.first().outerWidth() );
			if ( newShown < 1 ) newShown = 1;
			if ( newShown == curShown || ( newShown > curShown && $table.find('tr').length < 2 ) ) return;

			var $newbody = $('<tbody/>');
			var $tr = null;
			var curpos = 0;
			$tds.each( function () {
				if (curpos >= newShown || $tr == null) {
					$newbody.append( $tr = $('<tr/>') );
					curpos = 0;
				}
				curpos++;
				$tr.append( this );
			} );
			$table.children( 'tbody' ).replaceWith( $newbody );
		} );
	}
};
$(document).ready( function () {
	resizeGalleries.init();
} );

//</source>