layout of page improved and ordered ranking (#903)

This commit is contained in:
René Zubcevic 2020-11-27 13:58:58 +01:00 committed by GitHub
parent 574039902d
commit 6bee0f3fa6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 36 additions and 21 deletions

View File

@ -8,6 +8,7 @@ import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController; import org.springframework.web.bind.annotation.RestController;
import java.util.ArrayList; import java.util.ArrayList;
import java.util.Comparator;
import java.util.List; import java.util.List;
import java.util.stream.Collectors; import java.util.stream.Collectors;
@ -45,6 +46,15 @@ public class Scoreboard {
UserTracker userTracker = userTrackerRepository.findByUser(user.getUsername()); UserTracker userTracker = userTrackerRepository.findByUser(user.getUsername());
rankings.add(new Ranking(user.getUsername(), challengesSolved(userTracker))); rankings.add(new Ranking(user.getUsername(), challengesSolved(userTracker)));
} }
/* sort on number of captured flags to present an ordered ranking */
rankings.sort(new Comparator<Ranking>() {
@Override
public int compare(Ranking o1, Ranking o2) {
return o2.getFlagsCaptured().size() - o1.getFlagsCaptured().size();
}
});
return rankings; return rankings;
} }

View File

@ -1185,7 +1185,7 @@ div.scoreboard-username {
color: aliceblue; color: aliceblue;
padding: 4px; padding: 4px;
padding-left: 8px; padding-left: 8px;
font-size: x-large; font-size: medium;
border-radius: 6px; border-radius: 6px;
} }
@ -1203,7 +1203,7 @@ div.captured-flag {
background-color: #444; background-color: #444;
color: white; color: white;
padding: 4px; padding: 4px;
font-size: x-large; font-size: medium;
display: inline-block; display: inline-block;
} }
@ -1216,13 +1216,6 @@ div.captured-flag {
color: red color: red
} }
.appseceu-banner {
background: url('img/owasp_logo.jpg') no-repeat 0px 0px;
height: 117px;
width: 1268px;
margin-bottom: 20px;
}
#content { #content {
position: relative; position: relative;
} }

View File

@ -1,9 +1,7 @@
<div class="scoreboard-title">WebGoat Challenge</div>
<div class="appseceu-banner"></div>
<table class="scoreboard-table"> <table class="scoreboard-table">
<% _.each(rankings, function(userRanking, index) { %> <% _.each(rankings, function(userRanking, index) { %>
<tr> <tr>
<th class="username"> <div class="scoreboard-username"><%= index%> <%=userRanking.username %> </div></th> <th class="username"> <div class="scoreboard-username"><%= index+1%> - <%=userRanking.username %> </div></th>
<td class="user-flags"> <% _.each(userRanking.flagsCaptured, function(flag) { %> <td class="user-flags"> <% _.each(userRanking.flagsCaptured, function(flag) { %>
<div class="captured-flag"> <div class="captured-flag">

View File

@ -7,14 +7,6 @@
<meta http-equiv="Cache-Control" CONTENT="no-cache"/> <meta http-equiv="Cache-Control" CONTENT="no-cache"/>
<meta http-equiv="Cache-Control" CONTENT="no-store"/> <meta http-equiv="Cache-Control" CONTENT="no-store"/>
<!--[if lt IE 7]>
<id class="no-js lt-ie9 lt-ie8 lt-ie7"/> <![endif]-->
<!--[if IE 7]>
<id class="no-js lt-ie9 lt-ie8"/> <![endif]-->
<!--[if IE 8]>
<id class="no-js lt-ie9"/> <![endif]-->
<!--[if gt IE 8]><!-->
<!-- CSS --> <!-- CSS -->
<link rel="shortcut icon" th:href="@{/images/favicon.ico}" type="image/x-icon"/> <link rel="shortcut icon" th:href="@{/images/favicon.ico}" type="image/x-icon"/>
@ -28,13 +20,35 @@
<meta http-equiv="Content-Type" content="text/id; charset=ISO-8859-1"/> <meta http-equiv="Content-Type" content="text/id; charset=ISO-8859-1"/>
<title>WebGoat</title> <title>WebGoat</title>
</head> </head>
<body class="scoreboard-page"> <!-- <body class="scoreboard-page"> -->
<body>
<header id="header">
<!--logo start-->
<div class="brand">
<a th:href="@{/welcome.mvc}" class="logo"><span>Web</span>Goat</a>
</div>
<!--logo end-->
<div id="lesson-title-wrapper">
<h1 id="lesson-title">WebGoat challenges ranking</h1>
</div><!--lesson title end-->
<div class="user-nav pull-right" id="user-and-info-nav" style="margin-right: 75px;">
</div>
</header>
<section id="container">
<!--main content start-->
<section class="main-content-wrapper">
<section id="main-content">
<div id="scoreboard-wrapper"> <div id="scoreboard-wrapper">
<div id="scoreboard"> <div id="scoreboard">
<!-- will use _ template here --> <!-- will use _ template here -->
</div> </div>
</div> </div>
</section>
</section>
</section>
</body> </body>