dubey/WebGoat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Buying page also calculates the prices

Browse Source 
Product image added
This commit is contained in:
Nanne Baars 2018-05-29 12:47:27 +02:00
parent 589872ad47
commit e045bc692d
3 changed files with 55 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
webgoat-lessons/jwt/src/main/resources/html/JWT.html
View File

@ -111,7 +111,7 @@
<link rel="stylesheet" type="text/css" th:href="@{/lesson_css/jwt.css}"/> <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/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="attack-container">
<div class="assignment-success"><i class="fa fa-2 fa-check hidden" aria-hidden="true"></i></div> <div class="assignment-success"><i class="fa fa-2 fa-check hidden" aria-hidden="true"></i></div>
<form class="attack-form" accept-charset="UNKNOWN" <form class="attack-form" accept-charset="UNKNOWN"
@ -136,9 +136,11 @@
<tr> <tr>
<td class="col-sm-8 col-md-6"> <td class="col-sm-8 col-md-6">
<div class="media"> <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"> <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> <h5 class="media-heading"> by <a href="#">WebGoat Publishing</a></h5>
<span>Status: </span><span <span>Status: </span><span
class="text-success"><strong>In Stock</strong></span> class="text-success"><strong>In Stock</strong></span>
@ -148,8 +150,11 @@
<td class="col-sm-1 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="quantity1" value="3"></input> <input type="text" class="form-control" id="quantity1" value="3"></input>
</td> </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>$
<td class="col-sm-1 col-md-1 text-center"><strong>$14.61</strong></td> <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"> <td class="col-sm-1 col-md-1">
<button type="button" class="btn btn-danger"> <button type="button" class="btn btn-danger">
<span class="glyphicon glyphicon-remove"></span> Remove <span class="glyphicon glyphicon-remove"></span> Remove
@ -159,7 +164,9 @@
<tr> <tr>
<td class="col-md-6"> <td class="col-md-6">
<div class="media"> <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"> <div class="media-body">
<h4 class="media-heading"><a href="#">Pentesting for professionals</a></h4> <h4 class="media-heading"><a href="#">Pentesting for professionals</a></h4>
<h5 class="media-heading"> by <a href="#">WebWolf Publishing</a></h5> <h5 class="media-heading"> by <a href="#">WebWolf Publishing</a></h5>
@ -167,11 +174,12 @@
</div> </div>
</div> </div>
</td> </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> <input type="text" class="form-control" id="quantity2" value="2"></input>
</td> </td>
<td class="col-md-1 text-center"><strong>$4.99</strong></td> <td class="col-sm-1 col-md-1 text-center"><strong>$<span id="piecePrice2">4.99</span></strong>
<td class="col-md-1 text-center"><strong>$9.98</strong></td> </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"> <td class="col-md-1">
<button type="button" class="btn btn-danger"> <button type="button" class="btn btn-danger">
<span class="glyphicon glyphicon-remove"></span> Remove <span class="glyphicon glyphicon-remove"></span> Remove
@ -186,8 +194,8 @@
<td>  </td> <td>  </td>
<td><h5>Subtotal<br></br>Estimated shipping</h5> <td><h5>Subtotal<br></br>Estimated shipping</h5>
<h3>Total</h3></td> <h3>Total</h3></td>
<td class="text-right"><h5><strong>$24.59<br></br>$6.94</strong></h5> <td class="text-right"><h5><strong>$<span id="subtotalJwt">24.59</span><br></br>$6.94</strong></h5>
<h3>$31.53</h3></td> <h3>$<span id="totalJwt">31.53</span></h3></td>
</tr> </tr>
<tr> <tr>
<td>  </td> <td>  </td>

BIN
webgoat-lessons/jwt/src/main/resources/images/product-icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.5 KiB

36
webgoat-lessons/jwt/src/main/resources/js/jwt-buy.js Normal file
View File

@ -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));
}