How to move an existing CICS application to a smartphone

Using Rational software to code a mobile-to-CICS application

Reginaldo Barosa describes how to modernize an existing IBM® z/OS® application by using service-oriented architecture (SOA) to move it to a smartphone. Without making changes in the existing IBM® CICS® application, he shows how to create and deploy CICS web services that a smartphone can invoke.

Share:

Reginaldo W. Barosa (rbarosa@us.ibm.com), Executive IT Specialist, IBM

Reginaldo Barosa photoReginaldo W. Barosa is an IBM Executive IT Specialist. He provides technical sales support, helping customers with enterprise modernization solutions and development tools, such as Rational Developer for System z. Before joining IBM U.S. more than 13 years ago, Reginaldo worked for 27 years for IBM Brazil. He has co-authored IBM Redbooks and has written two books, as well as other articles and tutorials for IBM developerWorks. He holds a degree in electrical engineering from Instituto Maua de Tecnologia, Sao Paulo, Brazil.


developerWorks Professional author
        level

23 July 2013

Also available in Russian

Introduction

I read recently that more smartphones than standard phones are being made this year. This is a milestone in a trend that is putting computing power and Internet access in millions of hands worldwide.

According to information quoted in that article, citing IDC analysis, manufacturers shipped 216 million smartphones worldwide in the first three months of 2013, compared to 189 million regular cell phones. The writer states that smartphones made up 51.6% of the 419 million mobile phones sold.

This article shows you how you can easily create a hybrid smartphone application that reuses an existing IBM® z/OS® application by using IBM® Rational® software. By following the concepts demonstrated here, you can create a smartphone client application that invokes an IBM® CICS® or COBOL application running on an IBM® z/OS® mainframe, transformed into SOAP web services. Although the example in this article uses COBOL and CICS, the same principles and technology can be applied to PL/I or IMS, RPG with IBM® System i®, as well as RESTful web services.

The sample CICS transaction

For this scenario, we used CICS Transaction Server (TS) for z/OS, Version 4.2. It might work for previous versions, as well. CICS users can follow the documentation to install the CICS catalog manager example application (transaction named EGUI).

This installation is quite simple. You need to install and deploy not just the COBOL code required to run the 3270-based application, but also the COBOL wrappers and the SOAP web services that you can use as an example.

Perform the steps defined in the CICS documentation to implement the example explained here.

Figure 1 shows the traditional 3270 screen for the sample application, which displays data retrieved from a Virtual Storage Access Method (VSAM) data set. In this application, the user enters a valid item number, and the data is retrieved from a VSAM data set. It is used to populate the fields on the 3270 screens. The user can also select a specific item and order it by specifying the quantity, user name, and charge department.

Figure 1. Existing example COBOL/CICS application 3270 map interface
3270 screen sequence with EGUI transaction running

The objective: Create a smartphone application by reusing existing code

The objective is to modernize this application by accessing the back-end data through the existing CICS/COBOL code that is running on an IBM® z/OS® system, using a smartphone as the interface.

The actual CICS/COBOL application will not change, but because you want to access it through a smartphone, you have the opportunity to create a much better interface for it. For example, for a smartphone, you could add the user location to the UI by using the GPS or take a user photo to add to the user profile.

Figure 2 shows the new interface as displayed on an Apple iPhone. The z/OS application returned the item data, but additional capabilities will be added to the iPhone client. This would be impossible on a 3270 screen, of course.

Figure 2. The new interface for the z/OS application using an iPhone
iPhone screens examples after transforming CICS EGUI

Create a smartphone application

The next sections describe the sequence for building the sample application. The process consists of two major steps:

  1. Create, deploy, and test the CICS web service.
  2. Build the smartphone client to invoke the web service.

To follow the steps described here, you need access to IBM® Rational® Developer for System z® and IBM® Worklight.

The instructions in this article are based on the assumption that you are familiar with Eclipse and the concepts of perspectives and views. The Rational products mentioned previously include tutorials to help you become familiar with related terms and concepts, so you do not need to be very experienced to follow along. A general understanding of mainframe terminology and mobile concepts is also helpful.

1. Create, deploy, and test the CICS web service

In this first step, the COBOL client programs and the 3270 map screens are eliminated, and the server COBOL/CICS code is wrapped as CICS web services and represented by the WSDL (Web Services Description Language). This step is fundamental in the transformation of your application. Figure 3 shows the topology of this transformation,

Figure 3. Eliminating 3270 maps for CICS web services
Diagram of 3 services created

This is the simplest part of the entire process, and using IBM® Rational® Developer for System z® (hereafter referred to as Rational Developer) makes it even easier. There are many tutorials that explain how to perform this task, so the detailed steps will not be repeated here. You will apply the Rational Developer Enterprise Service wizards to the CICS/COBOL program, and the wizards will generate a CICS SOAP Web service and the WSDL. The code can also be deployed into CICS also using Rational Developer facilities.

In this scenario, we used three sample CICS web services that invoke the provided COBOL wrapper programs. These wrapper programs were created to mask the back end and provide a simplified web services interface. The source for the three wrapper programs, along with the web services and copybooks, is located in the CICS SDFHSAMP library. The COBOL wrapper programs are documented in the Defining the web service client and wrapper programs section of the CICS info center documentation.

Table 1 lists the provided COBOL wrapper programs, their copybooks, and descriptions.

Table 1. COBOL- or CICS-provided wrapper programs
COBOL wrapperCopybooks used in the programProgram description and provided WSDL
DFH0XICWDFH0XWC1 - Defines the data structure for the inquire catalog request.
DFH0XWC2 - Defines the data structure for the inquire catalog response.
DFH0XCP1 - Defines the commarea interface to the catalog manager module and the data store modules.
Wrapper program for Inquire Catalog web service
(inquireCatalogWrapper)
DFH0XISWDFH0XWC3 - Defines the data structure for the inquire single request.
DFH0XWC4 - Defines the data structure for the inquire single response.
DFH0XCP1 - Defines the commarea interface to the catalog manager module and the data store modules.
Wrapper program for the Inquire Single web service
(inquireSingleWrapper).
DFH0XPOWDFH0XWC5 - Defines the data structure for the place order request.
DFH0XWC6 - Defines the data structure for the place order response.
DFH0XCP1 - Defines the commarea interface to the catalog manager module and the data store modules.
Wrapper program for the place Order web service (placeOrderWrapper)

Example of creating a CICS web service using Rational Developer

The web services are already provided, so you don't need to recreate them. However, this article shows an example how to create one of the three web services so you can deploy it and even debug it using the Debug tool for z/OS (not part of Rational Developer). This example creates a CICS web service from the COBOL wrapper program that does the Inquire to a single item action.

To preserve the provided COBOL programs, you create a copy of the DFH0XISW program, and name it DITLXISW. This allows you to recompile this program with debug options. Later, you will need to change the provided wsbind code to invoke this new program. These are the required steps:

  1. Copy the DFH0XISW program, and name it DITLXISW.
  2. Create a web service for the CICS project, and use bottom-up and Interpretive XML Conversion.
  3. Import the DITLXISW program and its copybooks (DFH0XCP1, DFH0XWC3, and DFH0X0C4).
  4. Generate and deploy the web service to your CICS installation, assuming that you have the web services infrastructure ready (pipelines, and so forth).
  5. Test the deployed web service
  6. Modify the provided wsbind code to invoke the new wrapper program.

Figures 4, 5, and 6 show the most important dialog windows when you are creating the CICS web services using Rational Developer. Notice that we use a CHANNEL interface rather than COMMAREA to invoke the CICS wrapper COBOL program.

This dialog window in Figure 4 asks for the input message that the COBOL program will receive. Notice that, in this example, we do not use the traditional CICS COMMAREA

Figure 4. Input request for Language Structures
web services dialog, Input Request message

The dialog window in Figure 5 asks for the output message that the COBOL program will return.

Figure 5. Output Response Language structure
web services dialog, Output Response message

The dialog window in Figure 6 asks for the Program interface to be used. Notice that this example uses CHANNEL rather than the traditional CICS COMMAREA.

Figure 6. Program interface through the channel
web services dialog window, CHANNEL selected

The Rational Developer for System z dialog window enables you to create, deploy, and test the CICS web service without affecting the existing CICS/COBOL application.

Figure 7 shows the WSDL generated by Rational Developer. The input request is the item number, and the output response data related to this item.

Figure 7. WSDL generated by Rational Developer wizards
Tab view shows the WSDL generated

If you have the required z/OS authorization, the generated wsbindcan be deployed to your CICS. Also, you have the option to install the CICS web services (pipeline scan) by using the generated CICS resource definition element (DITLXISW.admr).

If the deployment was successful, you can test the CICS service created using the Rational Developer Web Services Explorer. The explorer uses a web browser as an interface to enable you to test a simple web invocation. To perform this test, follow these steps:

  1. Right-click on DITLXISW.wsdlin the Generation/Targets folder and select Web Services > Test with Web Services Explorer. This WSDL will provide the information that you will need to create the Worklight adapter later.
  2. Click DITLXISWOperation, and then enter a valid item number (for example, 0010), and click Go.

Figure 8 shows the CICS web services test and the data returned from CICS.

You need to have a successful test before you can continue. In this example, the CICS service is deployed into a mainframe that is listening on port 9036. Be sure that there are no firewalls blocking your connection. If you receive no data or have other errors, correct the problem and retest before you proceed.

In case you prefer not to create and deploy this web service, you could use the provided web service example named inquireSingleWrapper.

Figure 8. Invoke the CICS web service with the Web Services Explorer
Actions pane shows web services testing entries

Import this project into Rational Developer

Note:
This article does not explain the process of creating the CICS web services. If you need details about how to do that, read my article titled Wrap existing COBOL programs as Web Services with IBM Rational Developer for System z.

If you have Rational Developer installed, you can fast-track this activity by importing the Project Interchange file and related assets, including the WSDL included here.

  1. Download and decompress the Mobile_to_zOS.zip file from the Download section of this article.
  2. Use a temporary file to decompress this file. It will create:
    • EGUI_CICS_Services_Project.zip
    • Worklight_CICS_web_service_application.zip
    • Worklight_EGUI_Application.zip file
  3. Start Rational Developer, and point to an empty workspace.
  4. Select File > Import > General > Existing Projects into Workspace > Next.
  5. Point to the extracted EGUI_CICS_Services_Project.zip file, select All, and click Finish.
  6. You must open the Enterprise Service Tools perspective to see what you have imported.

Modify the provided wsbind to invoke the wrapper program that you created

When performing the sample web services installation procedure by following the Installing web service support in the CICS information center documentation. Figure 9 shows the wsbind resources created in the z/OS UNIX directories.

Figure 9. WSBIND resources created when installing the sample
WSBIND files circled in screen segment

Because you need to use the new COBOL code wrapper that you copied, you also need to modify the corresponding inquireSingleWrapper.wsbind resource sample that was provided.

Using the Rational Developer and the Enterprise Developer perspective, make these modifications:

  1. Locate on your z/OS system where the sample wsbind files provided are located, which is probably in this folder:
    /usr/lpp/cicsts/cicsts42/samples/webservices/wsbind/provider
  2. Right-click inquireSingleWrapper.wsbind, and select Open With > WSBind editor.
  3. Change the Program name from DFH0XISW to DITLXISW (the new program name that you copied) as Figure 10 shows.
  4. Install this service again using the pipeline scan, or just double-click the admr file type.
  5. Compile and link the new DITLXISWprogram. Be sure that your CICS can access it, and then add this new resource to the CICS Processing Program Table (PPT) If you have the Debug tool for z/OS, remember to compile with the TEST option so you could debug it.
Figure 10. WSBIND modified
WSBIND modified to invoke DITLXISW
  1. Now you can test the newly created wrapper program by using the provided web service, inquireSingleWrapper.wsdl, and its related inquireSingleWrapper.wsbind.

In case you want to debug the COBOL code by using Rational Developer, you must create a Debug Configuration. Be sure that no users (field User ID on Debug Configuration options) are associated with the invoked program.

Figure 11 shows the Debug tool for z/OS interacting with Rational Developer.

Figure 11. Rational Developer Debug perspective, debugging the web service invocation
Screen shows Debug in action

At this point, the z/OS server code is ready, and you can create the smartphone interface. In this scenario, we used the z/OS running on a laptop (see Rational Developer and Test Environment for System z), because it makes this entire test very easy and agile. However, it would be exactly the same if using a mainframe.

2. Build the smartphone client

You are now ready to create the user interface, using the IBM® Worklight mobile application platform to invoke the sample CICS services.

Worklight includes five components:

  • Worklight Studio
  • Worklight Server
  • Worklight Device Runtime Components
  • Worklight Application Center
  • IBM Worklight Console

Together, these components help to build, test, run, and manage mobile applications that can meet the enterprise security standards of global organizations. The platform is designed to support application provisioning, user authentication, encrypted server-client communication, and offline availability, including on-device encryption and offline authentication.

In this scenario, you will use only the Worklight Studio, which also provides a test server (Worklight Server). With Worklight, you can create and deploy native, HTML5, and hybrid mobile apps.

You can use Worklight to build, test, deploy, and manage your smartphone and tablet apps for iOS, Android, BlackBerry, and Windows Phone devices. If you want more details about Worklight, see Getting started with IBM Worklight, which includes self-paced modules (PDF files), exercises, and sample code that will get you started.

IBM Worklight reduces your development cost, improves time-to-market, and enhances mobile application governance and security. It uses standards-based technologies that avoid the use of code translation, proprietary interpreters, and unpopular scripting languages. Organization use Worklight to achieve several goals:

  • Support multiple mobile operating environments and devices with the simplicity of a single, shared code base
  • Easily connect and synchronize with enterprise data, applications, and cloud services
  • Safeguard mobile security at the device, application, and network layer
  • Govern their mobile app portfolio from one central interface.

In this article, you will see just one example of how to create one CICS Worklight adapter for the web service that you tested before and a very small application that invokes this specific adapter. You can import this small sample application by using the Worklight_CICS_web_service_application.zip file provided in this article.

The full application, with many more functions, is provided in the Worklight_EGUI_Application.zip file included with this article. (See the About the download section.) Later in this article, you will see instructions on how to import this file to Worklight Studio and test the application.

The steps to create the adapter and small application to invoke a single CICS web service are as follows:

  1. Change the default Worklight browser to an external browser, such as Google Chrome.
  2. Create a Worklight project and a hybrid application.
  3. Create a Worklight adapter for the CICS web service.
  4. Create the Worklight application that invokes this adapter.
  5. Create the smartphone environments.
  6. Test the iPhone application.
  7. Verify the service call response time.

Change the default Worklight browser to Google Chrome

For later code preview and eventual debug, it is better to use another browser rather than the Worklight default browser. Google Chrome is an excellent choice. Follow these steps to change the default browser:

  1. Using Worklight, select Window > Preferences > General > Web Browser.
  2. Select Use external web browser.
  3. Click the New button, provide a name, and locate the Chrome browser.
  4. Click OK, and select this browser as the new default.

From now on, each time that the Worklight needs a browser, it will open Google Chrome.

Create a Worklight project and a hybrid application

Using the Worklight Design perspective, create a hybrid application. We suggest using a hybrid application instead of other options, because it uses some of the smartphone capabilities and JavaScript as the client.

  1. Select File > New > Worklight Project.
  2. Name the project something meaningful (CICS_web_service, for example), select Hybrid Application, and click Next.

    Note:
    A hybrid application can target multiple environments. It is written primarily in HTML5, CSS, and JavaScript, but it can be extended with native code. It can access the smartphone device capabilities through a JavaScript API.
  3. Name the application (something like inquireSingle). Make sure that JQuery, Sencha, and Dojo are not selected, and click Finish. The required folders are created and the editor opens.
  4. Using the editor, click the Source tab of application descriptor xml, and verify that the Worklight server is pointing to your workstation:
    <worklightServerRootURL>http://${local.IPAddress}:8080</worklightServerRootURL>
  5. Close the editor.

Create a Worklight adapter for the CICS web service

Using the Worklight Design perspective, create an adapter that invokes the CICS web service, inquireSingleWrapper:

  1. Under the CICS_web_service project, right-click the adapters folder, and select New > Worklight Adapter.
  2. Using the Adapter type drop-down menu, select HTTP Adapter.
  3. Name the adapter something meaningful (for example, inquireSingle), and click Finish. The editor opens showing the inquireSingle.xml file.
  4. Click the Design tab, and then delete the getStories and getStoriesFiltered procedures by selecting them and clicking the Remove button.
  5. To add JavaScript that will invoke the SOAP web service, still using the Design tab, right-click the inquireSingle adapter, and click Add.
  6. Select Procedure, and click OK.
  7. In the Details section, name it inquireSingleSOAP. You will see the new procedure created.
  8. Click Connection Policy, and modify the Domain and Port. The domain is the TCP IP server (in this example, 192.168.1.101), and the port is the port number where the CICS web services are deployed (in this example, 9036).
  9. Save the file.

Figure 12 shows a source code example where the z/OS server TCP IP address is 192.168.1.101, the port number is 9036, and the inquireSingleSOAP procedure is added.

Figure12. Modified inquireSingle adapter editor
Screen shows inquireSingle.xml content

You still need to modify the JavaScript procedure used by the adapter to invoke the CICS web service.

To modify the generated inquireSingle-impl.js code:

  1. Double-click on inquireSingle-impl.js to invoke the editor (under adapters/inquireSingle).
  2. Replace this file as shown in Figure 13. Note that those changes are based on the WSDL generated provided by the sample. You can also import this file from the code provided in the Worklight_CICS_web_service_application.zip file.
Figure 13. The JavaScript code used by the adapter
Screen showing inquireSingle-impl.js content

You now can deploy this adapter:

  1. Right-click on the CICS_web_service project, and select Start Worklight Server. Use the Worklight console and be sure that the "Activation done" message is displayed.

    Tip:
    If you have problem displaying the console, select Window > Show View > Other > General > Console. You might need to click the Console icon to show the Worklight console.
  2. Under the Adapters folder, right-click inquireSingle, and select Run As > Deploy Worklight Adapter. Verify that the "Adapter deployed successfully" message is displayed on the Worklight console.

Create the Worklight application that invokes this adapter

As mentioned before, you are creating a very simple application where you can type an item number, invoke the CICS web service, and get the response. The smartphone EGUI application provided here is more complex than this. However, this code will give you a good idea about how to use the adapters and populate the fields with the request and response messages.

Follow these steps to create this small application:

  1. Under CICS_web_service project (under apps/inquireSingle/common), open the inquireSingle.html file.
  2. Using the Source tab, replace the content with the code shown in the Listing 1.
  3. Under the JavaScript folder, open the inquireSingle.js file, and, using the Source tab, replace the code with the content shown in Listing 2.

You don't need to type this code. You will find it with the sample files provided with this article in the Download section. Look for this file:
Worklight_CICS_web_service_application.zip

Important:
Be sure that there are no editor errors in the files.

Listing 1. The inquireSingle.html code

Click to see code listing

Listing 1. The inquireSingle.html code

<!DOCTYPE HTML>
<html>
<head>
	<meta charset="UTF-8">
	<title>inquireSingle</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0,	     maximum-scale=1.0,	minimum-scale=1.0, user-scalable=0">
	<link rel="shortcut icon" href="images/favicon.png">
	<link rel="apple-touch-icon" href="images/apple-touch-icon.png">
	<link rel="stylesheet" href="css/inquireSingle.css">
	<script>window.$ = window.jQuery = WLJQ;</script>
</head>
<body id="content" style="display: none;">
	<h1>Invoke CICS inquireSingle</h1>
	<hr>
	<table>
		<tbody>
			<tr>
				<td><h3>Order Item
</h3>
				</td>
				<td><input type="text" id="inputID" value="0010">
				</td>
			</tr>
			<tr>
				<td><h3>Description
</h3>
				</td>
				<td><textarea id="ResultID" readonly 
				     style="font-style: italic; color: blue"></textarea>
				</td>
			</tr>
			<tr>
				<td><h3>Cost</h3>
				</td>
				<td><textarea id="PriceID" readonly 
				     style="font-style: italic; color: blue"></textarea>
				</td>
			</tr>
		</tbody>
	</table>
	<hr>
	<button id="ButtonID" onclick="invokeCICS(inputID.value)" 
	        style="font-weight: bold; color: black;
	        background-color: yellow">Invoke CICS</button>
	<script src="js/initOptions.js"></script>
	<script src="js/inquireSingle.js"></script>
	<script src="js/messages.js"></script>
</body>
</html>
Listing 2. The JavaScript inquireSingle.js
function wlCommonInit(){
}
function invokeCICS(itemRef){	
	var obj = {};
	obj.itemRef = itemRef;
	var invocationData = {
			adapter: "inquireSingle",
			procedure: "inquireSingleSOAP",
			parameters: [ obj ]
	};
	WL.Client.invokeProcedure(invocationData, {
		onSuccess: function (result)
		{
			var item =
			result.invocationResult.Envelope.Body.inquireSingleResponse.
singleItem;
					 document.getElementById("ResultID").value = 
item.itemDescription;
					 document.getElementById("PriceID").value = 
item.unitCost;
		},  
		 onFailure: function (result) {
				console.debug("ERROR: "+result);
		},
	});
}

Create the smartphone environments

This example shows how to create iPhone and Android environments.

  1. Under CICS_web_service project, right-click the apps folder, and select New > Worklight Environment.
  2. Using the Application/Component drop-down menu, select inquireSingle.
  3. Select both iPhone and Androidphones and tablets, and click Finish.

New icons and folders will be created.

Test the iPhone application

Worklight provides a fast way to preview the code by using browsers. Assuming that you have changed the defaults to use an external browser (such as Google Chrome), just follow these steps:

  1. Under CICS_web_service project, under apps/inquireSingle, right-click iphone, and select Run As > 3 Preview.

Be patient, because this operation can take a few minutes.

The Worklight application will be deployed to the Worklight server, and the external web browser will start. If you followed the previous suggestion, the Chrome browser will open.

  1. Type a valid item, such as 0010, and click the yellow Invoke CICS button.

Figure 14 show the result of the CICS web service invocation.

Tips:

  • You can use the Rotate button to see the iPhone behavior.
  • You also can run a similar emulation for the Android environment if you right-click on Android, and select Run As > 3 Preview.
Figure 14. The iPhone Mobile Browser Simulator
Screen shows iPhone Browser Simulator in action

Verify the service call response time

You might be impressed with the response time of this CICS web service call, because it is merely milliseconds.

To see the response time (using the Google Chrome web browser):

  1. In the top-right corner, click the Customize and Control… icon .
  2. Select Tools > Developer Tools and notice the new window at the base of the browser (see Figure 15).
  3. Using this new window, select the Network tab.

Figure 15 shows an example of response times from a real example.

Figure 15. Using the Chrome Browser to verify the calls response time
web service call response time in milliseconds

As you noticed the CICS web service calls are extremely fast. You now could use your creativity to create a more sophisticated interface and complex applications using CICS web services.

EGUI smartphone client example

Using the concepts described previously, we built a more sophisticated example application. We used the Dojo framework in this case.

You can download and import this code by following these steps:

  1. Download the Worklight_EGUI_Application.zip file provided with this article to a temporary file.
  2. Start Worklight if it is not already running.
  3. Import the provided code using the File > Import function
  4. Expand General > Existing Projects into Workspace > Next.
  5. Select Archive file, and use the Browse button to point to <temp> Worklight_EGUI_Application.zip.
  6. Deselect MobileEnterpriseEGUIAndroid(native), and click Finish. This import will take a while, because it also has frameworks, such as the Dojo one.

You still need to clean your workspace. Otherwise, you might have errors when trying to start the Worklight server.

  1. Close Worklight.
  2. Start Worklight with the clean option. One way to do that is to is to right-click Worklight startup path, select Properties, and modify the start parameters by adding the –clean option.

    Example: C:\Program Files (x86)\IBM\WLStudio\Worklight.cmd -clean
  3. Restart Worklight.

Tip:
Remember to delete this option as soon Eclipse starts. Otherwise, all starts will take too long. You need to do that only once.

  1. Open the Worklight console (select Window > Show View > other > General > Console), and then select Worklight console.
  2. Right-click the MobileEnterprise project, and select Start Worklight Server.

    Note:
    The example provided uses the z/OS server at the address 192.168.1.101. You will need to adjust to your z/OS server. Under the Adapters folder, open all the files with type xml and verify that the TCPIP address and ports are reflecting your z/OS system.

    Example:
    The InquireCatalogWrapper.xml file under adapter/InquireCatalogWrapper
  3. Under the Adapters folder, right-click the InquireCatalogWrapper. InquireSingleWrapper, and PlaceOrderWrapper adapters, and deploy them by using Run As > Deploy Worklight Adapter. Each adapter will be deployed and confirmed by a console message that says "Adapter deployed successfully."
  4. Under the appl folder, right-click iphone, and select Run As > 4 Preview.

Figure 16 shows this application running, using an iPhone preview.

Figure 16. EGUI application, iPhone preview
Screen showing iPhone browser preview in action

Observe that a new function named Inquire (Search) Catalog adds more value to the iPhone application. Try this function. Using a collection loaded from the browse catalog, the user can type and search the content.

Figure 17 gives an example. When the user types blu, all occurrences with those letters are listed. This capability is not on the 3270 original green screens. Remember that no new code was added to the existing COBOL and CICS applications.

Figure 17. Inquire (query), a new capability added to the smartphone application
Screens show the Search Catalog iPhone preview

Also, we can extend the application to use the capabilities of smartphones to take pictures or use the GPS. Figure 18 shows an example where a new function called My Customer Profile allows you to either take a picture or use the GPS. You can also see the real iPhone screen captures in Figure 2.

Figure 18. New smartphone-native capabilities added to the application
Screen showing iPhone application with new native capabilities

Benefits of using web services

This article described using one existing COBOL CICS application and no changes in the code. No single line of COBOL or Java code was written. The CICS running on z/OS provides all of the web services capabilities. Also, the response time of the web services invocation was milliseconds.

In this small example, we used three CICS web services, but we could have used dozens of web services for different functions.

Security is not the focus here, and no authentication was necessary. But in the real world, this could be implemented using the web services security framework as well the Worklight server for authentications.


Benefits of using Worklight

The advantage of using smartphones is obvious, so I will not discuss that. But we need a software development tool that explores all if the capabilities of the smartphones and can easily connect to web services with good performance.

Note that the Worklight adapters that connect to the z/OS server are not downloaded to the smartphones, but they are stored at the Worklight server. Only the client code that uses the adapters is installed on the smartphone. This way, we have the advantage of having three tiers: the client smartphone, the Worklight server, and the z/OS CICS server.

Worklight also provides several more benefits:

  • Reduces development costs, accelerates time to market, and helps deliver new, higher-quality smartphone applications
  • Performs well and offers a rich user interface
  • Supports multiple smartphone operating systems
  • Extends the value and the life of the reliable business logic that resides in System z, as well other systems, by using adapters
  • Manages push notifications centrally
  • Improves application quality with integrated functional testing

About the download

The download materials included with this article contain code that you can use to implement the ideas presented here. Download the Mobile_to_zOS.zip file to a temporary drive on your computer and decompress it. Rather than build all of the pieces on your own, the code for the entire example is provided, so you can focus on the concepts described. The download file includes these files:

Worklight_EGUI_Application.zip
Exported Rational Developer for System z file that must be imported into Rational Developer and used to create, test, and deploy the CICS web services described in this article.
 
Worklight_CICS_web_service_application.zip
Exported project from Worklight discussed on this article. You might also need this code to copy and paste code to use in this sample.
 
Worklight_EGUI_Application.zip
Exported project from Worklight. It is the complete example described on this article. Michael Lavacca created this code.
 

Acknowledgement

Thanks to my colleague Michael C Lavacca who provided the smartphone application on which this article is based. The screen captures illustrate the application, as well.


Download

DescriptionNameSize
Code sampleMobile_to_zOS.zip117MB

Resources

Learn

Get products and technologies

Discuss

Comments

developerWorks: Sign in

Required fields are indicated with an asterisk (*).


Need an IBM ID?
Forgot your IBM ID?


Forgot your password?
Change your password

By clicking Submit, you agree to the developerWorks terms of use.

 


The first time you sign into developerWorks, a profile is created for you. Information in your profile (your name, country/region, and company name) is displayed to the public and will accompany any content you post, unless you opt to hide your company name. You may update your IBM account at any time.

All information submitted is secure.

Choose your display name



The first time you sign in to developerWorks, a profile is created for you, so you need to choose a display name. Your display name accompanies the content you post on developerWorks.

Please choose a display name between 3-31 characters. Your display name must be unique in the developerWorks community and should not be your email address for privacy reasons.

Required fields are indicated with an asterisk (*).

(Must be between 3 – 31 characters.)

By clicking Submit, you agree to the developerWorks terms of use.

 


All information submitted is secure.

Dig deeper into Rational software on developerWorks


static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=1
Zone=Rational, DevOps
ArticleID=937154
ArticleTitle=How to move an existing CICS application to a smartphone
publish-date=07232013