S CS3SE3 -- Visual Programming l i Programming in JavaScript -- cont’d d z Miscellaneous Material -- cont’d e • Precedence of Operations for JS 1
Environments
Dots (from dotted address), index brackets , operations brackets Increment, decrement, not and bit complement Multiply, divide and modulus Addition and subtraction Bit shift left, bit shift right and zero-fill right shift Comparative operators: less than, greater than, less than or equal, greater than or equal Equal to and not equal to Logical AND Logical XOR Logical OR Evaluation AND (does not require evaluation of the right-hand operand) Evaluation OR (does not require evaluation of the right-hand operand) Ternary operator: ( Boolean condition ) ? Statement 1 : Statement 2 ;
Argument separator (comma)
S l i d e
Assignment(ass), inc ass, dec ass, mult ass, div ass, mod ass, L-shft ass, R-shft ass, 0-fil-Rshft cs3se3/wfsp ass, bitAND ass, bitXOR ass, bitOR ass L20-1
Programming in JavaScript -- 1 Miscellaneous Material -- cont’d z
Timer Operations (Yes there is a timer that can work just like DELPHI -- yuck!) • Below are the methods that can be used to manipulate the Operating System’s time clock The object with which these methods operate is the intrinsic object: DATE.
2 Allows the date and time to be set within the new time object (NOT set the OS clock!)
There are also some methods that can prove useful in working with dates • parse(dateString) -- returns the date as the number of milliseconds from January 01, 1970 at 00:00:00. • UTC(year, month, day[, hours] [, minutes] [, seconds] -returns as above but in GMT or UTC = Universal Coordinated Time (en francais) • toGMTString() -- returns the date in GMT using Internet conventions • toLocalString(). -- returns date in local time as mm/dd/yy hh:mm:ss • toString(). -- returns date in local time as Month,day year hh:mm:ss
cs3se3/wfsp
L20-2
S Programming in JavaScript -- 2 l i Miscellaneous Material -- cont’d d z The PERSISTENCE Problem -- cont’d from the previous lecture e • Some important functions – The following functions are stand-alone methods that are not attached to any object, and, therefore, can be called without reference to any one particular instance or static reference to an object.
3
• eval(statement) – The eval function takes a string and returns the numerical equivalent of any operations represented by the string. – Example: result = eval( 2+6/2 ); would return the number 5. – This function is important in form elements such as textfields, where a string represents a function that must be evaluated. – Example: in working with a spreadsheet script there is a requirement to evaluate arithmetic expressions in a cell represented by a text input field.
• parseInt(numberString, radix) – This function returns the numerical equivalent of the integer string based upon the integer radix provided where radix represents the base of the number to convert to, such as 10 for decimal, 8 for octal, and 16 for hexadecimal. – Because parseInt expects an integer, it truncates any decimal portion of a number without rounding. – If the method cannot parse the string, it truncates the number wherever it ended. L20-3 If it cannot parse even the cs3se3/wfsp first character, it returns 0.
S l i d e 4
Programming in JavaScript -- 3 Miscellaneous Material -- cont’d z
The PERSISTENCE Problem -- cont’d • parseFloat(floatString) – This function returns the floating point equivalent of the number represented by floatString – The parseInt function can handle floating-point numbers in both decimal and scientific notation.
• escape(character) – This function returns the ASCII encoding of the argument in the ISO Latin 1 character set. (Essentially the “American” codepage.) – For example, escape("&") returns "%26."
• unEscape(string) – This function returns the ASCII character for the encoded string argument. – For example, unEscape("%026") returns "&". – Both escape and unEscape can be used to encode characters which would not normally be understood by a file type.
• COOKIE – defined » this is a small file that resides on the client with strict rules about behaviour » it is maintained as a file within the browser’s disk cache as “cookie.txt” » BUT its contents are encoded with respect to delimiters and separators, that is, there are no white spaces, commas or semicolons etc., only there ASCII equivalents. cs3se3/wfsp
L20-4
S Programming in JavaScript -- 4 l i Miscellaneous Material -- cont’d // Function to put values into a cookie d z The PERSISTENCE Problem function setCookie (name, value) { e • COOKIE to the rescue! document.cookie = name + "=" + escape (value); – uses
5
// alert("setCookie to "+document.cookie);
} » originally used by server sites to maintain info about the last visit
– properties » each cookie can only consume only 4Kbytes of disk space and there can be no more than 20 coolie entries; note 1 entry consumes 1 line as shown below
– entry format » NAME=VALUE; path=PATH;
DD-Mon-YY HH:MM:SS: GMT=DATE; domain=DOMAIN_NAME; security info
» where NAME is the cookie identifier VALUE is the value of the cookie itself path & domain are URL info which allows only the URL domain that created the cookie in the first place to modify/delete it » the code above, setCookie, actually sets a value for a particular cookie entry, but only in the first item of the string. If expiry times, URLs are to be modified, the routine becomes significantly more complex.
– Time format » the date is present in order to automatically delete the cookie entry when it becomes necessary. cs3se3/wfsp
L20-5
S Programming in JavaScript -- 5 l // Function to get a value from a cookie i Miscellaneous Material function getCookieVal (offset) { -- cont’d var endstr = document.cookie.indexOf(";",offset); d if (endstr == -1) { z The PERSISTENCE e endstr = document.cookie.length; Problem -- cont’d
6
• COOKIE Formats – Example
} return unescape(document.cookie.substring(offset, endstr)); }
» the time is treated as an optional expiration date; if there is none then the lifetime for this cookie entry is only as long as the current browser session lasts
• COOKIE manipulations – the function above looks for the “offset” item (as delimited by the semi-colon) in the cookie entry string for ultimate extraction. – If it cannot be found then the function flags failure with a negative return, otherwise if successful, then the string value of the item is returned – On the next slide is the function that uses the getCookieVal function to cycle through all the entries until it matches a “name” given in the argument list of the calling function
• Last Miscellaneous -- reserved words list – like PASCAL, there is a list of reserved words which are shown on the next slide
We shall next turn our attention to VBScript, which is much like JavaScript in syntax but Visual Basic in vocabulary, so there is not much to learn. cs3se3/wfsp
L20-6
S Programming in l JavaScript -- 6 i d Miscellaneous Material e
-- cont’d
7
reserved words list Æ
z
Programming in VBScript -- 1 Comparison to VB6 and JavaScript z
z
Like JS, VBS is typeless, so all variables are all variants and the automatic conversions during assignment holds. See at the right Æ Variant SubTypes include Empty, Null, Boolean, Byte, Integer, Currency, Long, Single, Double, Date(Time) String, Object and Error. cs3se3/wfsp
L20-7
S l Comparison to VB6 and JavaScript -- cont’d i z Flow Control d • Like VB6, VBS has the e If … Then … Else … End If construct, exactly. 8
z
• For … Next , unlike VB6, uses no counter argument on the Next • Select Case can only check for Æ equality & not a range of values (VB6). Type of Functions NOT Available: • • • • •
z
Programming in VBScript 2
Select Case TheLetter Case "A", "E", "I", "O", "U" MsgBox "Vowel" Case "Y" MsgBox "Sometimes a Vowel" Case Else MsgBox "Consonant" End Select
No normal file I/O Conversion routines (Str, Val, etc.) Error handling (no On Error GoTo) Debugging (no Breakpoints, End, Stop, etc.) OOPS – no Clipboard object, no use of Is keyword, nor TypeOf, etc.
What IS available – every item on the HTML web page can be scripted! • Expand an HTML tag with an ID in the header, (like Name property) such as
Please click me! then use a subroutine for the body, (placing in the HTML HEAD section) as in
Sub AResponseiveHead_OnClick() MsgBox "Hello – Welcome to Dynamic HTML" End Sub cs3se3/wfsp
L20-8
S Programming in l VBScript -- 3 i d e Comparison to VB6 9
and JavaScript -- cont’d z
z
S l i d e 1 0
This is the first full VBScript example. More to follow.
cs3se3/wfsp
L20-9
cs3se3/wfsp
L20-10
Programming in VBScript -- 4 More on VBScript -- cont’d z
For VB Script, here are the most common Input Controls and associated Events.
EVENT NAME
RAISED BY
onClick
Button, CheckBox Radio, Submit, Reset
onFocus
Button, CheckBox Password, Radio, Submit, Select, Reset, Text, TextArea
onBlur
Password, Select, Text, TextArea
onChange
Select, Text, TextArea
onSelect
Text, TextArea
S l More on VBScript -- cont’d i z Another VBScript example with input d windows. (Cont'd on next slide.) e 1 1
Programming in VBScript -- 5
Our first VBScript Click the button to add an integer to the total. cs3se3/wfsp
L20-11
S Programming in VBScript -- 6 l i More on VBScript -- cont’d z Another VBScript example is provided d below, where URL redirection occurs via e User input (selection). 1 2
Select a site to browse Sub Redirect() Document.Location = Document.Forms(0).SiteSelector.Value End Sub Select a site to browse cs3se3 home page. WebCT home. Official cs3se3 home page. cs3se3/wfsp L20-12
S Programming:VBScript--7 l i More on VBScript -- cont’d z Previous Example (cont’d) d e - Outputs Provided
(c)
1 3
(a)
(d)
(e)
(b)
L20-13cs3se3/wfsp
S l More on VBScript -- cont’d z VBScript Object manipulation i example. d e 1 4
L20-13
Programming in VBScript -- 8
Using a VB Script Class cs3se3/wfsp
L20-14
S l i d e
Programming in VBScript -- 9 More on VBScript -- cont’d z
1 5
z
VBScript Object manipulation example – cont’d. Going on from here should not be difficult for the careful reader.
Enter first name: Enter age:
So ends our sojourn into the world of dynamic HTML with JavaScript and VBScript Next two lectures on the WWW and Human Computer Interface, & then on to XML and company! cs3se3/wfsp L20-15
