Lesson 12: Using templates to provide common content for groups of pages
The initial WAP-enabled devices have to work on low bandwidth systems (on GSM these go at a maximum of 9.6kb, whereas even the modems built into standard PCs can - at least theoretically - operate at 56kb/s). Because of this, WML has been designed with features which allow one to cut down the amount of bytes sent.
One of these features is the support for 'templates'. When multiple cards are sent in one pack, you can specify a template containing code to be read into each card. This cuts down on duplication of code.
The following piece of code shows two cards. Navigation between these cards is supported by the template code. This provides a button for the user to get from the first card (the home page) to the second (which has been called the 'index'), as well as a back button for him to return.
|
1.
|
<?xml version="1.0"?>
|
|
2.
|
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml">
|
|
3.
|
<wml>
|
|
4.
|
<!-- The template for the deck -->
|
|
5.
|
<template>
|
|
6.
|
<do type="prev" name="backbtn" label="back">
|
|
7.
|
<prev/>
|
|
8.
|
</do>
|
|
9.
|
<do type="accept" name="indexbtn" label="index">
|
|
10.
|
<go href="#card2"/>
|
|
11.
|
</do>
|
|
12.
|
</template>
|
|
13.
|
<!-- the first card in the deck -->
|
|
14.
|
<card id="card1" title="Welcome">
|
|
15.
|
<p align="center">
|
|
16.
|
Hello from Softsteel Solutions
|
|
17.
|
</p>
|
|
18.
|
</card>
|
|
19.
|
<!-- The Second card in the deck -->
|
|
20.
|
<card id="card2" title="index">
|
|
21.
|
<p>This card is empty</p>
|
|
22.
|
</card>
|
|
23.
|
</wml>
|
|
|
There may be occasions, however, on which you want to override template code. For instance, it may be that you want all but one of many cards to contain navigation back to the home page. Here it would be more efficient to specify a template and allow one card to 'opt out', rather than requiring each of the standard cards to implement its own navigation.
To override template code - known as 'shadowing' - one makes use of an element's 'name' attribute. The general idea is that a card's element can have the same name as that of an element in its template, and in this circumstance the former is allowed to overrule the latter.
The following code shows how one could disable the backwards navigation in the 'index' card in the example given above. The relevant 'do' command already has a name (backbtn), so the index card just needs to implement an overriding do command which does nothing, viz:
|
1.
|
<card id="card2" title="index">
|
|
2.
|
<do type="prev" name="backbtn" label="back">
|
|
3.
|
<noop/>
|
|
4.
|
</do>
|
|
5.
|
</card>
|
|
|
The <noop/> tag forces the browser to do nothing. Again, it must be enclosed by an anchor or a do element. The following example associates the noop command with the prev action (as opposed to the prev command - see Lesson 8):
|
1.
|
<do name="null" type="prev">
|
|
2.
|
</noop>
|
|
3.
|
</do>
|
|
|
One reason that one might ever want use this code is that some browsers do support a 'back' function even when it is not explicitly coded into into a WML page. Howerer, sometimes it is best to disable this function. For example, it is a good idea to close off backwards navigation immediately following a successful online purchase, so as to stop the user repeating the order by mistake.
|