2022-07-24 08:49:29 +03:00
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "UTF-8" >
< meta http-equiv = "X-UA-Compatible" content = "IE=edge" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< title > Selmer Bot Web Dashboard< / title >
< link rel = "shortcut icon" href = "https://github.com/ION606/selmer-bot-website/blob/main/assets/favicon.ico" type = "image/x-icon" >
< script src = "https://kit.fontawesome.com/728e740903.js" crossorigin = "anonymous" > < / script >
2022-07-27 11:28:50 +03:00
< link href = "https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel = "stylesheet" >
< script src = "https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js" > < / script >
< script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js" > < / script >
< link rel = "preconnect" href = "https://fonts.googleapis.com" >
< link rel = "preconnect" href = "https://fonts.gstatic.com" crossorigin >
< link href = "https://fonts.googleapis.com/css2?family=Cinzel&family=Rajdhani:wght@300&family=Share+Tech+Mono&display=swap" rel = "stylesheet" >
2022-07-24 08:49:29 +03:00
< style >
html { width : 100 % ; height : 100 % ; margin : 0 ; padding : 0 ; }
body {
/* background-color: rgb(4, 4, 85); */
background-color : rgb ( 41 , 42 , 48 ) ;
width : 100 % ; height : 100 % ; margin : 0 ; padding : 0 ;
}
/* .dropdown a:hover { background-color: #ddd; } */
. show { display : block ; }
. hide { display : none ; }
. loadingscreen {
height : 90 vh ;
background-color : bisque ;
z-index : 100 ;
}
. navbar {
2022-07-27 11:28:50 +03:00
background-color : rgb ( 0 , 0 , 0 ) ;
/* height: 50px;
2022-07-24 08:49:29 +03:00
border-width: 1px;
2022-07-27 11:28:50 +03:00
border-style: double; */
2022-07-24 08:49:29 +03:00
}
2022-07-27 11:28:50 +03:00
. navbar . nav-item {
margin-right : 25 px ;
margin-left : 25 px ;
}
2022-07-24 08:49:29 +03:00
# right {
float : right ;
margin-right : 50 px ;
}
. box {
font-size : 20 px ;
2022-07-27 11:28:50 +03:00
height : 40 px ;
2022-07-24 08:49:29 +03:00
width : auto ;
margin-bottom : 15 px ;
2022-07-27 11:28:50 +03:00
padding : 3 px ;
2022-07-24 08:49:29 +03:00
border : 1 px solid black ;
clear : both ;
align-content : center ;
2022-07-27 11:28:50 +03:00
margin-right : 30 px ;
margin-left : 30 px ;
2022-07-24 08:49:29 +03:00
}
. statusdiv {
border-style : dashed ;
border-color : rgb ( 247 , 189 , 0 ) ;
2022-07-27 11:28:50 +03:00
width : 140 px ;
height : 120 px ;
2022-07-24 08:49:29 +03:00
margin-top : 20 px ;
float : right ;
margin-right : 50 px ;
text-align : center ;
}
. saved {
background-color : rgb ( 11 , 184 , 11 ) ;
}
. saving {
background-color : orange ;
}
. failed {
background-color : red ;
}
. buttonsmainbar {
background-color : green ;
width : 200 px ;
2022-07-27 11:28:50 +03:00
height : 60 px ;
2022-07-24 08:49:29 +03:00
}
. btnmain {
background-color : rgb ( 0 , 0 , 0 ) ;
}
. sidebar {
background-color : #42424b ;
width : 11 % ;
position : fixed ;
2022-07-27 11:28:50 +03:00
top : 75 px ;
2022-07-24 08:49:29 +03:00
bottom : 0 ;
display : flex ;
flex-wrap : wrap ;
border : 0 px ;
border-right : 2 px ;
border-color : black ;
border-style : solid ;
}
. wc {
align-content : center ;
align-self : center ;
color : white ;
font-family : 'Gill Sans' , 'Gill Sans MT' , Calibri , 'Trebuchet MS' , sans-serif ;
letter-spacing : 1 px ;
}
. lg {
align-content : center ;
align-self : center ;
color : white ;
font-family : 'Gill Sans' , 'Gill Sans MT' , Calibri , 'Trebuchet MS' , sans-serif ;
letter-spacing : 1 px ;
}
2022-07-27 15:34:38 +03:00
. form-select {
width : 200 px ;
background-color : rgb ( 187 , 183 , 183 ) ;
border-color : #000000 ;
}
2022-07-27 11:28:50 +03:00
< / style >
2022-07-24 08:49:29 +03:00
2022-07-27 11:28:50 +03:00
<!-- Buttons -->
< style >
. jumpButton {
/* color: #ffffff; */
font-size : 15 px ;
border : 1 px solid #000000 ;
width : 200 px ;
height : 40 px ;
cursor : pointer ;
align-self : center ;
background-color : rgb ( 2 , 2 , 192 ) ;
}
. jumpButton : hover {
color : #2d63c8 ;
/* background-color: #ffffff; */
}
/* SUBMIT BUTTON START */
. submitButton {
2022-07-24 08:49:29 +03:00
position : relative ;
background-color : black ;
border-radius : 4 em ;
font-size : 16 px ;
color : white ;
padding : 0.8 em 1.8 em ;
cursor : pointer ;
user-select : none ;
text-align : center ;
text-decoration : none ;
cursor : pointer ;
transition-duration : 0.4 s ;
-webkit- transition-duration : 0.4 s ; /* Safari */
}
. submitButton : hover {
transition-duration : 0.1 s ;
background-color : #3A3A3A ;
}
. submitButton : after {
content : "" ;
display : block ;
position : absolute ;
border-radius : 4 em ;
left : 0 ;
top : 0 ;
width : 100 % ;
height : 100 % ;
opacity : 0 ;
transition : all 0.5 s ;
box-shadow : 0 0 10 px 40 px white ;
}
. submitButton : active : after {
box-shadow : 0 0 0 0 white ;
position : absolute ;
border-radius : 4 em ;
left : 0 ;
top : 0 ;
opacity : 1 ;
transition : 0 s ;
}
. submitButton : active {
top : 1 px ;
}
/* SUBMIT BUTTON END */
. logoutbtn {
margin-top : 14 px ;
scale : 1.7 ;
}
. logoutbtn : hover {
cursor : pointer ;
color : red ;
}
2022-07-27 11:28:50 +03:00
# sevradio br {
margin-top : 10 px ;
}
. btnside {
color : #ffffff ;
background-color : #42424b ;
font-size : 19 px ;
/* border: 2px solid #000000; */
outline : none ;
border : none ;
width : 100 % ;
height : 50 px ;
cursor : pointer ;
}
2022-07-24 08:49:29 +03:00
2022-07-27 11:28:50 +03:00
. btnside : hover {
color : #ffffff ;
background-color : #377aea ;
}
2022-07-31 14:02:17 +03:00
. helpbtn {
margin-top : 30 px ;
margin-bottom : 30 px ;
font-size : 20 px ;
align-self : right ;
padding : 0 px ;
border-radius : 50 % ;
border-style : solid ;
}
2022-07-27 11:28:50 +03:00
< / style >
2022-07-24 08:49:29 +03:00
< script >
//Maybe pre-load the channels in the server into local storage for accessing when chosing the welcome/logging channels?
window . onload = ( ) => {
var serverSettings = JSON . parse ( window . localStorage . getItem ( 'serverInfo' ) ) ;
2022-07-31 14:02:17 +03:00
//Load the channels
2022-07-24 08:49:29 +03:00
var xhr = new XMLHttpRequest ( ) ;
2022-07-31 14:24:02 +03:00
xhr . open ( 'get' , ` http://www.selmerbot.com/getChannels/ ` , true ) ;
2022-07-24 08:49:29 +03:00
xhr . setRequestHeader ( 'Content-Type' , 'application/x-www-form-urlencoded; charset=UTF-8' ) ;
xhr . setRequestHeader ( 'serverNumber' , serverSettings . Id ) ;
xhr . onloadend = ( e ) => {
2022-07-27 15:34:38 +03:00
//Channel Section
const channels = JSON . parse ( xhr . response ) ;
// console.log(channels.text);
// window.localStorage.setItem('channels', (xhr.response));
for ( let i = 0 ; i < channels . text . length ; i ++ ) {
var channel = channels . text [ i ] ;
if ( channel . name && channel . id ) {
2022-07-27 16:15:40 +03:00
var optlog = document . createElement ( 'option' ) ;
optlog . value = channel . id ;
optlog . innerHTML = channel . name ;
//I need two because if I try to append the same one, it only appends to one dorpdown
var optwelcome = document . createElement ( 'option' ) ;
optwelcome . value = channel . id ;
optwelcome . innerHTML = channel . name ;
if ( serverSettings . WELCOME . welcomechannel == optwelcome . value ) {
optwelcome . setAttribute ( 'selected' , '' ) ;
}
if ( serverSettings . LOG . logchannel == optlog . value ) {
optlog . setAttribute ( 'selected' , '' ) ;
// optlog.selected = serverSettings.LOG.logchannel;
}
document . getElementById ( 'logchanneldropdown' ) . appendChild ( optlog ) ;
document . getElementById ( 'welcomechanneldropdown' ) . appendChild ( optwelcome ) ;
2022-07-27 15:34:38 +03:00
}
}
// document.getElementById('body').classList.replace('hide', 'show');
2022-07-24 08:49:29 +03:00
//Welcome section
let wc = serverSettings . WELCOME . welcomechannel || '' ;
let wm = serverSettings . WELCOME . welcomemessage || '' ;
2022-07-27 16:15:40 +03:00
// document.getElementById('wc').setAttribute('value', wc);
2022-07-24 08:49:29 +03:00
document . getElementById ( 'wm' ) . setAttribute ( 'value' , wm ) ;
//Logging section ,"LOG":{"_id":"LOG","keepLogs":false,"logchannel":null,"severity":0}}
let kl = serverSettings . LOG . keepLogs || false ;
let lc = serverSettings . LOG . logchannel || '' ;
let ls = serverSettings . LOG . severity || 0 ;
document . getElementById ( 'kl' ) . checked = kl ;
2022-07-27 16:15:40 +03:00
// document.getElementById('lc').setAttribute('value', lc);
2022-07-24 08:49:29 +03:00
// document.getElementById('ls').children[ls].checked = true; //Doesn't work
}
xhr . send ( ) ;
2022-07-31 14:24:02 +03:00
2022-07-24 08:49:29 +03:00
}
function logout ( ) {
window . localStorage . clear ( ) ;
window . location . href = 'index.html' ;
}
< / script >
< script >
function loadWelcomePage ( ) {
document . getElementById ( 'welcome' ) . classList . replace ( 'hide' , 'show' ) ;
}
function loadLoggingPage ( ) {
document . getElementById ( 'log' ) . classList . replace ( 'hide' , 'show' ) ;
}
function divChange ( c1 ) {
// document.getElementById("mainDropdown").classList.toggle("show");
var divchildren = document . getElementById ( 'inputs' ) . children ;
//Hide the divs we don't need
for ( let i = 0 ; i < divchildren . length ; i ++ ) {
var d2 = document . getElementById ( divchildren [ i ] . id ) ;
if ( ! d2 . classList . contains ( 'hide' ) ) { d2 . classList . add ( 'hide' ) ; }
}
//Show the div we want
var d1 = document . getElementById ( c1 ) ;
d1 . classList . toggle ( "hide" ) ;
}
function sendData ( event , inp ) {
event . preventDefault ( ) ;
//Change saving status
var b = document . getElementById ( 'savstat' ) ;
b . classList . replace ( 'saved' , 'saving' ) ;
b . innerText = 'SAVING' ;
var serverSettings = JSON . parse ( window . localStorage . getItem ( 'serverInfo' ) ) ;
if ( inp . inp == 'logs' ) {
const ls = document . getElementsByName ( 'ls' ) ;
var sevname = '' ;
for ( i in ls ) {
if ( ls [ i ] . checked ) { sevname = ls [ i ] . id . substring ( 3 ) ; }
}
const sevlist = [ 'none' , 'low' , 'meduim' , 'high' ]
serverSettings . LOG . severity = sevlist . indexOf ( sevname ) ;
2022-07-27 15:34:38 +03:00
serverSettings . LOG . logchannel = document . getElementById ( 'logchanneldropdown' ) . value || null ;
2022-07-24 08:49:29 +03:00
let kl = false ;
if ( document . getElementById ( 'kl' ) . checked ) {
kl = true ;
}
serverSettings . LOG . keepLogs = kl ;
} else {
2022-07-27 16:15:40 +03:00
serverSettings . WELCOME . welcomechannel = document . getElementById ( 'welcomechanneldropdown' ) . value || null ;
serverSettings . WELCOME . welcomemessage = document . getElementById ( 'wm' ) . value || null ;
2022-07-24 08:49:29 +03:00
}
//Send the data to the server
var xhr = new XMLHttpRequest ( ) ;
2022-07-31 14:24:02 +03:00
xhr . open ( 'post' , 'http://www.selmerbot.com/sendData/' , true ) ;
2022-07-24 08:49:29 +03:00
xhr . setRequestHeader ( 'Content-Type' , 'application/x-www-form-urlencoded; charset=UTF-8' ) ;
xhr . setRequestHeader ( 'serverSettings' , JSON . stringify ( serverSettings ) ) ;
xhr . onloadend = ( e ) => {
if ( xhr . response == 'DONE' ) {
b . classList . replace ( 'saving' , 'saved' ) ;
b . innerText = 'SAVED' ;
window . localStorage . setItem ( 'serverInfo' , JSON . stringify ( serverSettings ) ) ;
} else {
b . classList . replace ( 'saving' , 'failed' ) ;
b . innerText = 'FAILED' ;
}
}
xhr . send ( JSON . stringify ( serverSettings ) ) ;
}
< / script >
< / head >
2022-07-27 11:28:50 +03:00
< body >
< nav class = "navbar navbar-expand-sm navbar-fixed-top" >
< div class = "container-fluid mx-auto" >
< a class = "navbar-brand" href = "index.html" >
< img src = "https://github.com/ION606/selmer-bot-website/blob/main/assets/Selmer-icon.png?raw=true" alt = "Selmer Icon" style = "width: 50px;" >
< / a >
<!-- <li class="nav - item">
<a href="index.html" style="color: white" class="nav - link"><i class="fa - solid fa - house - chimney", alt="Home" style="scale: 2;"></i></a>
</li> -->
< ul class = "navbar-nav" >
< li class = "nav-item" >
< a href = "myGuilds.html" id = "guildslink" class = "nav-link" > < i class = "fa-solid fa-server" alt = "Servers" style = "scale: 2; color: rgb(11, 189, 189);" > < / i > < / a >
< / li >
< li class = "nav-item" >
< a href = "https://github.com/ION606/selmerBot/wiki" target = "_blank" class = "nav-link" > < i class = "fa-solid fa-book" style = "scale: 2; color: white;" alt = "WIKI" > < / i > < / a >
< / li >
< li class = "nav-item" >
< a href = "premium.html" class = "nav-link" > < i class = "fa-solid fa-crown" style = "scale: 2; color: gold;" alt = "PREMIUM" > < / i > < / a >
< / li >
< / ul >
<!-- <button type="button" class="btn btn - primary" data - bs - toggle="tooltip" title="Hooray!">Hover over me!</button> -->
< div class = "container" style = "font-family: 'Rajdhani', sans-serif; color: white;" > < h1 > Selmer Bot Web Dashboard< / h1 > < / div >
< span class = "ms-auto" style = "margin-right: 1%;" >
< button onclick = "logout()" id = "logoutbtn" class = "logoutbtn" style = "display: none;" > < i class = "fa-solid fa-arrow-right-from-bracket" alt = "Log Out" > < / i > < / button >
< button onclick = "window.location = getAPIRedirect()" id = "loginbtn" class = "loginbtn" > < i class = "fa-solid fa-arrow-right-from-bracket" alt = "Log In" > < / i > < / button >
2022-07-24 08:49:29 +03:00
< / span >
< / div >
2022-07-27 11:28:50 +03:00
< / nav >
2022-07-24 08:49:29 +03:00
< div class = "statusdiv" >
2022-07-27 11:28:50 +03:00
< h2 style = "color: white; margin-bottom: 10px; margin-top: 10px;" > STATUS< / h2 >
2022-07-24 08:49:29 +03:00
< div id = "savstat" class = "box saved" > SAVED< / div >
< / div >
< div class = "sidebar" >
< div id = "buttons" class = "buttonsmainbar" >
< button onclick = "divChange('welcome')" class = "btnside" > Welcome< / button >
< button onclick = "divChange('log')" class = "btnside" > Logging< / button >
< / div >
< / div >
2022-07-31 14:02:17 +03:00
2022-07-24 08:49:29 +03:00
<!-- EVERYTHING NOT SIDEBAR -->
< div style = "margin-left:15%" >
< div id = "inputs" >
< div id = "welcome" , class = "hide wc" style = "margin-top: 20px;" >
2022-07-31 14:02:17 +03:00
< button class = "helpbtn" onclick = "alert('Use {sn} to insert the server name, {un} to insert the user name, and {ut} to insert the user tag\nExample: Welcome to {sn} Sir {un}#{ut}')" > < img src = "https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fwww.downloadclipart.net%2Flarge%2F45627-icon-with-question-mark-clipart.png&f=1&nofb=1" style = "width: 50px; border-radius: 50%; border-style: solid;" > < / button >
2022-07-24 08:49:29 +03:00
< form >
< label for = "wc" > Welcome Channel Name:< / label >
2022-07-31 14:02:17 +03:00
2022-07-27 16:15:40 +03:00
< select id = "welcomechanneldropdown" class = "form-select mb-5" aria-label = "Default select example" >
< option selected = "" > < / option >
< / select >
2022-07-24 08:49:29 +03:00
< label for = "wm" > Welcome Message:< / label >
< input type = "text" id = "wm" name = "wm" > < br > < br >
< input type = "submit" value = "Submit" , class = "submitButton" onclick = "sendData(event, { 'inp': 'welcome' })" >
< / form >
< / div >
2022-07-31 14:02:17 +03:00
2022-07-24 08:49:29 +03:00
< div id = "log" , class = "hide lg" >
2022-07-31 14:02:17 +03:00
< button class = "helpbtn" onclick = "alert('When setting the log severity, setting the tier will also include all higher tiers\nFor example, using !setup log_severity none will log things from every severity')" > < img src = "https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fwww.downloadclipart.net%2Flarge%2F45627-icon-with-question-mark-clipart.png&f=1&nofb=1" style = "width: 50px; border-radius: 50%; border-style: solid;" > < / button >
2022-07-24 08:49:29 +03:00
< form >
< label for = "kl" > Keep Logs?< / label >
< input type = "checkbox" id = "kl" name = "kl" > < br > < br >
2022-07-27 16:15:40 +03:00
< label class = "ps-1" for = "lc" > Log Channel Name:< / label >
2022-07-27 15:34:38 +03:00
< select id = "logchanneldropdown" class = "form-select mb-5" aria-label = "Default select example" >
< option selected = "" > < / option >
< / select >
2022-07-27 11:28:50 +03:00
< div id = "sevradio" >
< p style = "margin-bottom: 0px; text-underline-offset: 2px;" > < u > Log Severity< / u > < / p >
< label for = "ls-none" style = "margin-top: 0px;" > None< / label >
< input type = "radio" id = "ls-none" name = "ls" > < br >
< label for = "ls-low" > Low< / label >
< input type = "radio" id = "ls-low" name = "ls" > < br >
< label for = "ls-meduim" > Medium< / label >
< input type = "radio" id = "ls-meduim" name = "ls" > < br >
< label for = "ls-high" > High< / label >
< input type = "radio" id = "ls-high" name = "ls" > < br > < br >
< / div >
2022-07-24 08:49:29 +03:00
< input type = "submit" value = "Submit" , class = "submitButton" onclick = "sendData(event, { 'inp': 'logs' })" >
< / form >
< / div >
2022-07-31 14:02:17 +03:00
< / div >
2022-07-24 08:49:29 +03:00
< / div >
< / body >
< / html >