CodeCooker Home Page


Assignments - Second Semester
Name Description Language(s) Specifications Other Requirements
Personal Web Site
Personal Web Site Build a web site that serves as a directory for all your assignments in this class and as an online portfolio of your web design capabilities.

Build your site useing Notepad++.

The web site will have, as a minimum, 4 pages:

Page Subject Requirement Software
Main Page This page contains a logo, design by you using Gimp 2. It will have links to the other pages. It should have introductory narrative about who you are. The page should be dated. Notepad
Gimp 2
Assignment Page Provide a link to each of your assignments with a sort description of that assignment. Each assignment should reside in a separate directory in your html directory. Notepad
Gimp 2
Resume Page This page is your resume. List your work history (if you have one), the types of classes you have taken, and extra-curricular activities you have been involved in. List a section that details your skill and interests. The page should be dated. Notepad
Gimp 2
Hobbies/Interests Page Provide detailed information about your interests/hobbies. The page should be dated. Notepad
Gimp 2


Notepad++
Gimp 2
  • Each page should contain the following:
    - a consistent style throught the site
    - use cascading style sheets to handle the text-rollover effects of the links
    - a graphic of your own design to serve as a logo
    - a navigation bar with links to each of your assignments
    - your name, semester, and year
    - a statement about your future goals
For a sample css, go here.

For a tutorial on Cascading Style Sheets, try here.

Problems in PHP
Starting PHP Write a Hello, World program.

PHP  
Basic Program Structures in PHP Write a program that demonstrates the use of PHP variables, a "for" loop, an "if-then," and basic output.

The program will produce a count down from 100 to 1 that lists the number of items left in the listing.

For example:

There are 100 items left.
There are 99 items left.
There are 98 items left.
There are 97 items left.
There are 96 items left.

until the last 2 items which reads:

There is 1 item left.
There are no items left.
PHP
  • The program, when called by its URL, will produce its output in a browser window.
For a sample, click here.
You do not have include the form that the sample uses.
Online Order Form Build a web page that looks like an online order form. When submitted a "confirmation page" will be shown.

The subject of your order form is up to you.

Start by building a simple HTML page that has a single text box and a Submit button.

Then write a simple PHP page that prints out what is typed in the text box.

For a sample HTML page click here.

For a sample PHP script click here.

To run it click here.

PHP/HTML
  • The form must contain at least one example each of the following FORM input types:
    - text
    - text area
    - checkboxes
    - radio buttons
    - pull-down menu
    - password
    - submit
    - reset
  • The confirmation page generated by a PHP program must show the values entered into the above FORM elements.
  • Source code will be heavily annotated.
For a sample, click here.

How to build HTML Forms

Introduction to PHP Read Chapter 1 in our PHP book.

PHP and HTML   Access the book as shown in class.
Name Description Language(s) Additional
Specifications
Other Requirements
Math Calculator Build a web site that will function as a math calculator. You will have two text boxes for data entry and a pull-down menu between them to select the operation. Include a "Submit" button to launch the calculator.

PHP/HTML The required operations are:
  • addition
  • subtraction
  • multiplication
  • division
  • modulus

Be sure to trap errors generated by attempts to divide by zero. The answer to the calculation will be shown on a new web page that also shows the data and operation selected from the first page.

Source code will be heavily annotated.
For a sample, click here.
Name Description Language(s) Additional
Specifications
Other Requirements
Loan Calculator Build a web site that will function as a loan calculator that determines the payment amount. Your first page will have text boxes for the user to enter the following data:

  • The initial amount of the loan
  • The annual interest rate(in percent)
  • The term of the loan in years

The formula for loan calculations is:

              J
M = P * ---------------------
        1 - ( 1 + J ) ^ -N

where:

P is the principal (the initial amount of the loan)
J is the interest rate (the percentage divided by 1200)
N is the length of the loan in months (years times 12)

Include a "Submit" button to launch the calculator.

PHP/HTML The site will calculate the monthly payment and will display it rounded of to two decimal places and preceeded by a dollar sign.



Source code will be heavily annotated.
For a sample, click here.
Name Description Language(s) Additional
Specifications
Other Requirements
String Processing Exercise Build a web site for processing strings. You will have three text boxes on the main page. The boxes will be labeled for "Name," "Phrase," and "Search Word." Include a "Submit" button to launch the program. The program will perform the functions as listed in the specifications on the right.

The PHP commands you should become familiar with for this project are:

str_word_count
strlen
strrev
stripos
str_replace
substr
substr_replace
explode
foreach
array
PHP/HTML Show the results in a labeled table like the example program on the right. The required operations are:
  • split the first and last names
  • show the phrase
  • show the search word
  • show how many words are in the phrase
  • show how many characters are in the phrase
  • print the phrase backwards
  • show the PHP position that the search word appears in the phrase
  • print the phrase with the vowels, aeiou, replaced with *. Replace y if at the end of a word.
  • print the phrase with the words in their original order by each word reversed.



Source code will be heavily annotated.
For a sample, click here.
Name Description Language(s) Additional
Specifications
Other Requirements
Hi-Lo Game
Version 1
This assignment is to build a web site that plays the Hi-Lo game. This is the same game we wrote in Computer Application Design 1 in QuickBasic.

Write the application so it works as a self-referential script, that is, a single PHP file, named index.php. Use the include() function to load seperate html pages where necessary.

Follow the flowchart provided. See the link to the right.

Step One

We will simulate state by passing variables back and forth between the user and the program by including them as hidden input types in a form. The variables we need to pass are the level, the answer, the turns, and a list of previous guesses.

Write a program that detects whether or not these variables have been set.
Here is the example shown in class.

Refer to the flowchart for this program and add the two programs we will use as includes: set_level.php and guess.php.

Test the program to make sure it lets you select a level and then routes you to making a guess. View the source code of each page to make sure the hidden variables are being passed properly.

Step Two

Refer to the flowchart and complete the assignment.
PHP/HTML
  • The user will have a choice of levels.
  • The source code for the HTML should encrypt the answer.
  • The cursor should appear in the "guess" box without the user having to click in it first.
  • Source code will be heavily annotated.
 

For a working example, see your teacher's Hi-Lo game.

Name Description Language(s) Additional
Specifications
Other Requirements
Hi-Lo Game
Version 2
Create a second version of the Hi-Lo game. This version will function in Roman Numerals instead of base 10.

PHP/HTML
  • Same requirements as Version 1.
  • It will use Roman numerals in the range of I to C.
  • The source code for the HTML should encrypt the answer.
  • The cursor should appear in the "guess" box without the user having to click in it first.
  • Source code will be heavily annotated.
 

Name Description Language(s) Additional
Specifications
Other Requirements
Presidents Program You will build a web page that allows the user to list and search through a list of U.S. presidents. Functionally, this program will work just like to one we did in our first semester class.

PHP/HTML The program will read the president's data file from your file space on the server.

The program will:
  • list all the presidents
  • list by last name
  • list by term number
  • list by party

Additionally, the program will
  • allow name searches without case sensitivity.
  • show a list of parties in a pull-down menu
  • provide specific information to the user if they fail to make a choice or type in a name or term number
There is a demo to look at here:here. You should be able to copy it to Notepad, save it with a ".php" extension, and upload it to your file space to run it. Be sure to read through its annotation.

You can try a working copy of the program here.

You can get a copy of the president data by clicking here.
Name Description Language(s) Additional
Specifications
Other Requirements
Word Guess Game You will build web site that functions a word guess (hangman) game.

Proceed as follows:

Day 1
Step 1
Copy the wordlist.txt file by right-clicking here and saving it in your folder on your computer.

Upload that file to your folder on the web server
Step 2
Write code that displays the word list in the browser:
$fp=fopen('wordlist.txt','r');
while(!feof($fp))
{
	$word = trim(fgets($fp,999));
	echo $word .'<br>';
}
fclose($fp);
Test It!

Try a sample - List all words
Step 3
Modify that code so that only words of a certain length are listed.

Hint: Use the 'trim' function to clean up the words before you measure their length.

Test It!

Try a sample - List 4-letter words
Step 4
Generate a random number between 1 and the number of words on the list.

Hint: Read the word list into an array and use the 'count' function to tell you how many words there are in the array. For example, in the above program that lists all the words, instead of, or in addition to printing out each word, you could assign each word to the array:

$word_array[] = $word;

Notice that you do not have to include a counter between the [ ] characters. PHP will assign the index number for you starting a zero.

Using the random number, go to that position in the array and retrieve just that word.

If that word has the correct number of letters, print it out, else try again. You might try something like this:

<in english>

while the number of letter in the word is not equal to 4
{
get a random word from the array
}

print out the word

</in english>

Refreshing the browser will select a different word each time.

Test It!

Try a sample - List different word on each refresh
Day 2
Step 5
The previous steps allowed you generate the answer. Now we need to get the user input.

Design a form in html as a start page. DO NOT much spend time making it fancy at this point. Just a couple radio buttons for selecting the level and a submit button. You can include a hidden "firstime" variable like we used in the Hi Lo game or detect the first time the program is run by using the isset() function.

Next, add form retrieval code to your PHP program from Step 4 above and have it run the answer generator only if it is the firstime the script is run.

Test It!

Step 6
Now add a guess section to your program after the answer generator section.

Add a form that will relaunch your PHP program just like we did in the Hi Lo game. In that form you'll have a guess box and a few hidden types along with a submit button.

Test it by having it echo back the value of all your variables.

Day 3
Step 7
Next we need to add code that will search the answer for occurences of the guess. This is a string processing exercise similar to what we did in the string assignment a while back.

Search the answer for the guess and build a "clue string" that shows the position of the guess in the string. Where the guess does not occur, add an underscore character.

Test It!

Big Hint!

Try using 4 strings:
  • Guess - the user's guess letter
  • Answer - the random word
  • Solution - a string made of of some non-alphanumeric character (-+!_%$#) equal in length to the Annswer string
  • Temp - a string you will build as you search Answer string for matches to Guess string
Procedure
  • Search through Answer string one character at time
  • If that character in Answer string matches Guess string AND that position in Solution string has not been guessed correctly (in other words it is your non-alphanumeric character), then append Guess string to Temp string (try .=), else append your non-alphanumeric character to Temp string.
  • When done searching, set Solution string equal to Temp string
  • If Solution string equals Answer string, game over, else print out Solution string and get another guess
An example of a quick and dirty test program is here: here.

Day 5 & 6
Step 8
You are now ready to continue on your own to add the additional features that will make the game functional.

Test It! Test It! Test It!
PHP/HTML The game will have the following features:
  • levels of play based on the number of letters to be guessed
  • randomly generated word from word list provided in class
  • show the number of letters to be guessed, for example: _ _ _ _
  • show the user's previously guessed letters inserted in proper order
  • a graphic to indicate progress (it doesn't have to be a hangman)
  • show correct word when they lose
  • a way to play again
I have a working model of the program here.

For a non-violent version of the program, click here.

An example of a quick and dirty test program is here: here.

Name Description Language(s) Additional
Specifications
Other Requirements
Generic Site with CMS You will build a web page that utilizes a Content Management System.

The site will be built with the following requirements/features:

  • A single page for the entire site that the user sees (a template)
  • Uses a stylesheet
  • The page content will be loaded from external files:
    • site links (the list of pages on the site
    • navigation bar buttons (to a selection of site pages
    • a set of links to other sites
    • the page main content
  • An administrative backend for site management will contain the following features:
    • create new pages
    • rename existing pages
    • delete existing pages
    • edit existing pages
    • change administrative password
    • edit which pages show in navigation bar*
    • edit site links


    * The admin should be able to select which of 5 pages will appear in a navigation bar and the order they will appear. An easy interface would be 5 select menus that the admin can use to select which page appears on the bar. You might want to consider writing that page order to a file.

PHP/HTML You will use the preinstalled FCKeditor for editing the page content.

The page content for this project will be for a generic business or organziation.

Use session control for logging in and out of the admin page.

You'll need to validate everything the user enters. That means to check the file names they use. Check that only alphanumeric characters are accepted, spaces are converted to underscores, and the first character is not a number. Spaces in file names are to be avoided. You might also want to limit the length of the page names.

When you show the page names as a hyperlinks, you can replace the underscores with spaces and use the php ucwords() function to make the page name look better.

Getting started Tip Sheet.

Creating a file Tip Sheet.

Reading a file Tip Sheet.

Using sessions Tip Sheet.

Creating hyperlinks out of filenames Tip Sheet.

Selecting links for a navigation bar demo.
Name Description Language(s) Additional
Specifications
Other Requirements
PHP Genrated Graphics - Part 1 In this activity you will write an application that generates a bar graph from a user-supplied data set.

In keeping with one of the themes of the class, the graph will show the popularity of various computer programming languages based on employer demand. You will use www.dice.com to search for each of the listed languages to find the number of current jobs that list that language in the job description.

Your main page will have a form for entering the number of jobs for each language. When the form is submitted, your PHP program will generate a horizontal bar graph showing each language count sorted from smallest to largest demand.

Click here for a tipsheet on associative arrays.

Click here for a tipsheet on hex decimal conversion.

Click here for a tipsheet on doing graphics in PHP.

PHP/HTML

Read pages 387-412 of our book.
The data entry form will contain fields for the following laguages:
  • C++
  • PHP
  • Java
  • Visual Basic
  • C#
  • Ajax
  • Javascript
  • Perl
  • Python
  • SQL

The data entry form will allow the user to select, through pull-down menus, the colors for each of the following:
  • graph background color
  • bar colors
  • text color
You will have at least 10 color options per menu.

The graph will meet the following specifications:
  • minimum size of 640 x 480
  • user selected colors
  • the languages sorted from least popular on top to most popular on the bottom
  • each language name listed to the left of its horizonal bar
  • the total number of jobs for each language listed on the left end of its bar
  • a title under the graph
For a sample, click here.

Name Description Language(s) Additional
Specifications
Other Requirements
Random Number Generator You will build a program that generates a list of random numbers with no repeats.

PHP
  • The program will have a Menu screen and show your name.
  • The program will allow the user to enter the quantity (range) of random numbers they want, up to 20,000.
  • The program will generate a list of numbers from 1 to the number supplied by the user.
  • Before the program starts to generate the numbers, read the time, and again when it is done. Show the elapse time in minutes and seconds.
  • The program will do 20,000 numbers in less that 10 seconds.
  • After they are generated, the user will be asked if they want to save the numbers to a text file and, if they do, provide the file as a download. The file will have a file extension of ".csv".
  • Source code will be heavily annotated.
There is an interesting PHP version here.
Name Description Language(s) Additional
Specifications
Other Requirements
PHP Genrated Graphics - Part 2 In this activity you will write an application that creates an online photo gallery for an individual user.

The user will create a name for a photo collection and be able to upload photos through that form. Up to 5 photos at a time can be uploaded.

There will be a viewing program that automatically resizes the images to a maximum of 800 horizontal or 600 vertical.

Click here for a tipsheet for this assignment.

PHP/HTML

Read pages 387-412 of our book.
A main page with means to upload or view photos.

The viewing option will automatically resize the images to a maximum of 800 horizontal or 600 vertical.

The user can click forward or back to proceed through the collection.

There is always a link to take the user back to the main page.

The upload feature will be password protected.
For a demo of this project, click here.

Name Description Language(s) Additional
Specifications
Other Requirements
Final The die roller probability grapher

You will write an application that produces a graphical report that shows the number of times each number shows up on a six-sided die when it is repeatedly rolled.

Your main page will consist of a form that allows the user to type in the number of rolls to make.

When the form is submitted, your PHP program will roll the die that many times, each time generating a random number between one and six. Count how many ones, twos, three, fours, fives, and sixes there are for all of the rolls.

Produce a labeled, horizontal bar graph showing the total number of rolls for each number and a bar showing each of the six numbers' relative frequency of occurrence.

PHP/HTML
For a demo of this project, click here.








CodeCooker Home Page