Kenzo/Gallus_Pub
2
1
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

Add event image upload endpoint and refactor image upload handling
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
Details

Browse Source 
- Introduced `/events/upload` endpoint for securely uploading and processing event images.
- Added image validation, resizing, and conversion to WebP with fallback support for original formats.
- Updated `uploadImage` to `uploadEventImage` and introduced `uploadGalleryImage` in `admin.astro`.
This commit is contained in:
Kenzo
2025-12-09 17:34:00 +01:00
parent 89640a3372
commit 9c3b4be79d
2 changed files with 78 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/pages/admin.astro
View File

@ -51,7 +51,6 @@ const title = 'Admin';
<label>Datum<input id="ev-date" type="date" placeholder="z. B. 2025-12-31" /></label>
<label>Beschreibung<textarea id="ev-desc" rows="4"></textarea></label>
<label>Bild-Datei<input id="ev-file" type="file" accept="image/*" /></label>
<label>Alt-Text<input id="ev-alt" placeholder="Bildbeschreibung" /></label>
<button id="btn-create-ev">Event anlegen</button>
<div id="ev-create-msg" class="muted"></div>
</div>
@ -125,7 +124,15 @@ const title = 'Admin';
});
// ========== Events & Publish ==========
async function uploadImage(file, altText) {
async function uploadEventImage(file) {
const fd = new FormData();
fd.append('file', file);
const res = await fetch(API_BASE + '/api/events/upload', { method: 'POST', body: fd, credentials: 'include' });
if (!res.ok) throw new Error(await res.text());
return res.json();
}
async function uploadGalleryImage(file, altText) {
const fd = new FormData();
fd.append('file', file);
if (altText) fd.append('altText', altText);
@ -230,14 +237,13 @@ const title = 'Admin';
const date = (document.getElementById('ev-date')).value.trim();
const desc = (document.getElementById('ev-desc')).value.trim();
const file = /** @type {HTMLInputElement} */ (document.getElementById('ev-file')).files[0];
const alt = (document.getElementById('ev-alt')).value.trim();
const msg = document.getElementById('ev-create-msg');
msg.textContent = 'Lade Bild hoch...';
try {
let imageUrl = '';
if (file) {
const up = await uploadImage(file, alt || title);
imageUrl = up?.image?.imageUrl || '';
const up = await uploadEventImage(file);
imageUrl = up?.imageUrl || '';
}
msg.textContent = 'Lege Event an...';
await api('/api/events', {
@ -249,7 +255,6 @@ const title = 'Admin';
(document.getElementById('ev-date')).value = '';
(document.getElementById('ev-desc')).value = '';
(document.getElementById('ev-file')).value = '';
(document.getElementById('ev-alt')).value = '';
await loadEvents();
} catch(e){ msg.textContent = 'Fehler: '+e.message }
});