WebCenter 11gR1 PS3 – Design Time at Run Time with a Vengeance – introducing run time Data Controls and Data Visualizations

The concept of design time @ run time that empowers application administrators and even end users to influence the application after it has been deployed has been gaining traction over the last few years. Bit by bit, run time customization facilities have made their way into Fusion Middleware. In the form of the SOA Composer, the BPM Process Composer, custom customization in ADF and various WebCenter features – most prominently the Composer framework.

The recent 11gR1 Patch Set 3 release has brought design time @ run time to the next level. In terms of functional richness as well as ease of use. Design Time at Run Time enables run time application administrators to not only change the layout of existing pages as well as add new content – static HTML or live Portlets -, but also to create new pages, edit the navigation structure of the application, change component properties and skin-attributes, create data controls and create and edit taskflows. Many of the application aspects that until recently were the sole discretion of the application developer are now available at runtime to privileged users. All in aid of agility and quick time to market.

This article gives a very rapid demonstration of the creation of a new WebCenter Portal application with only default content. This application is deployed in the Integrated WebLogic Server. At run time, a new page is created as well as a new Data Control for Employee from the EMP table in the SCOTT database schema. A table visualization of the Employees is added – still at run time – to this dynamically created page.

This next screenshot is of a page that did not exist when the application was deployed, with a table component that was created at run time through a data control that was also configured after deployment.

The environment used for this demonstration is JDeveloper 11gR1 PS 3 with the WebCenter extensions (WebCenter Framework and Services Design Time, WebCenter Customization Framework Design Time) (install through the Update Center in JDeveloper or directly from http://www.oracle.com/ocom/groups/public/@otn/documents/webcontent/156082.xml).

Additionally, a database was used with the SCOTT sample schema and – more importantly – the WebCenter schema as installed through the Repository Creation Utility (http://download.oracle.com/otn/nt/middleware/11g/111140/ofm_rcu_win_11.1.1.4.0_disk1_1of1.zip).

Furthermore, a JDBC Data Source – ScottDS – was created through the WebLogic Server Admin Console for the Integrated WebLogic Server (http://localhost:7101/console). This Data Source is used later on in the WebCenter application to create a Data Control at run time.

In the (design time) application, I have created Database Connections for the Activities and WebCenter schema created through the Repository Creation Utility.

Upon creation, JDeveloper proposed to associate these connections with Activities and WebCenter – which is exactly what I want.

Steps for creating the application

Since the focus of this article is on Design Time @ Run Time, the steps for design time @ design time should be straightforward. And they are. There is really nothing to it. Here it goes:

1. Start JDeveloper 11gR1 PS 3

2. Create New Application (from the New Gallery) based on Template WebCenter Portal App.

3. Assign a name and a location – for example WCApp_DesignAtRuntime in c:\temp – and accept all default.

4. Locate file home.jspx and run it.

At Run Time: Create Data Control for EMP table in SCOTT schema

The application appears. You are prompted to login. You can do so using weblogic/weblogic1 as the default credentials for the integrated weblogic server.

The home page appears. We added nothing to it, and it appears pretty sparse. Design time effort: next to nothing. Result from design time effort: pretty much zero as well. Now for the interesting bit.

Click on the Administration link to make interesting.

The Administration page appears. Click on Create Page.

Enter the name for the page – for example EmployeesOverview – and select a layout template and press OK to create the page:

Back in the Administration page, click the Data Controls link.

Then click the Create icon, to create a new Data Control:

Select the default Data Control type (SQL). Select the Scott Data Source – or whatever the name of the Data Source that you created yourself in the WLS Console. Type the name of the password that is used by this Data Source to connect to the database. This is an extra protection to ensure that only ‘initiated personnel’ can use the data source.

Type the SQL statement in the box. You can make use of bind parameters – that for example through a parameter form could be retrieved from the end user. Use the Test button to check the correctness of the query. Provide a name and a description.

Click on the Create button. The newly created Data Control shows up. Note that its status is set to hidden. This means that the Data Control is currently not available to base Data Visualizations on.

With the Data Control selected, click on Edit and select Show from the dropdown list:

This changes the status of the Data Control and makes it available for use in Task Flows under Data Visualizations.

Add Table of Employees to the page EmployeesOverview

Click on the Pages link. Select the dynamically created page EmployeesOverview. Select Edit Page from the Actions menu:

The Page appears in Edit Mode.

Click on Add Content.

The Resource Catalog Browser appears. Open folder Web Development. Next, open folder Data Controls.

Open the folder for the Employees data control. Finally, click on Add for the Employees collection. Select Table as the display style for this Data Control.

The Create Table wizard appears. It allows us to set additional characteristics for this table style visualization of the Data Control. On the first page, we can specify the table style – note that the distinction Table and Read-Only Table only becomes relevant for ADF BC Data Controls (deployed with the application). We can also configure table properties such as Sortable Headers for the Columns and Filters in the Column Headers.

Press Next.

Specify which of the columns in the Data Control should be displayed in the table. Press Next.

Specify details per column, such as the display style, the column header and potentially the deeplink characteristics of the cell-values. Click Create to complete the wizard and return to the page editor.

The page editor reappears, with the table component that we have just configured. Click on the close icon to leave the editor, and return to the application in ‘normal view mode’.

The Employees Overview page appears – a page that was created at run time. It contains data from a Data Control that was also created at run time, displayed in a Table component that was also created at run time!

The table can be reorganized: changing width of columns as well as the order in which they display. The Filter can be used to further refine the selection of records that is displayed.

Summary

Of course it is not an ordinary end user who will create SQL Queries in a Web application. Or who will create a Data Visualization based on a predefined Data Control. However, the mechanism demonstrated here would allow a developer to enrich an application at run time, without necessarily going through the entire deployment process.

Application Adminstrators and Content Editors will probably not create SQL queries themselves, but can be trained to create the Data Visualizations from Data Controls that were either deployed with the application or have been created by a developer at run time.

This article should provide you with a a glimpse of what the application of the future could look like. More in future articles.