Webmaster''''s Guide to the Wireless Internet part 18 ppt

142 Chapter 4 • Enhancing Client-Side Functionality with WMLScript Comments are either encapsulated within a pair of “/*” and “*/” or are pre- ceded with the “//” combination, like this: /* This is a block of comments that spans multiple lines */ // This is a single line of comment // This is another line of comment WMLScript 1.1 also reserves a set of keywords that have special meaning to the compiler.They are shown in Table 4.2. Table 4.2 Keywords in WMLScript access extern path agent for return break function typeof continue header url div http use div= if user Domain isvalid var else meta while equiv name Examining WMLScript Data Types WMLScript supports five built-in data types: ■ Integer ■ Floating Point ■ String ■ Boolean ■ Invalid To declare a variable, use the var keyword.There is no need to explicitly declare the data types;WMLScript will handle them internally.The following illustrates how WMLScript automatically converts the variable to the appropriate data type: www.syngress.com 159_wg_wi_04 10/22/01 4:34 PM Page 142 Enhancing Client-Side Functionality with WMLScript • Chapter 4 143 var month=12; var price=5.95; var msg="Hello World!"; var printName=true; var except=Invalid; The Invalid type is used to differentiate itself from the other data types, for example: if (5/0=Invalid) { // codes here } Examining WMLScript Operators Similar to most programming languages,WMLScript supports the sets of opera- tors shown in Tables 4.3, 4.4, 4.5, 4.6, and 4.7. Table 4.3 Assignment Operators Operator Description = Assignment += Add and then assign; for example, x += y is equivalent to x = x + y -= Subtract and then assign; for example, x –= y is equivalent to x = x – y *= Multiply and then assign; for example, x *= y is equivalent to x = x * y /= Divide and then assign; for example, x /= y is equivalent to x = x / y div= Divide (integer division) and then assign; for example, x div= y is equivalent to x = x div y %= Remainder (the sign of the result is the same as the sign of the dividend) and then assign; for example, x %= y is equivalent to x = x % y <<= Bitwise left shift and then assign; for example, x <<= y is equivalent to x = x << y >>= Bitwise right shift with sign and then assign; for example, x >>= y is equivalent to x = x >> y www.syngress.com Continued 159_wg_wi_04 10/22/01 4:34 PM Page 143 144 Chapter 4 • Enhancing Client-Side Functionality with WMLScript >>>= Bitwise right shift zero file and then assign; for example, x >>>= y is equivalent to x = x >>> y &= Bitwise AND and then assign; for example, x &= y is equivalent to x = x & y ^= Bitwise XOR and then assign; for example, x ^= y is equivalent to x = x ^ y |= Bitwise OR and then assign; for example, x |= y is equivalent to x = x | y Table 4.4 Binary Arithmetic Operators Operator Description + Addition (for number) or concatenation (for strings) - Subtraction * Multiplication / Division div Integer division % Remainder, the sign of the result is the same as the sign of the dividend << Bitwise left shift >> Bitwise right shift and sign >>> Bitwise shift right with zero fill & Bitwise AND | Bitwise OR ^ Bitwise XOR Table 4.5 Unary Arithmetic Operators Operator Description + Plus - Minus Pre/post decrement www.syngress.com Table 4.3 Continued Operator Description Continued 159_wg_wi_04 10/22/01 4:34 PM Page 144 Enhancing Client-Side Functionality with WMLScript • Chapter 4 145 ++ Pre/post increment ~ Bitwise NOT Table 4.6 Logical Operators Operator Description && Logical AND || Logical OR ! Logical NOT (unary) Table 4.7 Comparison Operators Operator Description < Less than <= Less than or equal == Equal >= Greater than or equal > Greater than Inequality WMLScript also supports the conditional operators. For example, the fol- lowing if-else statement: if (x==0) { x = 1; } else { x=10; } can be rewritten as: x = 0 ? 1 : 10 www.syngress.com Table 4.5 Continued Operator Description 159_wg_wi_04 10/22/01 4:34 PM Page 145 146 Chapter 4 • Enhancing Client-Side Functionality with WMLScript Examining WMLScript Control Structures WMLScript supports the if construct for making decisions and the while and for loops for repetitive execution. Using the If Statement The if statements allows decisions to be made based on the result of a condition. For example, the following code snippet will calculate the average if the total is more than zero; otherwise it will assign the average to be zero: if (total>0) { average = sum / total; } else { average = 0; } Using the While Loop The while loop executes a block of instruction repeatedly as long as the condition is true. For example, the following sums up all the integers from 1 to 5: var num = 5; var sum = 0; while (num>=1) { sum += num—; } Using the For Loop The for loop executes a block of instruction repeatedly for a finite number of times. For example: var result = 1; for (var i=1; i<=num; i++) // loop counter i starts at 1, ends when result *= i; // i is less than or equal to num. i is // incremented by 1 in each loop Using the Break Keyword The break keyword interrupts the loop within a while or for loop. For example: www.syngress.com 159_wg_wi_04 10/22/01 4:34 PM Page 146 Enhancing Client-Side Functionality with WMLScript • Chapter 4 147 while (num>1) { sum += num—; // add up num and decrement num by 1 if (sum>20) // if the sum is more than 20, break; // break out of the loop } Using the Continue Keyword The continue keyword allows execution of either a for or while loop to continue, thereby skipping the rest of the block. For example: var num = 20; for (var i=1; i<=num; i++) { if (i%2==0) // if no remainder (meaning it is an even number), continue; // continue the loop Console.print(i) // else print out the odd number } Using WMLScript Libraries The WMLScript specification contains the following libraries: ■ Lang Library Contains functions that relate to the language core. ■ Float Library Contains functions that perform floating point operations. ■ String Library Contains functions that perform string operations. ■ URL Library Contains a set of functions for handling absolute URLs and relative URLs. ■ WMLBrowser Library Contains functions by which WMLScript can access the associated WML context. ■ Dialogs Library Contains a set of typical user-interface functions. Libraries are named collections of functions that belong logically together.To call these functions, simply specify the library name followed by a dot (.) sepa- rator and the function name with the appropriate parameters.We will take a look at some of the examples in the following sections. The library collection can be extended by emulator vendors for debugging purposes. For example, the UP.Simulator contains the Console library to help developers in debugging. www.syngress.com 159_wg_wi_04 10/22/01 4:34 PM Page 147 148 Chapter 4 • Enhancing Client-Side Functionality with WMLScript Functions in the Class Libraries Within the libraries there are functions.Table 4.8 shows the functions within the various libraries described in the previous section.We will be making use of some of these functions in the examples that follow. Learning to Interpret WMLScript Let’s look at our first example on how WML interacts with WMLScript. In this example, we will look at how a WML deck (see Figure 4.3) calls a WMLScript program (Figure 4.4) using the <go> element.The WMLScript program in this example contains one function defined with the extern keyword. It also illustrates the use of functions located in the libraries. Figure 4.3 Example1.wml—WML Deck Calling a WMLScript Program <?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="Card 1"> <p> Say hello to WMLScript! <do type="accept" label="Hello"> <go href="Example1.wmls#Hello" /> </do> </p> </card> </wml> Figure 4.4 Example1.wmls—WMLScript Program Displaying an Alert extern function Hello() { Dialogs.alert("A big Hi from WMLScript!"); } www.syngress.com 159_wg_wi_04 10/22/01 4:34 PM Page 148 149 Table 4.8 Functions of the Various Class Libraries Lang Float String URL WMLBrowser Dialogs abort ceil charAt escapeString getCurrentCard alert abs floor compare getBase getVar confirm characterSet int elementAt getFragment go prompt exit maxFloat elements getHost newContext float minFloat find getParameters prev isFloat pow format getPath refresh isInt round insertAt getPort setVar max sqrt isEmpty getQuery maxInt length getReferer min removeAt getScheme minInt replace isValid parseFloat replaceAt loadString parseInt squeeze resolve random subString unescapeString seed toString trim 159_wg_wi_04 10/22/01 4:34 PM Page 149 150 Chapter 4 • Enhancing Client-Side Functionality with WMLScript Dissecting the Code The WML deck (shown in Figure 4.3) contains a <go> element, which points to a WMLScript file: <go href="Example1.wmls#Hello" /> To link a WML deck to the WMLScript file, specify the filename of the WMLScript file in the href attribute of the <go> element.The name following the # symbol is the function name in the WMLScript. Within the WMLScript file (see Figure 4.4), we have a function named Hello() defined with the extern keyword: extern function Hello() { } Only functions in WMLScript with the extern keyword preceding the func- tion name may be called by a WML deck. In this case, the function named Hello() accepts no input parameters. Dialogs.alert("A big Hi from WMLScript!"); This line simply tries to display an alert on the user’s screen. In this case, we use the alert() function from the Dialogs library. Using the Nokia WAP Toolkit, you should see the screens shown in Figure 4.5. NOTE WMLScript statements end with a semicolon (;). Readers familiar with JavaScript should feel right at home! www.syngress.com Figure 4.5 Linking a WML Deck to a WMLScript File 159_wg_wi_04 10/22/01 4:34 PM Page 150 Enhancing Client-Side Functionality with WMLScript • Chapter 4 151 Performing Mathematical Operations Using WMLScript The next example that we will illustrate is performing mathematical operations, using WMLScript to calculate the factorial of a number.This example uses a WML deck to prompt the user to enter a number (see Figure 4.6).The number is then passed to the WMLScript program for calculation (see Figure 4.7).This example illustrates looping construct in WMLScript as well as setting variable values in WMLScript and how it is passed back to the WML deck. Figure 4.6 Example2.wml—WML Deck to Prompt the User to Enter a Number <?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="Card 1"> <p> Factorial machine: <br/> Enter a number: <input type="text" name="num" /> <do type="accept" label="Calculate!"> <go href="Example2.wmls#Calculate($(num))" /> </do> </p> </card> <card id="card2" title="Card 2"> <p> $num ! is $(result) </p> </card> </wml> www.syngress.com 159_wg_wi_04 10/22/01 4:34 PM Page 151 . mathematical operations, using WMLScript to calculate the factorial of a number.This example uses a WML deck to prompt the user to enter a number (see Figure 4.6) .The number is then passed to the. condition. For example, the following code snippet will calculate the average if the total is more than zero; otherwise it will assign the average to be zero: if (total>0) { average = sum / total; } else. Point ■ String ■ Boolean ■ Invalid To declare a variable, use the var keyword.There is no need to explicitly declare the data types;WMLScript will handle them internally .The following illustrates how WMLScript automatically