Skip to Content
avatar image
Former Member

Kapsel Logon Plugin customization

Hi,

I am trying to style the login screens with Ionic framework in the kapsel logon plugin .The fields in the logon plugin are stored in StaticScreens.js, when changing some fields to 'visible:false', the field is not visible anymore but the server is not connecting, so, if the field is hidden, the plugin is not getting the information. I want only to display "username" and "password" on the main page with a specified background.

The logon plugin is using ui5 to display the screens, but I need to style that with a different framework .

Is there anyway that I can customize the screen and send the information to the plugin on clicking the event of the login screen?

Could anyone please help me to resolve this.

Thanks ,

Archana Vasudevan

Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

1 Answer

  • May 24, 2015 at 11:12 AM

    Hi Archana,

    The application should be able to connect to your server even when you hide the fields on the screen. I have tried it.

    If some of the fields are mandatory for the registration pass it from context as given below.

                var appId = "com.sap.policydemo"; // Change this to app id on server
                var smpServerProtocol = "https";
                var smpServerHost = "hcpms-p123456trial.hanatrial.ondeman";
                var smpServerPort = "443";
                // Optional initial connection context
                var context = {
                     "serverHost": smpServerHost, //Place your SMP 3.0 server name here
                     "https": smpServerProtocol == "https",
                     "serverPort": smpServerPort,
                     "user": "smpAdmin", //user name for registration and OData Endpoint
                     "password": "s3pAdmin",  //password for registration and OData Endpoint
                                           //once set can be changed by calling sap.Logon.changePassword()
                     "communicatorId": "REST",
                     "passcode": "password",  //note hardcoding passwords and unlock passcodes are strictly for ease of use during development
                                              //once set can be changed by calling sap.Logon.managePasscode()
                     "unlockPasscode": "password",
                     "passcode_CONFIRM":"password",
                     "ssoPasscode":"Password1"
                 };
    

    Given below is the changed code in staticscreen.js

    'SCR_REGISTRATION': {
                id: 'SCR_REGISTRATION',
                nav: {
                    submit: {
                    }, 
            cancel: {
            } 
                },
                fields: {
                serverHost : {
                uiKey:'FLD_HOST',
                editable:true,
                visible:false
                },
                            user : {
                                uiKey:'FLD_USER'
                            },
                            password : {
                                uiKey:'FLD_PASS',
                                type: 'password'
                            },
                            resourcePath : {
                                uiKey:'FLD_RESOURCE_PATH',
                                visible:false
                            },
                            https: {
                                uiKey:'FLD_IS_HTTPS',
                                type: 'switch',
                                'default':false,
                                visible:false
                            },
                            serverPort : {
                                uiKey:'FLD_PORT',
                                type: 'number',
                                editable:true,
                                visible:false
                            },
                            farmId : {
                                uiKey:'FLD_FARMID',
                                visible:false
                            },
                            communicatorId : {
                                uiKey: 'FLD_COMMUNICATORID',
                                'default':'REST',
                                visible:false
                            },
                            securityConfig: {
                                uiKey:'FLD_SECCONF',
                                visible:false
                            },
    
    
                }
            },
    

    With the above code the login screen should look like this:

    The logon plugin uses SAPUI5 library. There is an example on how to customise the SAPUI5 libraries -Getting Started with Kapsel - Part 2 -- Logon

    Regards,Midhun

    SAP Technology RIG


    hide logon.png (74.8 kB)
    Add comment
    10|10000 characters needed characters exceeded

    • Former Member Former Member

      Yes, it's possible to skip the passcode screen.

      You can find the information in the following post:

      Getting Started with Kapsel - Part 2 -- Logon

      Extracted from the post:

      In SP03, a method was added that enables a developer to further customize the screens shown by the Logon plugin.  The following example code can be added to register3.html.  This code will enable the Registration screen and the passcode screen to be skipped.  Specifically replace the call to sap.Logon.init with the below code.

      //The Logon UI can be customized by adding a custom method to handle showScreen var logonView = sap.logon.IabUi; logonView.onShowScreen = customShowScreen; logonView.onShowNotification = customShowNotification;  sap.Logon.init(logonSuccessCallback, logonErrorCallback, appId, context, logonView); 


      Add the following two methods.

      function customShowScreen(screenId, screenEvents, currentContext) {
          if (screenId =="SCR_SSOPIN_SET") {
              screenEvents.onskip();
              return true;
          }

      else if (screenId =="SCR_UNLOCK") {

              var context = {

                  unlockPasscode: "Password1@"

              }

              screenEvents.onsubmit(context);

              return true;

          }

          else if (screenId =="SCR_REGISTRATION") {
              screenEvents.onsubmit(currentContext.registrationContext);
              return true;
          }
          else if (screenId =="SCR_SET_PASSCODE_MANDATORY") {
                var context = {
                        passcode: "Password1@",
                        passcode_CONFIRM: "Password1@"
                }
                screenEvents.onsubmit(context);
                return true;
          }
          else if (screenId =="SCR_SET_PASSCODE_OPT_ON") {
              screenEvents.ondisable();
              return true;
          }
          else if (screenId =="SCR_SET_PASSCODE_OPT_OFF") {
              var context = {};
              screenEvents.onsubmit(context);
              return true;
          }
          return false;  //skip the default value
      }

      function customShowNotification(screenId, notificationKey) {
          if (screenId == "SCR_SSOPIN_SET" || screenId == "SCR_UNLOCK" || screenId == "SCR_REGISTRATION" || screenId == "SCR_SET_PASSCODE_MANDATORY" || screenId == "SCR_SET_PASSCODE_OPT_ON" || screenId == "SCR_SET_PASSCODE_OPT_OFF" ) {
              alert(notificationKey);
              return true;
          }
          return false;
      }

      Best Regards,

      Emanuel