1 files changed, 63 insertions, 28 deletions

diff --git a/resources/mediawiki.special/mediawiki.special.preferences.js b/resources/mediawiki.special/mediawiki.special.preferences.js
index b7200826..47872907 100644
--- a/resources/mediawiki.special/mediawiki.special.preferences.js
+++ b/resources/mediawiki.special/mediawiki.special.preferences.js
@@ -1,7 +1,7 @@
 /*
  * JavaScript for Special:Preferences
  */
-( function( $, mw ) {
+jQuery( document ).ready( function ( $ ) {
 $( '#prefsubmit' ).attr( 'id', 'prefcontrol' );
 var $preftoc = $('<ul id="preftoc"></ul>');
 var $preferences = $( '#preferences' )
@@ -15,8 +15,35 @@ var $fieldsets = $preferences.children( 'fieldset' )
 var $legends = $fieldsets.children( 'legend' )
 	.addClass( 'mainLegend' );
 
+/**
+ * It uses document.getElementById for security reasons (html injections in
+ * jQuery()).
+ *
+ * @param String name: the name of a tab without the prefix ("mw-prefsection-")
+ * @param String mode: [optional] A hash will be set according to the current
+ * open section. Set mode 'noHash' to surpress this.
+ */
+function switchPrefTab( name, mode ) {
+	var $tab, scrollTop;
+	// Handle hash manually to prevent jumping,
+	// therefore save and restore scrollTop to prevent jumping.
+	scrollTop = $( window ).scrollTop();
+	if ( mode !== 'noHash' ) {
+		window.location.hash = '#mw-prefsection-' + name;
+	}
+	$( window ).scrollTop( scrollTop );
+
+	$preftoc.find( 'li' ).removeClass( 'selected' );
+	$tab = $( document.getElementById( 'preftab-' + name ) );
+	if ( $tab.length ) {
+		$tab.parent().addClass( 'selected' );
+		$preferences.children( 'fieldset' ).hide();
+		$( document.getElementById( 'mw-prefsection-' + name ) ).show();
+	}
+}
+
 // Populate the prefToc
-$legends.each( function( i, legend ) {
+$legends.each( function ( i, legend ) {
 	var $legend = $(legend);
 	if ( i === 0 ) {
 		$legend.parent().show();
@@ -30,18 +57,6 @@ $legends.each( function( i, legend ) {
 		text : $legend.text(),
 		id : ident.replace( 'mw-prefsection', 'preftab' ),
 		href : '#' + ident
-	}).click( function( e ) {
-		e.preventDefault();
-		// Handle hash manually to prevent jumping
-		// Therefore save and restore scrollTop to prevent jumping
-		var scrollTop = $(window).scrollTop();
-		window.location.hash = $(this).attr('href');
-		$(window).scrollTop(scrollTop);
-
-		$preftoc.find( 'li' ).removeClass( 'selected' );
-		$(this).parent().addClass( 'selected' );
-		$( '#preferences > fieldset' ).hide();
-		$( '#' + ident ).show();
 	});
 	$li.append( $a );
 	$preftoc.append( $li );
@@ -49,15 +64,35 @@ $legends.each( function( i, legend ) {
 
 // If we've reloaded the page or followed an open-in-new-window,
 // make the selected tab visible.
-// On document ready:
-$( function() {
-	var hash = window.location.hash;
-	if( hash.match( /^#mw-prefsection-[\w-]+/ ) ) {
-		var $tab = $( hash.replace( 'mw-prefsection', 'preftab' ) );
-		$tab.click();
-	}
-} );
+var hash = window.location.hash;
+if ( hash.match( /^#mw-prefsection-[\w\-]+/ ) ) {
+	switchPrefTab( hash.replace( '#mw-prefsection-' , '' ) );
+}
 
+// In browsers that support the onhashchange event we will not bind click
+// handlers and instead let the browser do the default behavior (clicking the
+// <a href="#.."> will naturally set the hash, handled by onhashchange.
+// But other things that change the hash will also be catched (e.g. using
+// the Back and Forward browser navigation).
+if ( 'onhashchange' in window ) {
+	$(window).on( 'hashchange' , function () {
+		var hash = window.location.hash;
+		if ( hash.match( /^#mw-prefsection-[\w\-]+/ ) ) {
+			switchPrefTab( hash.replace( '#mw-prefsection-', '' ) );
+		} else if ( hash === '' ) {
+			switchPrefTab( 'personal', 'noHash' );
+		}
+	});
+// In older browsers we'll bind a click handler as fallback.
+// We must not have onhashchange *and* the click handlers, other wise
+// the click handler calls switchPrefTab() which sets the hash value,
+// which triggers onhashcange and calls switchPrefTab() again.
+} else {
+	$preftoc.on( 'click', 'li a', function ( e ) {
+		switchPrefTab( $( this ).attr( 'href' ).replace( '#mw-prefsection-', '' ) );
+		e.preventDefault();
+	});
+}
 
 /**
 * Timezone functions.
@@ -71,7 +106,7 @@ var $localtimeHolder = $( '#wpLocalTime' );
 var servertime = parseInt( $( 'input[name=wpServerTime]' ).val(), 10 );
 var minuteDiff = 0;
 
-var minutesToHours = function( min ) {
+var minutesToHours = function ( min ) {
 	var tzHour = Math.floor( Math.abs( min ) / 60 );
 	var tzMin = Math.abs( min ) % 60;
 	var tzString = ( ( min >= 0 ) ? '' : '-' ) + ( ( tzHour < 10 ) ? '0' : '' ) + tzHour +
@@ -79,7 +114,7 @@ var minutesToHours = function( min ) {
 	return tzString;
 };
 
-var hoursToMinutes = function( hour ) {
+var hoursToMinutes = function ( hour ) {
 	var arr = hour.split( ':' );
 	arr[0] = parseInt( arr[0], 10 );
 
@@ -102,7 +137,7 @@ var hoursToMinutes = function( hour ) {
 	}
 };
 
-var updateTimezoneSelection = function() {
+var updateTimezoneSelection = function () {
 	var type = $tzSelect.val();
 	if ( type == 'guess' ) {
 		// Get browser timezone & fill it in
@@ -133,8 +168,8 @@ var updateTimezoneSelection = function() {
 };
 
 if ( $tzSelect.length && $tzTextbox.length ) {
-	$tzSelect.change( function() { updateTimezoneSelection(); } );
-	$tzTextbox.blur( function() { updateTimezoneSelection(); } );
+	$tzSelect.change( function () { updateTimezoneSelection(); } );
+	$tzTextbox.blur( function () { updateTimezoneSelection(); } );
 	updateTimezoneSelection();
 }
-} )( jQuery, mediaWiki );
\ No newline at end of file
+} );