dark-firepit/jillo-bot
dark-firepit
/
jillo-bot
5
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

add more stuff to main page

This commit is contained in:
Jill 2023-11-18 15:49:50 +03:00
parent 07e6e162ff
commit fd3dbfa65b
Signed by: oat
GPG Key ID: 33489AA58A955108
6 changed files with 59 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/index.ts
View File

@ -29,7 +29,7 @@ async function init() {
log.nonsense('booting chip...');
log.nonsense('starting up web interface...');
await startServer(sitePort);
await startServer(bot, sitePort);
log.nonsense('setting up connection...');

10
src/web.ts
View File

@ -2,8 +2,9 @@ import express from 'express';
import * as log from './lib/log';
import { CustomItem, db } from './lib/db';
import { defaultItems } from './lib/rpg/items';
import { Client } from 'discord.js';
export async function startServer(port: number) {
export async function startServer(bot: Client, port: number) {
const app = express();
app.use(express.static('static/'));
@ -24,5 +25,12 @@ export async function startServer(port: number) {
res.json([...defaultItems, ...customItems]);
});
app.get('/api/status', async (_, res) => {
res.json({
guilds: bot.guilds.cache.size,
uptime: bot.uptime
});
});
app.listen(port, () => log.info(`web interface listening on ${port}`));
}

4
static/create-recipe/script.js
View File

@ -128,10 +128,10 @@ Promise.all([
fetch(`/api/items${document.location.search}`)
.then(res => res.json()),
loaded
]).then(items => {
]).then(([items]) => {
const itemsContainer = document.querySelector('.items');
itemsContainer.textContent = '';
items[0].forEach(item =>
items.forEach(item =>
itemsContainer.appendChild(renderItem(item))
);
document.querySelectorAll('.item-list').forEach(elem => {

5
static/index.html
View File

@ -12,6 +12,8 @@
<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=Balsamiq+Sans&display=swap" rel="stylesheet">
<script src="/script.js"></script>
</head>
<body>
<div id="main">
@ -22,6 +24,9 @@
&middot;
<a href="https://git.oat.zone/dark-firepit/jillo-bot" target="_blank" rel="noopener">repo</a>
</div>
<div id="status">
&middot;&middot;&middot;
</div>
</div>
</body>
</html>

29
static/script.js Normal file
View File

@ -0,0 +1,29 @@
let resolveLoaded;
const loaded = new Promise(resolve => resolveLoaded = resolve);
function formatUptime(s) {
let units = [
['d', (s / (1000 * 60 * 60 * 24))],
['h', (s / (1000 * 60 * 60)) % 24],
['m', (s / (1000 * 60)) % 60],
['s', (s / 1000) % 60]
];
return units.filter(([_, t]) => t > 1).map(([sh, t]) => `${Math.ceil(t)}${sh}`).join(' ');
}
Promise.all([
fetch('/api/status')
.then(res => res.json()),
loaded
]).then(([status]) => {
document.querySelector('#status').innerHTML = `
<div class="status"></div> online &middot; ${status.guilds} guilds &middot; up for <span id="uptime">${formatUptime(status.uptime)}</span>
`;
const firstRender = Date.now();
setInterval(() => {
document.querySelector('#uptime').innerText = formatUptime(status.uptime + Date.now() - firstRender);
}, 1000);
});
document.addEventListener('DOMContentLoaded', () => resolveLoaded());

15
static/style.css
View File

@ -62,11 +62,11 @@ a:hover {
animation-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
transition: transform 0.15s, opacity 0.1s;
}
#main img:active {
#main > img:active {
transform: scale(0.97);
opacity: 0.9;
}
#main :not(img) {
#main > :not(img) {
animation: 0.8s fadein;
}
#main h1 {
@ -74,6 +74,17 @@ a:hover {
margin-top: 0.5rem;
margin-bottom: 1rem;
}
#main #status {
color: var(--text-color-light);
font-size: 0.85rem;
}
#status .status {
width: 0.5rem;
height: 0.5rem;
background-color: #00a55e;
display: inline-block;
border-radius: 1rem;
}
@keyframes fadein {
0% { opacity: 0; }