From becd284d513f52d6ca473c35d11f598f018cfe83 Mon Sep 17 00:00:00 2001
From: Timo Tijhof <krinklemail@gmail.com>
Date: Sun, 6 Oct 2013 23:27:37 +0200
Subject: [PATCH] mediawiki.action.edit.preview: Clean up and optimisation

* Remove redundant inline 'position: absolute' on the spinner.
* Remove trailing white space in jquery.spinner.css.
* Cache #editform query result.
* Remove redundant removeSelectors.join(',') logic.
* White space.
* Move delegate click event listener down from body to #editform
  (the common ancestor of the #wpDiff and #wpPreview buttons).
* Remove minHeight (was needed because the spinner was positioned
  absolute), which gets rid of the weird white gap for #wikiPreview if
  you do live diff instead of live preview.

Change-Id: Icdf975f201947ecadb886057131f2531c68791fb
---
 resources/jquery/jquery.spinner.css           |  2 +-
 .../mediawiki.action.edit.preview.js          | 28 ++++++-------------
 2 files changed, 10 insertions(+), 20 deletions(-)

diff --git a/resources/jquery/jquery.spinner.css b/resources/jquery/jquery.spinner.css
index 4a77528327..a9e06dbe20 100644
--- a/resources/jquery/jquery.spinner.css
+++ b/resources/jquery/jquery.spinner.css
@@ -33,7 +33,7 @@
 .mw-spinner-inline {
 	display: inline-block;
 	vertical-align: middle;
-	
+
 	/* IE < 8 */
 	zoom: 1;
 	*display: inline;
diff --git a/resources/mediawiki.action/mediawiki.action.edit.preview.js b/resources/mediawiki.action/mediawiki.action.edit.preview.js
index 2b97b874b4..d9ab97983f 100644
--- a/resources/mediawiki.action/mediawiki.action.edit.preview.js
+++ b/resources/mediawiki.action/mediawiki.action.edit.preview.js
@@ -7,7 +7,7 @@
 	 * @param {jQuery.Event} e
 	 */
 	function doLivePreview( e ) {
-		var $wikiPreview, copySelectors, removeSelectors, $copyElements, $spinner,
+		var $wikiPreview, $editform, copySelectors, $copyElements, $spinner,
 			targetUrl, postData, $previewDataHolder;
 
 		e.preventDefault();
@@ -16,6 +16,7 @@
 		$( mw ).trigger( 'LivePreviewPrepare' );
 
 		$wikiPreview = $( '#wikiPreview' );
+		$editform = $( '#editform' );
 
 		// Show #wikiPreview if it's hidden to be able to scroll to it
 		// (if it is hidden, it's also empty, so nothing changes in the rendering)
@@ -41,11 +42,7 @@
 		$copyElements = $( copySelectors.join( ',' ) );
 
 		// Not shown during normal preview, to be removed if present
-		removeSelectors = [
-			'.mw-newarticletext'
-		];
-
-		$( removeSelectors.join( ',' ) ).remove();
+		$( '.mw-newarticletext' ).remove();
 
 		$spinner = $.createSpinner( {
 			size: 'large',
@@ -53,26 +50,18 @@
 		});
 		$wikiPreview.before( $spinner );
 		$spinner.css( {
-			position: 'absolute',
 			marginTop: $spinner.height()
 		} );
-		// Make sure preview area is at least as tall as 2x the height of the spinner.
-		// 1x because if its smaller, it will spin behind the edit toolbar.
-		// (this happens on the first preview when editPreview is still empty)
-		// 2x because the spinner has 1x margin top breathing room.
-		$wikiPreview.css( 'minHeight', $spinner.height() * 2 );
 
 		// Can't use fadeTo because it calls show(), and we might want to keep some elements hidden
 		// (e.g. empty #catlinks)
-		$copyElements.animate( {
-			opacity: 0.4
-		}, 'fast' );
+		$copyElements.animate( { opacity: 0.4 }, 'fast' );
 
 		$previewDataHolder = $( '<div>' );
-		targetUrl = $( '#editform' ).attr( 'action' );
+		targetUrl = $editform.attr( 'action' );
 
 		// Gather all the data from the form
-		postData = $( '#editform' ).formToArray();
+		postData = $editform.formToArray();
 		postData.push( {
 			name: e.target.name,
 			value: ''
@@ -83,6 +72,7 @@
 		// although that requires figuring out how to convert that raw data into proper HTML.
 		$previewDataHolder.load( targetUrl + ' ' + copySelectors.join( ',' ), postData, function () {
 			var i, $from;
+
 			// Copy the contents of the specified elements from the loaded page to the real page.
 			// Also copy their class attributes.
 			for ( i = 0; i < copySelectors.length; i++ ) {
@@ -133,11 +123,11 @@
 
 		if ( !document.getElementById( 'wikiDiff' ) && document.getElementById( 'wikiPreview' ) ) {
 			$( '#wikiPreview' ).after(
-				$( '<div>' ).attr( 'id', 'wikiDiff')
+				$( '<div>' ).attr( 'id', 'wikiDiff' )
 			);
 		}
 
-		$( document.body ).on( 'click', '#wpPreview, #wpDiff', doLivePreview );
+		$( '#editform' ).on( 'click', '#wpPreview, #wpDiff', doLivePreview );
 	} );
 
 }( mediaWiki, jQuery ) );
-- 
2.20.1