Hello guys.

I'm trying to create a new authentication system provider (for authenticating users through SAML form post) and I'm a little stuck on how to make the settings form look like the settings of the other providers (login and logoff are already working well). 

The first thing I'd like to know is what do I need to do in order for my settings dialog have the same look as the one that standard authentication services settings have. For instance, here's how my settings look now:

 I'd like them to look like this 

I've tried to reproduce the code used by the Google authentication system provider, but I'm surely missing something because the results are completely different (just compare the previous images). The first question I have is how do I get those beautiful styles applied to my settings form? In my case, I've ended up only with a single button and the controls aren't styled like the ones generated by the google authentication settings. 

The second question I have is why do I have that blue header (chrome dev tools show that it's a fieldset) at the top?

The third question is how does the google authentication settings manage to get away with those labels names (App Id and App Secret - notice that these names are different from the property names of the settings class that is bound to the PropertyEditorControl). I've tried looking for attributes that might influence this, but haven't found any. In order to change the labels shown by my custom settings forms, I've ended setting the AutoGenerate property of the PropertyEditorControl to false and I had to handle the OnItemCreated event of the FieldEditorControl. BTW, How can I change the help text that's shown? In my case, it ends up showing the same value as the name of the property...

Is there any support for related properties? For instance, in my case, one of the setting properties should have the same value as one of the lines of another setting's property. Is there any easy way for performing this setup? How am I supposed to validate this?

I've tried to base my code on the one used by the out of the box oauth authentication system providers. Since my provider is not an OAuth provider, I didn't reuse the base classes, but I've ported most of the code. Here's my settings class that is bound to the PropertyEditorControl:

namespace Pagesp.Authentication.CartaoCidadao.Components {
    public class CartaoCidadaoConfigBase : AuthenticationConfigBase {
        private const string _cacheKey = "CCAuthentication";
        public CartaoCidadaoConfigBase(string service, int portalId) : base(portalId) {
            Service = service;
            Thumbprint = PortalController.GetPortalSetting(Service + "_Thumbprint", portalId, "");
            //other properties initialized in similar way
        }

        protected string Service { get; set; }
        public string Thumbprint { get; set; }
       //other properties are similar
        private static string GetCacheKey(string service, int portalId) {
            return _cacheKey + "." + service + "_" + portalId;
        }
        public static void ClearConfig(string service, int portalId) {
            DataCache.RemoveCache(GetCacheKey(service, portalId));
        }
        public static CartaoCidadaoConfigBase GetConfig(string service, int portalId) {
            var key = GetCacheKey(service, portalId);
            var config = (CartaoCidadaoConfigBase) DataCache.GetCache(key);
            if (config == null) {
                config = new CartaoCidadaoConfigBase(service, portalId);
                DataCache.SetCache(key, config);
            }
            return config;
        }
        public static void UpdateConfig(CartaoCidadaoConfigBase config) {
            PortalController.UpdatePortalSetting(config.PortalID, config.Service + "_Thumbprint", config.Thumbprint);
            // other properties saved in similar fashion
            ClearConfig(config.Service, config.PortalID);
        }
    }
}

Since I didn't find a way to change the way the PropertyEditorControl renders the labels, I've decided to use FieldEditorControl entries for setting up the properties:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="Settings.ascx.cs" Inherits="Pagesp.Authentication.CartaoCidadao.Settings" %>
<%@ Register TagPrefix="dnn" Namespace="DotNetNuke.UI.WebControls" Assembly="DotNetNuke" %>
<%@ Register TagPrefix="cc" Namespace="Pagesp.Authentication.CartaoCidadao.Components" Assembly="Pagesp.Authentication.CartaoCidadao" %>
<dnn:propertyeditorcontrol id="SettingsEditor" runat="Server" 
                           helpstyle-cssclass="dnnFormHelpContent dnnClear" 
                           labelstyle-cssclass="SubHead"     
                           editmode="Edit"
                           SortMode="SortOrderAttribute" 
    AutoGenerate="False">
    <Fields>
        <dnn:FieldEditorControl runat="server"  DataField="Provider" 
            Required="True" OnItemCreated="HandleItemCreated"></dnn:FieldEditorControl>
<!-- Other FieldEditorControls are similar -->
    </Fields>
</dnn:propertyeditorcontrol>

And here's the codebehind file:

namespace Pagesp.Authentication.CartaoCidadao {
    public partial class Settings : AuthenticationSettingsBase {
        protected PropertyEditorControl SettingsEditor;
        public string AuthSystemApplicationName => "CartaoCidadao";
        //Used for mapping prop names into different labels
        public static readonly Dictionary<string, string> _mapeamentos = new Dictionary<string, string> {
                                           {"Provider", "Nome do Provider"},
//other mappings removed

                                       };
           public override void UpdateSettings() {
               if (SettingsEditor.IsValid && SettingsEditor.IsDirty) {
                   var config = (CartaoCidadaoConfigBase) SettingsEditor.DataSource;
                   CartaoCidadaoConfigBase.UpdateConfig(config);
               }
           }
           protected override void (EventArgs e) {
               base. (e);
               var config = CartaoCidadaoConfigBase.GetConfig(AuthSystemApplicationName, PortalId);
               SettingsEditor.DataSource = config;
               SettingsEditor.DataBind();
           }
           protected void HandleItemCreated(object sender, PropertyEditorItemEventArgs e) {
               if (_mapeamentos.TryGetValue(e.Editor.Name, out var label)) {
                   e.Editor.Name = label;
               }
           }
    }
}

So, any help on how to solve this? 

Thanks!

Regards,

Luis