P r o j e c t  

HTML-CSS-JavaScript-PHP
CPT 106 · Franklin College · Erich Prisner · 2002-2006

In the last four weeks of the semester, your task is to create a project unifying the different web tools we have worked with so far. You are supposed to do this in groups of two, three or four, but working on your own is also possible (though not recommended).

Please form a group and choose a topic from the two given below. It may make sense to specialize, having one student doing the Stylesheet, one doing the PHP, for instance, but before you go into this you have to discuss the structure of your web page, the functionality and the design, and how the different parts (CSS, Javascript, PHP) are supposed to interact.

Since the PHP part would not work on our computers, I reserved server space for us at a free webspace provider. I will give you login information and information on how to ftp your files on the server later. I will open folders for the different projects, in which you can put the files. Please behave responsible with our joint server space.

Topic 1: Online Test

Create a web page where incoming students can do a computer placement test online. The students would go to the start page, where some explanations are given, and where the student can log in with name and password he or she was given by email (you maintain a list of all students, together with the passwords. For test purposes, let's assume we just have 5 students.) After logging in successfully, the student sees a page with four multiple choice questions with radio buttons as alternatives. After filling out the form, the student is supposed to click the "submit" button to enter the next page with four more questions.

If the student clicks the "submit" button" with not all answers answered, JavaScript should send a reminder to do so.

On all three pages with questions,a JavaScript clock should be ticking, showing the time passed already. The time limit for the whole test, all 12 questions, would be 15 minutes. If the 15 minutes are gone, all questions marked already on the present page would be taken into account, but no sumission is possible anymore.

After the student has either regularily left the last test page or timed out, the result should be given. For questions that were answered wrong the right answer should be displayed.

Of course, students that have taken the test once are not allowed to take it again. If the student tries that, an explanation should be given.

The pages should be formatted with CSS. The pages should all have a similar style, and also a heading.

Topic 2: Online Poll

Please create an online poll on whatever topic you like. There should be 5 questions with 2 to 5 alternatives for answer---use radio buttons, and two questions that require the user to write a number (like age) in a text field.

On the start page some explanations should be given. Then the user would start the survey by clicking on some button or link. Then a new small browser window (without navigation buttons) should open with question 1. After submitting, the next question should be displayed in that window, and so on. The main window should remain open all the time.

There should be another link or button on the main page for the results so far. Again a separate small browser window should open. But you should only be allowed to view the results if you have taken the poll before. This can be checked by a cookie. The displays of the results should be graphically, with bars for the different options, and the length of the bar proportional to the percentage. For the two textfield questions, the answer should be just the mean (average).

You should restrict users from taking the poll again within 1 hour (use cookies here again).

Of course, the pages should be formatted with CSS. In particular, use a uniform design for the 7 poll question pages, and also for the 7 answer pages.


Erich Prisner 2006