Comp20_HW4/hotdog.html at master · tomvdon/Comp20_HW4 · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<!DOCTYPE html>
<html>
<head>
	<title>Joe's Hotdogs</title>
	<style type="text/css">
		div.form_wrap{
			margin:auto;
			width: 25%
		}
		form{
			display:flex;
			flex-direction: row;
			flex-wrap: wrap;
			width:100%;
			border: 2px solid #0000ff;

		}
		label{
			width: 50%;
			//border: 2px solid red;
			box-sizing: border-box;
			text-align: right;
			padding-right: 10px;
		}
		input[type=text]{
			width: 50%;
			//border:2px solid green;
			box-sizing: border-box;
		}
		input[type=button]{
			width: 100%;
		}
	</style>
	<script type="text/javascript">
		var prices = {Hotdog: 3.25, French_Fries: 2.00, Drink: 1.50};
		var quantity = {Hotdog: 0, French_Fries: 0, Drink: 0};
		function generateForm(array)
		{
			var form_data = "";
			for (var key in array)
			{
				 form_data += "<label for ='" + key + "''>" + key.replace("_", " ") + ": $" + array[key] + "</label>";
				 form_data += "<input type = text placeholder = Quantity name ='" + key + "'' id ='" + key + "''>";
			}
			form_data += "<input type = 'button' name= 'btn_order' value = 'Order' onclick=calcOrder() >"
			document.getElementById("form1").innerHTML = form_data;
		}
		function calcOrder()
		{
			var subtotal = 0;
			var total = 0;
			var discount = false;
			var discount_price = 0;
			var tax = 0;
			var alert_text="Items Bought: \n";
			for (var item in quantity)
			{
				quantity[item] = document.getElementById(item).value
				if (quantity[item] > 0)
				{
					alert_text += item.replace("_", " ") + " Quantity: " + quantity[item] + "\n";
				}
			}
			for (var key in prices)
			{
				subtotal += prices[key] * quantity[key];
			}
			if (subtotal >= 20)
			{
				discount = true;
				discount_price = .10 * subtotal;
			}
			tax = .0625 * (subtotal - discount_price);
			total = subtotal - discount_price + tax;
			alert_text +="Subtotal: $" + subtotal + "\n";
			if (discount){
				alert_text += "10% Discount: -$" + discount_price.toFixed(2) + "\n";
			}
			alert_text +="Tax: $" + tax.toFixed(2) + "\n" + "Total: $" + total.toFixed(2);
			alert(alert_text);


		}
	</script>
</head>
<body>
	<div class="form_wrap">
		<form id="form1">
		</form>
	</div>
<script type="text/javascript">
	generateForm(prices);
</script>
</body>
</html>