Skip to main content

Delivering green-screen applications to mobile devices using Rational Host Access Transformation Services (HATS) V7.1

An introduction to HATS V7.1 mobile device support

Rick Hardison (rhardison@sdicorp.com), Consultant, Systems Documentation, Inc. (SDI)
Rick Hardison joined IBM in Raleigh, North Carolina in 1970 as a junior programmer. In 1977, he joined an installation support department and provided customer education and installation support for the first releases of IBM networking software. In 1981, he became a product planner and was involved with the announcement of VTAM support for APPN. In 1992, Rick moved into technical marketing providing support for IBM's Communications Clients and Servers, Host On-Demand and Host Access Transformation Services. Rick retired from IBM in 2005 and has since provided consulting services, including technical writing, through Systems Documentation, Inc. (SDI).

Summary:  This article summarizes the support provided by IBM Rational® Host Access Transformation Services (HATS) V7.1 (and later) that allows you access to character-based 3270 and 5250 applications (host applications) from mobile devices such as cellular phones, data collection terminals, and personal digital assistants (PDAs). A working knowledge of Rational HATS capabilities and application development tasks is assumed.

Date:  16 Sep 2008
Level:  Intermediate
Activity:  656 views

Overview

With Rational HATS, access to host applications can be modernized and delivered to users without any impact to the existing, proven host applications. Rational HATS does this by dynamically transforming and delivering 3270 applications running on IBM® System z™ platforms, as well as 5250 applications running on IBM® System i™ platforms to Web, portal, or rich client users. It also exposes key business processes and data as Web services.

Using Rational HATS, you can create Web applications and rich client applications that provide an easy-to-use graphical user interface (GUI) to improve usability and leverage reuse of 3270 and 5250 host applications.

You can develop Rational HATS Web applications, including portlets, with an interface that matches a company’s Web or portal GUI standards, and users can access them through their Web browsers. Rational HATS Web applications can also be developed to provide access to host applications from mobile devices such as cellular phones, data collection terminals, and personal digital assistants (PDAs).

Mobile device support

Using Microsoft® Internet Explorer Mobile, users with mobile devices can access Web applications. However, mobile devices have different characteristics than more traditional workstation client devices. These different mobile device characteristics place different requirements on the Web application:

  • A more traditional client device has a relatively large screen size (for example, 1024 x 768 pixels). However, the screen size of a typical mobile device is relatively small (for example, 320 x 240 pixels).
  • Also, a traditional client device typically supports the use of a mouse or keyboard for user interaction, whereas a mobile device may only have the keys provided on a cellular phone.
  • Finally, a traditional device generally has more processing power, memory, and a higher-speed connection to the Internet than does a mobile device.

With Rational HATS, you can develop a Web application to provide access to 3270 and 5250 host applications from mobile devices. The process for developing a Rational HATS Web application for a mobile device is the same as developing any Rational HATS Web application, with some considerations due to the different characteristics of the mobile device and its Web browser.

Rational HATS V7.1 (and later) includes several new functions to aid in developing a Web application to meet the requirements of mobile devices. These new functions, as well as other Rational HATS functions, are discussed in this article.

The remainder of this article discusses two approaches that you can use with Rational HATS to provide access to 3270 and 5250 host applications from mobile devices:

  • With the first approach, you use Rational HATS to develop a Web application that dynamically transforms host screens to modern graphical Web pages that meet the requirements of mobile devices.
  • With the second approach, you use Rational HATS Integration Objects to access the host applications and create customized Web pages to provide access from mobile devices.

Using screen transformations to support mobile devices

Rational HATS V7.1 screen transformation functions provide you the ability to develop Rational HATS Web applications to support mobile devices. The supported browser is Internet Explorer Mobile (V5.0 or later).

As with any Rational HATS application, you begin development by creating a Rational HATS project using the IBM® Rational® Software Delivery Platform.

Creating a project

When you create a project for a Rational HATS application that you intend for use by mobile devices, you should select the Optimize options for mobile devices option on the first page of the Create a Project wizard, as shown in Figure 1.


Figure 1. Creating a project for mobile devices
Set Name, Location, and Deployment options

Selecting this option initializes the project with options that work best for mobile devices. Some options (for example, printing, keyboard, asynchronous update, and other options) are not supported for mobile devices, and are therefore disabled.

When you optimize a project for mobile devices, the option for selecting a project theme is not provided. In this case, you can think of the mobile device option as being a theme itself.

Also, only templates optimized for use with mobile devices are provided for use in the project, as shown in Figure 2.


Figure 2. Default templates
Template on left, Preview on right

Default project settings

Default rendering

After you create a project optimized for mobile devices, you will notice some of the differences from a project for a typical Web application. For example, in the project settings a second rendering set (named compact) is created and set as the default, and the Use compact rendering option in selected, as shown in Figure 3.


Figure 3. Default rendering
tree view on left, detail options on right

In general, the default rendering set attempts to preserve the original host screen structure while extending functionality by automatically adding GUI controls (such as links, buttons, and tables) to improve user productivity. However, to allow default rendering of host screens to be displayed on mobile devices, the Use compact rendering option is supplied to allow a certain amount of compacting. With compacting, the amount of HTML and blank space is reduced, which may possibly display a different structure of the original host screen.

In the compact rendering set, notice that the Drop-down (selection) widget, instead of the Link widget, is used in default rendering for selection lists. This is done to preserve space on what is presumed to be a small screen mobile device. For example, the selection list on the host screen shown in Figure 4 is transformed by default to be a drop-down list, as shown in Figure 5.


Figure 4. Selection list on host screen
Main Menu with numbered list of choices

Notice the drop-down widget for the select list in the following figure.


Figure 5. Default rendering of selection list as a drop-down
List as drop-down to save screen space

Depending on the mobile device, when the drop-down widget is selected, the items in the selection list may be displayed on a separate page, as shown in Figure 6.


Figure 6. Default rendering of selection list drop-down
Same numbered list as on host screen

Also, in the compact rendering set, notice that recognition and transformation of dialogs is activated. In the host screen shown in Figure 7, the area contained within the simulated box is recognized as a dialog.


Figure 7. Host screen dialog
Section to Specify Collection or Library

By default, only the dialog area of the screen is transformed for display on the device, as shown in Figure 8.


Figure 8. Default dialog transformation
Same selection without blank lines

Application keypad

Additional options have been added to both the Application Keypad and Host Keypad settings. By default, the application keypad is displayed as icons in mobile device projects, as shown in Figure 9.


Figure 9. Application keypad settings
tree view on left, options on right

Figure 10 shows the default application keypad displayed as icons in the top right corner.


Figure 10. Default application keypad displayed as icons
screen displays icons selected in Rendering dialog

Host keypad

By default, the host keypad is displayed as a drop-down list. You can select which keys to display in the Host Keypad, as shown in Figure 11. At a minimum, you should include the Enter key for the default transformation and all custom transformations, because keyboard support is disabled in mobile projects.


Figure 11. Host keypad settings
tree view on left, options on right

Figure 12 shows the default host keypad displayed as a drop-down list with a Submit button.


Figure 12. Default host keypad displayed as a drop-down list with a Submit button
drop-down on left, button on right

Depending on the mobile device, when you select the host keypad drop-down list widget, the host keys you defined for the default transformation may be displayed on a separate page, as shown in Figure 13.


Figure 13. Host keypad drop-down list
Selected key names listed vertically

Widget settings

Next, notice the project settings for the Field widget. A new Layout drop-down option allows you two choices, Table or Separated, as shown in Figure 14. You select Table to render the output in a table, with the goal of preserving the layout of the original host screen. This is the default for Web applications not optimized for mobile devices.

Select Separated to render the output using inline span tags to differentiate between fields, with the goal of reducing the amount of HTML and blank space. This is the default for Web applications optimized for mobile devices.


Figure 14. Field widget
select from tree view on left, options on right

In addition, you can use the setting, Enable cursor positioning option on input fields, to allow the user to switch from data input mode to cursor positioning mode for input fields. When in data input mode, the user can enter data into the input field, as shown in the User field in Figure 15.


Figure 15. Data input mode
User name is MYIDBAD

To switch to cursor positioning mode, the user activates the link, designated by the asterisk (*) following the input field, as shown in Figure 16.


Figure 16. Switching to cursor positioning mode
asterisk to right of User name

When in cursor positioning mode, the user can tab to, or otherwise position the cursor on, any character in the input field, as shown in Figure 17. The cursor is now positioned at the "B" in the input field shown following.


Figure 17. Cursor positioning mode
the B in MYIDBAD is highlighted

To switch back to data input mode, the user activates the link, designated by the asterisk (*) following the input field, as shown in Figure 18.


Figure 18. Switching to data input mode
toggle the asterisk

The cursor is now positioned at the “B” in the input field shown in Figure 19.


Figure 19. Data input mode
User field highlighted, cursor before the B

Now, for example, if the user submits a Field exit host key (as shown in Figure 20), the data from the cursor location to the end of the field is deleted, and the field is exited (as shown in Figure 21).


Figure 20. Submit Field exit from the host keypad
field on left, Submit button on right

Figure 21. Field exit to the next input field
User name is now MYID, cursor in password field

This setting is useful for mobile devices that do not have other cursor positioning capabilities, and is available for the Field widget and also for the Popup, Subfile (check box), Subfile (drop-down), Subfile (popup), Table, and Text input widgets.

To aid in displaying table data on a mobile device, Rational HATS provides the Columns placement function for the Table, Subfile (check box), Subfile (drop-down), and Subfile (popup) widgets. This function allows you to arrange and exclude columns from the display. The function also allows expandable detail columns, so that the table can fit into a smaller horizontal space.

The detail columns, when expanded, are displayed directly below the row containing the primary columns of data. Once a particular row is expanded by the user, the detail columns are displayed in a format that flows down the screen rather than to the right. This enables small displays to view an arbitrary number of columns without resorting to horizontal scrolling.


Figure 22. Columns placement
tree view on left, options on right

For example, the host screen shown in Figure 23 has a table with four columns, PART_NUMBER, PART_NAME, SALES_PRICE, and PRODUCT_CATEGORY.


Figure 23. Host column data
line in inches, table rows numbered sequentially

When the project is optimized for mobile devices, the Table widget displays only the first two columns as primary columns, as shown in Figure 24.


Figure 24. Primary columns
PART_NUMBER and PART_NAME display

When the user expands the row to display the detail columns, they are displayed vertically below the primary columns, as shown in Figure 25.


Figure 25. Detail columns
SALES_PRICE and PRODUCT_CATEGORY below line 11

You can also select the option, Keep detail columns on the server. In some cases, this allows for a reduction of the amount of data transferred, because unwanted detail data is never sent over HTTP to the end device. Only the details that are specifically requested by the user are retrieved on-demand and sent to the browser.

Screen customizations and transformations

Use Rational HATS screen customization and transformation functions for a truly usable and optimized application for mobile devices. You can create an easy-to-use Web browser interface that makes only necessary functions available, and hides the rest. Using Rational HATS, you can transform host screens (like the one in Figure 26) into Web pages that are much easier to read and navigate (such as the one shown in Figure 27).


Figure 26. Complex host screen
Search screen

With Rational HATS, you can hide the complex interface from the end user, prompt for only required fields, and supply drop-down lists of valid values. You can display results using different HTML widgets, which makes results much easier to read and understand. You can limit what information displays, and collect results from multiple screens and display them on a single, scrollable Web page.


Figure 27. Web transformation of host screen
drop-down list with valid search values

Rational HATS’ ability to combine screens, skip unnecessary screens, enter information, and run macros on behalf of the end user, streamlines transactions by reducing the number of keystrokes and workflow steps needed to complete the transaction. These streamlined transactions with graphical user interfaces make it possible to extend the use of host application functions to users with mobile devices.

Preferences

When you first create a blank screen transformation in a Web project, Rational HATS may or may not include a free layout table in the transformation. By default, if the project is optimized for mobile devices, Rational HATS does not include a free layout table. You can select this option in the Rational HATS Toolkit preferences.

The preferences can be accessed from the Rational Software Delivery Platform menu bar by selecting Window > Preferences. One of the preferences allows you to specify whether to include a free layout table in each blank transformation you create in a Web project. By default, if the project is optimized for mobile devices, this option is overridden using the option, Except when the project is optimized for mobile devices, as shown in Figure 28.


Figure 28. Preferences
tree view on left, options on right

Using Integration Objects to support mobile devices

You can use Rational HATS' powerful macro and Integration Object capabilities to build pre-defined transactions for the user. Using Model 1, Struts, Java™Server Faces (JSF) Web pages, or Web services as the interface, these pre-defined transactions can prompt the user for input (such as an account number or a part number). Then, on behalf of the user, Rational HATS drives the host application to complete the transaction.

This capability enables the information to be externalized for access by mobile devices, but controls what the user is allowed to see and do. It also allows you to develop Rational HATS applications for mobile devices that support Web browsers other than those supported by Rational HATS screen transformation capabilities.

If a transaction is performed by multiple host applications, Rational HATS can combine interaction with all of them through a single Web interface. For example, you may have one host application that processes new order information, and another that processes customer account or history information. With Rational HATS you can provide communication with both applications through a single Web interface. Users never know that they are using two different applications.

To implement a Rational HATS Web-driven host transaction, you create a HATS macro to provide programmed navigation through the host screens that make up your host transaction. Next, from the macro, you generate a Rational HATS Integration Object (IO), which is a bean that encapsulates and provides a programming interface to execute the macro. Then you generate Web pages through which users can invoke the IO from their mobile devices.

Creating HATS macros

Rational HATS macros are easily created in the Rational HATS Toolkit. You record a macro using the Host Terminal wizard as you navigate through host screens using a live host connection, as shown in Figure 29. Using the macro, you can prompt the user for input to a host screen input field, navigate through other screens, and extract data from screens to return to the user’s mobile browser.


Figure 29. Recording a Rational HATS macro using the Host Terminal
tabs on top, tree view left, host screen right

After recording, you can edit your macros using the same Host Terminal wizard, or by using either the Macro Editor or the Advanced Macro Editor supplied with the HATS Toolkit.

Rational HATS V7.1 and later also includes the Visual Macro Editor (VME), as shown in Figure 30. The VME is a tool for visually developing Rational HATS macros, enabling you to build macros (and to find logic problems within them) more easily at development time.

The VME combines many of the features of the Rational HATS Host Terminal, Macro Editor, and Advanced Macro Editor into one tool, and allows for offline development of macros. It provides for the optional, automatic capture of screens as a macro is being recorded in the Host Terminal. It also allows flows to be copied between macros, and provides drag-and-drop support for adding new screens.

Note: The VME is a technology preview that can be optionally installed. It is not supported, but is provided for use as-is in Rational HATS V7.1.


Figure 30. Using the Visual Macro Editor for macro development
diagram showing data flow and branching

Creating Integration Objects

When you create an Integration Object (IO) for a macro, it creates a Java™ programming interface to execute the macro. The interface accepts the input expected by the macro, drives the macro, and supplies as output the output supplied by the macro.

Once you have created a macro, it is easy to create an IO by simply right-clicking the macro in the Rational HATS Projects view and selecting Create Integration Object, as shown in Figure 31. In the Rational HATS preferences, you can indicate that IOs be created automatically whenever you save a macro.


Figure 31. Creating an Integration Object from a macro
menu commandCreating Web pages

The next step in developing your IO application for mobile devices is to create Web pages that allow the mobile device user to submit input and receive output from the host application by driving the IO, and ultimately the macro. To do this, simply right-click the Integration Object and select Create Model 1 Web Pages, Create Struts Web, Pages, or Create JSF Web Pages, as shown in Figure 32.


Figure 32. Creating a Web page to drive an Integration Object
menu command

In the Create Web Pages wizard, you can specify which input properties to display on the Web page, as well as the input controls to use, as shown in Figure 33. You can also specify which output properties to display, including output controls.


Figure 33. Defining input properties displayed on the Web page
Leading text in data field, type of Input Control

Because 3270 and 5250 host applications are connection oriented, you may want to use connection pooling in conjunction with Connect and Disconnect macros to optimize performance and response time when running your IO.

When you specify connection pooling in your application, and specify that Rational HATS use Connect and Disconnect macros, Rational HATS maintains a pool of host connections that are already signed on and ready to run your IO upon request. Using this technique eliminates constant signing on and off of the host system when running your IO.

Once you deploy your application, users can simply use their mobile device browsers to access the URL for your Web page, and enter whatever input you have allowed for, as shown in Figure 34.


Figure 34. Web page that drives the Rational HATS Integration Object
search field and Submit button

When the user submits input on the Web page, this allocates a connection from the connection pool and drives the IO, which in turn drives the macro and the host application, as shown in Figure 35.


Figure 35. Host macro driven using input submitted by the user
search value from mobile query

Using the input submitted by the user, the macro navigates the host application and extracts the requested output.


Figure 36. Data extracted to return to the user
results from the query

The IO then passes the extracted output back to the user’s mobile Web browser, and the connection is returned to the connection pool waiting for another input request, as shown in Figure 37.


Figure 37. Host data returned to the mobile device Web browser
part results listed on mobile device

Migrating and testing mobile projects

As you begin to modernize access to your 3270 and 5250 host applications, it is likely that you will have different Rational HATS applications for traditional Web browser users versus mobile browser users. However, if you develop a Rational HATS Web application for traditional users, and you want to use the same, or a similar, application for mobile users, you must manually develop a separate Rational HATS project for mobile use.

Migrating

One approach for creating a Rational HATS Web application for mobile use, which application is similar to an existing traditional Rational HATS Web application, is to perform the following steps:

  1. Create a new Rational HATS project and select the option Optimize options for mobile devices.
  2. Copy all of the screen captures, screen customizations, and macros from the existing project to the new mobile project.
  3. Create new screen transformations in the mobile project to support the requirements of your mobile devices.
  4. Modify the screen customizations to apply the appropriate new screen transformations.
  5. If you use Integration Objects (IOs), regenerate the IOs from the macros that you copied, and recreate the Web pages that drive the IOs to support the requirements of your mobile devices.

Testing

You can test your Rational HATS mobile device applications the same way that you test traditional Rational HATS Web applications, using the internal test servers provided with the Rational Software Delivery Platform. You can use the internal Web browser provided with the Rational Software Delivery Platform, or external Web browsers. It is recommended that you also use mobile device emulators (for example, Microsoft Device Emulator V2 or later) to create a more realistic mobile device testing environment. You should also test with real mobile devices.


What you have learned

With Rational HATS V7.1, you can now more easily develop Rational HATS Web applications that provide screen transformation access to your 3270 and 5250 host applications from mobile devices such as cellular phones, data collection terminals, and personal digital assistants (PDAs).

In addition, you can use Rational HATS' robust macro and Integration Object support to provide access to pre-defined host transactions from mobile devices. These Rational HATS functions allow you to improve the productivity of your increasingly mobile workforce, and can help you broaden your customer base and improve your level of service.


Resources

Learn

Get products and technologies

Discuss

About the author

Rick Hardison joined IBM in Raleigh, North Carolina in 1970 as a junior programmer. In 1977, he joined an installation support department and provided customer education and installation support for the first releases of IBM networking software. In 1981, he became a product planner and was involved with the announcement of VTAM support for APPN. In 1992, Rick moved into technical marketing providing support for IBM's Communications Clients and Servers, Host On-Demand and Host Access Transformation Services. Rick retired from IBM in 2005 and has since provided consulting services, including technical writing, through Systems Documentation, Inc. (SDI).

Comments (Undergoing maintenance)



Trademarks  |  My developerWorks terms and conditions

Help: Update or add to My dW interests

What's this?

This little timesaver lets you update your My developerWorks profile with just one click! The general subject of this content (AIX and UNIX, Information Management, Lotus, Rational, Tivoli, WebSphere, Java, Linux, Open source, SOA and Web services, Web development, or XML) will be added to the interests section of your profile, if it's not there already. You only need to be logged in to My developerWorks.

And what's the point of adding your interests to your profile? That's how you find other users with the same interests as yours, and see what they're reading and contributing to the community. Your interests also help us recommend relevant developerWorks content to you.

View your My developerWorks profile

Return from help

Help: Remove from My dW interests

What's this?

Removing this interest does not alter your profile, but rather removes this piece of content from a list of all content for which you've indicated interest. In a future enhancement to My developerWorks, you'll be able to see a record of that content.

View your My developerWorks profile

Return from help

static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=1
Zone=Rational
ArticleID=337066
ArticleTitle=Delivering green-screen applications to mobile devices using Rational Host Access Transformation Services (HATS) V7.1
publish-date=09162008
author1-email=rhardison@sdicorp.com
author1-email-cc=

My developerWorks community

Tags

Help
Use the search field to find all types of content in My developerWorks with that tag.

Use the slider bar to see more or fewer tags.

Popular tags shows the top tags for this particular content zone (for example, Java technology, Linux, WebSphere).

My tags shows your tags for this particular content zone (for example, Java technology, Linux, WebSphere).

Use the search field to find all types of content in My developerWorks with that tag. Popular tags shows the top tags for this particular content zone (for example, Java technology, Linux, WebSphere). My tags shows your tags for this particular content zone (for example, Java technology, Linux, WebSphere).

Rate a product. Write a review.

Special offers