Siebel Open UI : Profile Attributes vs Browser Cookies

Profile Attribute Security

If you have used Siebel profile attributes, you know that these are name-value pairs used to store any information including user profile and retrieved any time during the application session. If the session is closed, the profile attributes will get nullified. This is custom functionality in HI client. 

In earlier versions like 8.1.1.3 or before, we can set profile attributes by entering code like the below line in browser address bar. 

Javascript: theApplication().setprofileAttr("ABC","ABC");

This has been disabled to fix security issues. Now that Oracle has identified security vulnerabilities in the browser scripting, in Open UI, they have disabled setting profile attributes. But for users who are OK with security constraints, the profile attribute setting from browser scripts are enable after setting server parameter EditProfileAttr = TRUE. Now, the security reasons for disabling the profile attribute setting are unknown, but if it is a consideration for you, we have another option in Open UI. 

Browser Cookies

We might have heard of this term many times, but a few really know about these. Browser cookies are name value pairs of data that a browser saves from the sites the user visit. Follow this link to know more about cookies.

Now, let us observe the similarities between Profile attributes and cookies. 

1. Scope: Both are name value pairs, profile attributes are used almost everywhere in application like browser scripts, server scripts and business services or workflows. You do not need a browser session for profile attributes to work. But, cookies need a browser session. They work only for javascripted objects like PM, PR or postload.js or preload.js and so on. 

2. Security: Cookies are vulnerable to attacks from hackers or people in same network who are trying to steal information. But, they are secure if you are using them to write non-sensitive information. If you are writing a view name in cookie, it is fine but do not consider saving phone number, credit card information etc in cookies. There are ways to create secure cookies. Profile attributes have some security issues when used in browser script.

3. Life time: Profile attributes get nullified after session is closed. Cookies on the other hand has a life time. We can set the end date of a cookie to a future date. But, each browser stores cookies in a separate location. There are ways to share cookies across browsers, but this is not in the scope of this post. If you clear your browser cookies, the cookies get deleted even when you have a session open. 

Overall, for a Siebel developer, Profile attributes is the preferable option. But web developers will look to use cookies as much as they can. Siebel is in a phase of moving to a web standard application with Open UI and cookies are going to play their role in future. It would be interesting to see how useful cookies are going to be when used in Open UI.

Siebel Open UI Vertical Scrollbar Continued..

Here is the final version of the PR to move the List Applet horizontal play bar to vertical scrollbar. The PR is tested for basic functionalities like query, resize, save record etc. I have fixed another issue where the list applet header getting aligned with list columns in the script.

if( typeof( SiebelAppFacade.vscrollpr ) === "undefined" ){

    SiebelJS.Namespace( "SiebelAppFacade.vscrollpr" );

    //Module with its dependencies

    define("siebel/custom/vscrollpr", ["siebel/jqgridrenderer"], function () {

        SiebelAppFacade.vscrollpr = ( function(){

            function vscrollpr( pm ){

                SiebelAppFacade.vscrollpr.superclass.constructor.call( this, pm );    

            }

            SiebelJS.Extend( vscrollpr, SiebelAppFacade.JQGridRenderer );

   vscrollpr.prototype.Init = function () {

            SiebelAppFacade.vscrollpr.superclass.Init.call(this);    

            };

   vscrollpr.prototype.ShowUI = function(){

                SiebelAppFacade.vscrollpr.superclass.ShowUI.call( this );

     var currbwidth = $(".ui-jqgrid-bdiv").width(); //get current body width

     var btabwidth = currbwidth - 60; // provide 60px space for scroll bar

var currhwidth = $(".ui-state-default.ui-jqgrid-hdiv").width(); // get current header width

var htabwidth = currhwidth - 60; // provide 60px space for scroll bar

$(".ui-state-default.ui-jqgrid-hdiv").css("width",htabwidth); // set header width

$(".ui-state-default.ui-jqgrid-hdiv").css("float","left"); // float it to left

     $(".ui-jqgrid-bdiv").css("width",btabwidth); // set body width

     $(".ui-jqgrid-bdiv").css("float","left");   // float it to left

     var html = $(".ui-pager-control").html(); // get the play bar html

     $('.ui-pager-control').appendTo('.ui-jqgrid-view'); // remove the playbar and append it to grid 

     $(".ui-pager-control").css("float","left"); // float it to left

     $(".ui-pager-control").css("width","60"); // set playbar width to 60 px;

     $(".ui-pager-control").css("-ms-transform","rotate(90deg)"); // rotate 90 degrees in IE

     $(".ui-pager-control").css("-webkit-transform","rotate(90deg)"); // rotate 90 deg in chrome

     $("span.ui-separator").parent().css("width","45"); // set separator width to 45px. this should be calculated based on height of applet

            };       

  vscrollpr.prototype.resize = function( )

          { // recalculate the widths after resize

 SiebelAppFacade.vscrollpr.superclass.resize.call( this );  

var currbwidth = $(".ui-jqgrid-bdiv").width();

     var btabwidth = currbwidth - 60;

var currhwidth = $(".ui-state-default.ui-jqgrid-hdiv").width();

var htabwidth = currhwidth - 60;

$(".ui-state-default.ui-jqgrid-hdiv").css("width",htabwidth);

$(".ui-state-default.ui-jqgrid-hdiv").css("float","left");

     $(".ui-jqgrid-bdiv").css("width",btabwidth);

     $(".ui-jqgrid-bdiv").css("float","left");   

     var html = $(".ui-pager-control").html();

     $('.ui-pager-control').appendTo('.ui-jqgrid-view');     

     $(".ui-pager-control").css("float","left");

     $(".ui-pager-control").css("width","60");

     $(".ui-pager-control").css("-ms-transform","rotate(90deg)");

     $(".ui-pager-control").css("-webkit-transform","rotate(90deg)");

     $("span.ui-separator").parent().css("width","45");

 }

return vscrollpr;

    } ());

        return "SiebelAppFacade.vscrollpr";

    });

}

Note: The code needs full testing before implementing. Also, I have hardcoded the value in below line. You need to do the calculation in this case for list applets with different heights.

$("span.ui-separator").parent().css("width","45");

Disclaimer: This is not production ready code. Do not use this code without proper testing. The JQGrid model provides this scroll bars by default as horizontal playbars. So, this is vanilla and it is not a good idea to modify it. 

Part -1

Siebel Open UI Vertical Scrollbar

Siebel Open UI vertical scrollbar in List Applets

In Open UI, the traditional vertical scroll bar is replaced by horizontal play bar buttons. These buttons perform the same functionality as that of vertical scroll bar in HI applications. But a lot of people are not liking this feature as compare to HI mode. This might confuse the users with horizontal scroll bar which is used to see columns to the right of the table. 

Oracle has used JQGrid model to render the OUI list applets. The horizontal play bar is a feature of JQGrid plugin. This makes it different from HI mode applets in many ways. I have discussed the differences and comparisons of these two type of applets in another post. It is not technically correct to have JavaScript scroll bar.

Here , I have tried to make this horizontal play bar align vertically. For this purpose I have written custom PR to render the existing play bar to rotate vertically and place it next to the list.

Here is how it looks. 

The PR contains the following code in ShowUI method.

     var currwidth = $(".ui-jqgrid-bdiv").width(); // get current width of list table
var tabwidth = currwidth - 40; // 
$(".ui-jqgrid-bdiv").css("width",tabwidth); // leave 40 pixel space for scroll bar
$(".ui-jqgrid-bdiv").css("float","left"); // set the table to left
var html = $(".ui-pager-control").html(); // get the horizontal play bar html - this is not required
$('.ui-pager-control').appendTo('.ui-jqgrid-view'); // remove the play bar and move it next to list
$(".ui-pager-control").css("float","left"); // make it float to left
$(".ui-pager-control").css("width","40"); // place it in 40 pixel room we created
$(".ui-pager-control").css("-ms-transform","rotate(90deg)"); // rotate the horiontal scroll bar by 90 deg. to align vertically..for IE browser
$(".ui-pager-control").css("-webkit-transform","rotate(90deg)"); // same as above.. for chrome,opere,safari browsers

$("span.ui-separator").parent().css("width","45"); // set the separator width to fit the list table height

This actually is just moving the existing play bar to right of the list and rotating the play bar. The PR file can be viewed here. 

Note: This is just a sample code and only written in Show UI method. The same should be taken care in other events like browser restore/resize. The same code should be replicated wherever necessary.

Check out the full code at below link. This is for educational purpose only.
Part-2

Also check this out for creating a scrollbar that looks and works similar to a browser scrollbar. 

Open UI and HI list applets vertical scrolling

If you had chance to work on Open UI, you would have observed a lot of difference in UI level objects like MVG, Query Assistant buttons, list applets etc when compared to HI mode. Well, since the base technology in rendering the UI is changed, the changes are required for technical reasons. One such feature is vertical scroll bar being replaced by horizontal play bar. Let us see why this change is probably made. 

Consider vertical scrolling using normal javascript for a table. We can have a vertical scroll bar in a list applet like this. But for the js scroll to work, the table html should have all the table rows (tr) and columns (td) tags and values which should show when we scroll.

So if I have 100 records with 10 fields each, I should have 1100 html tags (100 rows, 1000 columns). This will make my HTML very big. But the actual problem is, we need to get the field values of 100 records and place them into 1000 columns. You know, 1000 GetFieldValue() functions need to get executed. Consider the joins, MVGs and links, the performance will kill your browser. This rules out the JavaScript scroll bar.

Actually, this is the reason why even in HI mode, we have GotoNextSet, GotoPreviousSet, GotoNext, GotoPrevious methods in vertical scroll bar. These are the same methods we have in Open UI list applets also. So, we query a set of records (generally 10) and place them in UI. If user wants to get more records, user has to click on scroll buttons. 

But the visual difference we observe is the slider is missing in Open UI.

Open UI used JQGrid plugin which is a JQuery based plug-in which has built in methods to access/set/modify the Grid/table elements in the HTML. The horizontal play bar is a feature of JQGrid. So, Oracle used it in Open UI. JQGrid is currently used by many web based technologies. 

The horizontal play bar can be aligned vertically and made to look like vertical scroll bar except without slider. I am going to post the script required to make this change. If we can add a slider to this and make it work, then we can have the same vertical scroll bar as in HI mode. 

Please leave a comment about your thoughts on this.

Siebel High Interactivity Framework vs Open UI Framework

Siebel High Interactivity Framework

If you are browsing YouTube in any browser, it needs an add-on or plug-in to run the video. The browser does not have capability to play the video all by itself (although, latest HTLM5 enabled browsers have this capacity). It requires an add-on or plug-in. Similarly, for a Siebel application UI to work, it requires additional add-ons.

Before Open UI framework is introduced, Siebel High Interactivity application can only be opened in IE browser. The Siebel application is rendered using Internet Explorer's ActiveX Controls. The application requires the ActiveX controls for proper rendering and functionality of UI.

ActiveX objects are programs (add-ons) that supplements and enhance the browser experience. The ActiveX objects for Siebel are included as part of the installation and are placed in SWSE/public/enu/23030/applets location. (This location varies based on version; 23030 is for 8.1.1.11) Below is the location of ActiveX objects in local web client.

 When you access the application, the browser will prompt for the download of ActiveX and if user allows the prompt, it downloads ActiveX from your SWSE folder location. These ActiveX controls are installed in your IE. This is how Siebel High Interactivity Framework works. This can be viewed from Internet Settings -> Manage Add-ons

Users can not open HI application in any other browsers. Moreover, for ActiveX controls to download and work, user has to change internet settings which have a risk of decreasing the browser security. ActiveX objects are more prone to security risk as they are installed in your local computer and can access your computer.

Open UI framework:

Open UI is a framework for customising User Interface of Siebel. This uses Javascript, JQuery, CSS etc to render the Siebel application and function as per the requirements. Just like ActiveX, JQuery is a JavaScript based plug-in. There are other extended plug-ins to JQuery like JQuery-UI which are used in Siebel Open UI framework.

Why Open UI?

There are many reasons why Open UI framework is built when there is an already working, tested High Interactivity framework available.

Unlike before, the number of browsers and operating systems has increased beyond IE and Microsoft windows. Forcing the users to keep using IE and using only windows environment is not a good idea. It is not easy to recreate add-ons for other browsers and test them. Windows 8 does not support ActiveX anymore. Check this link. This seems to be the death blow for HI framework.

What Open UI offers?

Here are the few advantages in Open UI compared to HI ActiveX framework.

1.   Support to all browsers. Earlier Siebel application can only be opened in IE browser. This is due to the dependency on ActiveX controls. Open UI framework is based on Javascript, JQuery, CSS which is supported in all browsers.   

2. Siebel Application in Mobile. Access Siebel application from any device.

3.   Custom user experience. Provides capabilities to UI customisations which HI framework does not provide. 

4. Working offline.

SIEBEL: Extract SIF file from SRF

This post is a response to one of my friend's question. Can we get a SIF file of an applet from a SRF file? 

Scenario: We have a customized SRF file, connection to server DB and sample DB. Now we know that the Contact list applet is customized and compiled onto this SRF. Now we want to get a SIF file of the SRF.

Solution: Most of the people I approached, said it is not possible. But there is a solution!!

If you have a SIF file, try opening it with Notepad++ and observe that the SIF file is a Structured XML.

This gave me the idea. If I can build an XML similar to the SIF and save it as .SIF file, I will have my SIF file ready.

Step 1: First I created a dummy applet with all the child entities like Applet Browser Script,Controls, Menu Items etc. This step is to make sure that you have a dummy XML with all the applet elements in it. Exported it as a SIF file. Open the file with notepad++ and copy the XML. Using any online source, convert this XML to XSD. (I used this). Create an Integration Object using this XSD (use EAI XSD Wizard). Now this is the structure we want to get a new SIF file. Name the IO as Siebel Information IO.

Step 2: Create a new Siebel BO based IO (EAI Siebel Wizard) using BO Repository Applet. This is a vanilla BO. Make sure to include all the child items (Applet Menu, Web template Item,Applet Server Script etc) while creation. Name it as Repository Applet IO.

Step 3: Create a new IO data mapper under Administration Integration with destination IO as Siebel Information IO and source as Repository Applet IO.
Make sure you map all the fields properly. Get the project and repository details from Repository Applet IC fields (Project Name, Repository Name etc) and map the same. Compile the changes to your custom srf.

Step 4: Create a workflow with first step to query Repository Applet IO using EAI Siebel Adapter. Provide the Applet name as Input to query. In second Step, map the Repository Applet IO to Siebel Information IO using EAI Data Transformation Engine service. In the subsequent steps, convert the EAI Siebel Message to XML (EAI XML Converter) and write the file (EAI XML Write to File) to a location with name "Contact Form Applet.sif". 

Simulate the Workflow in your application connecting to your DB after opening it using your custom SRF and voila!! you have your SIF file with object definitions from your custom SRF.

What I did was: identified how siebel stored information in sif files, identify how siebel repository BO stores the information, query a siebel BO based IO, map to sif structure and write to sif file.

Go ahead and try it. It is a time taking process but it is worth if you have this kind of requirement. We can extract SIFs like Business Components, Business Services etc using Repository Business Component, Repository Business Service IOs. We can do this for all the objects in tools.

Let me know your thoughts on this!!

Salesforce WSDL testing using Soap UI

In this post I am going to discuss about how to test Salesforce WSDL using Soap UI. This is pretty basic stuff but for beginners this might be helpful.

You need to download the WSDL from your application from Setup -> Develop -> API -> Generate Enterprise WSDL. 

Copy and save the WSDL into a .wsdl file.

Import this WSDL in Soap UI. It will import methods like Create, Convert Lead, login, update, upsert etc.

First we need to get a session Id to access data in salesforce. To get this, we need to call login method in the WSDL.

The login method input should look like this:

<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:urn="urn:enterprise.soap.sforce.com">

   <soapenv:Header></soapenv:Header>

   <soapenv:Body>

      <urn:login>

          <!--Salesforce Username:-->

         <urn:username>khadar.pathan@gmail.com</urn:username>

           <!--password appended with session token:-->    <urn:password>NewPasswordc4w5ePZbF3dBokl1BrWr</urn:password>

      </urn:login>

   </soapenv:Body>

</soapenv:Envelope> 

You need to get the session token from below location in the application. 

This will send an email to your account with session token. You need to append your password and this token if you are trying to login to application from anything apart from a browser (like SOAP, Force.com IDE etc). 

You might get this error if you do not give session token "Invalid username, password, security token; or user locked out."

The output of above request gives server URL and session Id.

Using this session Id in Soap header and URL as service end point, you can create, delete, update, upsert or do any operation from the WSDL. If you do not change the service end point, you will get error "Destination URL not reset. The URL returned from login must be set in the SforceService".

In the below example, I have created a new Account. Sample Soap messages to create the data can be found at https://developer.salesforce.com/page/Sample_SOAP_Messages

Hope this helps!!