Update to MediaWiki 1.22.0

6 files changed, 344 insertions, 24 deletions

diff --git a/resources/mediawiki.page/mediawiki.page.gallery.js b/resources/mediawiki.page/mediawiki.page.gallery.js
new file mode 100644
index 00000000..147a869d
--- /dev/null
+++ b/resources/mediawiki.page/mediawiki.page.gallery.js
@@ -0,0 +1,248 @@
+/**
+ * Show gallery captions when focused. Copied directly from jquery.mw-jump.js.
+ * Also Dynamically resize images to justify them.
+ */
+( function ( $, mw ) {
+	$( function () {
+		var isTouchScreen,
+			gettingFocus,
+			galleries = 'ul.mw-gallery-packed-overlay, ul.mw-gallery-packed-hover, ul.mw-gallery-packed';
+
+		// Is there a better way to detect a touchscreen? Current check taken from stack overflow.
+		isTouchScreen = !!( window.ontouchstart !== undefined || window.DocumentTouch !== undefined && document instanceof window.DocumentTouch );
+
+		if ( isTouchScreen ) {
+			// Always show the caption for a touch screen.
+			$( 'ul.mw-gallery-packed-hover' )
+				.addClass( 'mw-gallery-packed-overlay' )
+				.removeClass( 'mw-gallery-packed-hover' );
+		} else {
+			// Note use of just "a", not a.image, since we want this to trigger if a link in
+			// the caption receives focus
+			$( 'ul.mw-gallery-packed-hover li.gallerybox' ).on( 'focus blur', 'a', function ( e ) {
+				// Confusingly jQuery leaves e.type as focusout for delegated blur events
+				gettingFocus = e.type !== 'blur' && e.type !== 'focusout';
+				$( this ).closest( 'li.gallerybox' ).toggleClass( 'mw-gallery-focused', gettingFocus );
+			} );
+		}
+
+		// Now on to justification.
+		// We may still get ragged edges if someone resizes their window. Could bind to
+		// that event, otoh do we really want to constantly be resizing galleries?
+		$( galleries ).each( function() {
+			var lastTop,
+				$img,
+				imgWidth,
+				imgHeight,
+				rows = [],
+				$gallery = $( this );
+
+			$gallery.children( 'li' ).each( function() {
+				// Math.floor to be paranoid if things are off by 0.00000000001
+				var top = Math.floor( $(this ).position().top ),
+					$this = $( this );
+
+				if ( top !== lastTop ) {
+					rows[rows.length] = [];
+					lastTop = top;
+				}
+
+				$img = $this.find( 'div.thumb a.image img' );
+				if ( $img.length && $img[0].height ) {
+					imgHeight = $img[0].height;
+					imgWidth = $img[0].width;
+				} else {
+					// If we don't have a real image, get the containing divs width/height.
+					// Note that if we do have a real image, using this method will generally
+					// give the same answer, but can be different in the case of a very
+					// narrow image where extra padding is added.
+					imgHeight = $this.children().children( 'div:first' ).height();
+					imgWidth = $this.children().children( 'div:first' ).width();
+				}
+
+				// Hack to make an edge case work ok
+				if ( imgHeight < 30 ) {
+					// Don't try and resize this item.
+					imgHeight = 0;
+				}
+
+				rows[rows.length-1][rows[rows.length-1].length] = {
+					$elm: $this,
+					width: $this.outerWidth(),
+					imgWidth: imgWidth,
+					aspect: imgWidth / imgHeight, // XXX: can divide by 0 ever happen?
+					captionWidth: $this.children().children( 'div.gallerytextwrapper' ).width(),
+					height: imgHeight
+				};
+			});
+
+			(function () {
+				var maxWidth,
+					combinedAspect,
+					combinedPadding,
+					curRow,
+					curRowHeight,
+					wantedWidth,
+					preferredHeight,
+					newWidth,
+					padding,
+					$outerDiv,
+					$innerDiv,
+					$imageDiv,
+					$imageElm,
+					imageElm,
+					$caption,
+					hookInfo,
+					i,
+					j,
+					avgZoom,
+					totalZoom = 0;
+
+				for ( i = 0; i < rows.length; i++ ) {
+					maxWidth = $gallery.width();
+					combinedAspect = 0;
+					combinedPadding = 0;
+					curRow = rows[i];
+					curRowHeight = 0;
+
+					for ( j = 0; j < curRow.length; j++ ) {
+						if ( curRowHeight === 0 ) {
+							if ( isFinite( curRow[j].height ) ) {
+								// Get the height of this row, by taking the first
+								// non-out of bounds height
+								curRowHeight = curRow[j].height;
+							}
+						}
+
+						if ( curRow[j].aspect === 0 || !isFinite( curRow[j].aspect ) ) {
+							mw.log( 'Skipping item ' + j + ' due to aspect: ' + curRow[j].aspect );
+							// One of the dimensions are 0. Probably should
+							// not try to resize.
+							combinedPadding += curRow[j].width;
+						} else {
+							combinedAspect += curRow[j].aspect;
+							combinedPadding += curRow[j].width - curRow[j].imgWidth;
+						}
+					}
+
+					// Add some padding for inter-element spacing.
+					combinedPadding += 5 * curRow.length;
+					wantedWidth = maxWidth - combinedPadding;
+					preferredHeight = wantedWidth / combinedAspect;
+
+					if ( preferredHeight > curRowHeight * 1.5 ) {
+						// Only expand at most 1.5 times current size
+						// As that's as high a resolution as we have.
+						// Also on the off chance there is a bug in this
+						// code, would prevent accidentally expanding to
+						// be 10 billion pixels wide.
+						mw.log( 'mw.page.gallery: Cannot fit row, aspect is ' + preferredHeight/curRowHeight );
+						if ( i === rows.length - 1 ) {
+							// If its the last row, and we can't fit it,
+							// don't make the entire row huge.
+							avgZoom = ( totalZoom / ( rows.length - 1 ) ) * curRowHeight;
+							if ( isFinite( avgZoom ) && avgZoom >= 1 && avgZoom <= 1.5 ) {
+								preferredHeight = avgZoom;
+							} else {
+								// Probably a single row gallery
+								preferredHeight = curRowHeight;
+							}
+						} else {
+							preferredHeight = 1.5 * curRowHeight;
+						}
+					}
+					if ( !isFinite( preferredHeight ) ) {
+						// This *definitely* should not happen.
+						mw.log( 'mw.page.gallery: Trying to resize row ' + i + ' to ' + preferredHeight + '?!' );
+						// Skip this row.
+						continue;
+					}
+					if ( preferredHeight < 5 ) {
+						// Well something clearly went wrong...
+						mw.log( {maxWidth: maxWidth, combinedPadding: combinedPadding, combinedAspect: combinedAspect, wantedWidth: wantedWidth } );
+						mw.log( 'mw.page.gallery: [BUG!] Fitting row ' + i + ' to too small a size: ' + preferredHeight );
+						// Skip this row.
+						continue;
+					}
+
+					if ( preferredHeight / curRowHeight > 1 ) {
+						totalZoom += preferredHeight / curRowHeight;
+					} else {
+						// If we shrink, still consider that a zoom of 1
+						totalZoom += 1;
+					}
+
+					for ( j = 0; j < curRow.length; j++ ) {
+						newWidth = preferredHeight * curRow[j].aspect;
+						padding = curRow[j].width - curRow[j].imgWidth;
+						$outerDiv = curRow[j].$elm;
+						$innerDiv = $outerDiv.children( 'div' ).first();
+						$imageDiv = $innerDiv.children( 'div.thumb' );
+						$imageElm = $imageDiv.find( 'img' ).first();
+						imageElm = $imageElm.length ? $imageElm[0] : null;
+						$caption = $outerDiv.find( 'div.gallerytextwrapper' );
+
+
+						// Since we are going to re-adjust the height, the vertical
+						// centering margins need to be reset.
+						$imageDiv.children( 'div' ).css( 'margin', '0px auto' );
+
+						if ( newWidth < 60 || !isFinite( newWidth ) ) {
+							// Making something skinnier than this will mess up captions,
+							mw.log( 'mw.page.gallery: Tried to make image ' + newWidth + 'px wide but too narrow.' );
+							if ( newWidth < 1 || !isFinite( newWidth ) ) {
+								$innerDiv.height( preferredHeight );
+								// Don't even try and touch the image size if it could mean
+								// making it disappear.
+								continue;
+							}
+						} else {
+							$outerDiv.width( newWidth + padding );
+							$innerDiv.width( newWidth + padding );
+							$imageDiv.width( newWidth );
+							$caption.width( curRow[j].captionWidth + (newWidth - curRow[j].imgWidth ) );
+						}
+
+						hookInfo = {
+							fullWidth: newWidth + padding,
+							imgWidth: newWidth,
+							imgHeight: preferredHeight,
+							$innerDiv: $innerDiv,
+							$imageDiv: $imageDiv,
+							$outerDiv: $outerDiv,
+							// Whether the hook took action
+							resolved: false
+						};
+
+						/**
+						 * Gallery resize.
+						 *
+						 * If your handler resizes an image, it should also set the resolved
+						 * property to true. Additionally, because this module only exposes this
+						 * logic temporarily, you should load your module in position top to
+						 * ensure it is registered before this runs (FIXME: Don't use mw.hook)
+						 *
+						 * See TimedMediaHandler for an example.
+						 *
+						 * @event mediawiki_page_gallery_resize
+						 * @member mw.hook
+						 * @param {Object} hookInfo
+						 */
+						mw.hook( 'mediawiki.page.gallery.resize' ).fire( hookInfo );
+
+						if ( !hookInfo.resolved ) {
+							if ( imageElm ) {
+								// We don't always have an img, e.g. in the case of an invalid file.
+								imageElm.width = newWidth;
+								imageElm.height = preferredHeight;
+							} else {
+								// Not a file box.
+								$imageDiv.height( preferredHeight );
+							}
+						}
+					}
+				}
+			} )();
+		} );
+	} );
+} )( jQuery, mediaWiki );
diff --git a/resources/mediawiki.page/mediawiki.page.image.pagination.js b/resources/mediawiki.page/mediawiki.page.image.pagination.js
new file mode 100644
index 00000000..fb44a76f
--- /dev/null
+++ b/resources/mediawiki.page/mediawiki.page.image.pagination.js
@@ -0,0 +1,51 @@
+/**
+ * Change multi-page image navigation so that the current page display can be changed
+ * without a page reload. Currently, the only image formats that can be multi-page images are
+ * PDF and DjVu files
+ */
+( function (mw, $) {
+	// Use jQuery's load function to specifically select and replace table.multipageimage's child
+	// tr with the new page's table.multipageimage's tr element.
+	// table.multipageimage always has only one row.
+	function loadPage( page ) {
+		var $multipageimage = $( 'table.multipageimage' ),
+			$spinner = $.createSpinner( {
+				size: 'large',
+				type: 'block'
+			} );
+
+		// Set the spinner's dimensions equal to the table's dimensions so that
+		// the current scroll position is not lost after the table is emptied prior to
+		// its contents being updated
+		$spinner.css( {
+			height: $multipageimage.find( 'tr' ).height(),
+			width: $multipageimage.find( 'tr' ).width()
+		} );
+
+		$multipageimage.empty().append( $spinner ).load(
+			page + ' table.multipageimage tr',
+			ajaxifyPageNavigation
+		);
+	}
+
+	function ajaxifyPageNavigation() {
+		// Intercept the default action of the links in the thumbnail navigation
+		$( '.multipageimagenavbox' ).one( 'click', 'a', function ( e ) {
+			loadPage( this.href );
+			e.preventDefault();
+		} );
+
+		// Prevent the submission of the page select form and instead call loadPage
+		$( 'form[name="pageselector"]' ).one( 'change submit', function ( e ) {
+			loadPage( this.action + '?' + $( this ).serialize() );
+			e.preventDefault();
+		} );
+	}
+
+	$( document ).ready( function() {
+		// The presence of table.multipageimage signifies that this file is a multi-page image
+		if( mw.config.get( 'wgNamespaceNumber' ) === 6 && $( 'table.multipageimage' ).length !== 0 ) {
+			ajaxifyPageNavigation();
+		}
+	} );
+}( mediaWiki, jQuery ) );
diff --git a/resources/mediawiki.page/mediawiki.page.patrol.ajax.js b/resources/mediawiki.page/mediawiki.page.patrol.ajax.js
index d7a07d71..75908eee 100644
--- a/resources/mediawiki.page/mediawiki.page.patrol.ajax.js
+++ b/resources/mediawiki.page/mediawiki.page.patrol.ajax.js
@@ -11,7 +11,7 @@
 		// that didn't have patrolToken yet.
 		return;
 	}
-	$( document ).ready( function () {
+	$( function () {
 		var $patrolLinks = $( '.patrollink a' );
 		$patrolLinks.on( 'click', function ( e ) {
 			var $spinner, href, rcid, apiRequest;
diff --git a/resources/mediawiki.page/mediawiki.page.ready.js b/resources/mediawiki.page/mediawiki.page.ready.js
index 684f582f..ee416d67 100644
--- a/resources/mediawiki.page/mediawiki.page.ready.js
+++ b/resources/mediawiki.page/mediawiki.page.ready.js
@@ -1,28 +1,40 @@
-( function ( mw, $ ) {
-	$( function () {
+( function ( mw , $ ) {
+	var supportsPlaceholder = 'placeholder' in document.createElement( 'input' );
+
+	mw.hook( 'wikipage.content' ).add( function ( $content ) {
 		var $sortableTables;
 
-		/* Emulate placeholder if not supported by browser */
-		if ( !( 'placeholder' in document.createElement( 'input' ) ) ) {
-			$( 'input[placeholder]' ).placeholder();
+		// Run jquery.placeholder polyfill if placeholder is not supported
+		if ( !supportsPlaceholder ) {
+			$content.find( 'input[placeholder]' ).placeholder();
 		}
 
-		/* Enable makeCollapsible */
-		$( '.mw-collapsible' ).makeCollapsible();
+		// Run jquery.makeCollapsible
+		$content.find( '.mw-collapsible' ).makeCollapsible();
 
-		/* Lazy load jquery.tablesorter */
-		$sortableTables = $( 'table.sortable' );
+		// Lazy load jquery.tablesorter
+		$sortableTables = $content.find( 'table.sortable' );
 		if ( $sortableTables.length ) {
 			mw.loader.using( 'jquery.tablesorter', function () {
 				$sortableTables.tablesorter();
-			});
+			} );
 		}
 
-		/* Enable CheckboxShiftClick */
-		$( 'input[type=checkbox]:not(.noshiftselect)' ).checkboxShiftClick();
+		// Run jquery.checkboxShiftClick
+		$content.find( 'input[type="checkbox"]:not(.noshiftselect)' ).checkboxShiftClick();
+	} );
+
+	// Things outside the wikipage content
+	$( function () {
+
+		if ( !supportsPlaceholder ) {
+			// Exclude content to avoid hitting it twice for the (first) wikipage content
+			$( 'input[placeholder]' ).not( '#mw-content-text input' ).placeholder();
+		}
 
-		/* Add accesskey hints to the tooltips */
+		// Add accesskey hints to the tooltips
 		mw.util.updateTooltipAccessKeys();
 
 	} );
+
 }( mediaWiki, jQuery ) );
diff --git a/resources/mediawiki.page/mediawiki.page.startup.js b/resources/mediawiki.page/mediawiki.page.startup.js
index 6a11d3e1..38466818 100644
--- a/resources/mediawiki.page/mediawiki.page.startup.js
+++ b/resources/mediawiki.page/mediawiki.page.startup.js
@@ -5,14 +5,23 @@
 	// Client profile classes for <html>
 	// Allows for easy hiding/showing of JS or no-JS-specific UI elements
 	$( 'html' )
-		.addClass('client-js' )
+		.addClass( 'client-js' )
 		.removeClass( 'client-nojs' );
 
-	// Initialize utilities as soon as the document is ready (mw.util.$content,
-	// messageBoxNew, profile, tooltip access keys, Table of contents toggle, ..).
-	// Enqueued into domready from here instead of mediawiki.page.ready to ensure that it gets enqueued
-	// before other modules hook into document ready, so that mw.util.$content (defined by mw.util.init),
-	// is defined for them.
-	$( mw.util.init );
+	$( function () {
+		// Initialize utilities as soon as the document is ready (mw.util.$content,
+		// messageBoxNew, profile, tooltip access keys, Table of contents toggle, ..).
+		// In the domready here instead of in mediawiki.page.ready to ensure that it gets enqueued
+		// before other modules hook into domready, so that mw.util.$content (defined by
+		// mw.util.init), is defined for them.
+		mw.util.init();
+
+		/**
+		 * @event wikipage_content
+		 * @member mw.hook
+		 * @param {jQuery} $content
+		 */
+		mw.hook( 'wikipage.content' ).fire( $( '#mw-content-text' ) );
+	} );
 
 }( mediaWiki, jQuery ) );
diff --git a/resources/mediawiki.page/mediawiki.page.watch.ajax.js b/resources/mediawiki.page/mediawiki.page.watch.ajax.js
index f945fa9d..e9afa4a2 100644
--- a/resources/mediawiki.page/mediawiki.page.watch.ajax.js
+++ b/resources/mediawiki.page/mediawiki.page.watch.ajax.js
@@ -71,7 +71,7 @@
 
 		actionPaths = mw.config.get( 'wgActionPaths' );
 
-		// @todo: Does MediaWiki give action path or query param
+		// @todo Does MediaWiki give action path or query param
 		// precedence ? If the former, move this to the bottom
 		action = mw.util.getParamValue( 'action', url );
 		if ( action !== null ) {
@@ -100,7 +100,7 @@
 		updateWatchLink: updateWatchLink
 	};
 
-	$( document ).ready( function () {
+	$( function () {
 		var $links = $( '.mw-watchlink a, a.mw-watchlink, ' +
 			'#ca-watch a, #ca-unwatch a, #mw-unwatch-link1, ' +
 			'#mw-unwatch-link2, #mw-watch-link2, #mw-watch-link1' );
@@ -161,7 +161,7 @@
 					cleanTitle = title.replace( /_/g, ' ' );
 					link = mw.html.element(
 						'a', {
-							href: mw.util.wikiGetlink( title ),
+							href: mw.util.getUrl( title ),
 							title: cleanTitle
 						}, cleanTitle
 					);