Simplify the cancel logic for input and display settings

Change-Id: I2afe78edad31b00a35d0589384e4091b61091275

resources/js/ext.uls.displaysettings.js

@@ -113,9 +113,11 @@
 			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();
@@ -620,48 +622,20 @@
 		 * Cancel the changes done by user for display settings
 		 */
 		cancel: function () {
-			var displaySettings = this,
+			if ( !this.dirty ) {
-				origUILanguage = this.getUILanguage();
-
-			if ( !displaySettings.dirty ) {
-				// Nothing changed
 				return;
 			}
-
 			// Reload preferences
-			mw.webfonts.preferences = $.extend( true, {}, displaySettings.savedRegistry );
+			mw.webfonts.preferences = $.extend( true, {}, this.savedRegistry );
-			if ( displaySettings.$webfonts ) {
-				displaySettings.$webfonts.refresh();
-			}
 
-			if ( $.i18n().locale !== origUILanguage ) {
+			// Restore fonts
-				// restore UI localization for display settings panel
+			if ( this.$webfonts ) {
-				$.i18n().locale = origUILanguage;
+				this.$webfonts.refresh();
-				this.i18n();
 			}
 
-			// Clear the dirty bit
-			displaySettings.dirty = false;
-			displaySettings.disableApplyButton();
-
 			// Restore content and UI language
-			displaySettings.uiLanguage = displaySettings.getUILanguage();
+			this.uiLanguage = this.getUILanguage();
-			displaySettings.contentLanguage = displaySettings.getContentLanguage();
+			this.contentLanguage = this.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,7 +75,6 @@
 		this.contentLanguage = this.getContentLanguage();
 		this.$imes = null;
 		this.$parent = $parent;
-		this.dirty = false;
 		this.savedRegistry = $.extend( true, {}, $.ime.preferences.registry );
 	}
 
@@ -88,11 +87,10 @@
 		 */
 		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();
@@ -106,6 +104,7 @@
 			this.prepareLanguages();
 			this.prepareToggleButton();
 			this.$template.i18n();
+			this.disableApplyButton();
 			$( 'body' ).data( 'webfonts' ).refresh();
 			this.listen();
 		},
@@ -454,8 +453,6 @@
 
 			inputSettings.$template.find( 'button.uls-input-settings-cancel' ).on( 'click', function () {
 				inputSettings.cancel();
-				// Redraw the panel according to the state
-				inputSettings.render();
 				inputSettings.close();
 			} );
 
@@ -569,12 +566,10 @@
 			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( '.input-settings-block.active' ).click();
+			this.$window.find( '.settings-menu-items > .active' ).click();
 			this.position();
 			this.visible();
 		},