forked from kontur-courses/testing
-
Notifications
You must be signed in to change notification settings - Fork 0
/
leaderboard.html
62 lines (56 loc) · 1.83 KB
/
leaderboard.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
<html>
<head>
<script src="https://cdn.firebase.com/js/client/2.4.2/firebase.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/css/bootstrap.min.css">
<style>
.no{background-color: #FCC;}
.ok{background-color: #DFD;}
.over{background-color: #FFA;}
</style>
</head>
<body>
<div id="container" />
<script>
function buildDateKey() {
var now = new Date();
var day = ("0" + now.getDate()).slice(-2);
var month = ("0" + (now.getMonth() + 1)).slice(-2);
var year = now.getFullYear();
return year + month + day;
}
function createFirebase() {
var url = "https://testing-challenge.firebaseio.com";
var realm = "word-statistics";
var dateKey = buildDateKey();
return new Firebase(`${url}/${realm}/${dateKey}`);
}
console.log("hi!");
var fb = createFirebase();
fb.on("value", function(snapshot) {
var html = "<table class='table table-condensed'>";
html += "<tr>";
["Name", "C", "E", "CR", "E2", "E3", "E4", "L2", "L3", "L4", "O1", "O2", "O3", "O4", "123", "998", "999", "EN1", "EN2", "QWE", "STA"].forEach(
v => html += "<th>" + v + "</th>");
html += "</tr>";
var res = snapshot.val();
res = res ? res : [];
var names = Object.keys(res);
names.sort((a,b) => -countNonzero(res[a].implementations) + countNonzero(res[b].implementations));
names.forEach(function(name){
html += "<tr><td>" + name.replace("<", "").replace(">", "") + "</td>";
res[name].implementations.forEach(v => html += formatCell(v));
html += "</tr>";
});
html += "</table>";
document.getElementById("container").innerHTML = html;
});
function countNonzero(arr){
return arr.filter(v => v > 0).length;
}
function formatCell(v){
var clazz = v == 0 ? "no" : (v <= 3 ? "ok" : "over");
return "<td class='" + clazz + "'>" + v + "</td>";
}
</script>
</body>
</html>