How to add custom Javascript file to an applet ?

In order to change the look and feel of the applet or UI, we have to add some JavaScript plugins to the applet This is the very first step in siebel open UI customization. Now lets take a look on that.

TO achive this we are using some user properties
Physical_Renderer Lets give its value as MyRenderer

1) Create a new directory called "custom" under the directory
             " D:\<file system>\client\PUBLIC\enu\IB2012_20\SCRIPTS\siebel"
2) Copy your custom js file lets say  "myUI.js" to the following directory
               "D:\<file system>\client\PUBLIC\enu\IB2012_20\SCRIPTS\siebel\custom"


Next step you have to update the manifest file. To do that
Open the file "D:\<file system>\client\OBJECTS\custom_manifest.xml"

Add a new key in the following section,
<PLATFORM_KEY_SPECIFIC><PLATFORM Name="Desktop">:
<KEY Name = "MyRenderer">
<FILE_NAME> siebel/phyrenderer.js </FILE_NAME>
<FILE_NAME> siebel/custom/myUI.js </FILE_NAME>
</KEY>

compile the applet and open the browser & Test your code.
Please remember if you want to see any CSS changes, you may clear your cache.

How to set up siebel Open UI

The following figures shows how to deploy / upgrade siebel open UI. 

Change CFG enableOpenUi to TRUE

 

More information and server installation steps are coming soon...

Siebel Open UI Screens

Hi Lets see some Open UI screens

Siebel Open UI : Oracle Demo

This is a demo of siebel open UI done by team Oracle

What is Ajax and why it is in Siebel Open UI

In old days siebel needs to communicate with server asynchronously. That means when you step out from a record it should save with out any page refresh. At that time there were no browsers supports this feature. But Internet explorer have such a feature which is implemented with the help of ActiveX. xmlHttpRequest can sent with the help of ActiveX. Later JSON (Javascript Object Notation)&Ajax  (Asynchronous JavaScript and XML)are replaced this technology and it is world widely accepted. Ajax can communicate with server asynchronously that means with out page load or refresh the data can be sent to or retrieve from server. 

But there is another problem every browsers have there own implementation on this ajax. If you are making any web application with ajax you need to take care all these browsers separately. First you need to identify the client browsers and then invoke their technology to send data to our server.

jQuery comes with cross browser solutions. If you add jQuery library in your code, all these things will take care by jQuery. you need to call jQuery Ajax and pass values to jQuery. Three or four lines of code replaces all these things.

$.ajax({
  url: "test.html",
data: "uname="+uname
  context: document.body
}).done(function() {
  $(this).addClass("done");
 .error(function(){
});
.success(function(){
});
});

The above code and there are more optional parameters can effective handle Ajax request & response.

Learn how to customize Open UI

We can easily customize open UI to beautiful website with heavy data that can be loaded in any browsers.
Since Open UI support jQuery as well as HTML 5 we can easily develop mobile application also with out approaching any mobile web developer. What are the prerequisites for studying these things?

 -> HTML
-> CSS
-> JavaScript
->jQuery (Javascript Library)
->HTML 5 (Optional)

If you have some HTML/ Javascript background you can easily learn jQuery & HTML 5. Else you need to study the basics of HTML/CSS/Javascript

You can learn it from here 1. W3Schools
                                          Learn HTML
                                          Learn CSS
                                          Learn JavaScript
                                          Learn jQuery
                                          Learn HTML 5
                                      2. TiZag
  You can also find these tutorials from this site.

After you learned all this things / or in the next post let's learn about Ajax
Why old days Siebel supports IE only etc...

ActiveX UI Architecture Vs OpenUI Architecture

The Image shown below revels how Open UI is going to rock. Open UI completely avoids the ActiveX monopoly and using latest trends in web technology like jQuery, Ajax etc..

Siebel Open UI

One of the main drawback of siebel is its UI. It is very disappointing one. Siebel supports High interactivity (HI) as well as Standard interactivity. (SI). HI is used by employee based application like financial, call center etc. SI is meant of portal applications like eEvents. Both UIs are not attractive. HI only works on internet explorer. HI application needs to send and receive data from server asynchronously. Years ago, no browser except IE has provided this feature.  IE achieved it through ActiveX components, and Siebel works fine in IE.

After the boom of Ajax & jQuery; asynchronous server communication is no more a headache. So it is high time to change UI standards & browser dependency.   Open UI uses main web standards like

• HTML 4.01 Standard (HTML 5 optional)
• Since It support HTML 5. We can have canvas tag. Using sibel UI we can even animate :)

• CSS level 2.1 (CSS level 3.0 optional)
• we can use many CSS frameworks so we can change overall color and theme.

• JavaScript version 1.5 
• this help us to use powerful java script libraries like jQuery, Moo tools etc

It supports
Chrome, Mozilla, IE, Safari etc..