By Amisha Pardasani 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 What is WAP WAP Architechture Does wireless internet really need a different protocol? Issues: • Transfer speed • Size and Readability • Navigation 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 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 What is WML? •Wireless Markup Language •based on XML •Purpose: •to specify user interface behavior and •display contents on wireless devices such as pagers, (PDAs) •WAP, WML WWW, HTML (phones), 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 WML Formatting • WML tags • Decks and cards • Comments • Text formatting • Tables WML Tags •Syntax: strict, conforms to XML 1.0 standard •Restricted use of tags •Restricted use of tables and images •Tags are case-sensitive 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, inputfields, tasks, images, etc. •Can be related to each other with links 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> WML Code ------ Card 1 -----Hello World! Only one card is displayed at a time Result Comments Comments are not displayed in the browser <!--This is a comment--> 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> WML Code ----- Formatting ----normal emphasized strong bold italic underline big small Result 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 WML Links and Images • Links – <anchor> tag – <a> tag • Images 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> 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> 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 WML Input • Input fields • Format Masks • Select and Option • Fieldset 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"/> 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. 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"> <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> --- Selectable List 1--HTML School XML School WAP School Select Syntax text <select title="label" multiple="boolean” name="variable” default="default" iname="index_var” ivalue="default” tabindex="n"> content </select> Option Syntax The <option> element specifies a particular choice within a <select> element. Syntax <option title="label" value="value" onpick="url"> content </option> 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"> CD Info <p> <fieldset title="CD Info"> Title: Title: <input name="title" type="text"/><br/> Prize: Prize: <input name="prize" type="text"/> </fieldset> </p> </card> </wml> WML Tasks • Go task • Prev task • Refresh task • Noop task Task Elements Start Tag Purpose <go> Represents the action of switching to a new card WML 1.1 <noop> Says that nothing should be done (noop stands for "no operation"). Used to override deck-level elements 1.1 <prev> Represents the action of going back to the previous card 1.1 <refresh> Refreshes some specified card 1.1 variables. If any of the variables are shown on the screen, this task also refreshes the screen Go Task • 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. <?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> 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> 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. <?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> 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> 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"> <wml> <card> <p> <do type="prev" label="Back"> <noop/> </do> </p> </card> </wml> Syntax <noop/> Refresh Task •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. <?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> Refresh this page <go href="thispage.wml"/> <refresh> <setvar name="x" value="30"/> </refresh> </anchor> </p> </card> </wml> Syntax <refresh>content</refresh> where content represents the variables to refresh: content You must specify at least one variable in a <refresh> statement: <var> 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"> <wml> <card ontimer="#card2"> <timer name="time" value="50"/> <p> Hello, Unwired World! </p> </card> <card id="card2"> ... </card> </wml> Syntax <timer name="variable" value="value"/> 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> 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. 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="i" value="500"/> <setvar name="name" value="value"/> 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> Character Entities The following are the only non-numeric entities supported by wml: Result & Description Ampersand Entity Name & Entity Number & ‘ Apostrophe &apos ' > < Greater-than Less-than > < > <     “ - Non-breaking space Quotation mark Soft hyphen " ­ " ­ Template This element behaves like a function that is shared by all the cards of a deck. <wml> <template> <do type="prev" name="previous” label="Previous"> <prev/> </do> </template> Syntax <template> Task </template> 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. 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 Any Questions / Suggestions? Please email me at amisha@csee.wvu.edu Thank You!!!
© Copyright 2024