From 442561663cdb8973add7be87d3e8f315c55cbf5a Mon Sep 17 00:00:00 2001
From: Santhosh Thottingal <santhosh.thottingal@gmail.com>
Date: Mon, 19 Nov 2012 17:02:41 +0530
Subject: [PATCH] Fix Bug 39684 - UI language change preview in display
 settings

When the user selects a UI language in the display settings dialog, the UI of
the dialog should preview immediately to the selected language. The change will
be only persisted if the user selects "apply changes".

Change-Id: I362e75c38c9d4a9921319f510653e2152d50fbb4
---
 resources/js/ext.uls.displaysettings.js | 32 +++++++++++++++++++++----
 1 file changed, 27 insertions(+), 5 deletions(-)

diff --git a/resources/js/ext.uls.displaysettings.js b/resources/js/ext.uls.displaysettings.js
index f5611bbe..58ddab42 100644
--- a/resources/js/ext.uls.displaysettings.js
+++ b/resources/js/ext.uls.displaysettings.js
@@ -111,7 +111,7 @@
 			this.prepareUIFonts();
 			this.prepareContentFonts();
 			this.prepareWebfontsCheckbox();
-			this.$template.i18n();
+			this.i18n();
 			this.listen();
 		},
 
@@ -178,6 +178,8 @@
 					$( 'div.uls-ui-languages button.button' ).removeClass( 'down' );
 					button.addClass( 'down' );
 					displaySettings.prepareUIFonts();
+					$.i18n().locale = displaySettings.uiLanguage;
+					displaySettings.i18n();
 				};
 			}
 
@@ -243,6 +245,8 @@
 					that.$parent.show();
 					that.prepareUIFonts();
 					that.prepareLanguages();
+					$.i18n().locale = langCode;
+					that.i18n();
 				},
 				quickList: function () {
 					return mw.uls.getFrequentLanguageList();
@@ -330,14 +334,25 @@
 			// uls-content-font-selector-label
 			$fontLabel = this.$template.find( '#' + target + '-font-selector-label' );
 			$fontLabel.empty();
-			$fontLabel.append( $( '<strong>' ).text(
-				$.i18n( 'ext-uls-webfonts-select-for', $.uls.data.getAutonym( language ) ) ) );
+			$fontLabel.append( $( '<strong>' ) );
 
 			// Possible messages:
 			// ext-uls-webfonts-select-for-ui-info
 			// ext-uls-webfonts-select-for-content-info
-			$fontLabel.append( $( '<div>' ).text(
-				$.i18n( 'ext-uls-webfonts-select-for-' + target + '-info' ) ) );
+			$fontLabel.append( $( '<div>' )
+				.attr( 'data-i18n', 'ext-uls-webfonts-select-for-' + target + '-info' ) );
+		},
+
+		/**
+		 * i18n this settings panel
+		 */
+		i18n: function () {
+			this.$template.i18n();
+
+			this.$template.find( '#ui-font-selector-label strong' )
+				.text( $.i18n( 'ext-uls-webfonts-select-for', $.uls.data.getAutonym( this.uiLanguage ) ) );
+			this.$template.find( '#content-font-selector-label strong' )
+				.text( $.i18n( 'ext-uls-webfonts-select-for', $.uls.data.getAutonym( this.contentLanguage ) ) );
 		},
 
 		/**
@@ -439,6 +454,13 @@
 		 * Depending on the context, actions vary.
 		 */
 		close: function () {
+			var origUILanguage = this.getUILanguage();
+
+			if ( $.i18n().locale !== origUILanguage ) {
+				// restore UI localization for display settings panel
+				$.i18n().locale = origUILanguage;
+				this.i18n();
+			}
 			this.$parent.close();
 		},