From 277b0db94d7f8d1bf574de9359643ec9842aa478 Mon Sep 17 00:00:00 2001
From: Santhosh Thottingal <santhosh.thottingal@gmail.com>
Date: Thu, 14 Nov 2013 17:31:35 +0530
Subject: [PATCH] Visual indication while saving the settings

* Button label change to "applying changes"
* Button become disabled
* Cursor changes to "progress"

Bug: 53772
Change-Id: I1de459590ea9b357965a73f274d566eba8c04482
---
 i18n/en.json                               |  1 +
 i18n/qqq.json                              |  3 ++-
 resources/css/ext.uls.languagesettings.css |  4 ++++
 resources/js/ext.uls.displaysettings.js    |  2 ++
 resources/js/ext.uls.inputsettings.js      |  2 ++
 resources/js/ext.uls.languagesettings.js   | 22 ++++++++++++++++++++++
 6 files changed, 33 insertions(+), 1 deletion(-)

diff --git a/i18n/en.json b/i18n/en.json
index 03046e47..61a7b816 100644
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -47,5 +47,6 @@
 "ext-uls-input-disable-notification-undo": "Undo",
 "ext-uls-input-disable-notification-info-personal": "You can enable the input tools at any time from the language settings.",
 "ext-uls-input-disable-notification-info-interlanguage": "You can enable the input tools at any time from the language settings next to the language list.",
+"ext-uls-language-settings-applying": "Applying...",
 "ext-uls-language-settings-preferences-link": "More language settings"
 }
diff --git a/i18n/qqq.json b/i18n/qqq.json
index 1267663e..80e1b6eb 100644
--- a/i18n/qqq.json
+++ b/i18n/qqq.json
@@ -48,5 +48,6 @@
     "ext-uls-input-disable-notification-undo": "Undo link text in the input method disable notification bubble",
     "ext-uls-input-disable-notification-info-personal": "Notification bubble text when input methods are disabled, appears if the ULS is at personal toolbar",
     "ext-uls-input-disable-notification-info-interlanguage": "Notification bubble text when input methods are disabled, appears if the ULS is at interlanguage toolbar",
+    "ext-uls-language-settings-applying": "Label for apply settings button in language settings screen, while settings being saved. Please keep it short.",
     "ext-uls-language-settings-preferences-link": "Text for the link showin in user preference screen"
-}
\ No newline at end of file
+}
diff --git a/resources/css/ext.uls.languagesettings.css b/resources/css/ext.uls.languagesettings.css
index b7a1b94c..7ec8debb 100644
--- a/resources/css/ext.uls.languagesettings.css
+++ b/resources/css/ext.uls.languagesettings.css
@@ -120,3 +120,7 @@
 label.checkbox input[type="checkbox"] {
 	float: left;
 }
+
+.waiting {
+	cursor: progress;
+}
\ No newline at end of file
diff --git a/resources/js/ext.uls.displaysettings.js b/resources/js/ext.uls.displaysettings.js
index 8045063b..07f15299 100644
--- a/resources/js/ext.uls.displaysettings.js
+++ b/resources/js/ext.uls.displaysettings.js
@@ -573,6 +573,7 @@
 				return;
 			}
 
+			displaySettings.$parent.setBusy( true );
 			// Save the preferences
 			mw.webfonts.preferences.save( function ( result ) {
 				var newFonts = mw.webfonts.preferences.registry.fonts || {},
@@ -595,6 +596,7 @@
 				displaySettings.dirty = false;
 				// Update the back-up preferences for the case of canceling
 				displaySettings.savedRegistry = $.extend( true, {}, mw.webfonts.preferences );
+				displaySettings.$parent.setBusy( false );
 			} );
 		},
 
diff --git a/resources/js/ext.uls.inputsettings.js b/resources/js/ext.uls.inputsettings.js
index a3f79c4e..11e592fb 100644
--- a/resources/js/ext.uls.inputsettings.js
+++ b/resources/js/ext.uls.inputsettings.js
@@ -507,6 +507,7 @@
 				// No changes to save in this module.
 				return;
 			}
+			inputSettings.$parent.setBusy( true );
 
 			if ( previousLanguage ) {
 				previousIM = inputSettings.savedRegistry.imes[previousLanguage];
@@ -530,6 +531,7 @@
 				inputSettings.dirty = false;
 				// Update the back-up preferences for the case of canceling
 				inputSettings.savedRegistry = $.extend( true, {}, $.ime.preferences.registry );
+				inputSettings.$parent.setBusy( false );
 			} );
 		},
 
diff --git a/resources/js/ext.uls.languagesettings.js b/resources/js/ext.uls.languagesettings.js
index 8b75c36e..01fa1b6d 100644
--- a/resources/js/ext.uls.languagesettings.js
+++ b/resources/js/ext.uls.languagesettings.js
@@ -234,6 +234,28 @@
 			this.$window.hide();
 		},
 
+		/**
+		 * Put the language settings panel in busy mode.
+		 * Busy mode means displaying a progress cursor,
+		 * and showing the 'apply' button as disabled and with
+		 * a different label.
+		 * @param {boolean} busy set true to put the panel in busy mode,
+		 *     false to unset the busy mode.
+		 */
+		setBusy: function ( busy ) {
+			var $applyButton = this.$window.find( 'button.uls-settings-apply' );
+
+			if ( busy ) {
+				this.$window.addClass( 'waiting' );
+				$applyButton
+					.text( $.i18n( 'ext-uls-language-settings-applying' ) )
+					.prop( 'disabled', true );
+			} else {
+				this.$window.removeClass( 'waiting' );
+				$applyButton.text( $.i18n( 'ext-uls-language-settings-apply' ) );
+			}
+		},
+
 		/**
 		 * Close this language settings window, and
 		 * call onClose if defined from the previous context.