rudi
/
disgord-Thanos
1
0
Fork 0
Code Issues Pull Requests Releases 1 Wiki Activity
Browse Source

Add Status page.

hkremer/rebranding
Gregory Rudolph 3 years ago
parent
86c95bb012
commit
3ddd84ae16
Signed by: rudi
GPG Key ID: EF64F3CBD1A1EBDD
3 changed files with 173 additions and 19 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 32
      static/app.js
  2. 154
      static/components.js
  3. 6
      static/index.html

32
static/app.js
Unescape View File

@ -12,6 +12,7 @@ var mode = new URLSearchParams(window.location.search).get("mode"); @@ -12,6 +12,7 @@ var mode = new URLSearchParams(window.location.search).get("mode");
const archiveLink = document.querySelector("#archive-link")
const pendingLink = document.querySelector("#pending-link")
const statusLink = document.querySelector("#status-link")
function handleForm(event) { event.preventDefault(); }
function main() {
archiveLink.classList.remove("active");
@ -20,7 +21,7 @@ function main() { @@ -20,7 +21,7 @@ function main() {
switch (mode) {
case "status":
statusLink.classList.add("active");
return;
return statusPage();
case "pending":
pendingLink.classList.add("active");
break;
@ -40,6 +41,34 @@ function main() { @@ -40,6 +41,34 @@ function main() {
}
function statusPage() {
document.getElementById("main-app").innerHTML = '';
fetch(`https://thanos.nightmare.haus/api/config`)
.then(response => response.json())
.then(data => {
var node = document.createElement("config-status");
var upTime = document.createElement("div");
upTime.setAttribute("slot", "uptime");
upTime.innerText = data.Uptime;
node.appendChild(upTime);
var bumpTime = document.createElement("div");
bumpTime.setAttribute("slot", "lastbump")
bumpTime.innerText = new Date(data.BumpTime).toLocaleString();
node.appendChild(bumpTime);
node.setData(data);
document.getElementById("main-app").appendChild(node);
});
}
function searchPage() {
var search = document.getElementById("search-bar");
fetch('https://thanos.nightmare.haus/api/verifications')
@ -115,7 +144,6 @@ window.onclick = function (event) { @@ -115,7 +144,6 @@ window.onclick = function (event) {
}
}
var form = document.getElementById("search-form");
function handleForm(event) { event.preventDefault(); }
form.addEventListener('submit', handleForm);
main();

154
static/components.js
Unescape View File

@ -1,6 +1,18 @@ @@ -1,6 +1,18 @@
const basicCard = document.createElement('basic-card');
basicCard.innerHTML = `
const configStatus = document.createElement('status');
const style = `
<style>
.column {
float: left;
width: 33.33%;
}
/* Clear floats after the columns */
.row:after {
content: "";
display: table;
clear: both;
}
p {
text-align: center;
}
@ -25,7 +37,22 @@ a { @@ -25,7 +37,22 @@ a {
.container {
padding: 6px 16px;
}
label{
display: inline;
float: left;
clear: left;
width: 250px;
text-align: left;
}
input {
display: inline;
float: right;
}
</style>
`;
basicCard.innerHTML = `
${style}
<div id="card-container" class="container">
<div class="card">
<h4><p><slot name="username" /></p></h4>
@ -38,6 +65,104 @@ a { @@ -38,6 +65,104 @@ a {
</div>
`;
configStatus.innerHTML = `
${style}
<div class="container">
<div class="row">
<div class="column">
<h4><p>Status</p></h4>
<p>Uptime: <slot name="uptime" /></p>
<p>Last Bump was <slot name="lastbump" /></p>
<p>by <slot id="lastbumper" name="lastbumper" /></p>
</div>
<div id="admin-stats" class="column">
<h4><p>Admin Stats</p></h4>
</div>
<div class="column">
<h4><p>Config</p></h4>
<form>
<label for="Guild">Guild: </label>
<input type="text" id="Guild" name="Guild" readonly/>
<label for="AdminChannel">Admin Channel: </label>
<input type="select" id="AdminChannel" name="AdminChannel"/>
<label for="AdminRole">Admin Role: </label>
<input type="select" id="AdminRole" name="AdminRole"/>
<label for="MonitorChannel">Monitor Channel: </label>
<input type="select" id="MonitorChannel" name="MonitorChannel"/>
<label for="MonitorRole">Monitor Role: </label>
<input type="select" id="MonitorRole" name="MonitorRole"/>
<label for="IntroChannel">Intro Channel: </label>
<input type="select" id="IntroChannel" name="IntroChannel"/>
<label for="VerifiedRole">Verified Role: </label>
<input type="select" id="VerifiedRole" name="VerifiedRole"/>
<label for="OutFile">Logging OutFile: </label>
<input type="text" id="OutFile" name="OutFile" />
<label for="KBTeam">KB Team: </label>
<input type="text" id="KBTeam" name="KBTeam" />
<label for="KBChann">KB Channel: </label>
<input type="text" id="KBChann" name="KBChann" />
<label for="level">Logging Level: </label>
<input type="number" id="Level" name="Level" />
<label for="ProgName">Program Name: </label>
<input type="text" id="ProgName" name="ProgName" />
<label for="UseStdout">Use stdout: </label>
<input type="checkbox" id="UseStdout" name="UseStdout"/>
<label for="submitchanges"></label>
<input style="width: 100%;" type="submit" id="submitchanges" name="submitchanges" onClick="alert('Post blocked.')">
</form>
</div>
</div>
`;
class ConfigStatusClass extends HTMLElement {
constructor() {
super();
this.attachShadow({ mode: 'open' });
this.shadowRoot.appendChild(configStatus.cloneNode(true));
}
async setData(data) {
this.shadowRoot.querySelector("#submitchanges").addEventListener('submit', handleForm);
this.shadowRoot.querySelector("#Guild").value = data.GuildID;
this.shadowRoot.querySelector("#AdminChannel").value = data.AdminChannel;
this.shadowRoot.querySelector("#AdminRole").value = data.AdminRole;
this.shadowRoot.querySelector("#MonitorChannel").value = data.MonitorChann;
this.shadowRoot.querySelector("#MonitorRole").value = data.MonitorRole;
this.shadowRoot.querySelector("#IntroChannel").value = data.IntroChann;
this.shadowRoot.querySelector("#VerifiedRole").value = data.VerifiedRole;
this.shadowRoot.querySelector("#OutFile").value = data.LogOpts.OutFile;
this.shadowRoot.querySelector("#KBTeam").value = data.LogOpts.KBTeam;
this.shadowRoot.querySelector("#KBChann").value = data.LogOpts.KBChann;
this.shadowRoot.querySelector("#Level").value = data.LogOpts.Level;
this.shadowRoot.querySelector("#ProgName").value = data.LogOpts.ProgName;
this.shadowRoot.querySelector("#UseStdout").checked = data.LogOpts.UseStdout == "true";
fetch('https://thanos.nightmare.haus/api/user?userID=' + data.LastBumper)
.then(response => response.json())
.then(userData => {
this.shadowRoot.querySelector("#lastbumper").innerHTML = userData.user.username;
});
this.loadStats(data.Stats)
}
async loadStats(data) {
var shadowRoot = this.shadowRoot;
Object.keys(data).forEach(function(uid) {
var score = data[uid];
fetch('https://thanos.nightmare.haus/api/user?userID=' + uid)
.then(response => response.json())
.then(userData => {
var stats = shadowRoot.querySelector("#admin-stats");
var userName = document.createElement("p");
userName.innerText = userData.user.username + ": " + score;
stats.appendChild(userName);
});
})
}
}
class UserCard extends HTMLElement {
constructor() {
@ -53,20 +178,21 @@ class UserCard extends HTMLElement { @@ -53,20 +178,21 @@ class UserCard extends HTMLElement {
const userID = this.shadowRoot.querySelector('#discord-id').assignedNodes()[0].textContent;
const userPic = this.shadowRoot.querySelector("#pic-link").assignedNodes()[0].querySelector("a").getAttribute("href");
fetch('https://thanos.nightmare.haus/api/user?userID=' + userID)
.then(response => response.json())
.then(data => {
if (data === undefined || data === null) {
alert("User not found.");
return;
}
document.querySelector("#myModal").style.display = "block";
document.querySelector('#modal-join').textContent = new Date(data.joined_at).toLocaleString();
document.querySelector('#modal-userID').textContent = data.user.username;
document.querySelector('#modal-avatar').src = `https://cdn.discordapp.com/avatars/${data.user.id}/${data.user.avatar}.png?size=256`;
document.querySelector('#modal-verification').src = userPic;
document.querySelector('#modal-verification').style = "max-height: 500px;";
});
.then(response => response.json())
.then(data => {
if (data === undefined || data === null) {
alert("User not found.");
return;
}
document.querySelector("#myModal").style.display = "block";
document.querySelector('#modal-join').textContent = new Date(data.joined_at).toLocaleString();
document.querySelector('#modal-userID').textContent = data.user.username;
document.querySelector('#modal-avatar').src = `https://cdn.discordapp.com/avatars/${data.user.id}/${data.user.avatar}.png?size=256`;
document.querySelector('#modal-verification').src = userPic;
document.querySelector('#modal-verification').style = "max-height: 500px;";
});
}
}
window.customElements.define('user-card', UserCard);
window.customElements.define('config-status', ConfigStatusClass);

6
static/index.html
Unescape View File

@ -16,7 +16,7 @@ @@ -16,7 +16,7 @@
<link href="https://getbootstrap.com/docs/4.0/examples/starter-template/starter-template.css" rel="stylesheet">
<!-- My imports -->
<link href="/static/index.css" rel="stylesheet">
<link href="./static/index.css" rel="stylesheet">
<!-- End of my imports -->
@ -75,8 +75,8 @@ @@ -75,8 +75,8 @@
</div>
<div id="main-app" style="display: flex; flex-wrap: wrap;">
</div>
<script src="/static/components.js"></script>
<script src="/static/app.js"></script>
<script src="./static/components.js"></script>
<script src="./static/app.js"></script>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->

Write Preview
Loading…
Cancel
Save