Finally finished this, will add more content (cough @matthew)
parent
3529e44e7a
commit
33f37588c8
79
index.html
79
index.html
|
@ -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>
|
<title>Staff Directory</title>
|
||||||
|
|
||||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
<link
|
||||||
<link href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/github-dark.min.css" rel="stylesheet">
|
rel="icon"
|
||||||
|
href="https://static.libraryofcode.org/library_of_code.png"
|
||||||
|
/>
|
||||||
|
|
||||||
<style>
|
<link
|
||||||
body {
|
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css"
|
||||||
background-color: #181a1b;
|
rel="stylesheet"
|
||||||
color: #eee;
|
integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM"
|
||||||
}
|
crossorigin="anonymous"
|
||||||
</style>
|
/>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
<h1>
|
<table class="table" id="directory">
|
||||||
Staff Directory
|
<thead>
|
||||||
</h1>
|
<tr>
|
||||||
|
<th scope="col">Name</th>
|
||||||
|
<th scope="col">Title/Department</th>
|
||||||
|
<th scope="col">Email</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody></tbody>
|
||||||
|
</table>
|
||||||
|
|
||||||
<table class="table" id="directory" style="color: white;">
|
<div
|
||||||
<thead>
|
id="loading"
|
||||||
<tr>
|
class="alert alert-info"
|
||||||
<th scope="col">Name</th>
|
role="alert"
|
||||||
<th scope="col">Title/Department</th>
|
style="display: block"
|
||||||
<th scope="col">Email</th>
|
>
|
||||||
</tr>
|
Loading... |
|
||||||
</thead>
|
</div>
|
||||||
<tbody>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
<div id="loading" class="alert alert-info" role="alert" style="display: block;">
|
<script src="./script.js"></script>
|
||||||
Loading... |
|
</div>
|
||||||
</div>
|
</body>
|
||||||
|
|
||||||
<script src="./script.js"></script>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
|
|
90
script.js
90
script.js
|
@ -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]' : ''}`;
|
const row = table.insertRow();
|
||||||
// row.insertCell().innerText = `${info.userID} | #${user.discriminator}`;
|
let name = `<strong>${user.username}</strong>`;
|
||||||
let departmentAndTitle = '';
|
row.insertCell().innerHTML = `<img src="${user.avatarURL}" alt="${user.username}" style="width:30px;height:30px;"> ${name} ${info.isManager ? " [k]" : ""}`;
|
||||||
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}`;
|
let departmentAndTitle = "";
|
||||||
let rankings = '<ul>';
|
if (info.title && info.dept) {
|
||||||
if (info.additionalRoles && info.additionalRoles.length > 0) {
|
departmentAndTitle += `${info.title}, ${info.dept}`;
|
||||||
for (const rank of info.additionalRoles) {
|
} else if (info.dept) {
|
||||||
rankings += `<li>${rank}</li>`
|
departmentAndTitle += info.dept;
|
||||||
}
|
|
||||||
rankings += '</ul>';
|
|
||||||
} else {
|
|
||||||
rankings = '';
|
|
||||||
}
|
|
||||||
// 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";
|
||||||
|
})();
|
||||||
|
|
Loading…
Reference in New Issue