Business components : Business components : Application Development of Business Component : Tasks : How to build the application with Business Component
  
How to build the application with Business Component
The UNICOM® Digital Transformation Toolkit (UDTT™) business component application consists of two parts: server side and client side.
The client side application is a RCP plug-in. Business component provides a lot of pre-build SWT UI composites that can be involved in the client application. These pre-build UI can be customized by the external configuration files. Business Component provides the flexibility that some components, such as EJ and Cash Drawer Management, can be deployed on either the server side or the client side. For example, the journal can be recorded on the client side or the server side. EJ and EJ viewer components support the two ways in the same API with almost the same configuration. The difference is that the application needs to define an EJ service proxy of UDTT Remote on the client side when EJ service is deployed on the server side.
See also
Client side configuration of business component application
Server side configuration of business component application
Tasks
Client side configuration of business component application
In the client side, Business component provides common and integrated configuration way for different subcomponents.
See the following figure for example of the Eclipse plug-in extension configuration.
This graphic is described in the surrounding text.
To display the navigator item in RCP, the RCP activity should be defined. Business Component provides a common BCActivity. The parameter of the activity should be com.ibm.btt.bc.ej.viewer.impl.EJViewerCompositeFactory;ejvconfig. The first part of parameter before the semicolon defines the factory to create the SWT composite. The second part, ejvconfig, is the configuration object ID in element factory configuration file.
When RCP is launched, the client application should initialize the configuration by following example code in Activator class.
elementFactory = new UniversalElementFactory("jar:///bttconfig/bttconfig.xml");
BTTFactory.setElementFactory(elementFactory);
XUIEngine.init("jar:///bttconfig/xuiengine.xml");
The following is the root configuration file example, bttconfig.xml. It imports sub configuration and defines a macro definition of the UDTT Remote service. This UDTT Remote macro definition can be used by EJ, Override, Access Control, Cash Draw configuration.
<root>
<import file="ejViewer.xml" />
<import file="override.xml" />
<import file="accessControl.xml" />
<import file="cashDrawerManagment.xml"/>

<macroDef id="remote">
<tagName name="interface" />
<attribute name="serviceId" />
<interface Instantiate="factoryElement"
FactoryClass="com.ibm.btt.remote.RemoteProxyFactory"
serviceId="@{serviceId}">
<ref Injection="httpClient" refId="httpClient"/>
<ref Injection="remoteConnectorUrl" refId="serviceUrl" />
</interface>
</macroDef>

<org.apache.commons.httpclient.HttpClient id="httpClient" />
<string id="serviceUrl" value="http://localhost:9080/BTTTellerSampleWeb/BTTRemoteConnector" />
<macro:remote id="postEngine" interface="com.ibm.btt.poc.postengine.PostEngine" serviceId="poc.postengine" />
</root>
The following is the content of EJ Viewer configuration file, ejViewer.xml.
Note Configuration object, ejvconfig, referenced by the BCActivity parameter is defined here. In this example, the EJ service is deployed in server side. So in the first line, there is a definition of EJ service proxy by the UDTT remote macro definition. Through the EJ viewer configuration, the application can control the layout and EJ fields of query condition and query result UI panel. For example, the application can set the width or height of the panel, and set the column number and field name and order.
<macro:remote id="ejEngine" interface="com.ibm.btt.bc.ej.BTTEJ" serviceId="ejJdbcT1" />
<com.ibm.btt.bc.ej.viewer.config.EJViewerConfigurationObject
id="ejvconfig" width="800" hight="600" >
<ref Injection="queryConditionLayout" refId="conditionUIlayout" />
<ref Injection="queryResultLayout" refId="resultUIlayout" />
<ref Injection="ejInstance" refId="ejEngine" />
<com.ibm.btt.demo.xui.EJRestoreTransactionXUIDemoImpl
Injection="restoreHandler" initPath="jar://bttconfig/xuiengine.xml" />
</com.ibm.btt.bc.ej.viewer.config.EJViewerConfigurationObject>
<com.ibm.btt.bc.ej.viewer.config.QueryConditionLayout
id="conditionUIlayout" colum="2">
<list Injection="fieldsList">
<com.ibm.btt.bc.ej.viewer.config.QueryConditionFieldDescriptor fieldName="ACCOUNT" />
<com.ibm.btt.bc.ej.viewer.config.QueryConditionFieldDescriptor fieldName="TxnID" />
<com.ibm.btt.bc.ej.viewer.config.QueryConditionFieldDescriptor fieldName="ACCOUNT2" />
<com.ibm.btt.bc.ej.viewer.config.QueryConditionFieldDescriptor fieldName="Status" />
<com.ibm.btt.bc.ej.viewer.config.QueryConditionFieldDescriptor fieldName="AMOUNT" />
<com.ibm.btt.bc.ej.viewer.config.QueryConditionFieldDescriptor fieldName="BankID" />
</list>
</com.ibm.btt.bc.ej.viewer.config.QueryConditionLayout>
<com.ibm.btt.bc.ej.viewer.config.QueryResultLayout
id="resultUIlayout">
<list Injection="fieldsList">
<com.ibm.btt.bc.ej.viewer.config.QueryResultFieldDescriptor fieldName="TxnID" width="100" />
<com.ibm.btt.bc.ej.viewer.config.QueryResultFieldDescriptor fieldName="ACCOUNT" width="130" />
<com.ibm.btt.bc.ej.viewer.config.QueryResultFieldDescriptor fieldName="AMOUNT" width="100" />
<com.ibm.btt.bc.ej.viewer.config.QueryResultFieldDescriptor fieldName="Status" width="100" />
<com.ibm.btt.bc.ej.viewer.config.QueryResultFieldDescriptor fieldName="ACCOUNT2" width="150" />
<com.ibm.btt.bc.ej.viewer.config.QueryResultFieldDescriptor fieldName="BankID" />
</list>
</com.ibm.btt.bc.ej.viewer.config.QueryResultLayout>
XUI Definition for transaction
As mentioned above, the transaction UI on the teller desktop is implemented with RCP XUI. So we need to define the following XUI definition files for the example. Each transaction has two XUI files; one is for the request, and the other for response. The following figure shows how to define the activity property for transactions with XUI.
DepositeReq.xui
DepositeResponse.xui
withdrawReq.xui
withdrawResponse.xui
This graphic is described in the surrounding text.
The following is the sample content of the DepositeReq.xui file.
Note The items with dataName defined, XUI engine will automatically creates a keyed Collection with the fields with the same name and values as the XUI fields with dataName defined when submission is executed.
<XUI>
<Composite id="DepositeRequest" bounds="41,32,757,571"font="Arial,9,NORMAL">
<Label bounds="211,38,244,33" text="Cash Deposit" alignment="CENTER" font="Arial,16,NORMAL"/>
<Label bounds="38,88,128,22" text="Account" alignment="RIGHT" />
<Text bounds="203,89,266,21" dataName="account"></Text>
<Label bounds="37,132,135,25" alignment="RIGHT" text="Dep. Book Number" />
<Text bounds="201,124,144,21" dataName="depositID" />
<Label bounds="36,172,137,28" text="Currency" alignment="RIGHT" />
<Combo bounds="200,166,99,24" text="RMB" dataName="currency"
dataNameForList="currencyTypeList" items="RMB;US$;EURO;HK$;pound" />
<Label bounds="35,210,145,27" text="Amount" alignment="RIGHT"></Label>
<Text bounds="197,210,157,22" dataName="amount" text="" enabled="true" editable="false"/>
<Button bounds="340,400,78,26" text="Submit" disableInError="true">
<list Injection="actions">
<com.ibm.btt.demo.action.DepositeAction />
</list>
</Button>
<Button bounds="376,204,138,29" text="Denomination Info">
<list Injection="actions">
<com.ibm.btt.demo.action.CashDrawerDepositAction />
</list>
</Button>
</Composite>
</XUI>
According to the above XUI definition, when the Submit button is clicked, the DepositeAction action is executed. In the implementation of the transaction action class, the code should check if override is needed. Then the application can call the server side operation or command chain to send the transaction request data to the host. After transaction response data is returned, the action displays the transaction response UI with the XUI engine.
See also
How to build the application with Business Component
Server side configuration of business component application
The following is the example content of the bttconfig.xml file of server side.
<import file="ej.xml" />
<import file="overrideServer.xml" />
<import file="transactions.xml" />
<import file="accessControl.xml" />
<com.ibm.btt.poc.postengine.PostEngineImpl id="poc.postengine" />
<com.ibm.btt.bc.common.pool.ConnectionPoolImpl id="JDBCDAOPool"
disablePool="true">
<com.ibm.btt.bc.common.pool.JdbcConnectionConfig Injection="jdbcConfig"
dbDriverName="COM.ibm.db2.jdbc.app.DB2Driver" dbUrl="jdbc:db2:journal" dataSource="jdbc/DEMO" />
<com.ibm.btt.bc.common.pool.PoolProperty Injection="poolProperty" maxActive="10" />
</com.ibm.btt.bc.common.pool.ConnectionPoolImpl>
The JDBC connection pool is commonly used by EJ and Access Control. So it is defined in the bttconfig.xml file.
Access Control Configuration
<com.ibm.btt.poc.login.LoginImpl id="login">
<ref refId="securityManager" Injection="securityManager"/>
</com.ibm.btt.poc.login.LoginImpl>

<com.ibm.btt.bc.ac.impl.BTTSecurityManager id="securityManager">
<ref Injection="securityObjectManager" refId="securityObjectManager" />
</com.ibm.btt.bc.ac.impl.BTTSecurityManager>
<com.ibm.btt.bc.ac.impl.SecurityObjectManager id="securityObjectManager">
<ref Injection="daoFactory" refId="db2DAOFactory" />
</com.ibm.btt.bc.ac.impl.SecurityObjectManager>
<com.ibm.btt.bc.ac.dao.db.DBDAOFactory id="db2DAOFactory" dbSchema="administrator">
<ref Injection="connectionPool" refId="JDBCDAOPool" />
</com.ibm.btt.bc.ac.dao.db.DBDAOFactory>
EJ configuration
<BTTEJ>
<com.ibm.btt.bc.ej.BTTEJBase id="ejJdbcT1" sharedMode="false">
<com.ibm.btt.bc.ej.dao.jdbc.EJDAOJdbcImpl Injection="ejDAO" tableName="administrator.ejtable">
<ref Injection="connectionPool" refId="JDBCDAOPool" />
</com.ibm.btt.bc.ej.dao.jdbc.EJDAOJdbcImpl>
<ref Injection="userDefinedFieldsDesc" refId="UserDefinedFieldsDescriptionTable" />
</com.ibm.btt.bc.ej.BTTEJBase>
<list id="UserDefinedFieldsDescriptionTable">
<com.ibm.btt.bc.ej.FieldDescriptor fieldName="ACCOUNT" isNumeric="false" />
<com.ibm.btt.bc.ej.FieldDescriptor fieldName="AMOUNT" isNumeric="true" />
<com.ibm.btt.bc.ej.FieldDescriptor fieldName="TxnID" isNumeric="false" />
<com.ibm.btt.bc.ej.FieldDescriptor fieldName="BankID" isNumeric="false" />
<com.ibm.btt.bc.ej.FieldDescriptor fieldName="Status" isNumeric="false" />
<com.ibm.btt.bc.ej.FieldDescriptor fieldName="ACCOUNT2" isNumeric="false" />
</list>
</BTTEJ>
Override configuration
<config>
<com.ibm.btt.msg.poll.PollMessageDispatcher id="com.ibm.btt.msg.MessageDispatcher" traceMessage="true" />
<com.ibm.btt.bc.override.agent.OverrideAgentImpl id="com.ibm.btt.bc.override.agent.OverrideAgent">
<ref Injection="messageDispatcher" refId="com.ibm.btt.msg.MessageDispatcher" />
</com.ibm.btt.bc.override.agent.OverrideAgentImpl>
</config>
Transaction configuration
In the configuration example, we use command chain to implement server side transaction handling. In this definition example, the definition is clear and flexible to add or remove the command. Also the command is highly reused.
<transactions>
<com.ibm.btt.command.CommandChain id="depositeCmdChain">
<java.util.ArrayList Injection="commands">
<ref refId="accessControlCmd"/>
<com.ibm.btt.demo.srvcmd.EJBeforeTransactionCmd />
<com.ibm.btt.demo.srvcmd.SendToHostCmd />
<com.ibm.btt.demo.srvcmd.EJAfterTransactionCmd />
</java.util.ArrayList>
</com.ibm.btt.command.CommandChain>
<com.ibm.btt.command.CommandChain id="withdrawCmdChain">
<java.util.ArrayList Injection="commands">
<ref refId="accessControlCmd"/>
<com.ibm.btt.demo.srvcmd.EJBeforeTransactionCmd />
<com.ibm.btt.demo.srvcmd.SendToHostCmd />
<com.ibm.btt.demo.srvcmd.EJAfterTransactionCmd />
</java.util.ArrayList>
</com.ibm.btt.command.CommandChain>
<com.ibm.btt.demo.srvcmd.AccessControlCmd id="accessControlCmd">
<ref refId="securityManager" Injection="securityManager" />
</com.ibm.btt.demo.srvcmd.AccessControlCmd>
</transactions>
See also
How to build the application with Business Component