luci-base: ui.js: add createHandlerFn() helper

The createHandlerFn() helper function is useful to construct onclick
or similar event handling functions. It will add a "spinning" CSS
class on the event target element and disable the element, wrap the
given function with Promise.resolv() and re-enable the target element
once the promise is settled.

Signed-off-by: Jo-Philipp Wich <jo@mein.io>

1 files changed, 23 insertions, 0 deletions

diff --git a/modules/luci-base/htdocs/luci-static/resources/ui.js b/modules/luci-base/htdocs/luci-static/resources/ui.js
index 23a9d7bfda..e008681710 100644
--- a/modules/luci-base/htdocs/luci-static/resources/ui.js
+++ b/modules/luci-base/htdocs/luci-static/resources/ui.js
@@ -2081,6 +2081,29 @@ return L.Class.extend({
 		catch (e) { }
 	},
 
+	createHandlerFn: function(ctx, fn /*, ... */) {
+		if (typeof(fn) == 'string')
+			fn = ctx[fn];
+
+		if (typeof(fn) != 'function')
+			return null;
+
+		return Function.prototype.bind.apply(function() {
+			var t = arguments[arguments.length - 1].target;
+
+			t.classList.add('spinning');
+			t.disabled = true;
+
+			if (t.blur)
+				t.blur();
+
+			Promise.resolve(fn.apply(ctx, arguments)).then(function() {
+				t.classList.remove('spinning');
+				t.disabled = false;
+			});
+		}, this.varargs(arguments, 2, ctx));
+	},
+
 	/* Widgets */
 	Textfield: UITextfield,
 	Checkbox: UICheckbox,