WML & WML Script
advertisement
WML & WML Script
Presented by Kelvin Liu
01/06/2000
Agenda
Explain what is WML & WMLScripts.
Explain the concept how WML “pages”
are organized.
How to create a WML “deck” from
scratch.
Integrate WML scripts functions into
WML decks.
What Is WML ?
Wireless Markup Language (WML)
version 1.1 is designed for creating
applications that run on small, mobile
devices such as cellular phones and
personal digital assistants.
WML Features
WML looks somewhat like Hyper Text
Markup Language (HTML).
WML is a formally defined XML
application. It inherits most of its
syntactic constructs from extensible
markup language (XML).
WML has support for text and image.
WML Features
User input support
Text entry, options selections and task
invocation
Support Unicode
Narrow-band optimization
Decks and Cards
WML data is structured as a collection
of “Cards”.
A Single collection of cards is referred
to as a WML “Decks”.
Decks and Cards
Card A
Card D
Card B
Card E
Card C
Card F
Deck 1
Deck 2
Decks and Cards
HTML Vs WML
HTML
html pages
html bookmarks
=
=
WML
wml decks
wml cards
WML Basics Syntax
WML is case sensitive
WML is markup language, uses tags < >
<tag> - Starts of an element
</tag> - Ends of an element
<tag/> - An empty element
e.g. <br/> Line Break
<tag attribute=“value”>
WML Basics Syntax
Document header must be present
<?xml version=“1.0”?>
<!DOCTYPE wml PUBLIC “-//WAPFORUM/DTD WML 1.1//EN”
“http://www.wapforum.org/DTD/wml_1.1.xml”>
<wml> tag defines the deck.
<head> tag provide access control and
metadata for the deck.
<card> tag defines different cards in a
deck.
Example One
<?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="card1" title="Example 1">
<p>
<br/>
Hello World!!!
</p>
</card>
</wml>
Navigation in WML
Creating a link in WML is just like creating
a link in HTML
Long Format
<anchor>Sample Link<go
href=“http://www.some.where”/> </anchor>
Short Format
<a href=http://www.some.where/>Sample Link</a>
Example Two
<?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="card1" title="First Card">
<p>
This card has two links to the second card.<br/>
<a href="#card2">Short Form Link</a><br/>
<anchor>Long Form Link<go href="#card2"/></anchor>
</p>
</card>
<card id="card2" title="Second Card">
<p>
This is the second card.
</p>
</card>
</wml>
Images
WAP 1.1 standard specifies a new and
only supported picture format, WBMP.
It is a B/W image format without
compression.
Syntax
<img src=“image.wbmp” alt=“sample”/>
Events and Tasks
Events are used to handle navigation and events by
specifying the processing of user agent events
Events:
do – gives the user a general mechanism for performing
actions on the current card.
ontimer – The event occurs when a timer expires.
onenterforward – The event occurs when the user enters
a card using a go task or any method with identical
semantics.
onenterbackward – The event occurs when the user
navigates into a card using a prev task or any method
with identical semantics.
onpick – The events occurs when the user select or
deselects the item in which the event is specified.
ETC………….
Events and Tasks
Tasks defines the action to be performed when a
certain event occurs.
Tasks:
go – It declares a go task, indicating navigation to an URL.
prev – It declares a prev task, indicating navigation to
the previous URL in the history stack.
refresh – It declares a refresh task, indicating an update of
the specified card variables.
setvar – It specifies the variable to set in the current
browser context as a side effect of executing a task.
noop – It specifies that nothing should be done, that is,
“no operation.”
ETC…….
What is WMLScript?
WMLScript was designed to provide general scripting
capabilities to the WAP architecture.
You can use WMLSctipt to complement WML, such
as:
Checking the validity of user input
Accessing facilities of the user agent
Generating messages and dialogs locally
Allowing extensions to the user agent software and configuring a
user agent after it has been deployed
WMLScript has the same base as JavaScript, but
some advanced features have been dropped.
WMLScript Syntax
Syntax very similar to JavaScript.
Case Sensitive
Semicolons end most statement
Line or block comments
Basic operations
String operations
Blocks of statement {}
Functions and parameters
(p1,p2)
Case != case
variable = value;
//this OR /* this */
+,-,*,/,=,==,!=,&&,<
“string text” + string_variable
while(somethings) {do this}
function function_name
Calling functions from WML
WML cards refer to WMLScript functions
with URL calls
<a href=http://www.some.where/script.wmls#function1
(‘$(wml_var)’,10)>
Function must be specified as an
externally callable function with extern
Extern function func1(param1, param2) {…..}
WMLScript Libraries
Standard libraries make WMLScript more
efficient.
Stored in client’s scripting environment.
Libraries
Lang
Float
String
URL
WMLBrowser
Dialogs
(e.g. abs, min, max, etc.)
(e.g. int, roung, sqrt, etc.)
(e.g. length, subString, find, etc.)
(e.g. getHost, getPort, getPath, etc.)
(e.g. getVar, setVar, go, etc.)
(e.g. prompt,confirm, alert, etc.)
Example Three
<wml>
<card id="c1" title="Example 3" newcontext="true">
<onevent type="onenterforward">
<refresh>
<setvar name="result" value="??"/>
</refresh>
</onevent>
<p>
<input name="num1" format="*N"/>
<input name="num2" format="*N"/>
$num1 + $num2 = $result <br/>
<a href="example3.wmls#add('$(num1)','$(num2)')">Calculate</a>
</p>
</card>
<card id="c2" title="Calculation Result">
<p><br/>
$num1 + $num2 = $result <br/>
<a href="#c1">Calculate Again</a>
</p>
</card>
extern function add(x,y)
</wml>
{
var res = Lang.parseInt(x)+Lang.parseInt(y);
WMLBrowser.setVar("result",res);
WMLBrowser.refresh();
WMLBrowser.go("example3.wml#c2");
}
Example Provided by NOKIA
