engineering
/
staff-directory
3
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

Finally finished this, will add more content (cough @matthew)

merge-requests/1/head
Damian 2023-06-15 07:08:44 +00:00
parent 3529e44e7a
commit 33f37588c8
2 changed files with 86 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
index.html
View File

@ -1,46 +1,47 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en" data-bs-theme="dark">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="author" content="Damian Freeman" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Staff Directory</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet"> <title>Staff Directory</title>
<link href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/github-dark.min.css" rel="stylesheet">
<style> <link
body { rel="icon"
background-color: #181a1b; href="https://static.libraryofcode.org/library_of_code.png"
color: #eee; />
}
</style>
</head>
<body>
<div class="container-fluid">
<h1>
Staff Directory
</h1>
<table class="table" id="directory" style="color: white;"> <link
<thead> href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css"
<tr> rel="stylesheet"
<th scope="col">Name</th> integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM"
<th scope="col">Title/Department</th> crossorigin="anonymous"
<th scope="col">Email</th> />
</tr> </head>
</thead> <body>
<tbody> <div class="container-fluid">
</tbody> <table class="table" id="directory">
</table> <thead>
<tr>
<th scope="col">Name</th>
<th scope="col">Title/Department</th>
<th scope="col">Email</th>
</tr>
</thead>
<tbody></tbody>
</table>
<div id="loading" class="alert alert-info" role="alert" style="display: block;"> <div
Loading... | id="loading"
</div> class="alert alert-info"
role="alert"
<script src="./script.js"></script> style="display: block"
</div> >
</body> Loading... |
</div>
<script src="./script.js"></script>
</div>
</body>
</html> </html>

94
script.js
View File

@ -1,52 +1,48 @@
// Removed useless bits of code (async function () {
const fetched = await fetch("https://loc.sh/int/directory");
const data = await fetched.json();
const table = document.getElementById("directory");
(async function() { let completed = 0;
const fetched = await fetch('https://loc.sh/int/directory'); document.getElementById("loading").innerText += ` ${completed}/${
//const fetched = await fetch('http://localhost:3890/int/directory'); data.length - 1
const data = await fetched.json(); }`;
const table = document.getElementById('directory'); for (const info of data.sort((a, b) => a.name.localeCompare(b.name))) {
//const table2 = document.getElementById('roles'); completed++;
// users.sort((a, b) => a.firstname.localeCompare(b.firstname)) document.getElementById(
let completed = 0; "loading"
document.getElementById('loading').innerText += ` ${completed}/${data.length - 1}` ).innerText = `Loading... | ${completed}/${data.length}`;
for (const info of data.sort((a, b) => a.name.localeCompare(b.name))) { const fetched2 = await fetch(
completed++; `https://loc.sh/int/directory?id=${info.userID}`
document.getElementById('loading').innerText = `Loading... | ${completed}/${data.length}`; );
// console.log(info); const user = await fetched2.json();
const fetched2 = await fetch(`https://loc.sh/int/directory?id=${info.userID}`); if (!user.staff) continue;
//const fetched2 = await fetch(`http://localhost:3890/int/directory?id=${info.userID}`);
const user = await fetched2.json();
// console.log(user);
if (!user.staff) continue;
const row = table.insertRow();
//const row2 = table2.insertRow();
let name = `<strong>${user.username}</strong>`;
let pn = [];
row.insertCell().innerHTML = `<img src="${user.avatarURL}" alt="${user.username}" style="width:30px;height:30px;"> ${name} ${user.res.isManager ? ' [k]' : ''}`;
// row.insertCell().innerText = `${info.userID} | #${user.discriminator}`;
let departmentAndTitle = '';
if (info.title && info.dept) {
departmentAndTitle += `${info.title}, ${info.dept}`;
} else if (info.dept) {
departmentAndTitle += info.dept;
}
row.insertCell().innerText = departmentAndTitle;
row.insertCell().innerHTML = info.emailAddress ? `<a href="mailto:${info.emailAddress}">${info.emailAddress}</a> ` : '';
// row2.insertCell().innerHTML = `${name}`; const row = table.insertRow();
let rankings = '<ul>'; let name = `<strong>${user.username}</strong>`;
if (info.additionalRoles && info.additionalRoles.length > 0) { row.insertCell().innerHTML = `<img src="${user.avatarURL}" alt="${user.username}" style="width:30px;height:30px;"> ${name} ${info.isManager ? " [k]" : ""}`;
for (const rank of info.additionalRoles) {
rankings += `<li>${rank}</li>` let departmentAndTitle = "";
} if (info.title && info.dept) {
rankings += '</ul>'; departmentAndTitle += `${info.title}, ${info.dept}`;
} else { } else if (info.dept) {
rankings = ''; departmentAndTitle += info.dept;
}
// row2.insertCell().innerHTML = rankings;
} }
document.getElementById('loading').style.display = "none"; row.insertCell().innerText = departmentAndTitle;
document.getElementById('directory').style.display = "block"; row.insertCell().innerHTML = info.emailAddress
})(); ? `<a href="mailto:${info.emailAddress}">${info.emailAddress}</a> `
: "";
let rankings = "<ul>";
if (info.additionalRoles && info.additionalRoles.length > 0) {
for (const rank of info.additionalRoles) {
rankings += `<li>${rank}</li>`;
}
rankings += "</ul>";
} else {
rankings = "";
}
}
document.getElementById("loading").style.display = "none";
table.style.display = "block";
})();