From 21108650f78679cf50a1141bedd899fbd55fbf64 Mon Sep 17 00:00:00 2001
From: JeLuF <jf@mormo.org>
Date: Sat, 24 Dec 2022 00:58:52 +0100
Subject: [PATCH 1/2] add findClosestAncestor

Function to find the closest ancestor of an element that matches the selection criterion
---
 ui/media/js/utils.js | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/ui/media/js/utils.js b/ui/media/js/utils.js
index 50f5f162..69801571 100644
--- a/ui/media/js/utils.js
+++ b/ui/media/js/utils.js
@@ -20,6 +20,19 @@ function getNextSibling(elem, selector) {
     }
 }
 
+function findClosestAncestor(element, selector) {
+  if (!element || !element.parentNode) {
+      // reached the top of the DOM tree, return null
+      return null;
+  } else if (element.parentNode.matches(selector)) {
+      // found an ancestor that matches the selector, return it
+      return element.parentNode;
+  } else {
+      // continue searching upwards
+      return findClosestAncestor(element.parentNode, selector);
+  }
+}
+
 
 /* Panel Stuff */
 

From 4eae540086599f825bb6236f02a34503dac499dd Mon Sep 17 00:00:00 2001
From: JeLuF <jf@mormo.org>
Date: Sat, 24 Dec 2022 01:02:38 +0100
Subject: [PATCH 2/2] Add "Remove" button to each image's hover menu

---
 ui/media/js/main.js | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/ui/media/js/main.js b/ui/media/js/main.js
index 5fd34844..17bf23d1 100644
--- a/ui/media/js/main.js
+++ b/ui/media/js/main.js
@@ -285,6 +285,7 @@ function showImages(reqBody, res, outputContainer, livePreview) {
             imageSeedLabel.innerText = 'Seed: ' + req.seed
 
             let buttons = [
+		{ text: 'Remove', on_click: onRemoveClick, class: 'secondaryButton' },
                 { text: 'Use as Input', on_click: onUseAsInputClick },
                 { text: 'Download', on_click: onDownloadImageClick },
                 { text: 'Make Similar Images', on_click: onMakeSimilarClick },
@@ -302,9 +303,12 @@ function showImages(reqBody, res, outputContainer, livePreview) {
                 const newButton = document.createElement('button')
                 newButton.classList.add('tasksBtns')
                 newButton.innerText = btnInfo.text
-                newButton.addEventListener('click', function() {
-                    btnInfo.on_click(req, img)
+                newButton.addEventListener('click', function(event) {
+                    btnInfo.on_click(req, img, event)
                 })
+                if (btnInfo.class !== undefined) {
+                   newButton.classList.add(btnInfo.class)
+                }
                 imgItemInfo.appendChild(newButton)
             }
             buttons.forEach(btn => {
@@ -318,6 +322,10 @@ function showImages(reqBody, res, outputContainer, livePreview) {
     })
 }
 
+function onRemoveClick(req, img, event) {
+    shiftOrConfirm(event, "Remove the image from the results?", () => { findClosestAncestor(img, '.imgItem').style.display='none' })
+}
+
 function onUseAsInputClick(req, img) {
     const imgData = img.src