Home Page

Back to Papers


Introduction - Why WAP?

WML

XML

The Oracle XDK

An Example Application

Our first XSQL Page

Browser Sensitivity

A WML Stylesheet

WML Output

An HTML Stylesheet

Conclusion and Resources

A WML Stylesheet

One of the potential difficulties with developing for handheld devices is the variety of different device possibilities. Rather than having to go and buy a bunch of mobile phones and PDA devices to test your application, most manufacturers provide free development kits that include documentation and, more important, an emulator of the device itself. This allows you to see how your application will look when running on the device itself. There are a number of emulators that I've used, including the Nokia and Ericcson development kits and the one I've used here - the Phone.com UP SDK. The browser used by that device (and a number of others) returns a HTTP_USER_AGENT string containing "UPG1 UP". So, if the user is using the phone.com UP Browser, then the data will be formatted using jobserve_wml.xsl, as follows.

Again, I've added line numbers for clarity but these would not be in the final version. Because this script and it's associated notes are so long, you might want to open a plain-text version in a different window by clicking here.

Example 5 - JOBSERVE_WML.XSL Stylesheet


1. <?xml version="1.0"?> 
2. <xsl:stylesheet xmlns:
		xsl="http://www.w3.org/1999/XSL/Transform" 
		version="1.0">
3. <xsl:output method="xml" doctype-public="-//WAPFORUM//DTD WML 1.1//EN"
4. 	media-type="text/vnd.wap.wml"
5. 	doctype-system="http://www.wapforum.org/DTD/wml_1.1.xml"
6. 	encoding="ISO-8859-1"/>
7. <xsl:template match="/">
8. <wml>
9. <card>
10. 	<p><b>RECENT POSTINGS</b></p>
11. 	<xsl:for-each select="ROWSET/ROW">
12. 	<p><anchor><go>
13. 	<xsl:attribute name="href">#card<xsl:number/>
14. 	</xsl:attribute>
15. 	</go>
16. 	<xsl:value-of select="SHORT_TITLE"/></anchor></p>
17. 	</xsl:for-each>
18. </card>
19. <xsl:for-each select="ROWSET/ROW">
20. <card>
21. 	<xsl:attribute name="id">
22. 	card<xsl:number/>
23. 	</xsl:attribute>
24. 	<p><b><xsl:value-of select="TITLE"/></b></p>
25. 	<p><xsl:value-of select="LOCATION"/></p>
26. 	<p><xsl:value-of select="SKILLS"/></p>
27. </card>
28. </xsl:for-each>
29. 
30. </wml>
31. </xsl:template>
32. </xsl:stylesheet>

XSL is a powerful language and can seem a little intimidating at first so it's worth your time to investigate one of the many detailed tutorials at the web sites included in the Resources section, but let's have a brief look at what's going on in this example. (Remember you can open a plain-text version by clicking here.

Line 1 identifies this file to be an XML document. So, not only is our data going to be returned using XML, but our stylesheet language is defined as XML and so are WML documents!

Line 2 defines the namespace for XSL.

Lines 3-6 are interesting because they were the only lines that caused any problems when I first started developing the protoype (and sincere thanks to Steve Muench of Oracle for helping me sort this out!). Because WML is an XML dialect in itself, every WML document is an XML document and so we can't just include the following line in the stylesheet, which is the way we normally identify a WML document in the WML file itself.


<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" 
	"http://www.wapforum.org/DTD/wml_1.1.xml">

Instead, we use the following line to generate the line listed above in the output.


<xsl:output method="xml" doctype-public="-//WAPFORUM//DTD WML 1.1//EN"
          media-type="text/vnd.wap.wml"
          doctype-system="http://www.wapforum.org/DTD/wml_1.1.xml"
          encoding="ISO-8859-1"/>

Our formatting instructions start with line 7, which instructs the processor that we want to match the root node of the XML document (/), containing all elements of the data.

Then things start to get a little simpler with lines 8, 9 and 10. One way of looking at XSL stylesheets that may help when you first start using them is to think of them as templates of your final document, containing some fixed text that will be passed through to the finished file, along with XSL instructions that will 'insert' your XML data into the template. The <wml> tag in line 8 is the first template item, so that will be included unchanged.

In fact, one of the more straightforward approaches I've found to developing stylesheets is to develop the a mock-up of the end result I'm looking for first, including the data. Then I can see which items are template text (such as the <wml> or <card> tag) and which will be generated using XML/XSL (such as a job title).

Note that this screen will consist of a WML deck with a number of cards, so the <card> tag at line 9 will be the start of the first card, containing a short description of the most recently posted 5 jobs, which will link to other cards containing further details about the job. Line 10 should look very familiar to HTML, but note that it's essential to have those closing tags!

Now we start to process the XML data. Line 11 says 'for each row in the XML data document', do the following :-

Line 12 will output a few WML tags for the row of data and then, because WML is an XML language itself, line 13 will set the href attribute of the element we're generating at the moment, the <go> element from the previous line. This indicates the location that the <go> element should jump to if this link is selected by the user.

Because the cards are being generated automatically, depending on the number of jobs returned, I needed to give each job details card a unique identifier. I've used the <xsl:number/> tag to generate unique numbers for each card in the deck so that the links can point to distinct card names in the format card<unique_id> (e.g. card1, card2, ). Note that this data isn't coming out of the database, but is being generated as part of the XSL transformation process.

Line 14 is just the closing tag for the href attribute and line 15 the closing tag for <go> element of the link which identifies the destination.

Line 16 is the first time that we're going to insert any of the data contained in our XML data document, using <xsl:value-of select=element_name/>. The short description for the job will be inserted into the anchor element and will be the text that's displayed for the link.

Line 17 ends the 'loop' started at line 11, so all the instructions and template text between these two points will be generated for each row included in the data document and our first WML card in the deck ends at line 18.

Then we make use of another key XSL facility, the ability to reuse the XML information in different ways in different parts of our output document - once for the main menu of hyperlinks with the short title and again for the job details pages. Line 19 is just like line 11, so we're starting another loop through the same data.

The first thing we do is to start a new card for each row in the data document, using xsl:number again to ensure that the card idenitifiers match the links that we generated in our main card. Then we insert various values from the document into the card, close the card off at line 27 and end the loop. So this loop will generate one card for each ROW element in the XML data document.

Previous


Technical Papers Utilities and Scripts Book Reviews Links
My Resume Fun & Games Email Home