make index page pretty
This commit is contained in:
parent
ba7e6f02f5
commit
41ca4bbf04
@ -15,6 +15,7 @@ import (
|
||||
type wrappedGuild struct {
|
||||
Id uint64 `json:"id,string"`
|
||||
Name string `json:"name"`
|
||||
Icon string `json:"icon"`
|
||||
}
|
||||
|
||||
func GetGuilds(ctx *gin.Context) {
|
||||
@ -53,6 +54,7 @@ func GetGuilds(ctx *gin.Context) {
|
||||
adminGuilds = append(adminGuilds, wrappedGuild{
|
||||
Id: g.GuildId,
|
||||
Name: g.Name,
|
||||
Icon: g.Icon,
|
||||
})
|
||||
lock.Unlock()
|
||||
}
|
||||
|
@ -105,6 +105,7 @@ func CallbackHandler(ctx *gin.Context) {
|
||||
Name: guild.Name,
|
||||
Owner: guild.Owner,
|
||||
UserPermissions: int32(guild.Permissions),
|
||||
Icon: guild.Icon,
|
||||
})
|
||||
}
|
||||
|
||||
|
2
go.mod
2
go.mod
@ -6,7 +6,7 @@ require (
|
||||
github.com/BurntSushi/toml v0.3.1
|
||||
github.com/TicketsBot/archiverclient v0.0.0-20200704164621-09d42dd941e0
|
||||
github.com/TicketsBot/common v0.0.0-20200702195837-7afe5e77d1df
|
||||
github.com/TicketsBot/database v0.0.0-20200620140717-f747a0bb4238
|
||||
github.com/TicketsBot/database v0.0.0-20200708121851-08f2e7582b28
|
||||
github.com/TicketsBot/logarchiver v0.0.0-20200425163447-199b93429026 // indirect
|
||||
github.com/apex/log v1.1.2
|
||||
github.com/boj/redistore v0.0.0-20180917114910-cd5dcc76aeff // indirect
|
||||
|
@ -206,3 +206,37 @@ html > ::-webkit-scrollbar {
|
||||
.wrapper {
|
||||
z-index: 1000 !important;
|
||||
}
|
||||
|
||||
.guild {
|
||||
width: 100%;
|
||||
background-color: #121212;
|
||||
height: 100px;
|
||||
margin-bottom: 10px;
|
||||
border-radius: 25px;
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.guild-icon {
|
||||
height: 80px;
|
||||
background-color: #272727;
|
||||
border-radius: 50%;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.guild-icon-fa {
|
||||
background-color: #272727;
|
||||
border-radius: 50%;
|
||||
margin-left: 10px;
|
||||
color: white;
|
||||
font-size: 60px !important;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
text-align: center;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.guild-name {
|
||||
color: white !important;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
@ -14,13 +14,18 @@
|
||||
<br/>
|
||||
<a href="https://invite.ticketsbot.net"><button class="btn btn-primary btn-fill"><i class="fas fa-plus"></i> Invite</button></a>
|
||||
</p>
|
||||
<table class="table table-hover table-striped" id="guild-table" style="display: none">
|
||||
<thead>
|
||||
<th>Server Name</th>
|
||||
</thead>
|
||||
<tbody id="guild-container">
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="container-fluid">
|
||||
<div class="row" id="guild-container">
|
||||
<div class="col-md-4">
|
||||
<div class="guild align-items-center" onclick="invite();">
|
||||
<i class="fas fa-plus fa-2x guild-icon-fa"></i>
|
||||
<div class="align-items-center">
|
||||
<span class="guild-name">Invite to your server</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -30,8 +35,8 @@
|
||||
</div>
|
||||
|
||||
<script>
|
||||
async function getPermissionLevels(guilds) {
|
||||
const res = await axios.get('/user/permissionlevel?guilds=' + guilds.map(guild => guild.id).join(","));
|
||||
async function getPermissionLevel(guildId) {
|
||||
const res = await axios.get('/user/permissionlevel?guilds=' + guildId);
|
||||
if (res.status !== 200 || !res.data.success) {
|
||||
showToast('Error', res.data.error);
|
||||
return;
|
||||
@ -40,42 +45,67 @@
|
||||
return res.data.levels;
|
||||
}
|
||||
|
||||
async function goto(guildId) {
|
||||
const permissionLevels = await getPermissionLevel(guildId);
|
||||
if (permissionLevels[guildId] === 2) {
|
||||
window.location.href = `/manage/${guildId}/settings`;
|
||||
} else {
|
||||
window.location.href = `/manage/${guildId}/logs`;
|
||||
}
|
||||
}
|
||||
|
||||
function invite() {
|
||||
window.location.href = 'https:\/\/invite.ticketsbot.net';
|
||||
}
|
||||
|
||||
async function loadData() {
|
||||
const res = await axios.get('/user/guilds');
|
||||
|
||||
const permissionLevels = await getPermissionLevels(res.data);
|
||||
console.log(permissionLevels)
|
||||
|
||||
if (res.data.length > 0) {
|
||||
document.getElementById('guild-table').style.display = 'table';
|
||||
|
||||
const container = document.getElementById('guild-container');
|
||||
|
||||
for (guild of res.data) {
|
||||
const tr = document.createElement('tr');
|
||||
const td = document.createElement('td');
|
||||
const col = document.createElement('div');
|
||||
col.classList.add('col-md-4');
|
||||
|
||||
const link = document.createElement('a');
|
||||
const guildContainer = document.createElement('div');
|
||||
guildContainer.classList.add('guild', 'align-items-center');
|
||||
|
||||
// admin
|
||||
if (permissionLevels[guild.id] === 2) {
|
||||
link.href = `/manage/${guild.id}/settings`;
|
||||
if (guild.icon === undefined || guild.icon === null || guild.icon === "") {
|
||||
const icon = document.createElement('i');
|
||||
icon.classList.add('fas', 'fa-question', 'guild-icon-fa');
|
||||
guildContainer.appendChild(icon);
|
||||
} else {
|
||||
link.href = `/manage/${guild.id}/logs`;
|
||||
const icon = document.createElement('img');
|
||||
icon.classList.add('guild-icon');
|
||||
icon.src = `https:\/\/cdn.discordapp.com/icons/${guild.id}/${guild.icon}.webp?size=256`;
|
||||
guildContainer.appendChild(icon);
|
||||
}
|
||||
|
||||
link.classList.add('server');
|
||||
link.appendChild(document.createTextNode(guild.name));
|
||||
const nameContainer = document.createElement('div');
|
||||
nameContainer.classList.add('align-items-center');
|
||||
|
||||
td.appendChild(link);
|
||||
tr.appendChild(td);
|
||||
container.appendChild(tr);
|
||||
const name = document.createElement('span');
|
||||
name.classList.add('guild-name');
|
||||
name.appendChild(document.createTextNode(guild.name));
|
||||
nameContainer.appendChild(name);
|
||||
|
||||
guildContainer.appendChild(nameContainer);
|
||||
|
||||
const guildId = guild.id
|
||||
guildContainer.onclick = async () => { await goto(guildId) };
|
||||
|
||||
col.appendChild(guildContainer);
|
||||
container.appendChild(col);
|
||||
}
|
||||
} else {
|
||||
document.getElementById('no-guilds').style.display = 'block';
|
||||
}
|
||||
}
|
||||
|
||||
withLoadingScreen(loadData);
|
||||
withLoadingScreen(async () => {
|
||||
await setDefaultHeader(); // on first load, this isnt set yet because its run async in auth.js
|
||||
await loadData();
|
||||
});
|
||||
</script>
|
||||
{{end}}
|
Loading…
x
Reference in New Issue
Block a user