slightly better (but still temporary) frontend and /api
This commit is contained in:
parent
758e2ef7e2
commit
4635778e0d
7 changed files with 100 additions and 44 deletions
14
public/index.html
Normal file
14
public/index.html
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Index</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<h1>Hi</h1>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
36
public/list.html
Normal file
36
public/list.html
Normal file
|
|
@ -0,0 +1,36 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>list</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div id="doc-list">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/axios@0.20.0/dist/axios.min.js"></script>
|
||||||
|
<script>
|
||||||
|
axios.get('/api/list').then(({ data }) => {
|
||||||
|
console.log(data);
|
||||||
|
const el = document.getElementById('doc-list');
|
||||||
|
for (const doc of data) {
|
||||||
|
let p = document.createElement('p');
|
||||||
|
p.innerText = `${doc.artist} - ${doc.title} by ${doc.credit}`;
|
||||||
|
el.insertAdjacentElement('beforeend', p);
|
||||||
|
|
||||||
|
let charts = document.createElement('ul');
|
||||||
|
for (const chart of doc.charts) {
|
||||||
|
let l = document.createElement('li');
|
||||||
|
l.innerText = `${chart.difficulty} ${chart.rating} - ${chart.name}`
|
||||||
|
charts.insertAdjacentElement('beforeend', l);
|
||||||
|
}
|
||||||
|
el.insertAdjacentElement('beforeend', charts);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
37
public/upload.html
Normal file
37
public/upload.html
Normal file
|
|
@ -0,0 +1,37 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>File upload</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<input type="file" id="file"><br>
|
||||||
|
<button id="upload-btn">Upload</button>
|
||||||
|
<br>
|
||||||
|
<p id="status-spn"></p>
|
||||||
|
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/axios@0.20.0/dist/axios.min.js"></script>
|
||||||
|
<script>
|
||||||
|
document.getElementById('upload-btn').addEventListener('click', async () => {
|
||||||
|
const file = document.getElementById('file');
|
||||||
|
if (file.files.length) {
|
||||||
|
console.log(file.files[0]);
|
||||||
|
|
||||||
|
const formData = new FormData();
|
||||||
|
formData.append('file', file.files[0]);
|
||||||
|
try {
|
||||||
|
let response = await axios.post('/api/upload', formData);
|
||||||
|
const chart = response.data;
|
||||||
|
document.getElementById('status-spn').innerHTML = `<b>${chart.artist} - ${chart.title}</b> has been uploaded!`;
|
||||||
|
} catch (error) {
|
||||||
|
document.getElementById('status-spn').innerText = `Error: ${error.response.data}`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
@ -28,13 +28,12 @@ export function run(app) {
|
||||||
authorization: `${postRes.data.token_type} ${postRes.data.access_token}`
|
authorization: `${postRes.data.token_type} ${postRes.data.access_token}`
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
res.send(`hi ${userInfo.data.username}#${userInfo.data.discriminator}<br><img src="https://media.discordapp.net/avatars/${userInfo.data.id}/${userInfo.data.avatar}.png">`);
|
||||||
res.send(`hi ${userInfo.data.username}#${userInfo.data.discriminator}`);
|
|
||||||
} catch(err) {
|
} catch(err) {
|
||||||
res.send(`whoooops<br>${err}`);
|
res.send(`whoooops<br>${err}`);
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
res.send('https://discord.com/api/oauth2/authorize?client_id=750952563079250012&redirect_uri=http%3A%2F%2Flocalhost%3A8080%2Fdiscordauth&response_type=code&scope=identify');
|
res.send(`<a href="https://discord.com/api/oauth2/authorize?client_id=${process.env.DISCORD_OAUTH_CLIENTID}&redirect_uri=http%3A%2F%2Flocalhost%3A8080%2Fdiscordauth&response_type=code&scope=identify">Click here!!</a>`);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
@ -1,23 +0,0 @@
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>file upload</title>
|
|
||||||
<script>
|
|
||||||
async function upload() {
|
|
||||||
let file = document.getElementById('file');
|
|
||||||
|
|
||||||
console.log(file.files[0]);
|
|
||||||
|
|
||||||
await fetch('/upload', {
|
|
||||||
method: 'POST',
|
|
||||||
body: file.files[0]
|
|
||||||
});
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<form method="post" encType="multipart/form-data">
|
|
||||||
<input type="file" name="file" id="file"><br>
|
|
||||||
<input type="submit" value="upload" onclick="upload()">
|
|
||||||
</form>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
18
src/index.ts
18
src/index.ts
|
|
@ -53,6 +53,8 @@ db.then(() => {
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
app.use(express.urlencoded({extended: true}));
|
app.use(express.urlencoded({extended: true}));
|
||||||
app.use(fileUpload({limits: { fileSize: 50 * 1024 * 1024 }}));
|
app.use(fileUpload({limits: { fileSize: 50 * 1024 * 1024 }}));
|
||||||
|
app.use(express.static('public', {extensions: ['html', 'htm']}));
|
||||||
|
app.use('/assets', express.static('assets'));
|
||||||
|
|
||||||
app.set('db', db);
|
app.set('db', db);
|
||||||
app.set('config', config);
|
app.set('config', config);
|
||||||
|
|
@ -61,22 +63,12 @@ db.then(() => {
|
||||||
upload.run(app);
|
upload.run(app);
|
||||||
auth.run(app);
|
auth.run(app);
|
||||||
|
|
||||||
app.get('/list', async (req, res) => { // only for testing
|
app.get('/api/list', async (req, res) => { // only for testing
|
||||||
const docs = await File.find({});
|
const docs = await File.find({});
|
||||||
|
// TODO: filter out _id and __v? possibly more
|
||||||
res.send(docs.map((doc: any) =>
|
res.send(docs);
|
||||||
`${doc.artist} - ${doc.title} by ${doc.credit}<br>` +
|
|
||||||
doc.charts.map(ch =>
|
|
||||||
`- ${ch.difficulty} ${ch.rating}: ${ch.name}`
|
|
||||||
).join('<br>')
|
|
||||||
).join('<br><br>'));
|
|
||||||
});
|
});
|
||||||
|
|
||||||
app.get('/', (req, res) => {
|
|
||||||
res.send('wip');
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
app.get('*', (req, res) => {
|
app.get('*', (req, res) => {
|
||||||
res.status(404).send('404');
|
res.status(404).send('404');
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -8,12 +8,12 @@ import { File } from './schema';
|
||||||
|
|
||||||
export function run(app) {
|
export function run(app) {
|
||||||
const logger = app.get('logger');
|
const logger = app.get('logger');
|
||||||
|
|
||||||
app.get('/upload', returnStatic('upload.html'));
|
|
||||||
|
|
||||||
app.post('/upload', async (req, res) => { // only for testing, very abusable
|
app.post('/api/upload', async (req, res) => { // only for testing, very abusable
|
||||||
|
if (!req.files) return res.status(400).send('No files were given');
|
||||||
const file = req.files.file;
|
const file = req.files.file;
|
||||||
if (file.mimetype !== 'application/zip') return res.status(400).send('Invalid filetype');
|
|
||||||
|
if (file.mimetype !== 'application/zip' && file.mimetype !== 'application/x-zip-compressed') return res.status(400).send('Invalid filetype');
|
||||||
|
|
||||||
const dir = tmpdir() + '/' + file.md5;
|
const dir = tmpdir() + '/' + file.md5;
|
||||||
fs.writeFile(dir, file.data, (err) => {
|
fs.writeFile(dir, file.data, (err) => {
|
||||||
|
|
@ -40,7 +40,8 @@ export function run(app) {
|
||||||
const file = new File(chart);
|
const file = new File(chart);
|
||||||
file.save();
|
file.save();
|
||||||
|
|
||||||
res.send(`your file "${chart.artist} - ${chart.title}" has been uploaded! check <a href="http://0.0.0.0:8080/list">the listing</a>`); // todo: change to actual url
|
// TODO: filter out _id and __v? possibly more
|
||||||
|
res.send(chart);
|
||||||
}
|
}
|
||||||
|
|
||||||
zip.close();
|
zip.close();
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue