From 51e2a3afcf460b602ac78227bcbc0d93056851d0 Mon Sep 17 00:00:00 2001
From: Cohee <18619528+Cohee1207@users.noreply.github.com>
Date: Tue, 12 Sep 2023 19:23:33 +0300
Subject: [PATCH] Fix not being able to close the gallery on SD gens.

---
 public/scripts/extensions/gallery/index.js | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/public/scripts/extensions/gallery/index.js b/public/scripts/extensions/gallery/index.js
index 11f3dd4ff..a70021a85 100644
--- a/public/scripts/extensions/gallery/index.js
+++ b/public/scripts/extensions/gallery/index.js
@@ -368,6 +368,21 @@ function makeDragImg(id, url) {
     });
 }
 
+/**
+ * Sanitizes a given ID to ensure it can be used as an HTML ID.
+ * This function replaces spaces and non-word characters with dashes.
+ * It also removes any non-ASCII characters.
+ * @param {string} id - The ID to be sanitized.
+ * @returns {string} - The sanitized ID.
+ */
+function sanitizeHTMLId(id){
+    // Replace spaces and non-word characters
+    id = id.replace(/\s+/g, '-')
+           .replace(/[^\x00-\x7F]/g, '-')
+           .replace(/\W/g, '');
+
+    return id;
+}
 
 /**
  * Processes a list of items (containing URLs) and creates a draggable box for the first item.
@@ -380,9 +395,9 @@ function makeDragImg(id, url) {
  */
 function viewWithDragbox(items) {
     if (items && items.length > 0) {
-        var url = items[0].responsiveURL(); // Get the URL of the clicked image/video
+        const url = items[0].responsiveURL(); // Get the URL of the clicked image/video
         // ID should just be the last part of the URL, removing the extension
-        var id = url.substring(url.lastIndexOf('/') + 1, url.lastIndexOf('.'));
+        const id = sanitizeHTMLId(url.substring(url.lastIndexOf('/') + 1, url.lastIndexOf('.')));
         makeDragImg(id, url);
     }
 }