From 40352cffeee6048eb3d5310eb12a7e2ddcb16301 Mon Sep 17 00:00:00 2001
From: krek0 <kreko@posteo.net>
Date: Tue, 21 Apr 2026 11:03:00 +0200
Subject: [PATCH] navigate to next image instead of closing gallery after
 delete or report

---
 .../lightgallery/plugins/admin/lg-admin.js    | 62 +++++++++++++------
 1 file changed, 44 insertions(+), 18 deletions(-)

diff --git a/photologue/static/lightgallery/plugins/admin/lg-admin.js b/photologue/static/lightgallery/plugins/admin/lg-admin.js
index 19b8ca4..a6748e1 100644
--- a/photologue/static/lightgallery/plugins/admin/lg-admin.js
+++ b/photologue/static/lightgallery/plugins/admin/lg-admin.js
@@ -48,26 +48,55 @@ class lgAdmin {
         document.getElementById("lg-delete").style.display = canDelete ? 'block' : 'none';
     }
 
+    // Navigate away from a photo that was just deleted/hidden.
+    // We slide first (while the item still exists), then remove and reindex after the
+    // animation so lightgallery's internal index/counter stays consistent.
+    _navigateAfterRemove(photoId, currentIndex) {
+        const total = this.core.galleryItems.length;
+        if (total <= 1) {
+            const el = document.querySelector(`[data-slide-name='${photoId}']`);
+            if (el) el.remove();
+            this.core.refresh();
+            this.core.closeGallery();
+            return;
+        }
+        const goingForward = currentIndex < total - 1;
+        const targetIndex = goingForward ? currentIndex + 1 : currentIndex - 1;
+        this.core.LGel.on('lgAfterSlide.adminRemove', () => {
+            this.core.LGel.off('lgAfterSlide.adminRemove');
+            const thumb = document.querySelector(`[data-slide-name='${photoId}']`);
+            if (thumb) thumb.remove();
+            const lgId = this.core.lgId;
+            const deletedItem = document.getElementById(`lg-item-${lgId}-${currentIndex}`);
+            if (deletedItem) deletedItem.remove();
+            document.querySelectorAll(`[id^="lg-item-${lgId}-"]`).forEach(item => {
+                const idx = parseInt(item.id.split('-').pop(), 10);
+                if (idx > currentIndex) item.id = `lg-item-${lgId}-${idx - 1}`;
+            });
+            this.core.refresh();
+            if (goingForward) {
+                this.core.index = currentIndex;
+                this.core.updateCurrentCounter(currentIndex);
+            }
+        });
+        this.core.slide(targetIndex, false, false, false);
+    }
+
     // Event called when user click on delete button
     onDelete(event) {
         event.preventDefault();
         if(confirm("Are you sure to delete this photo?")) {
             // Build form request
+            const photoId = this.photoId;
+            const currentIndex = this.core.index;
             let data = new FormData();
             data.append('csrfmiddlewaretoken', this.csrfToken);
-            fetch(`/photo/${this.photoId}/delete/`, {
+            fetch(`/photo/${photoId}/delete/`, {
                 method: "POST",
                 redirect: "manual", // do not load gallery again
                 body: data,
                 credentials: 'same-origin',
-            }).then(res => {
-                console.log("Deletion complete, response:", res);
-
-                // Remove HTML element
-                document.querySelectorAll(`[data-slide-name='${this.photoId}']`)[0].remove()
-                this.core.closeGallery();
-                this.core.refresh();
-            });
+            }).then(() => this._navigateAfterRemove(photoId, currentIndex));
         }
     }
 
@@ -76,22 +105,19 @@ class lgAdmin {
         event.preventDefault();
         if(confirm("Are you sure to report this photo?")) {
             // Build form request
+            const photoId = this.photoId;
+            const currentIndex = this.core.index;
             let data = new FormData();
             data.append('csrfmiddlewaretoken', this.csrfToken);
-            fetch(`/photo/${this.photoId}/report/`, {
+            fetch(`/photo/${photoId}/report/`, {
                 method: "POST",
                 redirect: "manual", // do not load gallery again
                 body: data,
                 credentials: 'same-origin',
-            }).then(res => {
-                console.log("Report complete, response:", res);
-
-                // Update HTML element
-                const thumbnail = document.querySelectorAll(`[data-slide-name='${this.photoId}']`)[0];
+            }).then(() => {
+                const thumbnail = document.querySelector(`[data-slide-name='${photoId}']`);
                 if (!this.isStaff) {
-                    thumbnail.remove()
-                    this.core.closeGallery();
-                    this.core.refresh();
+                    this._navigateAfterRemove(photoId, currentIndex);
                 } else {
                     location.reload();
                 }