By Amisha Pardasani

1. WAP and WML By Amisha Pardasani

2. Contents • Introduction to Wireless Application Protocol • Introduction to Wireless Markup Language • WML Formatting • Links and Images • Input • Tasks • Timer • Forms • Variables • Entities • Template • Conclusion • References

3. What is WAP

4. WAP Architechture

5. Does wireless internet really need a different protocol? • Issues: • Transfer speed • Size and Readability • Navigation

6. Summarizing WAP • WAP is an application communication protocol • WAP is used to access services and information • WAP is inherited from internet standards • WAP is for handheld devices • WAP is a protocol designed for micro browsers • WAP enables the creating of web applications for mobile devices • WAP uses the markup language WML

7. Examples of WAP • Checking train table information • Ticket purchase • Flight check in • Viewing traffic information • Checking weather conditions • Looking up stock values • Looking up addresses, phone numbers

8. What is WML? • Wireless Markup Language • based on XML • Purpose: • to specify user interface behavior and • display contents on wireless devices such as (phones), pagers, (PDAs) • WAP, WML WWW, HTML

9. Is WML lean and mean? • WML is designed to support a range of devices which have the following characteristics: • Small display size (relative to conventional personal computers) • Limited memory and CPU size • Low bandwidth • Due to these reasons WAP was designed to be lean and mean

10. WML Formatting • WML tags • Decks and cards • Comments • Text formatting • Tables

11. WML Tags • Syntax: strict, conforms to XML 1.0 standard • Restricted use of tags • Restricted use of tables and images • Tags are case-sensitive

12. WML Decks and Cards • Deck • WML page • Consists of a set of cards • All cards in a deck are downloaded at one time • Must be small and contain logically pertaining cards • Cards • Can contain text, markup, links, input-fields, tasks, images, etc. • Can be related to each other with links

13. A Simple Example <?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="no1" title="Card 1"> <p>Hello World!</p> </card> <card id="no2" title="Card 2"> <p>Welcome to WAP School!</p> </card> </wml> ------ Card 1 ------ Hello World! Only one card is displayed at a time Result WML Code

14. Comments Comments are not displayed in the browser <!--This is a comment-->

15. Text Formatting <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card title="Formatting"> <p> normal<br/> <em>emphasized</em><br/> <strong>strong</strong><br/> <b>bold</b><br/> <i>italic</i><br/> <u>underline</u><br/> <big>big</big><br/> <small>small</small> </p> </card> </wml> ----- Formatting ----- normalemphasizedstrongbolditalicunderlinebigsmall Result WML Code

16. Tables <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card title="Table"> <p> <table columns="3"> <tr> <td>Cell 1</td> <td>Cell 2</td> <td>Cell 3</td> </tr> </table> </p> </card> </wml> ------ Table ------ Cell 1 Cell 2 Cell 3

17. WML Links and Images • Links • <anchor> tag • <a> tag • Images

18. Links - <anchor> Tag <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card> <p> <anchor>Next page <go href="test.wml"/> </anchor> </p> </card> </wml>

19. Links - <a> Tag <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> • <wml><card> <p>Some links:<br/><a title="Link1"><go href="d1.wml"/>News</a><br/><a title="Link2"><go href="d2.wml"/>Sports</a> </p></card></wml>

20. Image <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card title="Image"> <p> This is an image <img src="../images/hatman.wbmp”alt=”hatman" /> in a paragraph </p> </card> </wml> ----- Image ----- This is an image in a paragraph

21. WML Input • Input fields • Format Masks • Select and Option • Fieldset

22. Input Fields <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card title="Input"> <p> Name: <input name="Name" size="15"/><br/> Age: <input name="Age" size="15” format="*N"/><br/> Sex: <input name="Sex" size="15"/> </p> </card> </wml> ----- Input ---------- Name: Age : Sex : Syntax: text<input name="variable" title="label" type="type"value="value" default="default" format="specifier"emptyok="boolean" size="n" maxlength="n" tabindex="n"/>

23. Specifying a Format Mask • A: Any symbolic or uppercase alphabetic character (no numbers) • a: Any symbolic or lowercase alphabetic character (no numbers) • N: Any numeric character (no symbols or alphabetic characters) • X: Any symbolic, numeric, or uppercase alphabetic character (not changeable to lowercase) • x: Any symbolic, numeric, or lowercase alphabetic character (not changeable to uppercase) • M: Any symbolic, numeric, or uppercase alphabetic character (changeable to lowercase)--for multiple character input, defaults to uppercase first character • m: Any symbolic, numeric, or lowercase alphabetic character (changeable to uppercase)--for multiple character input, defaults to lowercase first character • To limit the number of characters users can enter, you can specify a single digit number before the character tag--for example, format="3X" lets user enter a maximum of three symbolic, numeric, or uppercase alphabetic characters. • To let users enter an unlimited number of characters, specify an asterisk (*) before the character tag--for example, format="*a" lets the user enter any number of symbolic or lowercase alphabetic characters.

24. Select and Option <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> --- Selectable List 1--- HTML School XML School WAP School <wml> <card title="Selectable List 1"> <p> <select multiple=“true”> <option value="htm">HTML School</option> <option value="xml">XML School</option> <option value="wap">WAP School</option> </select> </p> </card> </wml>

25. Select Syntax text <select title="label" multiple="boolean” name="variable” default="default" iname="index_var” ivalue="default” tabindex="n"> content </select>

26. Option Syntax The <option> element specifies a particular choice within a <select> element. Syntax <option title="label" value="value" onpick="url">content</option>

27. Fieldset <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> ------- Fieldset-------- <wml> <card title="Fieldset"> <p> <fieldset title="CD Info"> Title: <input name="title" type="text"/><br/> Prize: <input name="prize" type="text"/> </fieldset> </p> </card> </wml> CD Info Title: Prize:

28. WML Tasks • Go task • Prev task • Refresh task • Noop task

29. Task Elements

30. The <go> element is a task element that instructs the device to open a specified URL. • If the URL specifies a particular card, the device displays that card. • If the URL specifies a deck, the device displays the first card in that deck. Go Task • Syntax: • <go href="url" sendreferer="boolean" method="method"accept-charset="charset" <postfield name="data" value="value"/>content</go> • where content represents the variables to set when opening the specified URL: • content You can optionally specify one or more variables in a <go> statement: <setvar> <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card> <p> <anchor> Go To Test <go href="test.wml"/> </anchor> </p> </card> </wml>

31. Prev Task • The <prev> element is a task element that instructs the device to remove the current URL from the history stack and open the previous URL. • If no previous URL exists on the history stack, specifying <prev> has no effect. • Syntax: • <prev>content</prev> • where content represents the variables to set when opening the previous URL: • content You can optionally specify one or more variables in a <prev> statement: <setvar> <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card> <p> <anchor> Previous Page <prev/> </anchor> </p> </card> </wml>

32. Noop Task • The <noop> element is a task element that instructs the device to do nothing, i.e. "no operation." • This element is useful for overriding deck-level <do> elements, called shadowing <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> • Syntax • <noop/> <wml> <card> <p> <do type="prev" label="Back"> <noop/> </do> </p> </card> </wml>

33. The <refresh> element is a task element that instructs the device to refresh the specified card variables. • The device also refreshes the display if any of those variables are currently shown. Refresh Task <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> Syntax <refresh>content</refresh> where content represents the variables to refresh: content You must specify at least one variable in a <refresh> statement: <var> <wml> <card> <p> <anchor> Refresh this page <go href="thispage.wml"/> <refresh> <setvar name="x" value="30"/> </refresh> </anchor> </p> </card> </wml>

34. Timer The <timer> element provides a method for invoking a task automatically after some period of user inactivity. Any task or user action that activates the card starts the timer, and executing any task element stops it. You can only associate one task per timer, and you can only define one timer per card. <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> • Syntax • <timer name="variable" value="value"/> <wml><card ontimer="#card2"><timer name="time" value="50"/><p>Hello, Unwired World!</p></card> <card id="card2">...</card></wml>

35. Forms A form is basically a do/go function <do type="accept" label="Next"> <go method="post” href="http://mydomain.com/mycgiscript.cgi"> <postfield name="searchvalue" value="$(search)"/> <postfield name="type" value="general"/> </go> </do> <p> Search for: <input type="text" name="search"/> </p>

36. Variables • Variables are used to proliferate status information or user entries from one card to another or to the server. • Variables consist of a letter or underscore character, followed by zero or more letters, numbers or underscore. • WML variables are case sensitive. • A WML variable can be specified in various ways: • with a setvar command • through an input element • with a postfield command • The major use of variables is for forms.

37. Specifying a Variable with the Setvar Command When someone executes a task (like go, prev, and refresh), the setvar element can be used to set a variable with a specified value. Syntax: <setvar name="name" value="value"/> <setvar name="i" value="500"/>

38. Specifying a Variable through an Input Element Variables can also be set through an input element (like input, select, option, etc.). The following example will create a variable named schoolname: <card id="card1"> <select name="schoolname"> <option value="HTML">HTML School</option> <option value="XML">XML School</option> </select> </card> To use the variable we created in the example above: <card id="card2"> <p>You selected: $(schoolname)</p> </card>

39. Character Entities The following are the only non-numeric entities supported by wml:

40. Template This element behaves like a function that is shared by all the cards of a deck. Syntax <template> Task </template> <wml><template><do type="prev" name="previous” label="Previous"><prev/></do></template>

41. Conclusion • WML offers software developers an entirely new, exciting platform on which to deploy their applications. • With this new platform, however, there comes a host of tradeoffs and challenges. • A new wrinkle will be added to the design process as things like server round-trips, bandwidth, and display sizes become issues to contend with. • There is no doubt that WAP opens the door to a new era in application development and deployment.

42. References • www.w3schools.com/wap • devgate2.phone.com/htmldoc/32w/wmlref/ • www.aitcom.net/wmltutor • www.Wap-UK.com • www.home-port.net/wml.htm • www.waptechinfo.com • www.wapdesign.org.uk/ • www.nokiko.com/wap/wml-template.asp

43. Any Questions / Suggestions? Please email me at amisha@csee.wvu.edu Thank You!!!