-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
72 lines (59 loc) · 2.62 KB
/
index.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<!-- (A) TITLE + CHARSET + DESCRIPTION -->
<title>To buy or Not to buy</title>
<meta charset="utf-8">
<meta name="description" content="a simple and straightforward purchase evaluator">
<!-- (B) VIEWPORT (ALLOW ZOOM IN, NOT OUT) -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.5">
<!-- (C) WEB APP MANIFEST -->
<!-- https://web.dev/add-manifest/ -->
<link rel="manifest" href="manifest.json">
<!-- (D) GOOD OLD FAVICON -->
<link rel="icon" href="favicon.png" type="image/png">
<!-- (E) ANDROID/CHROME -->
<meta name="mobile-web-app-capable" content="yes">
<meta name="theme-color" content="white">
<!-- (F) IOS APP ICON + MOBILE SAFARI -->
<link rel="apple-touch-icon" href="icon-512.png">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="Hello World">
<!-- (G) WINDOWS -->
<meta name="msapplication-TileImage" content="icon-512.png">
<meta name="msapplication-TileColor" content="#ffffff">
<!-- (H) STYLESHEET + JAVASCRIPT -->
<link rel="stylesheet" href="style.css">
<script defer src="main.js"></script>
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script> -->
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.7.1/chart.min.js"></script> --> <!-- Would need to update chart labels yAxes to y -->
<script src="Chart.min.js"></script>
<!-- Icon Photo by mohamed_hassan from PxHere: https://pxhere.com/en/photo/1446791?utm_content=clipUser&utm_medium=referral&utm_source=pxhere -->
</head>
<body onload="present()">
<h1>To buy or Not to buy</h1>
<p>a simple and straightforward purchase evaluator<br> (Cost/Use)</p>
<div class='data'>
<span id="price"></span>
<span id="period"></span>
<span id="uses"></span>
</div>
<div class='data'>
<div id='databutton'>
<button type="button" class='buttons' onClick="dataentry()">Enter Data</button>
</div>
<div id='calcbutton'>
<button type="button" class='buttons' onClick="calculations()">Calculate</button> <!--<hr>-->
</div>
</div>
<br>
<center><input type="button" value = "Restart" onclick="history.go(0)" /></center><br>
<!-- <center><input type="button" value = "Reset" onclick="resetpage()" /></center><br> -->
<div class='illustrations'>
<canvas id="costovertime" width="600" height="400"></canvas>
<br>
<canvas id="costperuse" width="600" height="400"></canvas>
</div>
</body>
</html>