Writing JSF applications for J2ME clients

Introduction

JSF is a Web framework for developing Component oriented web applications in the User Interface layer. Amongst the various capabilities that JSF provides, one of the major strengths of JSF is that it is not tied to any specific target device. For example, currently most of the JSF applications are running in a web server and are accessible through a web browser. However, web browser is not the only target for a JSF application to be viewed; it can be even accessed through a hand-held device, for example through a mobile phone. In this example, we will see how to develop JSF applications targeted for mobile phones. This article assumes that the reader has a good understanding of JSF, its life-cycle and some understanding on JSF renderer kits.

Download Sample Code for JSF Application for J2ME Clients

• Download Sample Code for JSF Application for J2ME Clients

Renderer kits

The responsibility of displaying a view in a target device is done through renderer kits. Renderer kits in JSF are nicely abstracted so it is possible to write custom implementation of renderer kits. Sun’s implementation of JSF provides a reference implementation of a HTML renderer kit. The HTML renderer kit is responsible for displaying the view in a web browser. So while writing a renderer kit implementation amongst the various factors to be taken into consideration, the important things are the target device, the protocol, the markup language and the scripting language. For a HTML renderer kit implementation, these would be the Web browsers, HTTP, hyper text markup language and java script.

Similarly a render kit implementation would consider the mobile phone browser, Wireless application protocol, the Wireless markup language (WML) and WML Script for providing suitable support in the mobile or any WAP browser. Wireless application protocol is the standard defined for displaying contents on wireless devices such as mobile phones. Similar to HTML that targets Web browsers, WML is the markup language for mobile phones. Consider the sample WML script,

1
2
3
4
5
6
7
8

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
   "http://www.wapforum.org/DTD/wml_1.1.xml" >
<wml>
	<card id="test" title="Test card">
		<p>This is a test WML page.</p>
	</card>
</wml>

Usually WML document can be thought of as a collection of cards. Each user interaction will be modeled as a card and each card will be inter-dependant. The syntax will mostly look like HTML for displaying the UI elements and content in the WML browser.

WML script, similar to Java script, is the client side scripting language for WML. It is mainly used for dynamically validating user input and it generally will appear in a separate file. Consider the following example script,

1
2
3
4
5

extern function sayHello()
{
	WMLBrowser.setVar("message", "Hello World.");
	WMLBrowser.refresh();
}

The above script will appear in a separate file, say ‘hello.wmls’ and the following wml page will provide a reference to the above wml script.

1
2
3
4
5
6
7
8
9
10

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
   "http://www.wapforum.org/DTD/wml_1.1.xml" >
<wml>
	<card id="test" title="Test card">
		<p><a href="hello.wmls#sayHello()">Run</a><br/>
		$(message)
		</p>
	</card>
</wml>

Mobile Faces

Mobile Faces for JSF provides a framework for simplifying the development of JSF applications targeted for wireless devices. The framework comes packaged with an implementation of renderer kits for HTML, XHTML-MP and WML. Also it supports various commonly used scripting languages such as Java Script, WML Script and ECMA Script. For testing JSF faces developed through Mobile Faces framework, we will be using OpenWave Browser for WAP. It serves as an emulator for testing WAP applications. In this article, we will be showing how to develop applications using the Mobile Faces toolkit.

Setting up the development environment

Download the following components before proceeding to the next section.

• Open Wave
• Mobile Faces

OpenWave is used for testing the JSF application in the WAP Browser. Mobile Faces distribution has to be downloaded, jar file has to be built from the distribution’s ant file and the same has to be made available in the application’s class path.

Comments

comments