Siebel Open UI Architecture, Siebel Open UI Training (Session 2)(http://www.techonestop.com/2014/05/siebel-open-ui-architecture-training.htmll) :This is our second video tutorial on Siebel open ui training series where we have discussed about Siebel Open UI architecture and its building blocks like presentation model, physical renderer, manifest file. Open UI is browser independent and platform independent Siebel CRM. Open Ui has new look and feel user interface, many built in functionalities, enhanced mobile application, better customer experience, embedded google map and many more. Also It is easier to integrate Social media websites with Siebel Open UI rather than traditional Siebel CRM. It supports srf independent changes as well. We will discuss Open UI architecture (PM, PR model), how to do IRM, followed by case studies.
You could also check our video on Siebel Open UI Roadmap http://www.youtube.com/watch?v=MR0bQK2gud4 which will give you idea about oracle strategy on Open UI, future plan.
For more information on Siebel Open UI, visit our website http://www.techonestop.com/.
Share your valuable comments which will help us to upload more videos, also join our facebook page 'techonestop', or follow in twitter or Linked In.
Siebel Open UI Training (Session 2): Siebel Open UI Architecture
1. Siebel Open UI Architecture
Presented by TechOneStop
Techonestop.in
In a vision to make TECHNOLOGY simple for u
techonestop.in1
2. Open UI Architecture Overview
techonestop.in2
It includes all elements of traditional Siebel client, plus few Open UI
specific components.
1)Application Object Manager(AOM)
2)Siebel Web Template(SWT) files
3)JavaScript(JS) files
4)Cascading Style Sheet (CSS) files
5)Open Ui client
a)Proxy
b)Presentation Model
c)Physical Renderer
6)Manifest files
3. Application Object Manager (AOM)
techonestop.in3
• Most important server component in Siebel
• In Open UI, it behaves exactly the same way, like our traditional siebel
• Processes user requests with the help of other components like Data
Manager, Siebel Web Engine
• Open UI parameters:
EnableOpenUI = TRUE
HighInteractivity = TRUE
• For webclient, Add two parameters under OM component
• For Dedicated, add two in [InfraUIFramework] section of client cfg file
4. Siebel Web Template(SWT) files
techonestop.in4
• HTML file with Siebel tags, provides empty placeholders for Views,
Applets, controls and other objects of siebel
• Open UI uses newer version of SWT files which no longer contain any
explicit layout information
Original SWT files has explicit tags like tables, boundaries where Open
UI swt files has ‘div’ tag, which allows css files to control the layout
• SWT files are on siebel server under siebsrvrWEBTEMPL
WEBTEMPL folder contains original swt files
OUIWEBTEMPL folder, under WEBTEMPL contains open ui SWT
files
CUSTOM folder, under OUIWEBTEMPL contains all custom SWT
files
For siebel developer web client, path is clientWEBTEMPL
5. Cascading Style Sheet (CSS) files
• Style language that defines the layout of web pages, example like font,
color, height, width and many more.
• Benefits of CSS file:
Reusable, one css file could be used for multiple web pages
Modify style definition in one place and change will be reflected in
all web pages
Different layout for different media types like print, mobile, desktop
• Easy to build, notepad is sufficient to write css file
• CSS file path:
On the web server under webmasterfiles<lang> and
eappwebPUBLIC<lang>FILES
For siebel developer client, path is clientPUBLIC<lang>files
techonestop.in5
6. Java Script (JS) files
• Enhance the interactivity features of web pages
• Extensively used in Open UI to render the application in web browser
• Oracle provided JS files to deliver Open UI functionalities, customers can
also add their own JS file to leverage the functionalities
• With Javascript, JQuery also can be used
• JS files are on siebel server under siebsrvrpublic<lang><build>SCRIPTS
SCRIPTS folder contains original (High Interactivity) JS files
siebel folder, under SCRIPTS contains open ui related vanilla JS files
custom folder, under SCRIPTSsiebel contains all custom js files
3rdparty folder, under scripts contains all 3rd party provided js files
• For siebel developer web client, path is client<lang><build>SCRIPTS
techonestop.in6
7. Open UI client
• Open UI client is an engine which runs within the browser on the client to
provide better and enhanced user interface
Binds data to the presentation layout
Caches data locally
Applies client side business logic
• Consists of 3 elements
Client Proxy
Presentation Model (PM)
Physical Renderer (PR)
techonestop.in7
8. Client Proxy
• Provides the interface to the back end siebel data
• Gets runtime data and metadata from siebel server whenever required
Runtime data is the actual data from siebel database that users see in
view/applet
Metadata specifies the column name and other details like required,
readonly and so on
• Provides data back to the siebel server
• Provided by oracle and must not be modified by customers
techonestop.in8
9. Presentation Model
•Javascript file to handle metadata and runtime data, coming from siebel
server and displays those in list or form applet in the client.
• Determine what logic should be applied
• Client side scripting without requiring the need of siebel server
• Capture client interaction
Did the user leave a control?
Did the user click a link?
•Collection of
Properties: Contains information about current state of each user
interaction. for example, open ui currently shows or hides a field
Method: Implement characteristic that modifies the state of an object.
For example, if user chooses a field value, then apply method to hide
another field
• Supports different logic for different platform
techonestop.in9
10. Physical Renderer
• Javascript files to build the enhanced user interface
• Can display the same set of records in different ways
List Applet
Carousal
Calendar
Mind Map
• Supports different behavior for Desktop versus Mobile device
techonestop.in1
11. Manifest File
• Uses an unique key to determine which javascript file/s to download to the
client
• Earlier version Open UI innovation pack 2013 (8.1.1.11) has three manifest
files under seibsrvrOBJECTS
Core_manifest.xml: As delivered listing of JS files and should not be
modified by customers
Custom_manifest.xml: Specifies key name and javascript file mappings
Manifest_extensions.map: Place to register Applet/key combination
• From Open UI innovation pack 2013, instead of modifying manifest file,
configure it in Open Ui client, under Administration-Application > Manifest
Administration
techonestop.in1
12. ActiveX Vs Open UI Architecture
* Provided by Oracle Corp
techonestop.in1
13. Example
Example: An user clicks on ‘My Opportunities’ to navigate to the My
Opportunities View
Step 1: Presentation model passes the request to the client proxy
Step 2: Proxy send the request to Siebel server
Step 3: Siebel server process the request and send results back to proxy
Step 4: proxy reads the manifest and download all required files
Step 5: Presentation model applies the business logic on result set and send
to physical renderer
Step 6: Physical Renderer prepares the final HTML file with the reference of
CSS files
Step 7: Result is presented to the user
techonestop.in1
14. Step 1
Step 1: Presentation model passes the request to the client proxy
- Presentation model captures the event (here, on mouse click) and sends
the request to client proxy
techonestop.in1
15. Step 2
Step 2: Proxy sends the request to Siebel server
- Proxy checks the client cache memory for the necessary data to fulfill
client request
- If it finds data, directly go to Step 4, otherwise sends the request to
Application Object manager on Siebel Server to get the record set
techonestop.in1
16. Step 3
Step 3: Siebel server process the request and send results back to proxy
- Application object manager processes the request and sends back record
set to proxy
• Metadata: object definitions for Columns, Applets, Views and all
• Runtime data: Comes from siebel database which is actual user data
techonestop.in1
17. Step 4
Step 4: Proxy reads the manifest and download all required files
- Proxy checks manifest files and downloads all JS and corresponding CSS
files to display opportunity records
techonestop.in1
18. Step 5
Step 5: Presentation model applies the business logic on result set and send
to physical renderer
- Once all data is received and files are downloaded, Proxy sends notification
to Presentation Model
- Presentation model applies business logic on received data, based upon JS
files
techonestop.in1
19. Step 6
Step 6: Physical Renderer prepares the final HTML file with the reference of
CSS files
- Once business logics are applied on all data, Presentation model sends the
notification to Physical Renderer to generate the HTML files with the
reference of CSS files
techonestop.in1
20. Step 7
Step 7: Result is presented to the user
- The final HTML web page, embedded with JavaScript, CSS and Data is
displayed in the browser
techonestop.in2
21. Q n A
Questions/Doubts ???
-Write it here
OR
-Visit our facebook community
page ‘TechOneStop’
OR
- Visit ‘www.techonestop.in’
techonestop.in21
22. Thank You !!!
- For more interesting features,
visit ‘www.techonestop.in’
techonestop.in22