WAP and WML

advertisement
WAP and WML
The Wireless Application Protocol
WAP architecture
WML document structure
WML syntax
•Basic document syntax
•Layout
•Text formatting
•Images
•Navigation
•Events
•Variables
WAP and WML
WAP Architecture

Client
 Any WAP-enabled phone, ie any phone which runs the
Wireless Application Protocol browser software
 No unique hardware is required
 There are at least 158 different models today, according to
developer.openwave.com

WAP Gateway
 This is a service provided by your mobile service carrier
 There are at least 51 carriers worldwide who offer WAP
gateways (developer.openwave.com)
 The WAP gateway serves several purposes:
• Serve WML, WMLS, and WBMP content
• Compile WMLScript
• Compress all content into binary form
WAP Architecture

Do you still need a web server?
 Early WAP server designs included an HTML-to-WML
converter. The theory was that you could serve your original
content, just reformulate the tags into WML in an automated
manner. Your web server became a back end behind your
WAP server; the WAP server would translate requests from
the Gateway, through to the web server, and back.
 This failed painfully. It’s clear now that your content needs to
either be in WML, or you need to design for a one-inch-square
screen in your HTML.

So, if not a web server, then--?
 Your WAP server is the web server.
 You can serve both types of content from one system.
WAP Architecture

Follow the request:
 Client establishes a data connection to WAP Gateway
 Client sends WTAI (“Wireless Telephony Application
Interface”--HTTP for phones) request for URL entered
 WAP Gateway receives request, decodes it
 WAP Gateway sends HTTP request to Web Server
 Web Server replies with content
 WAP Gateway re-encodes content and sends it back to client
 Client renders content locally
WML : Documents, Decks and Cards

Every WML document must begin with an XML
declaration and a DTD:
 <? xml version=“1.0”?>
 <!DOCTYPE wml PUBLIC “-//WAPFORUM//DTD WML
1.1//EN” “http://www.wapforum.org/DTD/wml_1.1.xml”>



All WML documents contain one or more cards.
Each card contains the content for a single page
of display.
The <WML> tag is the root of the deck.
 Within the <WML> tag, you’ll one or more <card>’s and
perhaps a <head> tag.
WML Syntax

<wml>
 <head>
 <card>

<card>
 title=“…”
 id =“…”
 newcontext =“true”, “false”
 onenterbackward =“[url]”
 onenterforward =“[url]”
 ontimer =“[url]”
WML Syntax - Layout

<p>
 align=“left”, “right”, center”
<p>
<table columns="3">
<tr>
 mode=“wrap”, “nowrap”


<td>Cell 1</td>
<br />
<td>Cell 2</td>
<table>
<td>Cell 3</td>
 columns=“…”
 align=“l”, “c”, “r”
 <tr>
 <td>
</tr>
</table>
</p>
WML Syntax - Text Formatting

<b>
- bold text

<big>
- big text

<em>
- emphasized text

<i>
- italicised text

<small>
- small text

<strong> - strong text

<u>
-underlined text
WML Syntax - Images

<img> - Render a WBMP file
 src=“…”
 align = “top”, “middle”, “bottom”
 alt=“…”
 height=“…”, width=“…”
 hspace=“…”, vspace=“…”
<p> An image:
<img src="stickman.wbmp” alt="Stickman"/>
</p>
WML Syntax - Navigation

As in HTML, you link from page to page explicitly
with anchors.
<p>
This is a <a href=“foo.wml”>link</a>
</p>

WML offers the <a> tag and the <anchor> tag

<a> - the simple anchor tag
 href=“…”

<anchor> - more powerful anchor tag
 <go>, <prev>, <refresh>, <noop>, ...
WML Syntax - Navigation

A softkey on a mobile phone is a button whose
function can be set by the software. Most phone
buttons are softkeys.

<do> - Map a user softkey to an action; similar to
an anchor tag.
 label=“…”
 type=“accept”, “prev”, “help”, “reset”, “options”, “delete”,
“unknown”, “x-*”, “vnd.*”
“accept” is the “YES” button on most phones; “prev” is the
“NO” button.

When using softkeys, be careful to respect
common usage rules.
WML Syntax - Navigation

<go> - Navigate to a new card

<prev> - Back up one on the card stack

<refresh> - Reloads the current page

<noop> - Do nothing

<setvar> - Sets a variable

<postfield> - Sends a post (or get) field value to
the server
WML Syntax - Events

<do> is the softkey event handler.

<onevent> is a more generalised events handler.
 type=“onenterbackward”, “onenterforward”, “onpick”, “ontimer”

Use onevent to process data differently
depending on the action of the user.

For example, you might want to initialise a
variable to zero with onenterforward, but then
incremement it to track user returns in
onenterback. Onenterback will fire whenever the
user uses the prev softkey to return to the page.
WML Syntax - Timer Events

Use the <timer> tag to initialise a timer.
 The timer’s value field specifies 1/10’th’s of a second.

The <card> tag defines an ontimer event, whose
value is a URL. When the <timer> times out, the
<card>’s ontimer URL is loaded.
<card id=“card1” ontimer=“#card2”>
<timer value=“30”>
</card>
<card id=“card2”>
<p>Here by timer!</p>
</card>
WML Syntax - Variables




A variable in a WML script is a data field whose
value can be changed before the next update.
This is a divergence from HTML. HTML does not
have the concept of variables, because HTML
has inline JavaScript instead.
Variable names, like all concepts in XML, are
case-sensitive.
To refer to a variable in your code, use a dollar
sign ($) followed by the name of the variable,
optionally enclosed in parentheses.
 $foo
 $(foo)
WML Syntax - Variables

Variables are set with the <setvar> tag.

Variables, once set, take effect when the page is
next reloaded. Unfortunately, since <setvar>
runs when an event triggers it, you can’t initialise
variables cleanly.
<card id=“Bob The Card”>
<onevent type="onenterforward">
<refresh>
<setvar name=“Fred” value=“Barney” />
</refresh>
</onevent>
WML Syntax - Variables

Variables can also be set through user input with
the <input> tag
 name=“…”
 type=“text”, “password”, emptyok=“true”, “false”
 maxlength=“…”, size=“…”
 format = [*|n][AaNXxMm]
A / a : Uppercase / lowercase alphabetic or punctuation
N : numeric
X / x : Uppercase / lowercase alphabetic
M / m : all characters
* : arbitrary number of characters
n : set number of characters
WAP and WML - Recap

WAP architecture
 Client, WAP Gateway, Web Server

WML document structure
 DTDs, decks and <card>’s

WML syntax







Basic document syntax - <wml>, <card>, ...
Layout - <p>, <br>, <table>, ...
Text formatting - <b>, <i>, <u>, <big>, <em>, ...
Images - <img> - WBMPs only.
Navigation - <a>, <anchor>, <do>
Events - ontimer, onenterforward, onenterbackward, ...
Variables - <setvar>, <input>, $(foo)
WAP and WML - Bibliography




WAP in Easy Steps, by Mike McGrath. (C)2000 published
by ComputerStep, Warwickshire
http://www.w3schools.com/wap/wml_reference.asp - a
really well-done WML reference
http://developer.openwave.com/ - OpenWave are the folks
who’re defining the WAP gateway standards. They also
make a mobile device SDK.
http://www.openmobilealliance.org/documents.html Technical specifications page for the Open Mobile Alliance,
the public body which binds the many corporations
investing in WAP and related technologies. Note: site can
be a bit thick.
Download