Creating widgets using IBM Web Experience Factory

You can use IBM® Web Experience Factory to help you create custom widgets. With IBM Web Experience Factory, application developers of all skill levels can create widgets that will run in Business Space,

1. Create a IBM Web Experience Factory project for your custom widget.
   1. Click File > New > WebSphere Portlet Factory Project. The Create WebSphere Portlet Factory Project wizard opens.
   2. In the first page, type the name of the project and click Next. You can leave the other fields with default values.
   3. In the Feature Set page, select the features that you need to include in the project. The project must include the Widget Extension feature in the Integration Extensions group. The project must also include the Dojo Extension feature in the Dojo Ajax group if your widget is using Dojo. Click Next.
   4. In the Server Configuration page, click Create Server Configuration. The Create Server Configuration window opens.
   5. Select IBM WebSphere Application Server and IBM Mashup Center 2.0 and then click OK. The Mashup Center server is the Business Space server. The Edit Server Configuration window opens.
   6. Provide a name and description for the server configuration and then provide the information necessary to connect to it.
      Restriction: The name can only have letters, numbers, dots (.) or underscores (_). It cannot have spaces or other characters.
   7. In the Edit Server Configuration window, click OK to close it. The Server Configuration page of the wizard now lists the server configuration that you created. Make sure that the new server configuration is the only one that is selected.
   8. Click Finish.
   9. When the Publish request window opens, click Yes. The wizard completes creating the project and then publishes it to the server configuration. The publish action runs in the background and may take some time to complete.
2. Create the IBM Web Experience Factory model for your custom widget.
   1. Click File > New > WebSphere Portlet Factory Model. The Create WebSphere Portlet Factory Model wizard opens.
   2. In the first page, select the project to contain the model and click Next.
   3. In the Select Model page, select the model type that you want to use as the base for the model and then click Next. The following page or pages that open next depend on the model type that you selected.
   4. In the following page or pages, make any appropriate selections and click Next. For example, if you selected Main and Page in the previous page, on this page you select between using a simple page or an imported page as the home for your widget. The imported page option provides a field in which you can select which file to import.
      Tip: With some model types, you can select to publish widgets to the server as an action of the wizard. You can select this option or defer publishing until later.
      Keep making appropriate choices for your model until the wizard displays the Save New Model page.
   5. Specify where to save the model to the project and then click Finish.
3. Develop your widget until it has the functionality that you want.
4. Create image files to serve as the preview and icon images for your custom widget and put them somewhere in the WebContent directory. Make the icon image 28 pixels by 28 pixels and make the preview image 160 pixels wide by 128 pixels high.
5. Test your widget by publishing it to a Business Space server:
   1. Open the model to edit it.
   2. Right-click the model and select Add Builder Call. The Builder Picker opens.
   3. Select Widget Adapter for the builder type and then click OK. The Widget Adapter page opens.
   4. Provide the information for the widget and then click OK. The widget title is the name that Business Space displays. The widget category is the category that contains the widget on the widget palette.
   5. Save your changes.
   6. Right-click the IBM Web Experience Factory project and select Widgets > Publish Widgets to Lotus Mashups toolbox.
   7. From the list of widgets, select your widget and then click OK.
   8. In a web browser, browse to the Business Space URL. The URL will be something like http://localhost:9080/BusinessSpace.
   9. Log into Business Space and then test your widgets.