A summary of my iWidget development in the classic “Hello World” format.

Requirements

1. WebSphere Integration Developer 7;
2. a deployed Business Space 7 (in my case, on WebSphere Portal 6.1.5)
3. a supported Mozilla Firefox (3.0.x with 7.0.0.0 of Business Space) or Internet Explorer 6 (SP2) and 7

Develop iWidget

Bring up WebSphere Integration Developer and get on the “Web” perspective.  Ask to create a new “Dynamic Web Project”.

Dynamic Web Project dialog, project name set to com.ibm.issw.iwidgetdemo, target runtime set to WebSphere Process Server v7.0, Dynamic Web Module version is set to 2.5, and configuration is custom. EAR membership is unticked.
EAR or WAR?  If EAR, say yes to “Add project to an EAR” – if WAR, say no.  For iWidgets, I would use WAR’s.

Modify the configuration to include the iWidget facet:

iWidget ticked

When the project has been created, create a new iWidget:

iWidget project wizard selected
and…

Create a New iWidget dialog. iWidget name set to HelloWorld.xml, source folder to /com.ibm.issw.iwidgetdemo/WebContent, and type set to Simple Widget. Edit mode is unticked.

The iWidget editor should then appear.  A good opportunity to explore.  When you’ve done – there’s nothing that needs to be done here if all what you want to see is a “Hello World” iWidget.

Test iWidget

With the iWidget file selected, Run -> Run As -> Run on Server, and ask for the J2EE Preview server:

J2EE Server is selected

Then the iWidget should be automatically run in a testing environment for iWidgets.  I prefer to use Firefox and Firebug which can be configured through Preferences -> General -> Web Browser (use the Search… button to find Firefox executable):

Web Browser pane. Use external Web browser is selected, under the External Web browsers list, Firefox with Firebug is ticked. The two other, unticked options are Default system Web browser and Internet Explorer.

and the iWidget should show in Firefox:

Firefox with one window, of 3 parts: 1. HelloWorld widget showing "Hello World", 2. three widgets for creating, sending, and receiving events, all blank, 3. the FIrebug console, currently showing content of iWidget in the CDATA tag, and some text saying there are 4 errors.

The wiring aspect of the iWidget can also be tested through using the widgets in the middle (currently blank as the iWidget has no configured events).

Deploy iWidget

A couple of jobs here.  Firstly, export the project as WAR (or EAR) and deploy on the JEE-based server, steps of which can be found elsewhere.  Secondly, business Space’s palette needs to be updated with details of this iWidget:

A couple of artificets need to be produced to update the palette.  Create a new general project with the following structure:

Project folder called com.ibm.issw.bspace.catalog, with two folders called catalog and endpoints, in catalog a file called catalog_ISSW.xml and in endpoints a file called ISSWEndpoints.xml

with contents for the catalog file based on this and for the endpoints file on this.

Export the project as ZIP and deploy on Business Space.  The installBusinessSpaceWidgets for standalone Business Space and installBusinessSpaceWidgetsOnPortal for Business Space on Portal commands can be used to deploy.  For example, for on Portal:

/opt/IBM/WebSphere/wp_profile/bin/wsadmin.sh -conntype NONE

$AdminTask installBusinessSpaceWidgetsOnPortal {-serverName WebSphere_Portal -nodeName vm304 -widgets /home/bjfletcher/ISSWCatalog.zip}

Reload Business Space in the web browser and the widget should appear in the palette.

Thanks

Thanks to E. Wayne and V. Ramamoorthy – particularly updating Business Space’s palette on Portal.

Advertisement