JazzJava

Javascript Programming:
Applications for the World Wide Web
VITTA Inservice Training
Information Systems 2000

Duration: 1 * 3 hour Session = 3 hours

Author:
David Dawson
Date: December, 1999
D G Dawson
Email: [email protected]
1

D G Dawson
Email: [email protected]
2

JavaScript Programming and

Applications for the World
Wide Web
Table of Contents
JAVASCRIPT PROGRAMMING AND APPLICATIONS FOR THE WORLD WIDE
WEB................................................................................................................................................................. 2

TABLE OF CONTENTS.................................................................................................................................. 2
ADVANCED JAVASCRIPT PROGRAMMING
3
SHORT APPLICATION PROBLEMS FOR JAVASCRIPT
3
1. QUESTIONAIRRE........................................................................................................................................3
2. TALKING CALCULATOR............................................................................................................................3
3. SLIDE SHOW................................................................................................................................................3
4. TRUE/FALSE TEST......................................................................................................................................3
5. CARS DRAWING GAME.............................................................................................................................3
6. DICE GAME..................................................................................................................................................3
7. AUTO-TELLER BANK.................................................................................................................................4
COOKIES PROGRAMS
4
COOKIE.HTML
4
COOKIE2.HTML
5
THE FRIENDLY CALCULATOR
7
FIND THE PICTURE GAME PIC_GAME.HTML
9
A TOTAL URL SEARCH PROGRAM: TOTAL_SEARCH.HTML
13
CALCULATING A MORTGAGE: MORTGAGE.HTML
18
SLIDESHOW: SLIDESHOW.HTML
18

D G Dawson
Email: [email protected]
3

Advanced Javascript Programming

In this short course you will be given the opportunity to develop a small software
package. A number of problems will be provided for you to attempt. Solutions to a
number of these will also be provided.
Cookies will also be demonstrated and discussed.

Short Application Problems for JavaScript

There are numerous JavaScript Programs which you can develop algorithms
for and implement. Here is a small selection for you to try.

1. QUESTIONAIRRE
Make a multiple choice questionnaire to test students knowledge of JavaScript. Output
details and comments for various scores that the user obtains.

2. TALKING CALCULATOR
a) Build a simple calculator using only one textbox and a button.
b) Further develop the calculator to include buttons for all digits and operators.
c) Add a guessing textbox for the calculator you have made. If your guess of the answer
is correct then have a friendly graphic appear, and have the program make a pleasant
sound you could use a windows sound if desired. If the answer is not correct then tell
the user to try again.
3. SLIDE SHOW
a) Make a slide show program that shows a sequence of different graphics every two or
three seconds, for example, portrait photos.
b) Can you make it loop indefinitely? What happens?
c) Extend the program so that a new window opens to show landscape photos.
d) Extend the program to randomise the order in which the pictures are shown.
4. TRUE/FALSE TEST
Make a true/false JavaScript test to test students knowledge on computer hardware
devices, or the Systems Development LifeCycle. Output details and comments for
various scores that the user obtains.
5. CARS DRAWING GAME
a) Build a simple card drawing game which randomly selects a card or cuts the deck.
Show a graphic to indicate which card has been drawn. You can make 13 separate .gif
images in Paint Shop Pro to represent the 13 type of cards. (Dont worry about the suits
at this stage.
b) Add another graphic to the card game to represent you cutting the card deck versus
the computer.
c) Add two sound files to the program to indicate whether you have won or lost.
d) Add a celebration graphic to appear when you have won and a sad smiley if you
have lost.
D G Dawson
Email: [email protected]
4

e) Add a feature to the program to keep score of the number of times the computer and
yourself have won.
6. DICE GAME
a) Develop a dice game with two dice rolling in the same way as the card game
works. You will need six graphics to represent the dice sides.
b) Add a feature to the program to show the side of the dice tumbling randomly
before the final image appears.
7. AUTO-TELLER BANK
Build a program to represent a bank AutoTeller. Make sure that you can deposit money,
withdraw money and access your account balance. Use buttons to enter the numbers.
Make sure your program outputs a written record of the notes it gives out. The teller
only gives out $20 and $50 notes. You will need validation and error detection for
incorrect withdrawal amounts, unrecognised characters and negative numbers. Make
the user enter a PIN number to access their account eg: 1234.
(PowerPoint).

Cookies Programs
The only way to save to a file in JavaScript is to save to the local cookie file. The
following programs show how you can save to this file and read from it by using
Netscapes Cookie class, which has been released into the public domain.

Cookie.html
<! -- David Dawsons JavaScript and Webpage Template-->
<HTML>
<HEAD>
<TITLE>JazzJava JavaScript Samples</TITLE>
<SCRIPT LANGUAGE = "JavaScript">
<!-- begin hiding JavaScript
function getCookieVal(aword){
var endstr = document.cookie.indexOf(";", aword);
if (endstr == -1)
endstr= document.cookie.length;
return unescape(document.cookie.substring(aword, endstr));
}
function GetCookie(name){
var arg = name + "="
var alen = arg.length;
var clen = document.cookie.length;
var i=0;
while (i < clen) {
var j = i + alen;
if(document.cookie.substring(i.j) == arg)
return getCookieVal(j);
if (i==0) break;
}
return null;
}
function SetCookie(name, value){

D G Dawson
Email: [email protected]
5

var argv = SetCookie.arguments;

var argc = SetCookie.arguments.length;
var expires = (argc>2)? argv[2] : null;
var path = (argc>3)? argv[3] : null;
var domain = (argc>4)? argv[4] : null;
var secure = (argc>5)? argv[5] : null;
document.cookie = name+ "=" + escape(value) +
((expires==null) ? "" : (";expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
alert(document.cookie)
}
function DeleteCookie(name){
var exp = new Date();
exp.setTime (exp.getTime() -1);
var cval = GetCookie (name);
document.cookie = name +"="+ cval+"; expires=" +exp.toGMTString();
}
function passCookie(){
var gar = document.aname.sende.value;
var aname= "Fred";
SetCookie(aname, gar);
}
function accessCookie(){
var gar = document.aname.sende.value;
var aname= "Fred";
document.cookie = GetCookie(aname);
document.pname.get.value = document.cookie
}
var expdate = new Date();
expdate.setTime(expdate.getTime() + (24 * 60 * 60 * 1000));
SetCookie ("ccpath", "www.netspace.net.au", expdate);
SetCookie("tempvar", "A short lived cookie");
document.write(document.cookie + "<br>");
DeleteCookie ("tempvar");
document.write("ccpath="+ GetCookie("ccpath")+"<br>");
document.write("tempvar="+ GetCookie("tempvar")+"<br>");
alert (document.cookie);
//end hiding JavaScript-->
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="aname">
<input type="text" name="sende" >
<input type="button" name="sender" value="Send String" OnClick="passCookie()">
</FORM>
<FORM NAME="pname">
<input type="text" name="get" >
<input type="button" name="getter" value="Get String" onClick="accessCookie()">
</FORM>
<P>
</BODY>

D G Dawson
Email: [email protected]
6

</HTML>

cookie2.html
<! -- David Dawsons JavaScript and Webpage Template-->
<HTML>
<HEAD>
<TITLE>JazzJava JavaScript Samples</TITLE>
<SCRIPT LANGUAGE = "JavaScript">
<!-- begin hiding JavaScript
function getCookieVal(aword){
var endstr = document.cookie.indexOf(";", aword);
if (endstr == -1)
endstr= document.cookie.length;
return unescape(document.cookie.substring(aword, endstr));
}
function GetCookie(name){
var arg = name + "="
var alen = arg.length;
var clen = document.cookie.length;
var i=0;
while (i < clen) {
var j = i + alen;
if(document.cookie.substring(i.j) == arg)
return getCookieVal(j);
if (i==0) break;
}
return null;
}
function SetCookie(name, value){
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc>2)? argv[2] : null;
var path = (argc>3)? argv[3] : null;
var domain = (argc>4)? argv[4] : null;
var secure = (argc>5)? argv[5] : null;
document.cookie = name+ "=" + escape(value) +
((expires==null) ? "" : (";expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
alert(document.cookie)
}
function DeleteCookie(name){
var exp = new Date();
exp.setTime (exp.getTime() -1);
var cval = GetCookie (name);
document.cookie = name +"="+ cval+"; expires=" +exp.toGMTString();
}
function passCookie(){
var gar = document.aname.sende.value;
var aname= "Fred";
SetCookie(aname, gar);
}

D G Dawson
Email: [email protected]
7

function accessCookie(){
var gar = document.aname.sende.value;
var aname= "ccpath";
document.cookie = GetCookie(aname);
document.pname.get.value = document.cookie
}
//end hiding JavaScript-->
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="aname">
<input type="text" name="sende" >
<input type="button" name="sender" value="Send String" OnClick="passCookie()">
</FORM>
<FORM NAME="pname">
<input type="text" name="get" >
<input type="button" name="getter" value="Get String" onClick="accessCookie()">
</FORM>
<P>
</BODY>
</HTML>

The Friendly Calculator

<HTML>
<HEAD>
<TITLE>calculator</TITLE>
<! -- David Dawsons JavaScript and Webpage Template-->
<SCRIPT LANGUAGE = "JavaScript">
<!-- begin hiding JavaScript
function calculate(){
document.ans.answer.value=eval(document.prob.prob.value)
item=document.ans.answer.value
itis=parseInt(item)
twitis=parseInt(document.sub.guess.value)
if(itis==twitis)
{document.mypic1.src="Iloveu.gif"
playsound()
}
else{
playsound2()
document.mypic1.src="skull.gif"
}
}
function playsound(){
document.sound1.play()
}
function playsound2(){
document.sound3.play()
}
//end hiding JavaScript-->

D G Dawson
Email: [email protected]
8

</SCRIPT>
</HEAD>
<BODY TEXT="#FFFFFF" BGCOLOR="#FFFF99" LINK="#0000EE"
VLINK="#551A8B" ALINK="#FF0000" BACKGROUND="bkblclou.gif">
<center>
<TABLE BORDER=2 COLS=2 WIDTH="90%" BGCOLOR="#000099" >
<CAPTION><FONT COLOR="#FFFFCC"><FONT SIZE=+1>A Friendly Maths
Calculator</FONT></FONT></CAPTION>
<TR>
<TD>
<FORM NAME="calc">
<INPUT TYPE=button NAME="one" VALUE=" 1 "
onClick="document.prob.prob.value=document.prob.prob.value+'1'">
<INPUT TYPE=button NAME="two" VALUE=" 2 "
onClick="document.prob.prob.value=document.prob.prob.value+'2'">
<INPUT TYPE=button NAME="three" VALUE=" 3 "
onClick="document.prob.prob.value=document.prob.prob.value+'3'">
<INPUT TYPE=button NAME="add" VALUE=" + "
onClick="document.prob.prob.value=document.prob.prob.value+'+'"><br>
<INPUT TYPE=button NAME="four" VALUE=" 4 "
onClick="document.prob.prob.value=document.prob.prob.value+'4'">
<INPUT TYPE=button NAME="five" VALUE=" 5 "
onClick="document.prob.prob.value=document.prob.prob.value+'5'">
<INPUT TYPE=button NAME="six" VALUE=" 6 "
onClick="document.prob.prob.value=document.prob.prob.value+'6'">
<INPUT TYPE=button NAME="subtract" VALUE=" - "
onClick="document.prob.prob.value=document.prob.prob.value+'-'"><br>
<INPUT TYPE=button NAME="seven" VALUE=" 7 "
onClick="document.prob.prob.value=document.prob.prob.value+'7'">
<INPUT TYPE=button NAME="eight" VALUE=" 8 "
onClick="document.prob.prob.value=document.prob.prob.value+'8'">
<INPUT TYPE=button NAME="nine" VALUE=" 9 "
onClick="document.prob.prob.value=document.prob.prob.value+'9'">
<INPUT TYPE=button NAME="multiply" VALUE=" * "
onClick="document.prob.prob.value=document.prob.prob.value+'*'"><br>
<INPUT TYPE=button NAME="zero" VALUE=" 0 "
onClick="document.prob.prob.value=document.prob.prob.value+'0'">
<INPUT TYPE=button NAME="point" VALUE=" . "
onClick="document.prob.prob.value=document.prob.prob.value+'.'">
<INPUT TYPE=button NAME="equals" VALUE=" = " onClick="calculate()">
<INPUT TYPE=button NAME="divide" VALUE=" / "
onClick="document.prob.prob.value=document.prob.prob.value+'/'"><br>
</FORM>
</TD>
<TD>
Type in Your Answer to the Problem and Press Submit
<FORM NAME="sub">
<INPUT TYPE=text NAME="guess" VALUE=""><br>
<INPUT TYPE=button NAME="sub" VALUE="Submit" onClick="calculate()"><br>
</FORM>
</TD>
</TR>
<TR>
<TD>
Here is the Actual Problem

D G Dawson
Email: [email protected]
9

<FORM NAME="prob">
<INPUT TYPE=text NAME="prob" VALUE=""><br>
</FORM>
</TD>
<TD>
Here is the Answer
<FORM NAME="ans">
<INPUT TYPE=text NAME="answer" ><br>
</FORM>
</TD>
</TR>
</TABLE>
<IMG SRC="Images\bird.gif" NAME="mypic1" BORDER=0 width = 160 height = 160>
<EMBED SRC="dave2.wav" autostart=false HIDDEN=TRUE NAME="sound1" MASTERSOUND>
<EMBED SRC="learn.wav" autostart=true HIDDEN=TRUE NAME="sound2" MASTERSOUND>
<EMBED SRC="wrong.wav" autostart=false HIDDEN=TRUE NAME="sound3" MASTERSOUND>
</center>
</BODY>
</HTML>

Find the Picture Game pic_game.html

This the code for a simple game. The images are shown in a pseudo random order>
Can you improve the randomised element?
<HTML>
<HEAD>
<! -- David Dawson's JavaScript and Webpage Template-->
<SCRIPT LANGUAGE="JavaScript">
var num=0
var num=1
var num=2
var num=3
count = 0
snakecount =0
browserName = navigator.appName;
browserVer = parseInt ( navigator.appVersion );
version = "n2";
if ( browserName == "Netscape" && browserVer >= 3 ) version = "n3";
if ( browserName == "Microsoft Internet Explorer" && browserVer >=4 )
version = "e4";
if ( version == "n3" || version == "e4" )
{
myimages = new Array()
img0 = new Image ()
img0.src = "shark.gif"
img1 = new Image ()
img1.src = "pikachu.gif"
img2 = new Image ()
img2.src = "bird.gif"
img3 = new Image ()
img3.src = "bomb.gif"
img4 = new Image ()
img4.src = "contruck.gif"
img5 = new Image ()

D G Dawson
Email: [email protected]
10

img5.src = "kanga5.jpg"
img6 = new Image ()
img6.src = "cowboy.gif"
img7 = new Image ()
img7.src = "iloveu.gif"
img8 = new Image ()
img8.src = "monkey.gif"
img9 = new Image ()
img9.src = "peace.gif"
img10 = new Image ()
img10.src = "skull.gif"
img11 = new Image ()
img11.src = "ship.gif"
img12 = new Image ()
img12.src = "snake.gif"
img13 = new Image ()
img13.src = "Sphead.gif"
img14 = new Image ()
img14.src = "pepe.gif"
img15 = new Image ()
img15.src = "Tie.gif"
img16 = new Image ()
img16.src = "Meliniom.gif"
img17 = new Image ()
img17.src = "Wing1.gif"
img18 = new Image ()
img18.src = "Ship2.gif"
for (g=0; g<=18; g++){
myimages[g] = new Image
myimages[g] = eval("img"+g+".src")
}
}
function slideshow()
{
for(i=1; i<20;i++){
for(b=1;b<11000;b++){}
randymiz()
document.mypic.src=myimages[num]
document.my2pic.src=myimages[num2]
document.my3pic.src=myimages[num3]
document.my4pic.src=myimages[num4]
if(num ==snakecount ||num2 ==snakecount ||num3 ==snakecount ||num4 ==snakecount )
{count++
document.myform.text1.value=count
}
}
}
function randymiz(){
now =new Date()
num=(now.getSeconds())%18
num2 = (now.getSeconds()+1)%18
num3 = (now.getSeconds()+2)%18

D G Dawson
Email: [email protected]
11

num4 = (now.getSeconds()+3)%18
}
function snake_counter(){
snakecount = document.form2.text2.value
}
function check(numb){
p1=parseInt(numb)
p2=parseInt(document.form2.text2.value)
if(p1==p2+1)
{playsound()}
else{playsound2()}
}
function playsound(){
document.sound1.play()
}
function playsound2(){
document.sound2.play()
}
</SCRIPT>
</HEAD>
<BODY>
<H3>Pictures change at Random upon mouse click.</h3>
<H3>Click on the thumbnail image to tell the computer which image was
counted</h3>
<TABLE NAME="one">
<TR>
<TD>
<CENTER>
<A HREF="JavaScript:slideshow()">
<IMG SRC="shark.gif" NAME="mypic" BORDER=0 width = 160 height = 160>
<IMG SRC="ship.gif" NAME="my2pic" BORDER=0 width = 160 height = 160></br>
<IMG SRC="skull.gif" NAME="my3pic" BORDER=0 width = 160 height = 160>
<IMG SRC="snake.gif" NAME="my4pic" BORDER=0 width = 160 height = 160>
</A>
</TD>
<TD>
<FORM name="myform">
Picture Total
<INPUT TYPE="text" name="text1">
</FORM>
<form name="form2">
<INPUT TYPE="button" name="snakebutton" value="Submit Number"
onClick="snake_counter()">
Enter number of picture to count
<INPUT TYPE="text" name="text2">
</form>
</TD>
</TR>
</TABLE>
Click on a pic to tell me which picture was being counted.<BR>
<TABLE NAME="pics">
<TR>
<TD>
<A HREF="JavaScript:check(1)">

D G Dawson
Email: [email protected]
12

<IMG SRC="shark.gif" NAME="my5pic" BORDER=0 width = 30 height = 30>

</A>
</TD>
<TD>
<A HREF="JavaScript:check(2)">
<IMG SRC="pikachu.gif" NAME="my6pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(3)">
<IMG SRC="bird.gif" NAME="my7pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(4)">
<IMG SRC="bomb.gif" NAME="my8pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(5)">
<IMG SRC="contruck.gif" NAME="my9pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(6)">
<IMG SRC="kanga5.jpg" NAME="my10pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(7)">
<IMG SRC="cowboy.gif" NAME="my11pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(8)">
<IMG SRC="Iloveu.gif" NAME="my12pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(9)">
<IMG SRC="monkey.gif" NAME="my13pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(10)">
<IMG SRC="peace.gif" NAME="my14pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(11)">
<IMG SRC="Skull.gif" NAME="my15pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(12)">
<IMG SRC="ship.gif" NAME="my16pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>

D G Dawson
Email: [email protected]
13

<A HREF="JavaScript:check(13)">
<IMG SRC="snake.gif" NAME="my17pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(14)">
<IMG SRC="Sphead.gif" NAME="my18pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(15)">
<IMG SRC="pepe.gif" NAME="my19pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(16)">
<IMG SRC="Tie.gif" NAME="my20pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(17)">
<IMG SRC="Meliniom.gif" NAME="my21pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(18)">
<IMG SRC="Wing1.gif" NAME="my22pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
<TD>
<A HREF="JavaScript:check(19)">
<IMG SRC="Ship2.gif" NAME="my23pic" BORDER=0 width = 30 height = 30>
</A>
</TD>
</TR>
</TABLE>
</CENTER>
<EMBED SRC="dave2.wav" autostart=false HIDDEN=TRUE NAME="sound1"
MASTERSOUND>
<EMBED SRC="wrong.wav" autostart=false HIDDEN=TRUE NAME="sound2"
MASTERSOUND>
</BODY>
</HTML>

A Total URL Search Program: total_search.html

<html>
<head>
<title>
Total Engine Search
</title>
<script language="JavaScript">
<!-- Hide this script from old browsers -/*
This script came from the 24 hour JavaScripts Site
located at http://www.javascripts.com. It is brought to
you by Eric Jarvies, Lewis Sellers, Giuseppe Lombardo,

D G Dawson
Email: [email protected]
14

Kurt Anderson, and David Medinets.

*/
Yahoo = "http://search.yahoo.com/bin/search?p=";
Alta = "http://www.altavista.digital.com/cgi-bin/query?pg=q&what=web&q=";
Open = "http://search.opentext.com/omw/simplesearch?SearchFor=";
Lycos = "http://www.lycos.com/cgi-bin/pursuit?query=";
Crawler = "http://www.webcrawler.com/cgi-bin/WebQuery?searchText=";
InfoSeek = "http://guide-p.infoseek.com/Titles?qt=";
DejaNews = "http://search.dejanews.com/nph-dnquery.xp?query=";
Inktomi = "http://204.161.74.8:1234/query/?query=";
MetaCrawler = "http://metacrawler.cs.washington.edu:8080/htbin-post/nph-metaquery.p?general=";
SavySearch = "http://guaraldi.cs.colostate.edu:2000/search?KW=";
Excite = "http://www.excite.com/search.gw?searchType=Concept&search=";
Magellan = "http://www.mckinley.com/searcher.cgi?query=";
Point = "http://point.lycos.com/cgi-bin/pursuit?query=";
Galaxy = "http://www.einet.net/cgi-bin/wais-text-multi?keywords=";
var got=0;
var url = "";
var plus="";
var mag="";
function search4(item){
stringPlus();
resultsWindow=window.open();
resultsWindow.document.open();
resultsWindow.document.write("<head><title>Close this window to return to Total
Search</title></head>");
resultsWindow.document.write("<FRAMESET ROWS=50%,50%><FRAMESET COLS=50%,50%><FRAME
NAME='frame0' SRC='" + computeFrameSrc(0) + "'><FRAME NAME='frame1' SRC='" +
computeFrameSrc(1) + "'></FRAMESET>");
resultsWindow.document.write("<FRAMESET COLS=50%,50%><FRAME NAME='frame2' SRC='" +
computeFrameSrc(2) + "'><FRAME NAME='frame3' SRC='" + computeFrameSrc(3) +
"'></FRAMESET></FRAMESET>");
resultsWindow.document.close();
got = 0;
}
function search2(item){
stringPlus();
resultsWindow=window.open();
resultsWindow.document.open();
resultsWindow.document.write("<head><title>Close this window to return to Total
Search</title></head>");
resultsWindow.document.write("<FRAMESET ROWS=50%,50%><FRAME NAME='frame0' SRC='" +
computeFrameSrc(0) + "'><FRAME NAME='frame1' SRC='" + computeFrameSrc(1) + "'></FRAMESET>");
resultsWindow.document.close();
got = 0;
}
function stringPlus(){
for (var j=0; j < window.document.choose4.text.value.length; j++){
if (window.document.choose4.text.value.charAt(j) == " ")
mag += "+";
else
mag += window.document.choose4.text.value.charAt(j);}
}
function numChecked(item){

D G Dawson
Email: [email protected]
15

plus = escape(item.text.value);
var h=0;
num=0;
for (var l=0; l < item.check1.length; l++) {
if (item.check1[l].checked){
h++;
if (h++ <= 4){
if (l == "0"){
num = 1;}
else if (l == "1"){
num = 2;}
else if (l == "2"){
num = 3;}
else if (l == "3"){
num = 4;}
else if (l == "4"){
num = 5;}
else if (l == "5"){
num = 6;}
else if (l == "6"){
num = 7;}
else if (l == "7"){
num = 8;}
else if (l == "8"){
num = 9;}
else if (l == "9"){
num = 10;}
else if (l == "10"){
num = 11;}
else if (l == "11"){
num = 12;}
else if (l == "12"){
num = 13;}
}
}
}
if (h == 2)
Results(num-1);
else if (h == 4)
search2(item);
else
search4(item);
}
function computeFrameSrc(num){
var k=-1;
for (var j=got; j < document.choose4.check1.length; j++) {
if (document.choose4.check1[j].checked){
k++;
if (k++ <= num){
if (j == "0"){
url = Yahoo + plus;
got = 1;}
else if (j == "1"){
url = Magellan + mag;
got = 2;}
else if (j == "2"){
url = Point + plus;
got = 3;}

D G Dawson
Email: [email protected]
16

else if (j == "3"){
url = Alta + plus + "&mode=and";
got = 4;}
else if (j == "4"){
url = Open + plus + "&mode=and";
got = 5;}
else if (j == "5"){
url = Lycos + plus + "&backlink=217&maxhits=25";
got = 6;}
else if (j == "6"){
url = Excite + plus +
"&category=default&mode=relevance&showqbe=1&display=html3,hb";
got = 7;}
else if (j == "7"){
url = Crawler + plus + "&maxHits=25";
got = 8;}
else if (j == "8"){
url = InfoSeek + plus + "&col=WW";
got = 9;}
else if (j == "9"){
url = DejaNews + plus + "&defaultOp=AND&svcclass=dncurrent&maxhits=25";
got = 10;}
else if (j == "10"){
url = Inktomi + plus + "&hits=25&disp=Text+Only";
got = 11;}
else if (j == "11"){
url = MetaCrawler + plus +
"&logic=0ion=The+World&orgType=Any&maxwait=1&score=0";
got = 12;}
else if (j == "12"){
url = SavySearch + plus +
"&classic=on&t1=x&Boolean=AND&Hits=10&Mode=MakePlan&df=normal&AutoStep=on&AutoInt=on&lb=1";
got = 13;}
return url;
}
}
}
url = "http://www.personalcompass.com/empty.html";
return url;
}
function Results(place){
stringPlus();
resultsWin = open("","results");
if (place == "0")
url = Yahoo + plus;
else if (place == "1")
url = Magellan + mag;
else if (place == "2")
url = Point + plus;
else if (place == "3")
url = Alta + plus + "&mode=and";
else if (place == "4")
url = Open + plus + "&mode=and";
else if (place == "5")
url = Lycos + plus + "&backlink=217&maxhits=25";
else if (place == "6")
url = Excite + plus + "&category=default&mode=relevance&showqbe=1&display=html3,hb";
else if (place == "7")

D G Dawson
Email: [email protected]
17

url = Crawler + plus + "&maxHits=25";

else if (place == "8")
url = InfoSeek + plus + "&col=WW";
else if (place == "9")
url = DejaNews + plus + "&defaultOp=AND&svcclass=dncurrent&maxhits=25";
else if (place == "10")
url = Inktomi + plus + "&hits=25&disp=Text+Only";
else if (place == "11")
url = MetaCrawler + plus + "&logic=0ion=The+World&orgType=Any&maxwait=1&score=0";
else if (place == "12")
url = SavySearch + plus +
"&classic=on&t1=x&Boolean=AND&Hits=10&Mode=MakePlan&df=normal&AutoStep=on&AutoInt=on&lb=1";
resultsWin.location = url;
}
// -- End Hiding Here -->
</script>
</head>
<body bgcolor="#FFFFFF">
<font size=+1>Total Search</FONT>
<p>
This script will runn the same search across all of
the major search engines at one time.<p>
<form name="choose4" Action="javascript:numChecked(document.choose4) //">
<p>
<Font size=4><b>Search and display 1-4 databases simultaneously:</B></font><BR>
<table><tr><td><b>Directories</b><br>
<input type="checkbox" name="check1" value="Yahoo"
onClick="choose4.check1.value='Yahoo'">Yahoo<br>
<input type="checkbox" name="check1" value="Magellan"
onClick="choose4.check1.value='Magellan'">Magellan<br>
<input type="checkbox" name="check1" value="Point"
onClick="choose4.check1.value='Point'">Point<br><br></td>
<td width="15"></td>
<td><b>Search Engines</b><br>
<input type="checkbox" name="check1" value="Alta"
onClick="choose4.check1.value='Alta'">Alta Vista<br>
<input type="checkbox" name="check1" value="Open"
onClick="choose4.check1.value='Open'">Open Text<br>
<input type="checkbox" name="check1" value="Lycos"
onClick="choose4.check1.value='Lycos'">Lycos<br>
<input type="checkbox" name="check1" value="Excite"
onClick="choose4.check1.value='Excite'">Excite<br></td>
<td><br><input type="checkbox" name="check1" value="Crawler"
onClick="choose4.check1.value='Crawler'">Webcrawler<br>
<input type="checkbox" name="check1" value="InfoSeek"
onClick="choose4.check1.value='InfoSeek'">InfoSeek<br>
<input type="checkbox" name="check1" value="DejaNews"
onClick="choose4.check1.value='DejaNews'">DejaNews<br>
<input type="checkbox" name="check1" value="Inktomi"
onClick="choose4.check1.value='Inktomi'">Inktomi<br>
</td>
<td width="15"></td>
<td><b>Meta Searches</b><br>
<input type="checkbox" name="check1" value="MetaCrawler"
onClick="choose4.check1.value='MetaCrawler'">MetaCrawler<br>
<input type="checkbox" name="check1" value="SavySearch"
onClick="choose4.check1.value='SavySearch'">SavySearch<BR><br><br>
</td></tr></table>

D G Dawson
Email: [email protected]
18

<P>
<B>Enter text to find</B>:<BR>
<input type="text" name="text" size=30>
<input type="submit" name="send" value="Search">
<input type="reset" name="clear" value="Clear All">
</form>
</body>
</html>

Calculating a Mortgage: mortgage.html

<HTML>
<HEAD>
<TITLE>
</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function loan(){
var monthlyInterest
var interest
var payment
var years
var amount
years = document.one.period.value
interest = document.one.rate.value /100
amount = document.one.amount.value
monthlyInterest = interest / 12;
payment = amount * monthlyInterest
/ (1 - (Math.pow (1/ (1 + monthlyInterest), years * 12)));
document.two.repay.value = payment
}
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="one">
Enter your loan Period in years.
<INPUT TYPE=text NAME="period" SIZE=10><br>
Enter your lnterest Rate.
<INPUT TYPE=text NAME="rate" SIZE=10><br>
Enter your loan Amount.
<INPUT TYPE=text NAME="amount" SIZE=10><br>
Click this button to process your loan.
<INPUT TYPE=button NAME="starter" VALUE="Process Loan" onClick="loan()"><br>
</FORM>
<FORM NAME="two">
Here are your monthly repayments: <br>
<INPUT TYPE=text NAME="repay" SIZE=10><br>
</FORM>
</BODY>
</HTML>

Slideshow: slideshow.html
Can you use setTimeOut to delay the slides, instead of the for loop?
<HTML>
<HEAD>

D G Dawson
Email: [email protected]
19

<! -- David Dawson's JavaScript and Webpage Template-->

<SCRIPT LANGUAGE="JavaScript">
var num=0
var num2=1
var num3=2
var num4=3
count = 0
snakecount =0
browserName = navigator.appName;
browserVer = parseInt ( navigator.appVersion );
version = "n2";
if ( browserName == "Netscape" && browserVer >= 3 ) version = "n3";
if ( browserName == "Microsoft Internet Explorer" && browserVer >=4 )
version = "e4";
if ( version == "n3" || version == "e4" )
{
myimages = new Array()
img0 = new Image ()
img0.src = "shark.gif"
img1 = new Image ()
img1.src = "pikachu.gif"
img2 = new Image ()
img2.src = "bird.gif"
img3 = new Image ()
img3.src = "bomb.gif"
img4 = new Image ()
img4.src = "contruck.gif"
img5 = new Image ()
img5.src = "kanga5.jpg"
img6 = new Image ()
img6.src = "cowboy.gif"
img7 = new Image ()
img7.src = "iloveu.gif"
img8 = new Image ()
img8.src = "monkey.gif"
img9 = new Image ()
img9.src = "peace.gif"
img10 = new Image ()
img10.src = "skull.gif"
img11 = new Image ()
img11.src = "ship.gif"
img12 = new Image ()
img12.src = "snake.gif"
img13 = new Image ()
img13.src = "Sphead.gif"
img14 = new Image ()
img14.src = "pepe.gif"
img15 = new Image ()
img15.src = "Tie.gif"
img16 = new Image ()
img16.src = "Meliniom.gif"
img17 = new Image ()
img17.src = "Wing1.gif"
img18 = new Image ()
img18.src = "Ship2.gif"
for (g=0; g<=18; g++){

D G Dawson
Email: [email protected]
20

myimages[g] = new Image

myimages[g] = eval("img"+g+".src")
}
}
function slideshow()
{
for(i=0; i<18;i++){
for(b=1;b<11000;b++){}
document.mypic.src=myimages[i]
}
}
</SCRIPT>
</HEAD>
<BODY>
<H3>SlideShow changes upon mouse click on image or button.</h3>
<CENTER>
<A HREF="JavaScript:slideshow()">
<IMG SRC="shark.gif" NAME="mypic" BORDER=0 width = 320 height = 320>
</A>
<form name="form2">
<INPUT TYPE="button" name="snakebutton" value="Submit Number"
onClick="slideshow()">
</form>
</BODY>
</HTML>

D G Dawson
Email: [email protected]
21