Auth Indicators WebUI part

Add custom_checkbox_widget on service page. The old  aci.attribute_widget
now inherits from the new base class custom_checkboxes_widget and overrides
the populate method.

https://fedorahosted.org/freeipa/ticket/5872

Reviewed-By: Petr Vobornik <pvoborni@redhat.com>

3 files changed, 215 insertions, 165 deletions

diff --git a/install/ui/src/freeipa/aci.js b/install/ui/src/freeipa/aci.js
index 9a19dd7b4..6ac7f4c71 100644
--- a/install/ui/src/freeipa/aci.js
+++ b/install/ui/src/freeipa/aci.js
@@ -537,146 +537,24 @@ return {
     }
 };};
 
-/**
- * @class aci.attributes_widget
- * @extends IPA.checkboxes_widget
- */
 aci.attributes_widget = function(spec) {
 
     spec = spec || {};
     spec.layout = spec.layout || 'columns attribute_widget';
-    spec.sort = spec.sort === undefined ? true : spec.sort;
-
-    var that = IPA.checkboxes_widget(spec);
+    spec.add_dialog_title = spec.add_dialog_title ||
+                            "@i18n:objects.permission.add_custom_attr";
+    spec.add_field_label = spec.add_field_label ||
+                            '@i18n:objects.permission.attribute';
 
-    /**
-     * Additional options which are not defined in metadata
-     * @property {string[]}
-     */
-    that.custom_options = spec.custom_options || [];
+    var that = IPA.custom_checkboxes_widget(spec);
 
     that.object_type = spec.object_type;
-    that.skip_unmatched = spec.skip_unmatched === undefined ? false : spec.skip_unmatched;
 
-    var id = spec.name;
-
-    that.create = function(container) {
-        that.container = container;
-        that.widget_create(container);
-
-        that.controls = $('<div/>', {
-            'class': 'form-inline controls'
-        });
-        that.controls.appendTo(container);
-        that.create_search_filter(that.controls);
-        that.create_add_control(that.controls);
-        if (that.undo) {
-            that.create_undo(that.controls);
-        }
-
-        that.owb_create(container);
-
-        that.create_error_link(container);
-    };
-
-    that.create_search_filter = function(container) {
-        var filter_container = $('<div/>', {
-            'class': 'search-filter'
-        });
-
-        that.filter = $('<input/>', {
-            type: 'text',
-            name: 'filter',
-            'class': 'form-control',
-            placeholder: text.get('@i18n:objects.permission.filter')
-        }).appendTo(filter_container);
-
-        that.filter.keyup(function(e) {
-            that.filter_options();
-        });
+    that.populate = function() {
 
-        var find_button = IPA.action_button({
-            name: 'find',
-            icon: 'fa-search',
-            click: function() {
-                that.filter_options();
-                return false;
-            }
-        }).appendTo(filter_container);
-
-        filter_container.appendTo(container);
-    };
-
-    that.create_add_control = function(container) {
-
-        that.add_button = IPA.button({
-            label: '@i18n:buttons.add',
-            click: that.show_add_dialog
-        });
-        container.append(' ');
-        that.add_button.appendTo(container);
-    };
-
-    that.show_add_dialog = function() {
-
-        var dialog = IPA.form_dialog({
-            name: "add_option",
-            title: "@i18n:objects.permission.add_custom_attr",
-            fields: [
-                {
-                    name: 'attr',
-                    label: '@i18n:objects.permission.attribute',
-                    required: true
-                }
-            ]
-        });
-        dialog.on_confirm = function() {
-            if (!dialog.validate()) return;
-            var attr = dialog.get_field('attr');
-            var value = attr.get_value()[0];
-            that.add_custom_option(value, false, true, true);
-            dialog.close();
-        };
-        dialog.open();
-    };
+        if (!that.object_type || that.object_type === '') return;
 
-    that.filter_options = function() {
-        $("li", that.$node).each(function() {
-            var item = $(this);
-            if(item.find('input').val().indexOf(that.filter.val()) === -1) {
-                item.css('display','none');
-            } else {
-                item.css('display','inline');
-            }
-        });
-    };
-
-    that.update = function(values) {
-
-        that.values = [];
-
-        values = values || [];
-        for (var i=0; i<values.length; i++) {
-
-            var value = values[i];
-
-            if (!value || value === '') continue;
-
-            value = value.toLowerCase();
-            that.values.push(value);
-        }
-
-        that.populate(that.object_type);
-        that.append();
-        that.owb_create(that.container);
-        that.owb_update(values);
-    };
-
-    that.populate = function(object_type) {
-
-        if (!object_type || object_type === '') return;
-
-        var metadata = metadata_provider.get('@mo:'+object_type);
+        var metadata = metadata_provider.get('@mo:'+that.object_type);
         if (!metadata) return;
 
         var aciattrs = metadata.aciattrs;
@@ -684,41 +562,6 @@ aci.attributes_widget = function(spec) {
         that.options = that.prepare_options(aciattrs);
     };
 
-    that.append = function() {
-
-        var unmatched = [];
-
-        function add_unmatched(source) {
-            for (var i=0, l=source.length; i<l; i++) {
-                if (!that.has_option(source[i])) {
-                    that.add_option(source[i], true /* suppress update */);
-                }
-            }
-        }
-
-        add_unmatched(that.custom_options);
-
-        if (that.values && !that.skip_unmatched) {
-            add_unmatched(that.values);
-        }
-    };
-
-    that.add_custom_option = function(name, to_custom, check, update) {
-
-        var value = (name || '').toLowerCase();
-        if (to_custom) that.custom_options.push(value);
-        if (check) that.values.push(value);
-        if (update) that.update(that.values);
-    };
-
-    that.has_option = function(value) {
-        var o = that.options;
-        for (var i=0, l=o.length; i<l; i++) {
-            if (o[i].value === value) return true;
-        }
-        return false;
-    };
-
     return that;
 };
 
diff --git a/install/ui/src/freeipa/service.js b/install/ui/src/freeipa/service.js
index f1f8d951e..73732dd48 100644
--- a/install/ui/src/freeipa/service.js
+++ b/install/ui/src/freeipa/service.js
@@ -109,6 +109,26 @@ return {
                             ]
                         },
                         {
+                            $type: 'custom_checkboxes',
+                            label: '@i18n:objects.service.auth_indicators',
+                            name: 'krbprincipalauthind',
+                            add_dialog_title: '@i18n:objects.service.custom_auth_ind_title',
+                            add_field_label: '@i18n:objects.service.auth_indicator',
+                            options: [
+                                {
+                                    label: '@i18n:authtype.otp',
+                                    value: 'otp'
+                                },
+                                {
+                                    label: '@i18n:authtype.type_radius',
+                                    value: 'radius'
+                                }
+                            ],
+                            tooltip: {
+                                title: '@mc-opt:service_add:krbprincipalauthind:doc'
+                            }
+                        },
+                        {
                             name: 'ipakrbokasdelegate',
                             $type: 'checkbox',
                             acl_param: 'krbticketflags'
diff --git a/install/ui/src/freeipa/widget.js b/install/ui/src/freeipa/widget.js
index fc2d6ef0b..0f3e7f27b 100644
--- a/install/ui/src/freeipa/widget.js
+++ b/install/ui/src/freeipa/widget.js
@@ -1980,6 +1980,192 @@ IPA.checkboxes_widget = function (spec) {
     return that;
 };
 
+
+/**
+ * @class IPA.custom_checkboxes_widget
+ * @extends IPA.checkboxes_widget
+ */
+IPA.custom_checkboxes_widget = function(spec) {
+
+    spec = spec || {};
+    spec.layout = spec.layout || 'columns attribute_widget';
+    spec.sort = spec.sort === undefined ? true : spec.sort;
+
+    var that = IPA.checkboxes_widget(spec);
+
+    that.add_dialog_title = spec.add_dialog_title ||
+                            "@i18n:dialogs.add_custom_value";
+    that.add_field_label = spec.add_field_label ||
+                            '@i18n:dialogs.custom_value';
+
+    /**
+     * Additional options
+     * @property {string[]}
+     */
+    that.custom_options = spec.custom_options || [];
+
+    that.skip_unmatched = spec.skip_unmatched === undefined ? false : spec.skip_unmatched;
+
+    var id = spec.name;
+
+    that.create = function(container) {
+        that.container = container;
+        that.widget_create(container);
+
+        that.controls = $('<div/>', {
+            'class': 'form-inline controls'
+        });
+        that.controls.appendTo(container);
+        that.create_search_filter(that.controls);
+        that.create_add_control(that.controls);
+        if (that.undo) {
+            that.create_undo(that.controls);
+        }
+
+        that.owb_create(container);
+
+        that.create_error_link(container);
+    };
+
+    that.create_search_filter = function(container) {
+        var filter_container = $('<div/>', {
+            'class': 'search-filter'
+        });
+
+        that.filter = $('<input/>', {
+            type: 'text',
+            name: 'filter',
+            'class': 'form-control',
+            placeholder: text.get('@i18n:search.placeholder_filter')
+        }).appendTo(filter_container);
+
+        that.filter.keyup(function(e) {
+            that.filter_options();
+        });
+
+        var find_button = IPA.action_button({
+            name: 'find',
+            icon: 'fa-search',
+            click: function() {
+                that.filter_options();
+                return false;
+            }
+        }).appendTo(filter_container);
+
+        filter_container.appendTo(container);
+    };
+
+    that.create_add_control = function(container) {
+
+        that.add_button = IPA.button({
+            label: '@i18n:buttons.add',
+            click: that.show_add_dialog
+        });
+        container.append(' ');
+        that.add_button.appendTo(container);
+    };
+
+    that.show_add_dialog = function() {
+
+        var dialog = IPA.form_dialog({
+            name: "add_option",
+            title: that.add_dialog_title,
+            fields: [
+                {
+                    name: 'custom_value',
+                    label: that.add_field_label,
+                    required: true
+                }
+            ]
+        });
+        dialog.on_confirm = function() {
+            if (!dialog.validate()) return;
+            var attr = dialog.get_field('custom_value');
+            var value = attr.get_value()[0];
+            that.add_custom_option(value, false, true, true);
+            dialog.close();
+        };
+        dialog.open();
+    };
+
+    that.filter_options = function() {
+        $("li", that.$node).each(function() {
+            var item = $(this);
+            if(item.find('input').val().indexOf(that.filter.val()) === -1) {
+                item.css('display','none');
+            } else {
+                item.css('display','inline');
+            }
+        });
+    };
+
+    that.update = function(values) {
+
+        that.values = [];
+
+        values = values || [];
+        for (var i=0; i<values.length; i++) {
+
+            var value = values[i];
+
+            if (!value || value === '') continue;
+
+            value = value.toLowerCase();
+            that.values.push(value);
+        }
+
+        that.populate();
+        that.append();
+        that.owb_create(that.container);
+        that.owb_update(values);
+    };
+
+    /**
+     * Method which can be overridden by child class for adding own
+     * autogenerated values. These values should be prepared using
+     * that.prepare_option() method and stored in that.options.
+     */
+    that.populate = function() {};
+
+    that.append = function() {
+
+        var unmatched = [];
+
+        function add_unmatched(source) {
+            for (var i=0, l=source.length; i<l; i++) {
+                if (!that.has_option(source[i])) {
+                    that.add_option(source[i], true /* suppress update */);
+                }
+            }
+        }
+
+        add_unmatched(that.custom_options);
+
+        if (that.values && !that.skip_unmatched) {
+            add_unmatched(that.values);
+        }
+    };
+
+    that.add_custom_option = function(name, to_custom, check, update) {
+
+        var value = (name || '').toLowerCase();
+        if (to_custom) that.custom_options.push(value);
+        if (check) that.values.push(value);
+        if (update) that.update(that.values);
+    };
+
+    that.has_option = function(value) {
+        var o = that.options;
+        for (var i=0, l=o.length; i<l; i++) {
+            if (o[i].value === value) return true;
+        }
+        return false;
+    };
+
+    return that;
+};
+
+
 /**
  * Creates input with properties defined by `spec` and an empty label which
  * targets the input.
@@ -6436,6 +6622,7 @@ exp.register = function() {
     w.register('action_panel', IPA.action_panel);
     w.register('activity', IPA.activity_widget);
     w.register('attribute_table', IPA.attribute_table_widget);
+    w.register('custom_checkboxes', IPA.custom_checkboxes_widget);
     w.register('button', IPA.button_widget);
     w.register('checkbox', IPA.checkbox_widget);
     w.register('checkboxes', IPA.checkboxes_widget);