-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
135 lines (125 loc) · 5.5 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
<!DOCTYPE html>
<html ng-app="coinConvApp">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<title>Home - Coin Calculator</title>
<script src="assets/js/angular.min.js"></script>
<!-- include css files -->
<link href="assets/css/style.css" rel="stylesheet" type="text/css" />
<!-- HTML5 Shiv and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
<script src="assets/js/modernizr.min.js"></script>
</head>
<body class="upload-portal" ng-controller="myCoinConvCtrl">
<!-- Navigation Bar-->
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<a href="/index.html" class="navbar-brand">
<img src="assets/images/finance.png" alt="nsio" />
<p class="hidden-xs">Coin <br/>Calculator</p>
</a>
</div>
</div>
</div>
<div class="subnav hide-print">
<div class="page-container-responsive container">
<ul class="subnav-list">
<li>
<a href="#" class="active subnav-item">Home</a>
</li>
</ul>
</div>
</div>
<!-- End Navigation Bar-->
<div class="wrapper">
<div class="container body-content">
<div class="row">
<div class="col-md-12">
<h4 class=" text-center m-0 m-b-10"><span class="text-muted m-l-5">Discover the minimum number of sterling coins you can get from an amount</span></h4>
</div>
</div>
<hr />
<form ng-submit="calcMinCoin()" name="coinCalcForm" novalidate>
<div class="row">
<div class="col-xs-6 col-sm-6 col-md-6">
<div class="form-group pull-right xs-pull-none">
<input type="text" ng-model="amountValue" name="amountValue" placeholder="Amount..." class="form-control" ng-required="true">
<p>
<span data-ng-cloak class="error validationerror" ng-show="coinCalcForm.amountValue.$invalid && coinCalcForm.amountValue.$touched">Must be a valid number!<br/></span>
<span data-ng-cloak class="error validationerror" ng-show=" errorMsg">{{errorMsg}}<br/></span>
<span>Press 'Enter' key or click 'Submit' button to calculate</span>
</p>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-3">
<div class="form-group">
<button id="calcCoin" type="submit" class="btn btn-success btn-large" ng-disabled="coinCalcForm.$invalid"><i class="ti-plus m-r-5"></i>Submit</button>
</div>
</div>
</div>
</form>
<hr />
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="table-responsive">
<div id="coinResult">
<table class="table">
<thead>
<tr>
<th>Denomination</th>
<th>Number</th>
</tr>
</thead>
<tbody data-ng-cloak>
<tr ng-repeat="x in finalCoins">
<td>{{ x.denomination }}</td>
<td>{{ x.pennyCount }}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<!-- Footer -->
<footer class="footer text-right">
<div class="container">
<div class="row">
<div class="col-xs-6">
2017 © seunOdebunmi
</div>
<div class="col-xs-6">
<ul class="pull-right list-inline m-b-0">
<li>
<a href="#">About</a>
</li>
<li>
<a href="#">Help</a>
</li>
<li>
<a href="#">Contact</a>
</li>
</ul>
</div>
</div>
</div>
</footer>
<!-- End Footer -->
</div>
</div>
<!-- jQuery -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/controller/converter.js"></script>
</body>
</html>