Dominic/Wedding-Website
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Bugfix + Feat Besseres Laden + Bildervorschau und Uploadbalken + Popup wirklich bild löschen?

Browse Source
This commit is contained in:
Dominic
2026-09-20 14:53:49 +00:00
parent 77b549c960
commit 2ae0d254a3
7 changed files with 385 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files
backend/templates/gallery.html
+43 -2
View File
@@ -47,10 +47,14 @@
class="gallery-open"
data-image-index="{{ loop.index0 }}"
>
<img src="{{ url_for('serve_upload', filename=image['filename']) }}" alt="{{ t('gallery_image_alt').format(name=image['uploaded_by_name']) }}" loading="lazy" />
<img src="{{ url_for('serve_thumbnail', filename=image['filename']) }}" alt="{{ t('gallery_image_alt').format(name=image['uploaded_by_name']) }}" loading="lazy" />
</a>
{% if is_host or guest_id == image['uploaded_by'] %}
<form class="gallery-delete-form" method="post" action="{{ url_for('delete_image', image_id=image['id']) }}">
<form
class="gallery-delete-form"
method="post"
action="{{ url_for('delete_image', image_id=image['id']) }}"
>
<button class="gallery-delete-btn" type="submit" aria-label="{{ t('delete') }}" title="{{ t('delete') }}">
<svg viewBox="0 0 24 24" aria-hidden="true" focusable="false">
<path d="M9 3h6l1 2h4v2H4V5h4l1-2zm1 6h2v8h-2V9zm4 0h2v8h-2V9zM7 9h2v8H7V9z" />
@@ -82,8 +86,45 @@
<div class="lightbox-save-hint" id="lightbox-save-hint" role="status">{{ t('gallery_save_hint') }}</div>
</div>
<dialog class="gallery-delete-dialog" id="gallery-delete-dialog" aria-labelledby="gallery-delete-title" aria-describedby="gallery-delete-message">
<h2 id="gallery-delete-title">{{ t('gallery_delete_title') }}</h2>
<p id="gallery-delete-message">{{ t('gallery_delete_confirm') }}</p>
<div class="gallery-delete-dialog-actions">
<button class="btn btn-ghost" id="gallery-delete-cancel" type="button">{{ t('gallery_delete_cancel') }}</button>
<button class="btn btn-danger" id="gallery-delete-confirm" type="button">{{ t('delete') }}</button>
</div>
</dialog>
<script>
(() => {
const deleteDialog = document.getElementById("gallery-delete-dialog");
const deleteCancel = document.getElementById("gallery-delete-cancel");
const deleteConfirm = document.getElementById("gallery-delete-confirm");
let pendingDeleteForm = null;
document.querySelectorAll(".gallery-delete-form").forEach((form) => {
form.addEventListener("submit", (event) => {
event.preventDefault();
pendingDeleteForm = form;
deleteDialog.showModal();
});
});
deleteCancel.addEventListener("click", () => deleteDialog.close());
deleteConfirm.addEventListener("click", () => {
if (pendingDeleteForm) {
HTMLFormElement.prototype.submit.call(pendingDeleteForm);
}
});
deleteDialog.addEventListener("close", () => {
pendingDeleteForm = null;
});
deleteDialog.addEventListener("click", (event) => {
if (event.target === deleteDialog) {
deleteDialog.close();
}
});
const lightbox = document.getElementById("gallery-lightbox");
const lightboxImage = document.getElementById("lightbox-image");
const lightboxDownload = document.getElementById("lightbox-download");