luci-base: ui.js: add ComboButton widget
authorJo-Philipp Wich <jo@mein.io>
Sun, 10 Nov 2019 17:20:39 +0000 (18:20 +0100)
committerJo-Philipp Wich <jo@mein.io>
Fri, 22 Nov 2019 08:20:29 +0000 (09:20 +0100)
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
(cherry picked from commit 97a3bef84b9b68d6f88f209f80c284e3b2e7ea1a)

modules/luci-base/htdocs/luci-static/resources/ui.js

index 8dff42b3ba801a51c3843ef56fb31aa21001b868..2e360410dfb6720fc43f4a322b7573d75ac9aee5 100644 (file)
@@ -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))
@@ -2716,8 +2761,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;
@@ -2740,6 +2787,7 @@ return L.Class.extend({
        Dropdown: UIDropdown,
        DynamicList: UIDynamicList,
        Combobox: UICombobox,
+       ComboButton: UIComboButton,
        Hiddenfield: UIHiddenfield,
        FileUpload: UIFileUpload
 });