Merge "Revert "Simplify the cancel logic for input and display settings""

resources/js/ext.uls.displaysettings.js

@@ -113,11 +113,9 @@
 			this.$parent.$settingsPanel.empty();
 			this.$webfonts = $( 'body' ).data( 'webfonts' );
 			this.$parent.$settingsPanel.append( this.$template );
-			this.disableApplyButton();
 			this.prepareLanguages();
 			this.prepareUIFonts();
 			this.prepareContentFonts();
-			$.i18n().locale = this.uiLanguage;
 			this.i18n();
 			this.$webfonts.refresh();
 			this.listen();
@@ -622,14 +620,48 @@
 		 * Cancel the changes done by user for display settings
 		 */
 		cancel: function () {
-			if ( !this.dirty ) {
+			var displaySettings = this,
+				origUILanguage = this.getUILanguage();
+
+			if ( !displaySettings.dirty ) {
+				// Nothing changed
 				return;
 			}
+
 			// Reload preferences
-			mw.webfonts.preferences = $.extend( true, {}, this.savedRegistry );
+			mw.webfonts.preferences = $.extend( true, {}, displaySettings.savedRegistry );
+			if ( displaySettings.$webfonts ) {
+				displaySettings.$webfonts.refresh();
+			}
+
+			if ( $.i18n().locale !== origUILanguage ) {
+				// restore UI localization for display settings panel
+				$.i18n().locale = origUILanguage;
+				this.i18n();
+			}
+
+			// Clear the dirty bit
+			displaySettings.dirty = false;
+			displaySettings.disableApplyButton();
+
 			// Restore content and UI language
-			this.uiLanguage = this.getUILanguage();
+			displaySettings.uiLanguage = displaySettings.getUILanguage();
-			this.contentLanguage = this.getContentLanguage();
+			displaySettings.contentLanguage = displaySettings.getContentLanguage();
+
+			// Restore the font dropdowns
+			displaySettings.prepareUIFonts();
+			displaySettings.prepareContentFonts();
+
+			// Restore the visual state of selected language button
+			displaySettings.$template.find( 'div.uls-ui-languages button.button' ).each( function () {
+				var $button = $( this );
+
+				if ( $button.attr( 'lang' ) === displaySettings.uiLanguage ) {
+					$button.addClass( 'down' );
+				} else {
+					$button.removeClass( 'down' );
+				}
+			} );
 		}
 	};
 

resources/js/ext.uls.inputsettings.js

@@ -75,6 +75,7 @@
 		this.contentLanguage = this.getContentLanguage();
 		this.$imes = null;
 		this.$parent = $parent;
+		this.dirty = false;
 		this.savedRegistry = $.extend( true, {}, $.ime.preferences.registry );
 	}
 
@@ -87,10 +88,11 @@
 		 */
 		render: function () {
 			var $enabledOnly;
-			this.dirty = false;
+
 			this.$parent.$settingsPanel.empty();
 			this.$imes = $( 'body' ).data( 'ime' );
 			this.$parent.$settingsPanel.append( this.$template );
+
 			$enabledOnly = this.$template.find( '.enabled-only' );
 			// ime system is lazy loaded, make sure it is initialized
 			mw.ime.init();
@@ -104,7 +106,6 @@
 			this.prepareLanguages();
 			this.prepareToggleButton();
 			this.$template.i18n();
-			this.disableApplyButton();
 			$( 'body' ).data( 'webfonts' ).refresh();
 			this.listen();
 		},
@@ -453,6 +454,8 @@
 
 			inputSettings.$template.find( 'button.uls-input-settings-cancel' ).on( 'click', function () {
 				inputSettings.cancel();
+				// Redraw the panel according to the state
+				inputSettings.render();
 				inputSettings.close();
 			} );
 
@@ -566,10 +569,12 @@
 			if ( !this.dirty ) {
 				return;
 			}
+			this.dirty = false;
+			this.disableApplyButton();
+
 			// Reload preferences
 			$.ime.preferences.registry = $.extend( true, {}, this.savedRegistry );
-			this.uiLanguage = this.getInterfaceLanguage();
+
-			this.contentLanguage = this.getContentLanguage();
 			// Restore the state of IME
 			if ( $.ime.preferences.isEnabled() ) {
 				mw.ime.setup();

resources/js/ext.uls.languagesettings.js

@@ -173,7 +173,7 @@
 
 			// Every time we show this window, make sure the current
 			// settings panels is upto date. So just click on active menu item.
-			this.$window.find( '.settings-menu-items > .active' ).click();
+			this.$window.find( '.input-settings-block.active' ).click();
 			this.position();
 			this.visible();
 		},