How Siebel CRM Renders Siebel Open UI Clients

Siebel CRM does the following to render a Siebel Open UI client:

• Uses HTML div elements and HTML tables in SWE templates to determine physical layout instead of the HTML frames that high interactivity uses. Siebel Open UI does not use div elements to structure a page. The entire page hierarchy that Siebel Open UI uses is a hierarchy of div elements. Siebel Open UI does not use the HTML frame.

• Uses cascading style sheets (CSS) to specify position, dimension, and styling for HTML elements, such as font color and font type, instead of the HTML code that high interactivity uses. This styling does not apply to the objects that an ActiveX control renders in a high-interactivity client, such as a list applet.

This configuration is more closely aligned with current guidelines for Web design than the configuration that high interactivity uses. Siebel Open UI allows you to customize how Siebel CRM renders individual objects in the client without having to use Siebel Tools, and it allows you use an alternative configuration, such as your custom configuration or a third-party configuration, to bind the Siebel business layer to user interface objects. Siebel Open UI allows you to customize an existing SWT file or create a new SWT file.

How Siebel CRM Renders Div Containers on Siebel Servers

Figure 2-1 illustrates how the Siebel Server uses SWE tags that reside in SWE templates to render div containers on the Siebel Server. For example, it renders a swe:view tag as a view container. It does the same rendering on this server for Siebel Open UI that it does for high interactivity.

Figure 2-1 How Siebel Servers Use SWE Tags to Render Containers on the Siebel Server

How Siebel CRM Handles Data in Siebel Open UI

Figure 2-2 illustrates how Siebel CRM uses a presentation model, which is a JavaScript file that resides in the client that specifies how to handle the metadata and data that Siebel Open UI gets from the Siebel Server. Siebel CRM then displays this information in a list applet or form applet in the client. The presentation model provides a logical abstraction of the metadata, transaction data, and behavior for part of the user interface. Siebel Open UI includes a presentation model for each significant part of the user interface, such as the application menu, toolbars, screen tabs, visibility drop-down lists, applet menus, different types of applets, and so on. The presentation model does not render the HTML in the user interface.

Figure 2-2 How Siebel CRM Handles Data in Siebel Open UI

How Siebel CRM Renders Objects in Siebel Open UI

Figure 2-3 illustrates how Siebel CRM uses a physical renderer, which is a JavaScript file that Siebel Open UI uses to render the user interface. A physical renderer contains instructions that describe how to render the physical presentation and interaction for a user interface element, such as a grid, carousel, form, tree, tab, menu, button, and so on. Each physical renderer references a presentation model, and it uses the metadata, data, and behavior that this presentation model defines to render an object in the client. For more information about presentation models and physical renders, see "About the Siebel Open UI Development Architecture".

Figure 2-3 How Siebel CRM Renders Objects in Siebel Open UI

Examples of How You Can Customize Siebel Open UI

Siebel Open UI uses the presentation model and the physical renderer to separate the logical user interface from the rendering. This configuration allows you to modify the user interface without having to modify the logical structure and behavior of the client. For example, you can modify the physical renderer so that it uses a third-party, grid-to-carousel control to display a list applet as a carousel without modifying a presentation model. For more information about this example, see "Customizing List Applets to Render as Carousels".

You can use the physical renderer of a control to implement a variety of configurations so that Siebel Open UI can render this control at nearly any physical location in the browser and with your custom logic. You can use the physical renderer to display different parts of the same applet in different physical panes in a Siebel screen. For example, you can configure Siebel Open UI to display a temporary recycle bin that uses data from the presentation model to render data in a pane that is physically separate from the data that the list applet displays. For more information about this example, see Chapter 4, "Example of Customizing Siebel Open UI."

You can use the presentation model to modify the logical behavior of the user interface without modifying the physical renderer. For example, you can modify a presentation model to add a list column in a list applet so that it iterates through list columns and renders them without modifying the physical renderer. This column can reside on the client even if the Siebel Server contains no representation of it.

You can customize at the control level writing plug-in wrappers that govern how a control should appear and behave when a certain set of conditions are satisfied. A checkbox appearing as a flipswitch on mobile devices is an example of this type of implementation.