updated expressjs project

This commit is contained in:
Ludwig Lehnert
2026-01-12 16:52:18 +01:00
parent 175c586465
commit f4c09a259c
3 changed files with 90 additions and 147 deletions

18
deploy.sh Normal file
View File

@@ -0,0 +1,18 @@
#!/usr/bin/env bash
set -euo pipefail
cd "$(dirname "$0")"
if docker compose ps -q >/dev/null 2>&1; then
echo "Stopping running services..."
docker compose down
fi
echo "Pulling latest changes..."
git pull
echo "Rebuilding and starting services..."
docker compose up -d --build --force-recreate
echo "Deploy complete."

View File

@@ -198,121 +198,30 @@ function formatCountdown(ts) {
function renderPage(title, body) { function renderPage(title, body) {
return `<!doctype html> return `<!doctype html>
<html lang="en"> <html lang="de">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<title>${title}</title> <title>${title}</title>
<style> <style>
:root { body { font-family: Arial, sans-serif; margin: 0; background: #f4f6f8; color: #1f2933; }
--ink: #1f1a14; main { max-width: 920px; margin: 0 auto; padding: 24px 16px 48px; }
--muted: #6c5e52; header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
--paper: #f5efe6; h1 { margin: 0; font-size: 1.6rem; }
--card: #fffaf3; h2 { margin: 0 0 12px; font-size: 1.15rem; }
--accent: #b44b2a; .muted { color: #6b7280; font-size: 0.95rem; }
--accent-dark: #8d3a21; .card { margin-top: 16px; padding: 16px; background: #fff; border-radius: 10px; border: 1px solid #e5e7eb; }
} form { display: grid; gap: 10px; }
* { box-sizing: border-box; } label { display: grid; gap: 6px; font-weight: 600; }
body { input, button { font: inherit; padding: 8px 10px; border-radius: 6px; }
margin: 0; input { border: 1px solid #d1d5db; }
font-family: "Palatino Linotype", Palatino, "Book Antiqua", serif; button { border: none; background: #1f2933; color: #fff; cursor: pointer; }
color: var(--ink); button.secondary { background: #6b7280; }
background: radial-gradient(circle at top, #fff8ee 0%, #f5efe6 45%, #efe6da 100%); table { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
min-height: 100vh; th, td { text-align: left; padding: 8px 6px; border-bottom: 1px solid #e5e7eb; vertical-align: top; }
} progress { width: 100%; height: 12px; }
main { .actions { display: grid; gap: 6px; }
max-width: 980px; .pill { display: inline-block; padding: 2px 8px; border-radius: 999px; background: #eef2f7; }
margin: 0 auto;
padding: 28px 18px 60px;
}
header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
}
h1 {
margin: 0;
font-size: 1.8rem;
letter-spacing: 0.02em;
}
.muted {
color: var(--muted);
font-size: 0.95rem;
}
.card {
margin-top: 18px;
padding: 18px 18px 20px;
background: var(--card);
border-radius: 14px;
box-shadow: 0 10px 30px rgba(31, 26, 20, 0.12);
animation: fadeUp 0.5s ease;
}
form {
display: grid;
gap: 12px;
}
label {
display: grid;
gap: 6px;
font-weight: 600;
}
input, button {
font: inherit;
padding: 8px 10px;
border-radius: 8px;
}
input {
border: 1px solid #cdbdab;
background: #fff;
}
button {
border: none;
background: var(--accent);
color: #fff;
cursor: pointer;
transition: transform 0.15s ease, background 0.2s ease;
}
button:hover { background: var(--accent-dark); }
button:active { transform: translateY(1px); }
button.secondary {
background: #5d5146;
}
.row {
display: grid;
gap: 8px;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
table {
width: 100%;
border-collapse: collapse;
font-size: 0.95rem;
}
th, td {
text-align: left;
padding: 8px 6px;
border-bottom: 1px dashed #d9caba;
vertical-align: top;
}
progress {
width: 100%;
height: 14px;
accent-color: var(--accent);
}
.actions {
display: grid;
gap: 6px;
}
.pill {
display: inline-block;
padding: 2px 10px;
border-radius: 999px;
background: #f0e4d6;
}
@keyframes fadeUp {
from { opacity: 0; transform: translateY(6px); }
to { opacity: 1; transform: translateY(0); }
}
</style> </style>
</head> </head>
<body> <body>
@@ -401,25 +310,25 @@ app.get(`${basePath}/login`, (req, res) => {
const body = ` const body = `
<header> <header>
<div> <div>
<h1>File Vault</h1> <h1>Dateiverwaltung</h1>
<div class="muted">Sign in to manage shared uploads.</div> <div class="muted">Bitte anmelden, um Uploads zu verwalten.</div>
</div> </div>
</header> </header>
<section class="card"> <section class="card">
<form method="post" action="${baseUrl('/login')}"> <form method="post" action="${baseUrl('/login')}">
<label> <label>
Username Benutzername
<input name="username" autocomplete="username" required /> <input name="username" autocomplete="username" required />
</label> </label>
<label> <label>
Password Passwort
<input type="password" name="password" autocomplete="current-password" required /> <input type="password" name="password" autocomplete="current-password" required />
</label> </label>
<button type="submit">Log in</button> <button type="submit">Anmelden</button>
</form> </form>
</section> </section>
`; `;
res.send(renderPage('Login', body)); res.send(renderPage('Anmeldung', body));
}); });
app.post(`${basePath}/login`, async (req, res) => { app.post(`${basePath}/login`, async (req, res) => {
@@ -432,26 +341,26 @@ app.post(`${basePath}/login`, async (req, res) => {
const body = ` const body = `
<header> <header>
<div> <div>
<h1>File Vault</h1> <h1>Dateiverwaltung</h1>
<div class="muted">Sign in to manage shared uploads.</div> <div class="muted">Bitte anmelden, um Uploads zu verwalten.</div>
</div> </div>
</header> </header>
<section class="card"> <section class="card">
<div class="pill">Login failed</div> <div class="pill">Anmeldung fehlgeschlagen</div>
<form method="post" action="${baseUrl('/login')}"> <form method="post" action="${baseUrl('/login')}">
<label> <label>
Username Benutzername
<input name="username" autocomplete="username" required /> <input name="username" autocomplete="username" required />
</label> </label>
<label> <label>
Password Passwort
<input type="password" name="password" autocomplete="current-password" required /> <input type="password" name="password" autocomplete="current-password" required />
</label> </label>
<button type="submit">Log in</button> <button type="submit">Anmelden</button>
</form> </form>
</section> </section>
`; `;
res.status(401).send(renderPage('Login', body)); res.status(401).send(renderPage('Anmeldung', body));
return; return;
} }
@@ -487,15 +396,15 @@ app.get(`${basePath}/dashboard`, requireAuthPage, async (req, res) => {
<td>${formatBytes(item.size_bytes)}</td> <td>${formatBytes(item.size_bytes)}</td>
<td> <td>
<div>${formatTimestamp(item.expires_at)}</div> <div>${formatTimestamp(item.expires_at)}</div>
<div class="muted">${formatCountdown(item.expires_at)} left</div> <div class="muted">Noch ${formatCountdown(item.expires_at)}</div>
</td> </td>
<td class="actions"> <td class="actions">
<form method="post" action="${baseUrl(`/files/${item.id}/delete`)}"> <form method="post" action="${baseUrl(`/files/${item.id}/delete`)}">
<button type="submit" class="secondary">Delete</button> <button type="submit" class="secondary">Löschen</button>
</form> </form>
<form method="post" action="${baseUrl(`/files/${item.id}/extend`)}"> <form method="post" action="${baseUrl(`/files/${item.id}/extend`)}">
<input name="extendSeconds" placeholder="Add seconds" /> <input name="extendSeconds" placeholder="Sekunden hinzufügen" />
<button type="submit">Extend</button> <button type="submit">Verlängern</button>
</form> </form>
</td> </td>
</tr> </tr>
@@ -505,48 +414,48 @@ app.get(`${basePath}/dashboard`, requireAuthPage, async (req, res) => {
const body = ` const body = `
<header> <header>
<div> <div>
<h1>File Vault</h1> <h1>Dateiverwaltung</h1>
<div class="muted">Signed in as ${req.user.username}</div> <div class="muted">Angemeldet als ${req.user.username}</div>
</div> </div>
<form method="post" action="${baseUrl('/logout')}"> <form method="post" action="${baseUrl('/logout')}">
<button type="submit" class="secondary">Log out</button> <button type="submit" class="secondary">Abmelden</button>
</form> </form>
</header> </header>
<section class="card"> <section class="card">
<h2>Upload new file</h2> <h2>Datei hochladen</h2>
<form id="upload-form"> <form id="upload-form">
<label> <label>
File Datei
<input type="file" name="file" required /> <input type="file" name="file" required />
</label> </label>
<label> <label>
Retention override (seconds) Aufbewahrung (Sekunden)
<input name="retentionSeconds" placeholder="${uploadTtlSeconds}" /> <input name="retentionSeconds" placeholder="${uploadTtlSeconds}" />
</label> </label>
<button type="submit">Upload</button> <button type="submit">Hochladen</button>
<progress id="upload-progress" value="0" max="100"></progress> <progress id="upload-progress" value="0" max="100"></progress>
<div id="upload-status" class="muted"></div> <div id="upload-status" class="muted"></div>
</form> </form>
</section> </section>
<section class="card"> <section class="card">
<h2>Current uploads</h2> <h2>Aktuelle Uploads</h2>
${uploads.length ? ` ${uploads.length ? `
<table> <table>
<thead> <thead>
<tr> <tr>
<th>File</th> <th>Datei</th>
<th>Size</th> <th>Größe</th>
<th>Expires</th> <th>Läuft ab</th>
<th>Actions</th> <th>Aktionen</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
${rows} ${rows}
</tbody> </tbody>
</table> </table>
` : '<div class="muted">No uploads yet.</div>'} ` : '<div class="muted">Noch keine Uploads.</div>'}
</section> </section>
<script> <script>
@@ -566,21 +475,21 @@ app.get(`${basePath}/dashboard`, requireAuthPage, async (req, res) => {
}); });
xhr.addEventListener('load', () => { xhr.addEventListener('load', () => {
if (xhr.status >= 200 && xhr.status < 300) { if (xhr.status >= 200 && xhr.status < 300) {
status.textContent = 'Uploaded. Refreshing list...'; status.textContent = 'Upload abgeschlossen. Liste wird aktualisiert...';
window.location.reload(); window.location.reload();
} else { } else {
status.textContent = 'Upload failed.'; status.textContent = 'Upload fehlgeschlagen.';
} }
}); });
xhr.addEventListener('error', () => { xhr.addEventListener('error', () => {
status.textContent = 'Upload failed.'; status.textContent = 'Upload fehlgeschlagen.';
}); });
xhr.send(new FormData(uploadForm)); xhr.send(new FormData(uploadForm));
}); });
</script> </script>
`; `;
res.send(renderPage('Dashboard', body)); res.send(renderPage('Übersicht', body));
}); });
app.post(`${basePath}/api/upload`, requireAuthApi, upload.single('file'), async (req, res) => { app.post(`${basePath}/api/upload`, requireAuthApi, upload.single('file'), async (req, res) => {
@@ -634,7 +543,7 @@ app.post(`${basePath}/files/:id/delete`, requireAuthPage, async (req, res) => {
req.user.username, req.user.username,
]); ]);
if (!uploadEntry) { if (!uploadEntry) {
res.status(404).send(renderPage('Not found', '<p class="card">Upload not found.</p>')); res.status(404).send(renderPage('Nicht gefunden', '<p class="card">Upload nicht gefunden.</p>'));
return; return;
} }
try { try {
@@ -652,7 +561,7 @@ app.post(`${basePath}/files/:id/extend`, requireAuthPage, async (req, res) => {
req.user.username, req.user.username,
]); ]);
if (!uploadEntry) { if (!uploadEntry) {
res.status(404).send(renderPage('Not found', '<p class="card">Upload not found.</p>')); res.status(404).send(renderPage('Nicht gefunden', '<p class="card">Upload nicht gefunden.</p>'));
return; return;
} }
@@ -668,7 +577,7 @@ app.post(`${basePath}/files/:id/extend`, requireAuthPage, async (req, res) => {
}); });
app.use((req, res) => { app.use((req, res) => {
res.status(404).send(renderPage('Not found', '<p class="card">Not found.</p>')); res.status(404).send(renderPage('Nicht gefunden', '<p class="card">Seite nicht gefunden.</p>'));
}); });
app.listen(port, () => { app.listen(port, () => {

View File

@@ -2,16 +2,32 @@
cd "$(dirname "$0")" cd "$(dirname "$0")"
echo "Initializing files.lehnert.cloud setup..."
mkdir -p ./traefik mkdir -p ./traefik
touch traefik/acme.json touch traefik/acme.json
chmod 600 traefik/acme.json chmod 600 traefik/acme.json
mkdir -p ./data mkdir -p ./data
echo "Ensured ./traefik and ./data exist."
if [ ! -f .logins ]; then if [ ! -f .logins ]; then
cp .logins.example .logins cp .logins.example .logins
echo "Created .logins from .logins.example"
else
echo "Found existing .logins"
fi fi
if [ ! -f .env ]; then if [ ! -f .env ]; then
cp .env.example .env cp .env.example .env
echo "Created .env from .env.example"
else
echo "Found existing .env"
fi fi
echo "Initialization complete."
echo "Next steps:"
echo "1) Edit .env and set SERVICE_FQDN, LETSENCRYPT_EMAIL, DATA_DIR, UPLOAD_TTL_SECONDS"
echo "2) Edit .logins to add users (bcrypt)"
echo "3) docker compose up --build"