120 lines
3.3 KiB
Plaintext
120 lines
3.3 KiB
Plaintext
<style>
|
|
.members {
|
|
width: 230px;
|
|
}
|
|
|
|
h2 {
|
|
font: 350 35px/1.5 Helvetica, Verdana, sans-serif;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
ul {
|
|
list-style-type: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
li {
|
|
font: 200 20px/1.5 Helvetica, Verdana, sans-serif;
|
|
border-bottom: 1px solid #ccc;
|
|
}
|
|
|
|
li:last-child {
|
|
border: none;
|
|
}
|
|
|
|
li a {
|
|
text-decoration: none;
|
|
color: #000;
|
|
display: block;
|
|
width: 200px;
|
|
|
|
-webkit-transition: font-size 0.3s ease, background-color 0.3s ease;
|
|
-moz-transition: font-size 0.3s ease, background-color 0.3s ease;
|
|
-o-transition: font-size 0.3s ease, background-color 0.3s ease;
|
|
-ms-transition: font-size 0.3s ease, background-color 0.3s ease;
|
|
transition: font-size 0.3s ease, background-color 0.3s ease;
|
|
}
|
|
|
|
li a:hover {
|
|
font-size: 30px;
|
|
background: #f6f6f6;
|
|
}
|
|
</style>
|
|
<h1 class="mt-4">Teacher Dashboard</h1>
|
|
<p class="lead mb-3">Welcome <%= user.name %></p>
|
|
<br>
|
|
<a href="/users/logout" class="btn btn-secondary">Logout</a>
|
|
<br>
|
|
<h2>Site Members</h2>
|
|
<div class='members'>
|
|
<ul>
|
|
<% members.forEach(function (member) { %>
|
|
<li><button class='btn btn-link mt-2' onclick='openProfile("<%= member.id %>")'><%= member.name %></button></li>
|
|
<div style='display: none;' data-role='page' id='<%= member._id %>'>
|
|
<p class="lead mb-3"><%= member.name %></p>
|
|
<p class='lead mb-3'><%= member.email %></p>
|
|
<br>
|
|
<div>
|
|
<p id='userRank'></p>
|
|
<p>XP: <%= member.xp %></p>
|
|
<p><%= member.role %></p>
|
|
</div>
|
|
<br>
|
|
<script>
|
|
let xp = <%= member.xp %>;
|
|
let currRank;
|
|
|
|
let ranks = [
|
|
{"Digital Noob": 0}, // index 0
|
|
{"Digital Novice": 48}, // index 1
|
|
{"Digital Novice II": 100}, // index 2
|
|
{"Digital Amature": 148}, // index 3
|
|
{"Digital Amature II": 200}, // index 4
|
|
{"Digital Apprentice": 248}, // index 5
|
|
{"Digital Apprentice II": 300}, // index 6
|
|
{"Digital Journeyman": 396}, // index 7
|
|
{"Digital Journeyman II": 476}, // index 8
|
|
{"Digital Journeyman III": 532}, // index 9
|
|
{"Digital Crafter": 580}, // index 10
|
|
{"Expert Digital Crafter": 648}, // index 11
|
|
{"Master Digital Crafter": 800} // index 12
|
|
]
|
|
|
|
// Get current rank
|
|
let indexes = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 12]
|
|
if (xp < 800) {
|
|
for(var i = 0; i < ranks.length; i++) {
|
|
for (let rank in ranks[i]) {
|
|
let nextIndex = indexes[i];
|
|
for (let nextRank in ranks[nextIndex]) {
|
|
if (xp >= ranks[i][rank] && xp < ranks[nextIndex][nextRank]) {
|
|
currRank = rank;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
} else {
|
|
currRank = "Master Digital Crafter";
|
|
}
|
|
|
|
//Show Data
|
|
document.getElementById('userRank').innerHTML = currRank;
|
|
|
|
</script>
|
|
</div>
|
|
<% }) %>
|
|
</ul>
|
|
</div>
|
|
<script>
|
|
function openProfile(id) {
|
|
let state = document.getElementById(id).style.display;
|
|
if (state == "block") {
|
|
document.getElementById(id).style.display = 'none';
|
|
} else {
|
|
document.getElementById(id).style.display = 'block';
|
|
}
|
|
}
|
|
</script>
|