@ -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 : 6 px 16 px ;
}
label {
display : inline ;
float : left ;
clear : left ;
width : 250 px ;
text - align : left ;
}
input {
display : inline ;
float : right ;
}
< / s t y l e >
` ;
basicCard . innerHTML = `
$ { style }
< div id = "card-container" class = "container" >
< div class = "card" >
< h4 > < p > < slot name = "username" / > < / p > < / h 4 >
@ -38,6 +65,104 @@ a {
@@ -38,6 +65,104 @@ a {
< / d i v >
` ;
configStatus . innerHTML = `
$ { style }
< div class = "container" >
< div class = "row" >
< div class = "column" >
< h4 > < p > Status < / p > < / h 4 >
< p > Uptime : < slot name = "uptime" / > < / p >
< p > Last Bump was < slot name = "lastbump" / > < / p >
< p > by < slot id = "lastbumper" name = "lastbumper" / > < / p >
< / d i v >
< div id = "admin-stats" class = "column" >
< h4 > < p > Admin Stats < / p > < / h 4 >
< / d i v >
< div class = "column" >
< h4 > < p > Config < / p > < / h 4 >
< form >
< label for = "Guild" > Guild : < / l a b e l >
< input type = "text" id = "Guild" name = "Guild" readonly / >
< label for = "AdminChannel" > Admin Channel : < / l a b e l >
< input type = "select" id = "AdminChannel" name = "AdminChannel" / >
< label for = "AdminRole" > Admin Role : < / l a b e l >
< input type = "select" id = "AdminRole" name = "AdminRole" / >
< label for = "MonitorChannel" > Monitor Channel : < / l a b e l >
< input type = "select" id = "MonitorChannel" name = "MonitorChannel" / >
< label for = "MonitorRole" > Monitor Role : < / l a b e l >
< input type = "select" id = "MonitorRole" name = "MonitorRole" / >
< label for = "IntroChannel" > Intro Channel : < / l a b e l >
< input type = "select" id = "IntroChannel" name = "IntroChannel" / >
< label for = "VerifiedRole" > Verified Role : < / l a b e l >
< input type = "select" id = "VerifiedRole" name = "VerifiedRole" / >
< label for = "OutFile" > Logging OutFile : < / l a b e l >
< input type = "text" id = "OutFile" name = "OutFile" / >
< label for = "KBTeam" > KB Team : < / l a b e l >
< input type = "text" id = "KBTeam" name = "KBTeam" / >
< label for = "KBChann" > KB Channel : < / l a b e l >
< input type = "text" id = "KBChann" name = "KBChann" / >
< label for = "level" > Logging Level : < / l a b e l >
< input type = "number" id = "Level" name = "Level" / >
< label for = "ProgName" > Program Name : < / l a b e l >
< input type = "text" id = "ProgName" name = "ProgName" / >
< label for = "UseStdout" > Use stdout : < / l a b e l >
< input type = "checkbox" id = "UseStdout" name = "UseStdout" / >
< label for = "submitchanges" > < / l a b e l >
< input style = "width: 100%;" type = "submit" id = "submitchanges" name = "submitchanges" onClick = "alert('Post blocked.')" >
< / f o r m >
< / d i v >
< / d i v >
` ;
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 ) ;