luci-base: ui.js: add ComboButton widget

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

1 files changed, 49 insertions, 1 deletions

diff --git a/modules/luci-base/htdocs/luci-static/resources/ui.js b/modules/luci-base/htdocs/luci-static/resources/ui.js
index c82b397c19..ffa36402a6 100644
--- a/modules/luci-base/htdocs/luci-static/resources/ui.js
+++ b/modules/luci-base/htdocs/luci-static/resources/ui.js
@@ -1188,6 +1188,51 @@ var UICombobox = UIDropdown.extend({
 	}
 });
 
+var UIComboButton = UIDropdown.extend({
+	__init__: function(value, choices, options) {
+		this.super('__init__', [ value, choices, Object.assign({
+			sort: true
+		}, options, {
+			multiple: false,
+			create: false,
+			optional: false
+		}) ]);
+	},
+
+	render: function(/* ... */) {
+		var node = UIDropdown.prototype.render.apply(this, arguments),
+		    val = this.getValue();
+
+		if (L.isObject(this.options.classes) && this.options.classes.hasOwnProperty(val))
+			node.setAttribute('class', 'cbi-dropdown ' + this.options.classes[val]);
+
+		return node;
+	},
+
+	handleClick: function(ev) {
+		var sb = ev.currentTarget,
+		    t = ev.target;
+
+		if (sb.hasAttribute('open') || L.dom.matches(t, '.cbi-dropdown > span.open'))
+			return UIDropdown.prototype.handleClick.apply(this, arguments);
+
+		if (this.options.click)
+			return this.options.click.call(sb, ev, this.getValue());
+	},
+
+	toggleItem: function(sb /*, ... */) {
+		var rv = UIDropdown.prototype.toggleItem.apply(this, arguments),
+		    val = this.getValue();
+
+		if (L.isObject(this.options.classes) && this.options.classes.hasOwnProperty(val))
+			sb.setAttribute('class', 'cbi-dropdown ' + this.options.classes[val]);
+		else
+			sb.setAttribute('class', 'cbi-dropdown');
+
+		return rv;
+	}
+});
+
 var UIDynamicList = UIElement.extend({
 	__init__: function(values, choices, options) {
 		if (!Array.isArray(values))
@@ -2700,8 +2745,10 @@ return L.Class.extend({
 		if (typeof(fn) != 'function')
 			return null;
 
+		var arg_offset = arguments.length - 2;
+
 		return Function.prototype.bind.apply(function() {
-			var t = arguments[arguments.length - 1].target;
+			var t = arguments[arg_offset].target;
 
 			t.classList.add('spinning');
 			t.disabled = true;
@@ -2724,6 +2771,7 @@ return L.Class.extend({
 	Dropdown: UIDropdown,
 	DynamicList: UIDynamicList,
 	Combobox: UICombobox,
+	ComboButton: UIComboButton,
 	Hiddenfield: UIHiddenfield,
 	FileUpload: UIFileUpload
 });