Dr. Greg Jones - Fall 2002

CECS 5100

Survey of Educational Computer Languages

Fall 2002

Need a free MP3 Player to listen to these clips ?

September 12th, 2002

Course Review (syllabus overview and comments)
Introduction
Audio (476k 1:00)
Review of Previous Concepts
Overview of Operators
Audio (2.7M 5:54)

Review of Assignment #1 part A

Audio (7.7M 16:69)

<html>
<head>

</head>
<body>
Part 1: (5 pts)<br>
Using JavaScript within HTML write an html/script 
that incorporates the following elements:
<p>
	a. uses the JS document.write<br>
	b. uses the JS alert<br>
	c. uses a variable<br>
	d. uses a for statement<br>
	e. uses the JS confirm<br>
<p>
Test Data: None<br>
Output: Student Defined<br>
Expected Code: Student must use one or more of 
the above items in the submitted code.<br>
Note: The above were all shown during class with 
the exception of confirm which can be looked up 
in the JS sourcebook.
<p>
<hr>

<script language="JavaScript">

// This is an example of in-line code

	var Ret
	
	Ret = confirm ("Display Assignment Title");
	
	if (Ret) {
		alert("The user pressed: "+Ret);
		document.write("<h2>Assignment #1 Part A</h2>");
		for (counter=1; counter < 10; counter++) 
			document.write("WOW!!! ");
		
	}

</script>

</body>
</html>

Local and Global Variables (p. 277)

Audio (1.9M 4:18)

<html>
<head>
	<script language="JavaScript">
		function showVar() {
			alert(test)
		}
		
		function loadVar() {
			test = "6"
		}

		loadVar();  // loads variable test with "6"

	</script>
</head>

<body>
<form>
<input type="button" value="click" onClick="showVar()">
</form>

</body>

</html>

Debugging JavaScript (Ch 14, p. 409, 410, 412, 415)
Audio (3.6M 7:52)

Review of Assignment #1 part B

Audio (3.6M 7:56)

<html>
<head>
<script language="JavaScript">

	schedulePage = "http://courseweb.tac.unt.edu/gjones/fall2002/cecs5100/schedule.html";
	thisPage = "assignment1b.html";
	
	function showConfirm ()
	{
		if ( confirm ( "Would you like to view the class schedule?" ) )
			location = schedulePage;
		else
			location = thisPage;
	}

</script>
</head>
<body>

Part 2: (5 pts)<br>
Using JavaScript within HTML write an html/script that implements 
the following pseudo code.
<p>
	a. Upon viewing the HTML page, display the course description 
	for 5100<br>
	b. At the bottom/after the course description html, provide a 
	hyper-link to the schedule page on courseweb.unt.edu under 5100<br>
	c. When the user clicks on the schedule hyper-link, the user 
	is presented with a confirm dialog box asking if they wish to 
	go to the new page or not.<br>
	d. If the user presses  Okay, then the page changes to the 
	listed URL for the schedule<br>
	e. If the user presses Cancel, the page does not change.<br>
<p>
Test Data: None<br>
Output: HTML as described, confirm dialog displayed on click of HREF 
for schedule, and page changes to the schedule page on confirm OK<br>
Expected Code: Student can use whatever JS code they wish to complete 
the assignment.<br>
Note: An example for this half of the assignment might be found on 
the current 5100 course pages. <br>Hint: Remember to 'view source' 
when looking at a web page.

<p>
<hr>

<b><font color="#66007F"><font size=+1>Course Description:</font></font></b>
<ul>A study of beginning computer programming using JavaScript, 
Perl, and HTML.  Requires "hands-on" programming independent of 
classroom instruction.  Topics include variables, simple and complex 
data structures, object-oriented design, debugging, and language uses.</ul>

<p>

<a href="#1" NAME="1" onClick="JavaScript:showConfirm()">View Course Schedule</a> 


</body>
</html>

Order of Precedence (p. 201-202)
Audio (896k 1:54)
Arrays (p. 245, 289)
Audio (4.8M 10:38)

Forms (Ch 16, p. 311, 312, 461, 483)

Audio (2.2M 4:56)

 Example 1 

<html>
<head>
	<script language="JavaScript">
		function readText(form) {
			var TestVar = form.inputbox.value;
			alert ("You typed: '" + TestVar + "'");
		}
		
		function writeText(form) {
			form.inputbox.value = "Have a nice day!";
		}
		
	</script>
</head>

<body>

<b>Example on page 462</b>
<p>
<form name="myform" action=" " Method="Get">
	Enter something in the box:
	<Input type="text" name="inputbox" value="">
	<p>
	<input type="button" name="button1" value="Read" onClick="readText(this.form)">
	
	<input type="button" name="button2" value="Write" onClick="writeText(this.form)">

</form>

</body>
</html>


 Example 2

<HTML>
</HEAD><TITLE>break</TITLE>
<SCRIPT LANGUAGE = "JavaScript">
function validatePrompt()
{
   var pInput = ""
   while (true)
   {
      pInput = prompt("Enter a number:", "")
      if (isNaN(parseFloat(pInput)))
         alert(pInput + " is not a number")
      else
         break
   }
}
</SCRIPT>

<BODY>
<H3>break</H3>
Click on "Prompt..." and see what happens
<FORM>
<INPUT   TYPE = "button"
         VALUE = "Prompt..."
         onClick = 'validatePrompt()'>
</FORM>
</BODY>
</HTML>