Siebel Open UI Mobile Simulation

If you are planning to implement Open UI mobile, you probably might be wondering how to unit test mobile application in your local machine. Well, if you open mobile client in a desktop browser, it will show you the application in normal mode not in mobile mode. 

If you had followed the instructions in bookshelf, you probably might have set the parameter  SupportedMobileBrowser ="Tablet:iPad,Android-Chrome-GT-P7510,Android-Chrome-Nexus,Android-Chrome-Micromax P500(Funbook),webOS,MSIE-Windows NT-Touch,MSIE-Windows NT-ARM|Phone:iPhone,iPod,Android-Chrome-Mobile,MSIE-Windows Phone,BB10-Mobile"

This means that your application supports these tablet browsers Pad,Android-Chrome-GT-P7510,Android-Chrome-Nexus,Android-Chrome-Micromax P500(Funbook),webOS,MSIE-Windows NT-Touch,MSIE-Windows NT-ARM and these phone browsers iPhone,iPod,Android-Chrome-Mobile,MSIE-Windows Phone,BB10-Mobile.


So, to test the mobile application, you need to simulate these browsers. Let me give you an example to simulate this for iPhone.

Open your safari browser, check if the developer menu is available or not. 

If you don't see this, go to Edit --> Preferences,

In advanced, check Show Develop menu in menu bar

Now in Develop menu, select the user agent. 

Now the browser behaves like iPhone or iPad browsers. By doing this, you can set the browser mode and unit test in local machine. This is quite useful for developers to test while developing mobile applications.

Open your dedicated client with safari (/b argument in client) and do above setting to test mobile applications. Hope this helps!!

Siebel Open UI: Right Click Menu in Applets

If you have been using Open UI for a while, you can list out many differences you observe from HI client and Open UI client. One difference is if you right click on a list applet, it does not open the menu as it did in HI client. If you are looking to make this work similar to HI client, this post is for you.

Below is the PM code to open the applet menu on right click on Applet.
---------------------------------------------------------------------------------------------
if( typeof( SiebelAppFacade.openmenupm ) === "undefined" ){
    SiebelJS.Namespace( "SiebelAppFacade.openmenupm" );
    define("siebel/custom/openmenupm", [], function () {
        SiebelAppFacade.openmenupm = ( function(){
var consts  = SiebelJS.Dependency( "SiebelApp.Constants" ); 
            function openmenupm( proxy ){
                SiebelAppFacade.openmenupm.superclass.constructor.call( this, proxy );
            }
            SiebelJS.Extend( openmenupm, SiebelAppFacade.ListPresentationModel );
            openmenupm.prototype.Init = function(){
                SiebelAppFacade.openmenupm.superclass.Init.call( this );
this.AddMethod( "ShowSelection",  SelectionChange, { sequence : false, scope : this } );

            };

function SelectionChange(){
var FullId = this.Get("GetId"); // get applet Id

$(".ui-jqgrid-btable").mousedown(function(event){
if(event.which == 3) //this is the right click event on table body
{

$("#s_at_m_" + FullId).click(); // simulate click on the menu object
return false;
}
});
$(function () {
 $(".ui-jqgrid-btable").bind("contextmenu",function(e){
e.preventDefault(); // prevent the right click browser menu to open like view source, inspect element
});
 });
};
            return openmenupm;
        } ());
        
return "SiebelAppFacade.openmenupm";
    });

}

------------------------------------------------------------------------------------------------------------

This code is working fine but please test this thoroughly if you are trying to use it in your application. 

The only issue is this PM opens the menu of the Applet as if the user clicked on the Menu button. The only difference is that the menu opens near the menu button and not at the location of mouse click. This can be taken care by setting the menu object's top and left coordinates like below. You can try and see if the code similar to below can be used to set the coordinates. 

---------------------------------------------------------------------------------------------

var y = event.clientY; // get current click Y coordinate

var x = event.clientX; // get current click X coordinate

$("#s_at_m_" + FullId).click(); // open Menu

var off = $("#s_at_m_" + FullId).offset().top; // get the height of menu button

y = y - off; // calculate the Y of the menu click with respect to Menu button

$(".siebui-appletmenu").css("position","absolute");

$(".siebui-appletmenu").css("top",y);

$("siebui-appletmenu").css("left",x); // set the coordinates

return false; // this is a psuedo code and it works for y coordinate, x coordinate is not working.. give it a try and try opening the menu at the click location

---------------------------------------------------------------------------------------------

Well this is not full functional code, but give it a try to open the menu at the click coordinates. 

So, we can make the Applet Menu to open on right click of the Applet. If you have a requirement to make the applet work similar to HI mode, this code will take care of it. 

Hope this helps!!

Upgrading to Open UI

Are you planning to upgrade to Siebel Open UI!! This post might help you!!

I am going to discuss about few product issues observed in Open UI. 

Behaviour and Performance: Do not expect Open UI to work the same way as ActiveX application. Open UI and ActiveX applications are based on different technologies. Open UI runs on JavaScript plug-ins and ActiveX application uses ActiveX objects which are proprietary IE plug-ins. Though Open UI is built to provide the same functionality as earlier, it might behave differently. Open UI is comparatively slow than ActiveX client. This is because every UI element needs a JavaScript file loading to function and render in UI. 

Open UI provides you the ability to modify any UI object and functionality. If you are well versed in CSS, JavaScript and JQuery you can fix most of the UI product issues. But remember to test all your changes rigorously.

Below are some product issues.

1. Blank screen on login - If you see a blank screen on login for the first time, replace the srf with a new full compile file. If you are seeing this issue even after the full compile, check your browser console. You might observe an error related to customizations to JS files. Note that latest patch set on 8.1.1.11 is not working in IE8. You will see a blank screen in this case.

2. MVG applets are blank - If you see this issue, sett the Open UI object manager component parameter AppletSelectStyle to Applet Select

3. Set Profile attribute in JS or Browser scripts - Set Profile Attribute is not allowed in JS files or Browser scripts as a fix to security defect. To enable this, set the Open UI object manager parameter EditProfileAttr to TRUE. If you are using HI client, then also you need to set this parameter for browser scripts to work. This is applicable to versions 8.1.1.9 and above.

4. Control Labels wrapped to next line - If you are using long labels in UI, they will get wrapped to new line. To prevent this, 

In theme-base.css modify the below line from pre-wrap to no-wrap

-------------------------

div.mceGridLabel {white-space: no-wrap;}

5. Side by Side applets render beyond viewable area - In some views, for e.g., Views with 50-50,25-75 templates, side by side applets are rendering beyond the viewable area. User has to scroll to right to view the applets. 

The issue is resolved by modification to the web template parameter: "table-layout: fixed" in the view SWT file.

6. SI mode applets do not render in Open UI - In home page you will see the error "why can't i see this applet? open ui cannot display this type of applet contact system administrator" in salutation applet. This is because it is a SI mode applet and they do not work in Open UI. You need to recreate or modify the applets to HI mode. 

7. HTML captions does not work as earlier - In some cases, HTML tags in controls do not work as expected. You can move the HTML attributes to a custom PR file to render as expected. Test all the objects that had html embedded.

8. List Applet column headers behave differently - Sometimes the list applet column headers are aligned differently (right or left) compared to ActiveX client. This may cause another issue for which we have a fix to move the label to align left.

You can make the column alignment uniform across the application by making below change.

Add "text-align:left;" to \23030\SCRIPTS\3rdParty\jqGrid\current\css\ui.jqgrid.css file under the block ".ui-jqgrid .ui-jqgrid-htable th div", which updated all list applets header to left.

If you are trying to resize the column width by dragging the column header, drag it only horizontally, if you move your mouse down to the table, the control will get lost. It is a minor user issue but users do complain about this sometimes.

9. Import or Export XML files - In open UI, writing an XML file to a location, importing or exporting workflow XMLs etc will work only with temp folder. To make this work for other locations, use below cfg parameter. Provide a list of locations with semi colon seperated list. If you face the error with code SBL-EAI-50228 anywhere, this might be the solution for the issue.

[EAIFileTransportConfigSubsys]
EAIFileTransportFolders = D:\TEST;D:\FS

For server, Navigate to Administration - Server Configuration > Enterprises > Parameters > set "EAI File Transport Folder List" (alias EAIFileTransportFolders), i.e.:

    EAI File Transport Folder List = D:\TEST;D:\FS

10. Application unresponsive - In Open UI, if you are doing an action that takes more than 30 seconds to complete, after 30 seconds you will get the cursor back but the application will not respond to your action. If you feel it is ok to have performance of more than 30 seconds (30000 milliseconds), modify the loadindicator.js file. 

In loadindicator.js, note that 30000 milliseconds (30 seconds) is hardcoded: you can increase this value

    var that = this;
    if( this.m_gbusy > 1 && config.timeOut ){
        clearTimeout(this.timeoutid);
        this.timeoutid = setTimeout( function(){
              that.timeout = true;
              that.Free();
            }, 30000);
        return this;

    }

I will keep adding more items to this list.