Question 1 [worth 16 marks]



Question 1

A certain coach company has the following ticket pricing policy. Children under 5 years old, and people who are 70 years old or more, travel for free. Otherwise, people who are under 16 years old travel for half price. Everyone else pays the full price for tickets. The company has started to implement an online facility to advise on these charges. The interface looks like this:

[pic]

The associated XHTML code is:

D.I.S. Shuttles: Ticket Prices

D.I.S. Shuttles

Find out your ticket type:

Enter your age in years:

Add a definition for the JavaScript function “priceProg()” (and other JavaScript statements as you think appropriate) to the above HTML so that (for example) for an input of 4, clicking on the “Display Your Ticket Type” button produces the alert message

[pic]

for an input of (for example) 9, clicking on the “Display Your Ticket Type” button produces the alert message

[pic]

and for an input of (for example) 25, clicking on the “Display Your Ticket Type” button produces the alert message

[pic]

Ideally, for an invalid input (e.g. some text rather than a number), clicking on the “Display Your Ticket Type” button should result in an appropriate error message.

Question 2

For legal and safety reasons, the Slais Shuttles coach company has been told that it may carry a maximum of ten people on its coach at any one time, and that the name of each passenger and whether they are a child or an adult must be recorded. They have started to implement a web page for this purpose. The interface looks like this:

[pic]

The associated XHTML code is:

D.I.S. Shuttles: Passenger List

D.I.S. Shuttles

Passenger List

Passenger name:

Child

Adult

Click here to display current child passengers

Click here to display current adult passengers

Click here to display all current passengers

Add definitions for the JavaScript functions “addPassenger()” and “displayPassengers(...)” to the above HTML so that clicking on the “Add To Passenger List” button appropriately stores information about the new passenger inside the JavaScript program, clicking on “Click here to display all current passengers” produces an alert message such as

[pic]

clicking on “Click here to display current child passengers” produces an alert message such as

[pic]

and clicking on “Click here to display current adult passengers” produces an alert message such as

[pic]

Attempting to add more than 10 passengers should result in an alert message such as

[pic]

You may also add any other JavaScript code or functions you want. Your program should store passenger names and details as properties of appropriate JavaScript objects.

Question 3

Without using predefined JavaScript array element-deleting or manipulating methods such as "concat()", "join()", "pop()", "push()", "reverse()", "shift()", "slice()", "sort()", "splice()", "toString()", "unshift()" or "valueOf()", add an extra "Delete From Passenger List" button to the web page of Question 2, which deletes the passenger described by the text box and radio buttons (if there is such a passenger) when clicked:

[pic]

Make sure:

• whether the HTML content is valid (i.e. validates using the

W3C HTML Validation Service),

• whether the programs work correctly,

• whether the programs are written in a good style (using meaningful variable names, making good use of data structures and functions where appropriate, etc.),

• whether the programs are set out in a clear way,

• whether the programs are sensibly commented.

................
................

In order to avoid copyright disputes, this page is only a partial summary.

Google Online Preview   Download