Course: INFO-1272

Project: Optional Lab– Restaurant Order

Due Date: Sunday December 3 11:59 PM Please
Submitting: see the last page for instructions.
Professor: Alex Cooper

How will my project be marked?

Marks What are the Marks Awarded For? Mark

Available Assigned
1 A title and adequate instructions are displayed and all output is neat and
well organized without spelling or grammatical errors

2 Arrays are properly used to store the descriptions and prices for the
items in each sub-menu

2 The sub-menus containing descriptions and prices are displayed using

reasonable styling

4 “Complete Order” button is set up with a proper event handler which will
summarize the order

2 “Clear Order” erases the order summary (div) and resets all the text
boxes to the default of 1.
2 Total bill (price) is correctly calculated and displayed using the required
format.

1 Web page is submitted as a zip file

1 Good coding style including proper indentation and use of variable and
function naming conventions and suitable comments

15 Total

Problem Description
You’re opening a new restaurant, but your limited budget doesn’t allow you to purchase any point-of-
sale software to automate the order processing and billing. Fortunately, you still have the skills you
learned at Fanshawe College and you decide to use them to write your own web application. The app
will allow each diner to select various items from the menu and then calculate the total amount of the
bill.

Create a single HTML page using the editor of your choice. Name this page using the following
template: your first name followed by an underscore and then RestaurantOrder.html. For example,
Jim_RestaurantOrder.html. The web page should do the following:

1. Display a title

2. Create and populate eight arrays, two for each sub-menu.

©2017 Fanshawe College Page 1 of 6 INFO-1232, Fall 2017

 There will be four sub-menus: appetizers, entrées, desserts and beverages. For each
sub-menu you will create a string array of the item descriptions and a number array to hold
the prices for each item. For example, if the 4th item in the descriptions array is “Garden
Salad”, then the price for this should be the 4th item in the corresponding prices array.

The sub-menu descriptions and prices should be EXACTLY as follows:

Appetizer Sub-Menu Entrée Sub-Menu
# Description Price # Description Price
1 No selection $0.00 1 No selection $0.00
2 Deep Fried Calamari $7.50 2 Rib-Steak $15.95
3 Soup du Jour $4.99 3 Fettuccini Alfredo $11.25
4 Garden Salad $3.99 4 Pan-Fried Sole $17.95
5 Garlic Bread $4.50 5 Mediterranean Platter $13.50
6 Vegetarian Lasagna $9.00
Dessert Sub-Menu Beverage Sub-Menu
# Description Price # Description Price
1 No selection $0.00 1 No selection $0.00
2 Ice Cream Sundae $2.95 2 Water $0.00
3 Cheesecake $5.00 3 Juice $2.00
4 Chocolate Truffle Cake $6.00 4 Pop $2.00
5 Raspberry Mousse $4.50 5 Milk $2.00
6 Coffee $1.75
7 Tea $1.75
3. Declare and initialize a variable to hold the total bill for all the food ordered by the diner. This
will be used like a running total as food items are selected.

4. You will need to create the user interface using a combination of divs, text boxes and buttons
etc. (see the sample screen captures on the next page). Notice that all text boxes use a
default value of 1.

5. Use 4 divs to display each of the sub-menu items and prices. For each sub-menu, you’ll have
a text box where the user can enter the number of the item selected.

6. When all 4 items have been entered, the user will press the “Complete Order” button and
you’ll use the numbers entered to extract the descriptions and prices from the relevant arrays
to allow you to display a summary of the order along with the total price. Don’t include any
“No selection” values in your summary.

7. The results of the “Complete Order” processing should be output to a div at the bottom of the
page (see sample output).

8. It’s also important that you check the value of each item number entered to ensure that it’s
valid for the particular sub-menu.

9. When you display the total price for all the food ordered, don’t add tax or a tip.

10. All prices and the amount of the final bill should be displayed in standard dollars and cents
format like $9.99 with exactly two decimal places.

11. Finally, you must also include a button labelled “Clear Order” which will erase the current
order and reset all input boxes to the default (1).

©2022Fanshawe College Page 2 of 6 INFO-1272, Fall 2022

Sample Output:

Page 3 of 6
Page 4 of 6
Page 5 of 6
How should I submit my project?

Electronic Submission:
Submit your program files to the "optional lab" dropbox in FanshaweOnline. Your
file(s) must be submitted as a single “zip” file. If you complete this lab and
receive a higher grade than your lowest lab mark, it will replace your lowest
lab mark.

Submit your own work!

It is considered cheating to submit work done by another student or from another
source. Helping another student cheat by sharing your work with them is also not
tolerated. Students are encouraged to share ideas and to work together on practice
exercises, but any code or documentation prepared for a project must be done by
the individual student. Penalties for cheating or helping another student cheat may
include being assigned zero on the project with even more severe penalties if you
are caught cheating more than once. Just submit your own work and benefit from
having made the effort on your own.

Page 6 of 6