CSC 551: Web Programming
Fall 2001
HW4: Event-driven JavaScript
Part 1
As we discussed in class, one of the advantages of text boxes and text areas over prompts is persistence and modifiability. If the user enters input into several text boxes, those values persist in the boxes. If the user changes their mind or wants to re-execute code based on new values, they can simply edit the appropriate text boxes and re-execute.
Create a new version of your gpa.html page that uses a single text area for inputting the information for all courses. As before, each course should have its name, grade, and credit hours listed on a single line, in that order. The output of your program, which should include the total credit hours, total grade points, and grade point average, should appear in a separate text area.
To handle tabs and carriage returns within the text area, you will need to update the Arrayify function so that it correctly handles all whitespace characters.
function IsWhiteSpace(ch)
// Returns: true if ch is a whitespace character, else false
{
return (ch == " " || ch == "\t" || ch == "\n" || ch == "\r");
}
function Arrayify(str)
// Assumes: str is a sequence of words, separated by whitespace
// Returns: an array containing the individual words
{
var items = new Array();
var count = 0;
while (str != "") {
var index = 0;
while (index < str.length && IsWhiteSpace(str.charAt(index))) {
index++;
}
if (index < str.length) {
var item = "";
while (index < str.length && !IsWhiteSpace(str.charAt(index))) {
item += str.charAt(index);
index++;
}
items[count] = item
count++;
}
str = str.substring(index+1, str.length);
}
return items;
}
|
Part 2
The team project for this course will involve writing a Web-based JavaScript program for playing BlackJack. If you are not familiar with the game, the rules are as follows:
- Initially, the dealer deals two cards (face up) to the player and two cards to herself (one face down, one face up).
- Individual cards are assigned points: numeric cards are assigned their number value (e.g., 3 of Hearts = 3 points), face cards are assigned 10 points each, and Aces can be either 1 or 11 points at the discretion of the player.
- If the player's initial cards total 21, this is an immediate win (BLACKJACK).
- Otherwise, the player can repeatedly opt to have another card dealt (a HIT). If the total of the player's cards exceed 21, however, the player loses (BUSTS). On the other hand, if the player can amass five cards without busting, he automatically wins.
- Once the player is done receiving cards (STANDS PAT), the dealer must turn over her card and hit until her total exceeds 16. If the total of the dealer's cards exceeds 21, the dealer loses.
- If neither the player nor the dealer busted, then the hand with the higher point total wins. In case of a tie, the dealer wins.
Without writing any code, design the layout of a page for playing the game. That is, draw a picture of the page and identify the individual page elements that make up the page. Be sure to annotate those elements with a brief description of what event-handling should occur with respect to the elements. For example, if there is a button on the page, describe what should happen when the user clicks on that button.
Be sure to consider:
- The cards for both the player and the dealer should be displayed graphically on the page (routines for dealing and displaying cards will be provided for the actual project).
- After the intial cards have been dealt, the user must be able to repeatedly HIT and see the resulting card before making their next decision.
- The totals for both the player's and the dealer's hands should be displayed at all times during the game.
- The player should be notified immediately when he has won or lost.
- After a game, the player should be allowed to begin a new game.
- A running total of wins and losses for the player should appear on the page.
Note: To familiarize yourself with the game, you are allowed to find and play with existing BlackJack games on the Web. However, the design of your page should not rely on these pages, most of which are terribly designed and/or rely on language features that you are not familiar with. Use your understanding of form elements and JavaScript to produce your own design. Under no circumstances are you allowed to view source code of existing BlackJack programs.
Repeat: you are not allowed to view the source code of any existing BlackJack page.