Skip to content

Commit

Permalink
Buying page also calculates the prices
Browse files Browse the repository at this point in the history
Product image added
  • Loading branch information
nbaars committed May 29, 2018
1 parent 589872a commit e045bc6
Show file tree
Hide file tree
Showing 3 changed files with 55 additions and 11 deletions.
30 changes: 19 additions & 11 deletions webgoat-lessons/jwt/src/main/resources/html/JWT.html
Original file line number Diff line number Diff line change
Expand Up @@ -111,7 +111,7 @@ <h3>Vote for your favorite</h3>

<link rel="stylesheet" type="text/css" th:href="@{/lesson_css/jwt.css}"/>
<script th:src="@{/lesson_js/bootstrap.min.js}" language="JavaScript"></script>
<script th:src="@{/lesson_js/jwt-refresh.js}" language="JavaScript"></script>
<script th:src="@{/lesson_js/jwt-buy.js}" language="JavaScript"></script>
<div class="attack-container">
<div class="assignment-success"><i class="fa fa-2 fa-check hidden" aria-hidden="true"></i></div>
<form class="attack-form" accept-charset="UNKNOWN"
Expand All @@ -136,9 +136,11 @@ <h3>Vote for your favorite</h3>
<tr>
<td class="col-sm-8 col-md-6">
<div class="media">
<img class="media-object" src="http://icons.iconarchive.com/icons/custom-icon-design/flatastic-2/72/product-icon.png" style="width: 72px; height: 72px;"></img>
<img class="media-object" th:src="@{/images/product-icon.png}"
style="width: 72px; height: 72px;"></img>
<div class="media-body">
<h4 class="media-heading"><a href="#">Learn defending your application with WebGoat</a></h4>
<h4 class="media-heading"><a href="#">Learn to defend your application with
WebGoat</a></h4>
<h5 class="media-heading"> by <a href="#">WebGoat Publishing</a></h5>
<span>Status: </span><span
class="text-success"><strong>In Stock</strong></span>
Expand All @@ -148,8 +150,11 @@ <h5 class="media-heading"> by <a href="#">WebGoat Publishing</a></h5>
<td class="col-sm-1 col-md-1" style="text-align: center">
<input type="text" class="form-control" id="quantity1" value="3"></input>
</td>
<td class="col-sm-1 col-md-1 text-center"><strong>$4.87</strong></td>
<td class="col-sm-1 col-md-1 text-center"><strong>$14.61</strong></td>
<td class="col-sm-1 col-md-1 text-center"><strong>$
<span id="piecePrice1">4.87</span></strong>
</td>
<td class="col-sm-1 col-md-1 text-center"><strong>$<span
id="totalPrice1">14.61</span></strong></td>
<td class="col-sm-1 col-md-1">
<button type="button" class="btn btn-danger">
<span class="glyphicon glyphicon-remove"></span> Remove
Expand All @@ -159,19 +164,22 @@ <h5 class="media-heading"> by <a href="#">WebGoat Publishing</a></h5>
<tr>
<td class="col-md-6">
<div class="media">
<img class="media-object" src="http://icons.iconarchive.com/icons/custom-icon-design/flatastic-2/72/product-icon.png" style="width: 72px; height: 72px;"></img>
<img class="media-object"
th:src="@{/images/product-icon.png}"
style="width: 72px; height: 72px;"></img>
<div class="media-body">
<h4 class="media-heading"><a href="#">Pentesting for professionals</a></h4>
<h5 class="media-heading"> by <a href="#">WebWolf Publishing</a></h5>
<span>Status: </span><span class="text-warning"><strong>Leaves warehouse in 2 - 3 weeks</strong></span>
</div>
</div>
</td>
<td class="col-md-1" style="text-align: center">
<td class="col-sm-1 col-md-1" style="text-align: center">
<input type="text" class="form-control" id="quantity2" value="2"></input>
</td>
<td class="col-md-1 text-center"><strong>$4.99</strong></td>
<td class="col-md-1 text-center"><strong>$9.98</strong></td>
<td class="col-sm-1 col-md-1 text-center"><strong>$<span id="piecePrice2">4.99</span></strong>
</td>
<td class="col-sm-1 col-md-1 text-center"><strong>$<span id="totalPrice2">9.98</span></strong></td>
<td class="col-md-1">
<button type="button" class="btn btn-danger">
<span class="glyphicon glyphicon-remove"></span> Remove
Expand All @@ -186,8 +194,8 @@ <h5 class="media-heading"> by <a href="#">WebWolf Publishing</a></h5>
<td>  </td>
<td><h5>Subtotal<br></br>Estimated shipping</h5>
<h3>Total</h3></td>
<td class="text-right"><h5><strong>$24.59<br></br>$6.94</strong></h5>
<h3>$31.53</h3></td>
<td class="text-right"><h5><strong>$<span id="subtotalJwt">24.59</span><br></br>$6.94</strong></h5>
<h3>$<span id="totalJwt">31.53</span></h3></td>
</tr>
<tr>
<td>  </td>
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
36 changes: 36 additions & 0 deletions webgoat-lessons/jwt/src/main/resources/js/jwt-buy.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
$(document).ready(function () {
$("#quantity1").on("blur", function () {
var quantity = $("#quantity1").val();
if (!$.isNumeric(quantity) || quantity < 0) {
$("#quantity1").val("1");
quantity = 1;
}
var piecePrice = $("#piecePrice1").text();
$('#totalPrice1').text((quantity * piecePrice).toFixed(2));
updateTotal();
});
$("#quantity2").on("blur", function () {
var quantity = $("#quantity2").val();
if (!$.isNumeric(quantity) || quantity < 0) {
$("#quantity2").val("1");
quantity = 1;
}
var piecePrice = $("#piecePrice2").text();
$('#totalPrice2').text((quantity * piecePrice).toFixed(2));
updateTotal();
})
})

function updateTotal() {
var price1 = parseFloat($('#totalPrice1').text());
var price2 = parseFloat($('#totalPrice2').text());
var subTotal = price1 + price2;
$('#subtotalJwt').text(subTotal.toFixed(2));
var total = subTotal + 6.94;
$('#totalJwt').text(total.toFixed(2));


}



0 comments on commit e045bc6

Please sign in to comment.