June 30, 2015

How to change color of screen tab in Open UI?

I think this configuration should available out of the box in Siebel. Never the less I am happy that it is possible to customize the View PR layer in Open UI to change the colors of view bar of specific views.

In this example we will see how can we change the view bar background conditionally using Open UI View level PR customization.

This is how grey tab theme looks out of the box for Manifest File view :
 
Open UI Manifest File View

And this is how Manifest Administration view looks with Open UI PR Customization:

Open UI Manifest Administration View

May be savvy developers would like to have pale yellow for read only views or red for administration screens???


Part 1 : Create CSS class
This customization requires extending the theme in theme.js and creating new class to add different color. New Class should look something like :
custom-theme.css
When this class is associated with any control, it will change the background of the element to transparent and change the background color to blue.

Part 2: Create View PR Customization 
Now the task left is to find the view bar element in the DOM and assigning the class, this can be done with these two commands:

            $("#s_sctrl_tabView").addClass("custom_viewbar");
            $("#s_sctrl_tabScreen").find("li.ui-tabs-active[role='tab']").find("a").addClass("custom_viewbar");

Additionally we need to handle the browser resize event and reassign the class on change of size of browser. Sadly resize event is not passed on the View level PR as described in bookshelf and it has to be done with help of jQuery bind function. Code handling resize event looks like :

        $(window).bind("resize", OnPRResize);

At last we need to handle the cleaanup in the EndLife event of jQuery bind and the class allocation.

$(".custom_viewbar").removeClass("custom_viewbar");
$(window).unbind("resize", OnPRResize);

The final code of PR looks like:


if (typeof(SiebelAppFacade.testPR) === "undefined") {
    SiebelJS.Namespace("SiebelAppFacade.testPR");
    define("siebel/custom/testPR", ["siebel/viewpr"],function () {
    SiebelAppFacade.testPR = (function () {

    function testPR(pm) {
                SiebelAppFacade.testPR.superclass.constructor.apply(this, arguments);
    }
    SiebelJS.Extend(testPR, SiebelAppFacade.ViewPR);

    testPR.prototype.Init = function () {
        $(window).bind("resize", OnPRResize);
        SiebelAppFacade.testPR.superclass.Init.apply(this, arguments);
    }

    testPR.prototype.ShowUI = function () {
        SiebelAppFacade.testPR.superclass.ShowUI.apply(this, arguments);
    }

    testPR.prototype.BindData = function (bRefresh) {
            SiebelAppFacade.testPR.superclass.BindData.apply(this, arguments);
    }
    var OnPRResize = function OnResize(){
            $("#s_sctrl_tabView").addClass("custom_viewbar");
            $("#s_sctrl_tabScreen").find("li.ui-tabs-active[role='tab']").find("a").addClass("custom_viewbar");
    };
    testPR.prototype.BindEvents = function () {
            SiebelAppFacade.testPR.superclass.BindEvents.apply(this, arguments);
    }
    testPR.prototype.EndLife = function () {
        $(".custom_viewbar").removeClass("custom_viewbar");
        $(window).unbind("resize", OnPRResize);
        SiebelAppFacade.testPR.superclass.EndLife.apply(this, arguments);
    }

    testPR.prototype.Setup = function () {};

    testPR.prototype.SetRenderer = function () {
                $("#s_sctrl_tabView").addClass("custom_viewbar");
                $("#s_sctrl_tabScreen").find("li.ui-tabs-active[role='tab']").find("a").addClass("custom_viewbar");
    };

    return testPR;
    }()
    );
    return "SiebelAppFacade.testPR";
    })
}

Part3: Configure Manifest
Now when this PR script is associated to any view in Open UI Manifest, view bar color and screen tab color of that view will change to blue.


Hope it helps, if you like this article and would like to see more articles like this please leave a comment or +1

June 28, 2015

How to make Open UI textarea fields flexible in IE?

As you would know that IE doesn't have flexible textarea even in version 11. When rest of all modern browser allow to open drag one corner of the text area to change its size, IE doesn't let user to change size of elements because of Trident layout engine???


Fixed size multiline fields in IE
Because of this limitation Siebel Open UI users suffer big time. All the multiline textarea fields in open UI are fixed size and there is no way to pop them up as in HI or expand them. read more. 

Flexible multiline fields in chrome
There are many jquery based plugins available for this problem however all of them needs to maintained and lacks in one thing or the other, probably you will end up using one of those plugins at the end. However If someone looking for simple straightforward stop gap solution, then you can use jQueryUI Resizable function to make the textareas flexible just like chrome or firefox.

To implement in simply add following one line in postload.js file on the web server.

 $("textarea").resizable(); 

This will make all the textarea controls which are used for multiline field flexible and show tiny blue cue to expand or decrease the size of element and mimic chrome or firefox textarea elements.


Hope it helps.


June 27, 2015

How to build Siebel Workflow Expression?

I remember my days when i started with Siebel, I just couldn't get the syntax of workflow expression correct. I still see newbies of siebel struggling to get it right the first time. In this post I would try to make the basic rules of workflow expressions as simple as possible.

Basic Rules of Siebel Workflow Expression are :

  1. Siebel Workflow takes String as input.
  2. + (plus) is the concatenation operator.
  3.  Process properties can be referred using & operator like this > [&Object Id] 
  4.  Don't worry about spaces in process property names, they are allowed.

Let's take an simple example where we want to build the expression to search for records with Contact Id specified in Object Id the search spec would be:



if Object id contains : 1-12345 then expression will be evaluated as :


Did I say its a H.U.G ?

See what is the difference between Expression Business Component and Filter Business Component


Hope it helps.

June 15, 2015

How to Invoke Siebel Business Service using URL?

SWEAPI is no doubt is one of the most neglected yet powerful feature of Siebel. It allows applications to integrate with Siebel as RESTful HTTP requests. SWEAPI is well documented and is powerful enough perform most of business operations similar to navigating around views and invoke methods of business services.

URL can be invoked from any HTTP client (likes of cURL) and is independent of User Agents. Output of business service can be transformed using XSLT style-sheets.

Following URL is an example for invoking business service through single URL. It is capable of logging into application and execute a business service(did I say workflows as well?).

http://host_name/fins_enu/start.swe?SWEDataOnly=1&SWESetMarkup=XML&SWECmd=ExecuteLogin&SWEUserName=SADMIN&SWEPassword=Password&SWEAC=SWECmd=InvokeMethod&SWEMethod=RunProcess&SWEService=Workflow%20Process%20Manager
This URL can give following output:


SWEDataOnly : Removes unnecessary navigational information from output
SWESetMarkup : Forces the output format to XML
SWEUserName : Application login user name
SWEPassword : Application password
SWEAC : Secondary command that is executed after login
SWEMethod : Method of business service to invoke
SWEService : Business service name

June 14, 2015

Siebel Open UI Interview Questions

Read Latest Open UI Interview Questions here.

What is Siebel Open UI?

Answer: Siebel Open UI is HTML 5 based Siebel High interactive client which is released by Oracle to replace older Active X based HI client. It is available in Siebel CRM from version 8.1.1.9 onwards. The name derived from Open source JavaScript libraries which it is based on.
Siebel Open UI Logo
Siebel Open UI

It is fully HTML 5 compliant user interface, which is based on jQuery and jQueryUI frameworks. It does not uses any active x component thus it can be accessed using any HTML 5 compliant browser like chrome, safari and Firefox along with latest Internet explorer.


Question : How to enable Open UI in Siebel?

Answer : To enable Open UI create new application object manager and set following parameters

Enable Open UI = true
HighInteractivity =true

Siebel Open UI exists parallel to existing Siebel clients. It references same srf and database and shares the same object definition with High Interactive application. 

 

Question: What are major customizable components of Siebel Open UI ?

Answer: Open UI can be customized extensively with help of jquery classes(known as presentation mode and physical renderer), which can override the default behviour of controls and can mash up with other HTML widgets.


 

 Question: What is the difference between presentation model and physical renderer?

Answer : Physical renderer is JavaScript layer in Open UI stack that is responsible for building the UI and showing the data. It communicates with presentation model to fetch data.

Presentation model is second layer which maintains the data state in Client. All the events and methods(such as delete record, write record or update record) are managed by PM layer. It communicates with proxy layer to get and set data on server.

 

Question: What is the difference between the PM of List applet and Form Applet?

Answer: Class of PM Layer is of list applet is different from Form applets and is extended as : 
SiebelJS.Extend(CustomClassName, SiebelAppFacade.PresentationModel); for form applet
and List applet uses SiebelJS.Extend(CustomClassName, SiebelAppFacade.ListPresentationModel)

Recommended way to customize PM and PR layer is use code creators
Duncan ford template generator 


 

Question : How to access Applet's Client User properties in Presentation Model?

Answer: Client user properties specified in siebel tools can be retrieved in Siebel Presentation Model JS by accessing the constants in the Setup method. Example:


CustomPM.prototype.Setup = function (propSet){
var consts = SiebelJS.Dependency("SiebelApp.Constants");
var apm = propSet.GetChildByType(consts.get("SWE_APPLET_PM_PS"));
var value = apm.GetProperty("User Property1");



Question: Does open UI support browser script events defined in tools?

Answer: Yes open UI supports browser scripts specified in tools. All the browser script events are supported. In addition to those events Open UI supports presentation model and physical renderer js class files to leverage HTML 5 capabilities.


Recommended Reading from Bookshelf:
Deploying Open UI
Configuring Open UI





Read for More Open UI Interview Questions - New