-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
145 lines (145 loc) · 4.88 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
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
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
<html lang="en">
<head>
<title>Option Pricer</title>
<link rel="stylesheet" href="css/index.css">
<link rel="icon" type="image/png" href="img/icon.png">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<a name="top"></a>
<div class="full-width" id="top_bar">
<div id="header">
<div id="title">Option Pricer</div>
</div>
</div>
<div class="full-width" id="body">
<form>
<div class="option">
<input type="radio" name="optionType" class="switch" value="eu" data-show="European" checked>
<input type="radio" name="optionType" class="switch" value="ga" data-show="Geometric Asian">
<input type="radio" name="optionType" class="switch" value="aa" data-show="Arithmetic Asian">
<input type="radio" name="optionType" class="switch" value="am" data-show="American">
<input type="radio" name="optionType" class="switch" value="vo" data-show="Volatility">
</div>
<div data-show="eu,ga,aa,am,vo" data-show-calc="true" data-calc-type="1">
<em>Spot Price</em>
<div class="field">
<div class="unit" data-position="left">$</div>
<input name="spotPrice" pattern="\d+(\.\d+)?" required>
</div>
</div>
<div data-show="eu,ga,aa,am">
<em>Volatility</em>
<div class="field">
<input name="volatility" pattern="\d+(\.\d+)?" required>
<div class="unit" data-position="right">%</div>
</div>
</div>
<div data-show="eu,ga,aa,am,vo">
<em>Risk-free Interest Rate</em>
<div class="field">
<input name="interestRate" pattern="\d+(\.\d+)?" required>
<div class="unit" data-position="right">%</div>
</div class="field">
</div>
<div data-show="vo">
<em>Repo Rate</em>
<div class="field">
<input name="repoRate" pattern="\d+(\.\d+)?" required>
<div class="unit" data-position="right">%</div>
</div>
</div>
<div data-show="eu,ga,aa,am,vo" data-show-calc="true" data-calc-type="2">
<em>Time to Maturity</em>
<div class="field">
<input name="maturity" pattern="\d+(\.\d+)?" required>
<div class="unit" data-position="right">years</div>
</div>
</div>
<div data-show="eu,ga,aa,am,vo" data-show-calc="true" data-calc-type="1">
<em>Strike Price</em>
<div class="field">
<div class="unit" data-position="left">$</div>
<input name="strikePrice" pattern="\d+(\.\d+)?" required>
</div>
</div>
<div data-show="ga,aa,am">
<em>Number of Steps/Observations</em>
<div class="field">
<input name="steps" pattern="\d+" required>
</div>
</div>
<div data-show="aa">
<em>Number of Paths</em>
<div class="field">
<input name="paths" pattern="\d+" required>
</div>
</div>
<div data-show="vo">
<em>Option Premium</em>
<div class="field">
<div class="unit" data-position="left">$</div>
<input name="premium" pattern="\d+(\.\d+)?" required>
</div>
</div>
<div data-show="aa">
<em>Control Variate</em>
<div class="field">
<input type="radio" name="control" class="switch" value="0" data-show="No" checked>
<input type="radio" name="control" class="switch" value="1" data-show="Yes">
</div>
</div>
<div data-show="eu,ga,aa,am,vo">
<em>Option Type</em>
<div class="field">
<input type="radio" name="call" class="switch" value="1" data-show="Call" checked>
<input type="radio" name="call" class="switch" value="0" data-show="Put">
</div>
</div>
<button>Calculate</button>
</form>
<form class="sub-calc" data-calc-type="1">
<div class="close">×</div>
<input name="target" class="hidden">
<div>
<em>Stock Price</em>
<div class="field">
<input name="stockPrice" pattern="\d+(\.\d+)?" required>
</div>
</div>
<div data-show="eu,ga,aa,am">
<em>Redemption Rate</em>
<div class="field">
<input name="redemptionRate" pattern="\d+(\.\d+)?" required>
<div class="unit" data-position="right">:1</div>
</div>
</div>
<button>Calculate</button>
</form>
<form class="sub-calc" data-calc-type="2">
<div class="close">×</div>
<input name="target" class="hidden">
<div>
<em>Maturity Date</em>
<div class="field">
<input name="maturityDate" pattern="\d{4}-\d{2}-\d{2}" required>
</div>
</div>
<button>Calculate</button>
</form>
<div id="result">
<em>Result</em>
<div>$xxxx</div>
</div>
</div>
<div class="footer2">
<div class="full-width">
Copyright © 2020 Ng Koon Hang (3035101554) | All rights reserved.
</div>
</div>
</body>
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/main.js"></script>
<script src="js/calc.js"></script>
</html>