Skip to content

Commit 3d382ff

Browse files
SysSn13SysSn13
committed
add dynamic background-color for delta
1 parent bfbb395 commit 3d382ff

File tree

5 files changed

+53
-50
lines changed

5 files changed

+53
-50
lines changed

‎public/stylesheets/main.css

+2-2
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ body {
1919
text-align: center;
2020
text-decoration: none;
2121
letter-spacing: .06em;
22-
background-color: #1890ff;
22+
background-color: #337ab7;
2323
padding: 0.5em 5em 0.4em 5em;
2424
text-shadow: 0 0 0.75em #444;
2525
box-shadow: 0 0 0.5em rgba(0, 0, 0, 0.5);
@@ -81,5 +81,5 @@ a {
8181
.btn-primary:active {
8282
background-color: #337ab7 !important;
8383
border-color: #337ab7 !important;
84-
box-shadow: 0 0 0 0.25rem rgb(102 151 193) !important;
84+
box-shadow: 0 0 0 0.25rem #e9edf1 !important;
8585
}

‎routes/index.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ router.get("/", async (req, res) => {
1717
}
1818
});
1919

20-
router.get("/contests/:contestSlug/ranking/:page", rankingsController.get);
21-
router.post("/contests/:contestSlug/ranking/search", rankingsController.search);
20+
router.get("/contest/:contestSlug/ranking/:page", rankingsController.get);
21+
router.post("/contest/:contestSlug/ranking/search", rankingsController.search);
2222

2323
module.exports = router;

‎views/index.ejs

+1-1
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222
<tr>
2323
<td>
2424
<% if (contest.rankings_fetched) { %>
25-
<a href="/contests/<%= contest._id %>/ranking/1" style="text-decoration:none"><%= contest._id %></a>
25+
<a href="/contest/<%= contest._id %>/ranking/1" style="text-decoration:none"><%= contest._id %></a>
2626
<% } else {%>
2727
<%= contest._id %>
2828
<% } %>

‎views/layouts/layout.ejs

+1-1
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
<body>
1616
<div class="container" style="overflow-x: hidden;"">
1717
<div>
18-
<a id=" forkMe" target="_blank" href="https://github.com/SysSn13/leetcode-rating-predictor/">Fork me on
18+
<a id="forkMe" target="_blank" href="https://github.com/SysSn13/leetcode-rating-predictor/">Fork me on
1919
GitHub</a>
2020
</div>
2121
<%- body %>

‎views/ranking.ejs

+47-44
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<a href="/" class="btn btn-primary btn-md mt-3" role="button">All Contests</a>
55
<h2 class="mb-5 mt-3" style="text-align: center;">Ranking of <strong><%= contest.title || contest._id %> </strong>
66
</h2>
7-
<form action="/contests/<%= contest._id %>/ranking/search" method='POST'>
7+
<form action="/contest/<%= contest._id %>/ranking/search" method='POST'>
88
<div class="mb-3">
99
<input type="text" class="form-control" id="user" name="user" placeholder="Get a contestant by username">
1010
<button type="submit" class="btn btn-primary mt-3 mb-3">Search</button>
@@ -15,15 +15,15 @@
1515
<ul class="pagination flex-wrap">
1616
<% if (page>1) { %>
1717
<li class="page-item">
18-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= page - 1 %>" tabindex="-1">
18+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= page - 1 %>" tabindex="-1">
1919
<<</a> </li> <li class="page-item"><a class="page-link"
20-
href="/contests/<%= contest._id %>/ranking/1">1</a></li>
20+
href="/contest/<%= contest._id %>/ranking/1">1</a></li>
2121
2222
<% } %>
2323
<% if (page===3) { %>
2424
2525
<li class="page-item">
26-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= page - 1 %>"
26+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= page - 1 %>"
2727
tabindex="-1"><%= page - 1 %></a>
2828
</li>
2929
@@ -33,33 +33,33 @@
3333
<a class="page-link" style="pointer-events: none;" tabindex="-1">..</a>
3434
</li>
3535
<li class="page-item">
36-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= page - 2 %>"
36+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= page - 2 %>"
3737
tabindex="-1"><%= page - 2 %></a>
3838
</li>
3939
<li class="page-item">
40-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= page - 1 %>"
40+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= page - 1 %>"
4141
tabindex="-1"><%= page - 1 %></a>
4242
</li>
4343
4444
4545
<% } %>
4646
<li class="page-item active">
47-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= page%>"><%= page %> <span
47+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= page%>"><%= page %> <span
4848
class="sr-only">(current)</span></a>
4949
</li>
5050
<% if (page===totalPages-2) { %>
5151
<li class="page-item">
52-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= parseInt(page) + 1 %>"
52+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= parseInt(page) + 1 %>"
5353
tabindex="-1"><%= parseInt(page) + 1 %></a>
5454
</li>
5555
<% } %>
5656
<% if (page<totalPages-2) { %>
5757
<li class="page-item">
58-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= parseInt(page) + 1 %>"
58+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= parseInt(page) + 1 %>"
5959
tabindex="-1"><%= parseInt(page) + 1 %></a>
6060
</li>
6161
<li class="page-item">
62-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= parseInt(page) + 2 %>"
62+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= parseInt(page) + 2 %>"
6363
tabindex="-1"><%= parseInt(page) + 2 %></a>
6464
</li>
6565
<li class="page-item">
@@ -69,9 +69,9 @@
6969
<% if (page<totalPages) { %>
7070
7171
<li class="page-item"><a class="page-link"
72-
href="/contests/<%= contest._id %>/ranking/<%= totalPages %> "><%= totalPages %> </a></li>
72+
href="/contest/<%= contest._id %>/ranking/<%= totalPages %> "><%= totalPages %> </a></li>
7373
<li class="page-item">
74-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= page + 1 %>" tabindex="-1">>></a>
74+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= page + 1 %>" tabindex="-1">>></a>
7575
</li>
7676
<% } %>
7777
@@ -80,45 +80,48 @@
8080
<% } %>
8181
</nav>
8282
<div class="table-responsive-lg">
83-
<table class="table table-hover table-striped table-fixed">
83+
<table class="table table-hover table-striped table-fixed ">
8484
<thead>
8585
<tr>
8686
<th>#</th>
87-
<th>Rank</th>
88-
<th>Name</th>
89-
<th>Rating</th>
90-
<th>Δ</th>
91-
<th>Country Name</th>
87+
<th class="pl-3">Username</th>
88+
<th class="text-center">Rank</th>
89+
90+
<th class="text-center">Previous rating</th>
91+
<th class="text-center">Expected new rating</th>
92+
<th class="text-center">Δ</th>
93+
<th class="text-center">Country Name</th>
9294
</tr>
9395
</thead>
9496
<tbody>
9597
<% if (contest.rankings) { %>
9698
<% for( let i = 0; i < contest.rankings.length; i++ ) { %>
9799
<tr>
98100
<td><%= i+1 %> </td>
99-
<td><%= contest.rankings[i].rank %> </td>
100101
<td><a target="_blank"
101102
href="
102-
<% if (contest.rankings[i].data_region==="CN") {%>
103-
<%="https://leetcode-cn.com/"%><% } else { %><%="https://leetcode.com/"%><% }%><%=contest.rankings[i]._id%>"><%= contest.rankings[i]._id %>
103+
<% if (contest.rankings[i].data_region==="CN") {%>
104+
<%="https://leetcode-cn.com/"%><% } else { %><%="https://leetcode.com/"%><% }%><%=contest.rankings[i]._id%>"><%= contest.rankings[i]._id %>
104105
</a></td>
106+
<td class="text-center"><%= contest.rankings[i].rank %> </td>
105107
<% if ( contest.rankings[i].current_rating && contest.rankings[i].current_rating != -1) { %>
106-
<td><%= Math.round(contest.rankings[i].current_rating*100)/100 %> </td>
108+
<td class="text-center"><%= Math.round(contest.rankings[i].current_rating*100)/100 %> </td>
109+
<td class="text-center">
110+
<%= Math.round((contest.rankings[i].current_rating+contest.rankings[i].delta)*100)/100 %></td>
107111
<% } else { %>
108-
<td>?</td>
112+
<td class="text-center">?</td>
113+
<td class="text-center">?</td>
109114
<% } %>
110-
<% if ( contest.rankings[i].delta) { %>
111-
<td class="
112-
<% if (contest.rankings[i].delta>0) { %> text-success
113-
<% } else { %>
114-
text-danger
115-
<% } %>
116-
"><%= Math.round(contest.rankings[i].delta*100)/100 %> </td>
115+
<% if ( contest.rankings[i].delta != undefined) { %>
116+
<td class="text-center"
117+
style="background-color:<%= contest.rankings[i].delta>0?`rgb(0,255,0,${(Math.min(150,contest.rankings[i].delta))/150})`:`rgb(255,0,0,${Math.min(150,-contest.rankings[i].delta)/150})` %> ">
118+
<%= (contest.rankings[i].delta>0? "+":"") + Math.round(contest.rankings[i].delta*100)/100 %>
119+
</td>
117120
<% } else { %>
118-
<td>?</td>
121+
<td class="text-center">?</td>
119122
<% } %>
120123
121-
<td><%= contest.rankings[i].country_name %> </td>
124+
<td class="text-center"><%= contest.rankings[i].country_name %> </td>
122125
</tr>
123126
<% } %>
124127
<% } %>
@@ -142,15 +145,15 @@
142145
<ul class="pagination flex-wrap">
143146
<% if (page>1) { %>
144147
<li class="page-item">
145-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= page - 1 %>" tabindex="-1">
148+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= page - 1 %>" tabindex="-1">
146149
<<</a> </li> <li class="page-item"><a class="page-link"
147-
href="/contests/<%= contest._id %>/ranking/1">1</a></li>
150+
href="/contest/<%= contest._id %>/ranking/1">1</a></li>
148151
149152
<% } %>
150153
<% if (page===3) { %>
151154
152155
<li class="page-item">
153-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= page - 1 %>"
156+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= page - 1 %>"
154157
tabindex="-1"><%= page - 1 %></a>
155158
</li>
156159
@@ -161,33 +164,33 @@
161164
<a class="page-link" style="pointer-events: none;" tabindex="-1">..</a>
162165
</li>
163166
<li class="page-item">
164-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= page - 2 %>"
167+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= page - 2 %>"
165168
tabindex="-1"><%= page - 2 %></a>
166169
</li>
167170
<li class="page-item">
168-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= page - 1 %>"
171+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= page - 1 %>"
169172
tabindex="-1"><%= page - 1 %></a>
170173
</li>
171174
172175
173176
<% } %>
174177
<li class="page-item active">
175-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= page%>"><%= page %> <span
178+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= page%>"><%= page %> <span
176179
class="sr-only">(current)</span></a>
177180
</li>
178181
<% if (page===totalPages-2) { %>
179182
<li class="page-item">
180-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= parseInt(page) + 1 %>"
183+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= parseInt(page) + 1 %>"
181184
tabindex="-1"><%= parseInt(page) + 1 %></a>
182185
</li>
183186
<% } %>
184187
<% if (page<totalPages-2) { %>
185188
<li class="page-item">
186-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= parseInt(page) + 1 %>"
189+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= parseInt(page) + 1 %>"
187190
tabindex="-1"><%= parseInt(page) + 1 %></a>
188191
</li>
189192
<li class="page-item">
190-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= parseInt(page) + 2 %>"
193+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= parseInt(page) + 2 %>"
191194
tabindex="-1"><%= parseInt(page) + 2 %></a>
192195
</li>
193196
<li class="page-item">
@@ -197,14 +200,14 @@
197200
<% if (page<totalPages) { %>
198201
199202
<li class="page-item"><a class="page-link"
200-
href="/contests/<%= contest._id %>/ranking/<%= totalPages %> "><%= totalPages %> </a></li>
203+
href="/contest/<%= contest._id %>/ranking/<%= totalPages %> "><%= totalPages %> </a></li>
201204
<li class="page-item">
202-
<a class="page-link" href="/contests/<%= contest._id %>/ranking/<%= page + 1 %>" tabindex="-1">>></a>
205+
<a class="page-link" href="/contest/<%= contest._id %>/ranking/<%= page + 1 %>" tabindex="-1">>></a>
203206
</li>
204207
<% } %>
205208
</ul>
206209
<% } else { %>
207-
<a href="/contests/<%=contest._id%>/ranking/1" class="btn btn-primary btn-md" role="button">All Rankings</a>
210+
<a href="/contest/<%=contest._id%>/ranking/1" class="btn btn-primary btn-md" role="button">All Rankings</a>
208211
<% } %>
209212
</nav>
210213

0 commit comments

Comments
 (0)