PLEASE HELP WITH HTMLJAVASCRIPT Youve been hired by Beverage

PLEASE HELP WITH HTML/JAVASCRIPT!

You\'ve been hired by Beverage Buzzards to write a web page that serves as a cash register database and stores sales for the business. Beverage Buzzards sells coffee of the following types and sizes:

l-light

b-blend

d-dark

s-small

$2.00

$2.50

$2.75

m-medium

$2.80

$3.00

$3.20

l-large

$3.60

$3.85

$4.00

The sales will be stored in a two-dimensional array. The array should be defined with space for up to ten sales. Information stored for each sale includes:

Sale ID

Coffee type (single letter)

Coffee size (single letter)

Sale subtotal

Sale tax

Sale total

Therefore, you need a 10x6 array.  The array should be declared script-level, outside any function, so that its information is retained while the web page is open. You do not need to code any array-resizing logic. Provide the following controls for the interface:

Sale ID (label and read-only text box) – shows the ID for the current sale. Use 1000 as the starting sale ID.

Coffee type (label and text box) – the type of coffee ordered. The only acceptable codes are l(light), b (blend), and d (dark). Print an alert message if any other code is entered.

Coffee size (label and text box) – the size of coffee ordered. The only acceptable codes are s (small), m (medium), and l (large). Print an alert message if any other code is entered.

A Totals button to perform the following:

ü Verify the coffee type entered.

ü Verify the coffee size entered.

ü Calculate and display the subtotal based on the coffee type and size.

ü Calculate and display the sales tax (subtotal * 0.06).

ü Calculate and display the total (subtotal + sales tax).

ü Store information about the sale in the sales array.

Subtotal (label and read-only text box) – the amount of the sale before sales tax.

Sales tax (label and read-only text box) – the sales tax.

Total (label and read-only text box) – the total cost of the sale.

A New button that starts a new sale with a unique Sale ID.  Store the Sale ID in the sales array.

A Prev button that shows the previous sale. If pressed from the oldest sale, show the newest sale (wrap around).

A Next button that shows the next sale. If pressed from the newest sale, show the oldest sale (wrap around).

A Reset button to clear all information about the current sale, except the Sale ID.

Sales count (label and read-only text box) – the current number of sales.

Also include these elements:

A page header with a title.

A page footer with the company name and an e-mail link.

Insure that labels and text boxes are aligned in columns. Connect the web page to a .CSS style sheet containing specifications for each category of control used in the page (body, p, inputs, etc.).  Place JavaScript in the HTML page.

	l-light	b-blend	d-dark
s-small	$2.00	$2.50	$2.75
m-medium	$2.80	$3.00	$3.20
l-large	$3.60	$3.85	$4.00

Solution

<table name= \"Beverages buzzards\" width = \"450px\">

<tr>

<td valign=\"top\">

  <label for=\"size\"></label>

</td>

<td valign=\"top\">

  <label for = \"light\"> light </label>

</td>

<td align =\"top\">

<label for = \" blend\"> blend < /label>

</td>

<td align = \"top\">

<label for = \"dark\"> dark </label>

</td>

</tr>

<tr>

<td valign=\"top\">

  <label for=\"size\">small</label>

</td>

<td >

  <label for = \"price\"> $2.0 </label>

</td>

<td align =\"top\">

<label for = \"price\"> $2.50< /label>

</td>

<td>

<label for=\"price\" > $2.75 </label>

</tr>

<tr>

<td valign=\"top\">

  <label for=\"size\">medium</label>

</td>

<td >

  <label for = \"price\"> $2.80 </label>

</td>

<td align =\"top\">

<label for = \"price\"> $3.0< /label>

</td>

<td>

<label for = \"price\"> $3.2 </label>

</td>

</tr>

<tr>

<td valign=\"top\">

  <label for=\"size\">large</label>

</td>

<td >

  <label for = \"price\"> $3.60 </label>

</td>

<td align =\"top\">

<label for = \"price\"> $3.85< /label>

</td>

<td>

<label for = \"price\"> $4.0 </label>

</td>

</tr>

</table>

<form name=\"coffee\" Onsubmit= return coffee validation > // create a form for to get a order from use//

<table width=\"450px\">

<body onload=\"beveragages.sales.coffeetype.focus();\">

</tr>

<tr>

<td valign=\"top\">

  <label for=\"cofeetype\"> cofeetype: </label>

</td>

<td valign=\"top\">

  <input type=\"text\" name=\"coffeetype\" size=\"10\">

</td>

</tr>

<tr>

<td >

  <label for=\"coffeesize\">coffeesize</label>

</td>

<td >

  <input type=\"text\" name=\"coffeesize\" maxlength=\"5\" size=\"3\">

</td>

</tr>

<tr>

<td >

  <label for=\"subtotal\" Onclick= return subtotal()>

</label>

</td>

</tr>

<tr>

<td valign=\"top\">

  <label for=\"Tax\">Tax</label>

</td>

<td valign=\"top\">

<label for=\"Tax\"> Subtotal * 0.06</label>

</td>

</tr>

<tr>

<td valign=\"top\">

  <label for=\"total\">Total</label>

</td>

<tr>

<td valign=\"top\">

  <label for=\"total\" Onclick = return total()>

</label>

</td>

</tr>

<tr>

<td colspan=\"2\" style=\"text-align:center\">

  <input type=\"submit\" value=\"Placeorder\">

<script source=\"beveragesbuzzards.js\" ></script>

</td>

</tr>

</table>

</form>

java script validation script to get the coffee type:

function (coffeesize)  

{  

ctype =string;

if (ctype != string)

{  

alert(\"Enter a valid type \");  

coffeetype.focus();  

return false;  

}  

return true;  

}

Repeat the same script for each case of validation